:root{--bg:#f4f6f9;--panel:#fff;--ink:#1f2a37;--ink-soft:#5b6675;--line:#c3ccd6;--grid-line:#333;--accent:#4a90d9;--accent-dark:#3f7fc2;--given-bg:#e9eef5;--given-ink:#1a1a1a;--player-ink:#1f5fbf;--error:#c0392b;--peer:#dfeaf7;--same:#cfd8e8;--selected:#bcd4f0;--radius:8px;--hover:#eef3fb;--hover-2:#dce8f7;--disabled-bg:#f0f2f5;--disabled-ink:#8a94a0;--disabled-line:#d4dae1}*{box-sizing:border-box}html,body{min-height:100%}body{background:var(--bg);color:var(--ink);-webkit-text-size-adjust:100%;margin:0;padding:20px 16px;font-family:system-ui,-apple-system,Segoe UI,Roboto,PingFang SC,Microsoft YaHei,sans-serif}#app{flex-direction:column;gap:14px;max-width:520px;margin:0 auto;display:flex}#toolbar,.tool-group{flex-wrap:wrap;align-items:center;gap:8px;display:flex}#toolbar button{border:1px solid var(--line);background:var(--panel);border-radius:var(--radius);cursor:pointer;min-height:40px;color:var(--ink);padding:8px 14px;font-size:15px}#toolbar button:hover{background:var(--hover)}#toolbar button.tool-btn{padding:8px 12px;font-size:14px}#toolbar button.tool-btn.active{background:var(--accent);color:#fff;border-color:var(--accent)}#toolbar button.tool-btn.active:hover{background:var(--accent-dark)}#toolbar button.tool-btn.tool-clear{color:var(--error);border-color:#e3b4ae}#toolbar button.tool-btn.tool-clear:hover{background:#fbecea}#toolbar button:disabled{opacity:.45;cursor:not-allowed;background:var(--disabled-bg);color:var(--disabled-ink);border-color:var(--disabled-line)}#toolbar button.new-game{background:var(--accent);color:#fff;border-color:var(--accent);margin-left:auto}#toolbar button.new-game:hover{background:var(--accent-dark)}.board{aspect-ratio:1;background:var(--grid-line);border:3px solid var(--grid-line);-webkit-user-select:none;user-select:none;touch-action:manipulation;border-radius:6px;grid-template-columns:repeat(9,1fr);gap:1px;width:min(100%,92vmin);max-width:100%;margin:0 auto;display:grid;overflow:hidden}.cell{background:var(--panel);cursor:pointer;aspect-ratio:1;justify-content:center;align-items:center;padding:0;font-size:clamp(18px,5.5vw,30px);font-weight:600;display:flex;position:relative}.cell .value{justify-content:center;align-items:center;width:100%;height:100%;line-height:1;display:none}.cell.filled .value{display:flex}.cell .notes{grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);width:100%;height:100%;padding:1px;display:none}.cell:not(.filled) .notes{display:grid}.board.hide-notes .notes{display:none}.cell .note{color:var(--ink-soft);justify-content:center;align-items:center;font-size:clamp(7px,2.1vw,11px);font-weight:500;line-height:1;display:flex}.cell.filled{color:var(--player-ink);font-weight:600}.cell.given{color:var(--given-ink);background:var(--given-bg);font-weight:700}.cell.error{color:var(--error);border:2px solid var(--error)}.cell.error .value{color:var(--error)}.cell.peer{background:var(--peer)}.cell.same{background:var(--same)}.cell.selected{background:var(--selected);outline:2px solid var(--accent);outline-offset:-2px;z-index:1}.cell.br{border-right:2px solid var(--grid-line)}.cell.bb{border-bottom:2px solid var(--grid-line)}.pad{-webkit-user-select:none;user-select:none;touch-action:manipulation;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:4px;display:grid}.pad-key{border:1px solid var(--line);background:var(--panel);border-radius:var(--radius);cursor:pointer;min-height:52px;color:var(--player-ink);padding:14px 0;font-size:clamp(18px,6vw,26px);font-weight:600;transition:background .12s,transform 40ms}.pad-key:hover{background:var(--hover)}.pad-key:active{background:var(--hover-2);transform:translateY(1px)}.pad-erase{color:var(--error);grid-column:1/-1;font-size:clamp(16px,5vw,22px)}.pad.disabled .pad-key{opacity:.45;cursor:not-allowed;background:var(--disabled-bg);color:var(--disabled-ink)}.pad.disabled .pad-key:hover,.pad.disabled .pad-key:active{background:#f0f2f5;transform:none}#status{min-height:22px;color:var(--ink-soft);margin-top:4px;font-size:15px;line-height:1.4}.toast{color:#fff;z-index:999;opacity:1;pointer-events:none;background:#28303aeb;border-radius:8px;padding:10px 18px;font-size:14px;line-height:1.4;transition:opacity .3s;position:fixed;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 4px 16px #00000040}.toast--hide{opacity:0}@media (max-width:480px){body{padding:12px 10px}#app{gap:12px}#toolbar{gap:6px}#toolbar button{min-height:44px;padding:10px 12px;font-size:14px}.pad-key{min-height:48px}}:root[data-theme=dark]{--bg:#15191f;--panel:#1f2630;--ink:#e6edf3;--ink-soft:#9aa7b4;--line:#333d49;--grid-line:#0c0f13;--accent:#5aa0e6;--accent-dark:#6fb0ef;--given-bg:#2a323d;--given-ink:#f0f4f8;--player-ink:#6fb1ff;--error:#ff6b5e;--peer:#28323e;--same:#313d4b;--selected:#2f4a63;--hover:#2a3441;--hover-2:#33404f;--disabled-bg:#20262e;--disabled-ink:#5c6773;--disabled-line:#333d49}:root[data-theme=sepia]{--bg:#f3ead4;--panel:#fbf6e9;--ink:#4a3f2f;--ink-soft:#8a7a5f;--line:#d8c9a6;--grid-line:#5c4a2e;--accent:#9c6b3f;--accent-dark:#85572f;--given-bg:#e8dcc0;--given-ink:#3a2f1c;--player-ink:#8a5a2b;--error:#b9472f;--peer:#ece0c4;--same:#e3d4b3;--selected:#ddcba0;--hover:#efe6d2;--hover-2:#e8dcc0;--disabled-bg:#ece3cf;--disabled-ink:#a99b7e;--disabled-line:#d8c9a6}.timer{font-variant-numeric:tabular-nums;color:var(--ink);background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);letter-spacing:.5px;align-self:flex-start;padding:6px 12px;font-size:18px;font-weight:600}.pause-overlay{color:#fff;z-index:1000;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#14181e8c;flex-direction:column;justify-content:center;align-items:center;gap:18px;display:flex;position:fixed;inset:0}.pause-overlay.hide{display:none}.pause-overlay__text{letter-spacing:1px;font-size:24px;font-weight:600}.pause-overlay__btn{border-radius:var(--radius);background:var(--accent);color:#fff;cursor:pointer;border:none;min-height:44px;padding:10px 26px;font-size:16px;font-weight:600;transition:background .12s,transform 40ms}.pause-overlay__btn:hover{background:var(--accent-dark)}.pause-overlay__btn:active{transform:translateY(1px)}.hud{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);flex-direction:column;gap:8px;padding:10px 12px;display:flex}.hud__progress{align-items:center;gap:10px;width:100%;display:flex}.hud__progress-track{background:var(--bg);border-radius:999px;flex:auto;height:18px;position:relative;overflow:hidden}.hud__progress-fill{background:var(--accent);border-radius:999px;width:0%;height:100%;transition:width .3s}.hud__progress-label{text-align:right;font-variant-numeric:tabular-nums;min-width:40px;color:var(--ink);flex:none;font-size:13px;font-weight:600}.hud__counts{grid-template-columns:repeat(9,1fr);gap:6px;display:grid}.count-chip{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);min-height:32px;color:var(--ink);justify-content:center;align-items:center;gap:4px;padding:4px 0;font-size:13px;display:flex}.count-chip__digit{color:var(--ink);font-weight:600}.count-chip__remain{font-variant-numeric:tabular-nums;color:var(--accent);font-size:12px}.count-chip--done{background:var(--disabled-bg);border-color:var(--disabled-line);opacity:.6}.count-chip--done .count-chip__digit,.count-chip--done .count-chip__remain{color:var(--disabled-ink)}@media (max-width:480px){.hud{padding:9px 10px}.hud__counts{grid-template-columns:repeat(5,1fr)}.count-chip{min-height:36px}}
