:root{font-family:Avenir Next,Manrope,Nunito Sans,sans-serif}*{box-sizing:border-box}body{margin:0;min-height:100vh;line-height:1.2}button{font:inherit}.app-shell{display:grid;gap:1.4rem;min-height:100vh;max-width:1160px;margin:0 auto;padding:1.2rem 1.25rem 1.8rem;position:relative}.top-bar{display:grid;grid-template-columns:auto minmax(120px,1fr) auto;gap:1rem;align-items:center;padding-bottom:.55rem;border-bottom:1px solid rgba(43,53,69,.15)}.difficulty-tabs{display:flex;flex-wrap:wrap;gap:.25rem 1rem;justify-self:start;grid-column:1}.top-actions{display:flex;gap:1rem;align-items:center;justify-self:end;grid-column:3}.top-center{display:flex;align-items:center;gap:.55rem;justify-items:center;grid-column:2}.game-layout{display:grid;grid-template-columns:minmax(280px,684px) minmax(250px,360px);gap:1.4rem;align-items:start;justify-content:space-between}.sudoku-board{width:min(100%,684px);max-width:684px;aspect-ratio:1 / 1;display:grid;grid-template-columns:repeat(9,1fr);grid-template-rows:repeat(9,1fr);border:2px solid;border-radius:12px;overflow:hidden;position:relative}.cell{display:grid;place-items:center;border-right:none;border-bottom:none;background:transparent;border-left:none;border-top:none;padding:0}.thick-right{border-right:2px solid}.thick-bottom{border-bottom:2px solid}.side-panel{display:grid;gap:1rem;width:min(100%,360px)}.mode-box{display:flex;justify-content:space-between;gap:.5rem;padding:1rem 1.1rem;border:2px solid;border-radius:12px}.number-panel{border:2px solid;border-radius:12px;padding:.75rem}.number-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}.tool-row{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem}.win-overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:1rem;pointer-events:none;z-index:9999}.win-card{width:min(520px,95vw)}@media(max-width:1120px){.game-layout{grid-template-columns:1fr;justify-content:start}.side-panel{max-width:520px}}@media(max-width:700px){.app-shell{gap:1.25rem;padding:1rem 1rem 1.5rem}.top-bar{grid-template-columns:1fr;justify-items:start}.difficulty-tabs,.top-actions{grid-column:1}.top-actions{width:100%;justify-self:stretch}.top-center{width:100%;justify-items:start;grid-column:1;flex-wrap:wrap}.action{flex:1}}body{background:radial-gradient(circle at 12% -18%,#7cb7eca6,#7cb7ec00 42%),radial-gradient(circle at 86% 12%,#609ed870,#609ed800 38%),linear-gradient(130deg,#d4e0ed,#c6d3e1 52%,#b9c8d8);color:#38424f}:root{--cell-dash-line: #b5bec9}.tab{background:transparent;color:#38424fd9;border:none;text-transform:uppercase;letter-spacing:.02em;font-size:clamp(.55rem,.9vw,.975rem);font-weight:700;padding:.35rem .6rem;border-radius:10px;cursor:pointer}.tab.is-active{color:#eef5ff;background:#dc37ff}.action{border:none;border-radius:14px;padding:.7rem 1rem;font-size:clamp(.55rem,.9vw,.975rem);font-weight:800;letter-spacing:.02em;cursor:pointer;box-shadow:inset 0 1px #ffffff59,0 4px 10px #1c283a2e}.action-ghost{background:transparent;color:#364558}.action-primary{background:linear-gradient(180deg,#ffffff38,#fff0 38%),linear-gradient(180deg,#5f83b1,#4f6f98);color:#eef5ff}.sudoku-board,.mode-box,.number-panel{border-color:#2d3847e6}.cell{font-size:clamp(1.15rem,2vw,2.6rem);font-weight:500;color:#3d3f44;position:relative;z-index:1;font-variant-numeric:tabular-nums lining-nums;text-align:center;line-height:1}.board-dash-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0}.board-pause-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-size:clamp(1.5rem,2.6vw,2.5rem);font-weight:800;letter-spacing:.03em;color:#2f4665;background:#ffffff75;opacity:0;pointer-events:none;z-index:3;transition:opacity .14s ease}.sudoku-board.is-paused .cell,.sudoku-board.is-paused .board-dash-layer{filter:blur(9px)}.sudoku-board.is-paused .board-pause-overlay{opacity:1;pointer-events:auto}.dash-line{position:absolute}.dash-v{top:0;bottom:0;border-left:1px dashed var(--cell-dash-line)}.dash-h{left:0;right:0;border-top:1px dashed var(--cell-dash-line)}.major-v{top:0;bottom:0;border-left:2px solid rgba(45,56,71,.92)}.major-h{left:0;right:0;border-top:2px solid rgba(45,56,71,.92)}.cell.is-given{color:#3d3f44}.cell.is-user{color:#4b6990;font-weight:700}.cell.is-related{background:#4f6f981c}.cell.is-value-match{background:#4f6f9833}.cell.is-selected{background:#4f6f985c}.cell.is-drag-selected{background:#4f6f9840}.cell.is-conflict{background:#c958584d;color:#7e2f2f}.cell.is-conflict.is-selected,.cell.is-conflict.is-value-match,.cell.is-conflict.is-related{background:#c958584d}.cell.anim-line-complete{animation:rowColCompletePulse .92s ease var(--cell-anim-delay, 0ms)}.cell.anim-box-complete{animation:boxCompletePulse 1.02s ease var(--cell-anim-delay, 0ms)}.cell.anim-digit-board-complete{animation:digitBoardCompletePulse .62s ease}.cell-notes{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);width:100%;height:100%;padding:.14rem}.cell-note{display:grid;place-items:center;font-size:clamp(.68rem,1vw,1.15rem);font-weight:400;color:#d200ff}.cell-note[data-note="1"]:not(.is-illegal){color:#d200ff}.cell-note[data-note="2"]:not(.is-illegal){color:#37daff}.cell-note[data-note="3"]:not(.is-illegal){color:#d7a8ff}.cell-note[data-note="4"]:not(.is-illegal){color:#00ffb8}.cell-note[data-note="5"]:not(.is-illegal){color:#ffb800}.cell-note[data-note="6"]:not(.is-illegal){color:#bfbaff}.cell-note[data-note="7"]:not(.is-illegal){color:#ff78d6}.cell-note[data-note="8"]:not(.is-illegal){color:#e6ff00}.cell-note[data-note="9"]:not(.is-illegal){color:#ffb9a9}.cell-note.is-illegal{color:#a51f1f}.cell-note.is-clearing{color:#fff!important;text-shadow:0 0 8px rgba(255,255,255,.95),0 0 16px rgba(255,255,255,.75),0 0 22px rgba(72,161,229,.75);animation:noteClearFlash 2s ease-out forwards}.icon-btn{border:none;background:linear-gradient(180deg,#ffffff1a,#fff0 42%),#4f6f9817;color:#567095;cursor:pointer;width:clamp(2.3rem,3.6vw,3.2rem);height:clamp(2.3rem,3.6vw,3.2rem);display:grid;place-items:center;line-height:1;padding:0;flex:0 0 auto;border-radius:12px;box-shadow:inset 0 1px #fff3,0 4px 9px #23314529}.icon-btn svg{width:clamp(1.2rem,1.9vw,1.8rem);height:clamp(1.2rem,1.9vw,1.8rem);stroke-linecap:round;stroke-linejoin:round}.pause-btn,.pause-btn.is-paused{color:#5a77a0}.difficulty-label{margin:0;padding-left:.2rem;letter-spacing:.02em;font-size:clamp(1.4rem,1.65vw,2.1rem);color:#334a66;font-weight:700}.timer-display{margin:-.55rem 0 0;width:fit-content;padding:.2rem .4rem;border-radius:8px;font-weight:700;color:#385473;background:#4f6f9824}.top-timer{margin:0;justify-self:center}.top-timer.is-hidden{visibility:hidden;opacity:0;pointer-events:none}.hotkey-callout{margin:0;width:fit-content;max-width:min(52vw,420px);padding:.2rem .55rem;border-radius:999px;font-size:clamp(.56rem,.86vw,.86rem);font-weight:800;letter-spacing:.015em;color:#2f4f77;background:linear-gradient(180deg,#ffffff3d,#fff0 48%),#4f6f9833;border:1px solid rgba(79,111,152,.36);cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hotkey-callout.is-pulse{animation:calloutPop .42s ease}.hotkey-callout.is-cycling{box-shadow:inset 0 1px #ffffff42,0 0 0 1px #4f6f9838,0 6px 14px #324b6e3d}.number-btn{border:none;border-radius:16px;min-height:clamp(62px,7vw,104px);background:linear-gradient(180deg,#ffffff42,#fff0 42%),#ffffff47;color:#4f6f98;display:grid;place-content:center;cursor:pointer;position:relative;box-shadow:inset 0 1px #ffffff57,0 6px 12px #1e2a3c2e}.number-btn span{font-size:clamp(2rem,3.4vw,3.7rem);line-height:1}.number-btn small{position:absolute;top:.55rem;right:.7rem;font-size:clamp(1rem,1.3vw,1.8rem);font-weight:400}.number-btn.is-complete{background:linear-gradient(180deg,#fff3,#fff0 45%),#7d88975c;color:#475466eb}.number-btn.is-complete small{color:#475466eb}.number-btn.anim-digit-complete{animation:digitCompletePulse .62s ease}.number-panel.is-notes-mode .number-btn{background:linear-gradient(180deg,#ffffff38,#fff0 40%),#587299;color:#e8eff7}.number-panel.is-notes-mode .number-btn small{display:none}.number-panel.is-notes-mode .number-btn.is-complete{background:#3b86be73;color:#e8eff7b8}.tool-btn{border:none;border-radius:12px;min-height:56px;background:linear-gradient(180deg,#fff3,#fff0 45%),#fff3;color:#55739a;font-size:clamp(1.4rem,2.4vw,2.3rem);cursor:pointer;display:grid;place-items:center;line-height:1;box-shadow:inset 0 1px #ffffff47,0 6px 12px #1e2a3c29}.tool-btn svg{width:clamp(1.6rem,2.4vw,2.3rem);height:clamp(1.6rem,2.4vw,2.3rem);display:block;stroke-linecap:round;stroke-linejoin:round}.tool-btn:disabled{opacity:.35;cursor:not-allowed}.notes-toggle-btn{position:relative;display:grid;place-items:center}.notes-state{position:absolute;top:.45rem;right:.55rem;font-size:.78rem;font-weight:800;letter-spacing:.01em}.notes-icon{display:grid;place-items:center}.notes-icon svg{width:clamp(1.4rem,2.2vw,2.1rem);height:clamp(1.4rem,2.2vw,2.1rem)}.notes-toggle-btn.is-active .notes-state{color:#f0f5ff;background:#3b87e7;border-radius:999px;padding:.14rem .33rem}.icon-btn.is-active{transform:scale(1.05)}.win-overlay{background:#1f28342e;opacity:0;transition:opacity .22s ease}.win-overlay.is-visible{opacity:1;pointer-events:auto}.win-card{background:#edf2f8;border:2px solid rgba(45,56,71,.92);border-radius:18px;padding:1.35rem 1.3rem;box-shadow:0 18px 50px #222c3a40;transform:translateY(14px) scale(.98);transition:transform .24s ease}.win-overlay.is-visible .win-card{transform:translateY(0) scale(1)}.win-title{margin:0 0 .6rem;font-size:clamp(1.8rem,3.2vw,2.4rem);color:#2f4665}.win-summary{margin:0 0 1rem;font-size:1.08rem;font-weight:700}.win-stats{margin:-.35rem 0 1rem;font-size:1rem;font-weight:700;color:#3a4f6c}.win-time-value{color:#4f6f98}.win-controls{display:grid;gap:.7rem}.win-difficulty-select{border:2px solid rgba(79,111,152,.5);border-radius:10px;background:#f8fbff;color:#2f4665;font:inherit;font-weight:700;padding:.55rem .65rem}@keyframes rowColCompletePulse{0%{box-shadow:inset 0 0 #4f6f9800}40%{box-shadow:inset 0 0 0 999px #4f6f9838}to{box-shadow:inset 0 0 #4f6f9800}}@keyframes boxCompletePulse{0%{box-shadow:inset 0 0 #e0aa4e00}42%{box-shadow:inset 0 0 0 999px #e0aa4e3d}to{box-shadow:inset 0 0 #e0aa4e00}}@keyframes digitCompletePulse{0%{transform:translateY(0) scale(1);box-shadow:inset 0 1px #ffffff57,0 6px 12px #1e2a3c2e}45%{transform:translateY(-2px) scale(1.04);box-shadow:inset 0 1px #fff6,0 10px 18px #1e2a3c3d}to{transform:translateY(0) scale(1);box-shadow:inset 0 1px #ffffff57,0 6px 12px #1e2a3c2e}}@keyframes digitBoardCompletePulse{0%{box-shadow:inset 0 0 #48a1e500}45%{box-shadow:inset 0 0 0 999px #48a1e554}to{box-shadow:inset 0 0 #48a1e500}}body.theme-dark{--cell-dash-line: #4d6073;background:radial-gradient(circle at 8% -20%,#48a1e575,#48a1e500 40%),radial-gradient(circle at 90% 8%,#48a1e547,#48a1e500 36%),linear-gradient(125deg,#050a10,#0b1520 55%,#0d2231);color:#d3e5f3}body.theme-dark .top-bar{border-bottom-color:#48a1e538}body.theme-dark .tab{color:#8fa3b6}body.theme-dark .tab.is-active{color:#07131f;background:#48a1e5}body.theme-dark .action-ghost{color:#a8c1d6}body.theme-dark .action-primary{background:linear-gradient(180deg,#fff3,#fff0 40%),linear-gradient(180deg,#5eb1ef,#48a1e5);color:#07131f}body.theme-dark .sudoku-board,body.theme-dark .mode-box,body.theme-dark .number-panel{border-color:#506377;background:#141c25}body.theme-dark .major-v,body.theme-dark .major-h{border-color:#7b93aa}body.theme-dark .cell.is-given{color:#eef4fb}body.theme-dark .cell.is-user{color:#3b87e7}body.theme-dark .cell.is-related{background:#48a1e533}body.theme-dark .cell.is-value-match{background:#48a1e557}body.theme-dark .cell.is-selected{background:#7b02544d}body.theme-dark .cell-note{color:#dc37ff}body.theme-dark .cell-note.is-illegal{color:#ff6e6e}body.theme-dark .cell.is-conflict,body.theme-dark .cell.is-conflict.is-selected,body.theme-dark .cell.is-conflict.is-value-match,body.theme-dark .cell.is-conflict.is-related{background:#c9585852;color:#ff9292}body.theme-dark .icon-btn{color:#83bee6;background:linear-gradient(180deg,#ffffff14,#fff0 42%),#1b2631;box-shadow:inset 0 1px #ffffff17,0 5px 11px #00000059}body.theme-dark .difficulty-label{color:#8dc9f2}body.theme-dark .timer-display{color:#a7d6f8;background:#48a1e538}body.theme-dark .hotkey-callout{color:#bce5ff;background:linear-gradient(180deg,#ffffff1f,#fff0 48%),#48a1e533;border-color:#48a1e57a}body.theme-dark .number-btn{background:linear-gradient(180deg,#ffffff1a,#fff0 40%),#27323d;color:#bde3fb;box-shadow:inset 0 1px #ffffff1f,0 7px 14px #0000005c}body.theme-dark .cell.anim-line-complete{animation-name:rowColCompletePulseDark}body.theme-dark .cell.anim-box-complete{animation-name:boxCompletePulseDark}body.theme-dark .cell.anim-digit-board-complete{animation-name:digitBoardCompletePulseDark}body.theme-dark .number-btn.anim-digit-complete{animation-name:digitCompletePulseDark}body.theme-dark .number-btn.is-complete{background:linear-gradient(180deg,#ffffff17,#fff0 40%),#3a4755;color:#76899e}body.theme-dark .number-panel.is-notes-mode .number-btn{background:linear-gradient(180deg,#ffffff24,#fff0 40%),#48a1e5;color:#07131f}body.theme-dark .number-panel.is-notes-mode .number-btn.is-complete{background:#3b86be73;color:#07131f99}body.theme-dark .tool-btn{background:linear-gradient(180deg,#ffffff14,#fff0 45%),#27323d;color:#8ec9f2;box-shadow:inset 0 1px #ffffff1c,0 7px 14px #00000057}body.theme-dark .notes-toggle-btn.is-active .notes-state{color:#07131f;background:#48a1e5}body.theme-dark .win-overlay{background:#0000008a}body.theme-dark .win-card{background:#151d25;border-color:#3e4d5a;box-shadow:0 18px 50px #00000070}body.theme-dark .win-title{color:#c8e7fb}body.theme-dark .win-summary,body.theme-dark .win-stats{color:#9dc3de}body.theme-dark .win-time-value{color:#48a1e5}body.theme-dark .win-difficulty-select{border-color:#48a1e599;background:#1d2731;color:#c7e3f8}body.theme-dark .board-pause-overlay{color:#c7e8ff;background:#050a109e}@keyframes rowColCompletePulseDark{0%{box-shadow:inset 0 0 #48a1e500}40%{box-shadow:inset 0 0 0 999px #48a1e542}to{box-shadow:inset 0 0 #48a1e500}}@keyframes boxCompletePulseDark{0%{box-shadow:inset 0 0 #ffc15600}42%{box-shadow:inset 0 0 0 999px #ffc15638}to{box-shadow:inset 0 0 #ffc15600}}@keyframes digitCompletePulseDark{0%{transform:translateY(0) scale(1);box-shadow:inset 0 1px #ffffff1f,0 7px 14px #0000005c}45%{transform:translateY(-2px) scale(1.04);box-shadow:inset 0 1px #ffffff2b,0 10px 18px #0000006b}to{transform:translateY(0) scale(1);box-shadow:inset 0 1px #ffffff1f,0 7px 14px #0000005c}}@keyframes digitBoardCompletePulseDark{0%{box-shadow:inset 0 0 #48a1e500}45%{box-shadow:inset 0 0 0 999px #48a1e56b}to{box-shadow:inset 0 0 #48a1e500}}@keyframes noteClearFlash{0%{opacity:.35;transform:scale(.72);filter:brightness(1.4)}35%{opacity:1;transform:scale(1.18);filter:brightness(2.4)}to{opacity:0;transform:scale(1);filter:brightness(1)}}@keyframes calloutPop{0%{transform:scale(.98);filter:brightness(1)}40%{transform:scale(1.02);filter:brightness(1.2)}to{transform:scale(1);filter:brightness(1)}}@media(max-width:700px){.tab{font-size:1.1rem}.action{font-size:1rem}}
