:root,:root[data-theme=paper]{--bg: #f4efe4;--bg-panel: #fbf8f1;--bg-panel-alt: #f1eadb;--border: #ddd5c3;--border-strong: #6b6357;--text: #2b2925;--text-muted: #7d766a;--accent: #b8452e;--accent-ink: #ffffff;--highlight: #ffe9a8;--crosshair: #ede5d2;--given-text: #2b2925;--entered-text: #2b5fb8;--note-text: #8a8378;--success: #3b7d4f;--warning: #b7791f;--danger: #c8352e;--radius: 10px;--shadow: 0 1px 2px rgba(60, 45, 20, .08), 0 6px 18px -8px rgba(60, 45, 20, .25);--tag-easy: #3b7d4f;--tag-medium: #2b5fb8;--tag-hard: #b7791f;--tag-insane: #c8352e;--font-ui: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-display: "Fraunces", Georgia, serif;--font-hand: "Caveat", "Segoe Print", cursive;--paper-noise-opacity: .35}:root[data-theme=midnight]{--bg: #0f1420;--bg-panel: #161d2e;--bg-panel-alt: #1c2540;--border: #2a3450;--border-strong: #4a5878;--text: #e7ecf7;--text-muted: #8a95b3;--accent: #e0b45a;--accent-ink: #1a1408;--highlight: #2b3a5c;--crosshair: #1c2540;--given-text: #d8dfef;--entered-text: #7cc4ff;--note-text: #8a95b3;--success: #34d399;--warning: #fbbf24;--danger: #f87171;--shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 8px 24px -10px rgba(0, 0, 0, .6);--tag-easy: #34d399;--tag-medium: #4f9dff;--tag-hard: #fbbf24;--tag-insane: #f87171;--paper-noise-opacity: .12}*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-ui);font-feature-settings:"tnum" 1,"cv11" 1;transition:background-color .25s ease,color .25s ease;position:relative}body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:var(--paper-noise-opacity);background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.35 0 0 0 0 0.3 0 0 0 0 0.2 0 0 0 0.18 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}#root{min-height:100vh;position:relative;z-index:1}h1,h2,h3{font-family:var(--font-display);font-weight:600;letter-spacing:-.01em}button{font-family:inherit;cursor:pointer;transition:background-color .15s ease,border-color .15s ease,transform .08s ease,opacity .15s ease}button:active:not(:disabled){transform:translateY(1px)}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.muted{color:var(--text-muted)}.small{font-size:.85rem}.page{max-width:980px;margin:0 auto;padding:24px 20px 56px}.centered-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}.app-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;gap:12px}.app-header h1{font-size:1.5rem;margin:0;display:flex;align-items:center;gap:10px}.header-actions{display:flex;align-items:center;gap:8px}.btn,.header-actions button,.game-status-actions button,.toolbar-actions button,.victory-actions button,.profile-tabs button,.scope-toggle button{background:var(--bg-panel);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:8px 14px;font-size:.88rem;font-weight:500}.btn:hover,.header-actions button:hover,.game-status-actions button:hover,.toolbar-actions button:hover:not(:disabled),.victory-actions button:hover,.profile-tabs button:hover,.scope-toggle button:hover{border-color:var(--border-strong)}button.primary{background:var(--accent);color:var(--accent-ink);border:1px solid transparent;border-radius:8px;padding:10px 18px;font-weight:600}button.primary:hover{filter:brightness(1.08)}button.primary:disabled{opacity:.6;cursor:default}.icon-btn{width:36px;height:36px;padding:0;flex:none;display:inline-flex;align-items:center;justify-content:center;background:var(--bg-panel);color:var(--text);border:1px solid var(--border);border-radius:8px;text-decoration:none;transition:border-color .15s ease,color .15s ease}.icon-btn:hover{border-color:var(--border-strong);color:var(--accent)}.icon-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.icon-btn svg{width:18px;height:18px}.logo-mark{width:28px;height:28px;flex:none}.panel{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius);padding:18px 20px;margin-bottom:18px;box-shadow:var(--shadow)}.panel h2{margin:0 0 14px;font-size:1.15rem}.panel-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;gap:12px}.panel-header h2{margin:0}.resume-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;border-left:4px solid var(--accent);border-radius:0 var(--radius) var(--radius) 0}.dashboard-columns{display:grid;grid-template-columns:1fr 1fr;gap:18px}@media(max-width:720px){.dashboard-columns{grid-template-columns:1fr}}.difficulty-tag{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;font-size:.74rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;border:1px solid transparent}.tag-easy{background:color-mix(in srgb,var(--tag-easy) 14%,transparent);color:var(--tag-easy);border-color:color-mix(in srgb,var(--tag-easy) 35%,transparent)}.tag-medium{background:color-mix(in srgb,var(--tag-medium) 14%,transparent);color:var(--tag-medium);border-color:color-mix(in srgb,var(--tag-medium) 35%,transparent)}.tag-hard{background:color-mix(in srgb,var(--tag-hard) 14%,transparent);color:var(--tag-hard);border-color:color-mix(in srgb,var(--tag-hard) 35%,transparent)}.tag-insane{background:color-mix(in srgb,var(--tag-insane) 14%,transparent);color:var(--tag-insane);border-color:color-mix(in srgb,var(--tag-insane) 35%,transparent)}.difficulty-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}@media(max-width:640px){.difficulty-grid{grid-template-columns:repeat(2,1fr)}}.difficulty-card{background:var(--bg-panel-alt);border:1px solid var(--border);border-radius:var(--radius);padding:14px;text-align:left;color:var(--text);display:flex;flex-direction:column;gap:8px;position:relative}.difficulty-card:hover{border-color:var(--border-strong);transform:translateY(-2px);box-shadow:var(--shadow)}.difficulty-card.selected{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.difficulty-card .difficulty-tag{align-self:flex-start}.difficulty-preview{width:100%;height:auto;margin:2px 0}.difficulty-blurb{margin:0;font-size:.82rem;color:var(--text-muted);line-height:1.4}.difficulty-best{margin:0;font-size:.85rem;color:var(--text-muted);font-variant-numeric:tabular-nums}.difficulty-best strong{color:var(--text);font-weight:600}.stats-headline{display:flex;gap:28px;margin-bottom:16px;flex-wrap:wrap}.stats-headline>div{display:flex;flex-direction:column}.stats-number{font-family:var(--font-display);font-size:1.7rem;font-weight:600;font-variant-numeric:tabular-nums;line-height:1.1}.stats-table{width:100%;border-collapse:collapse;font-size:.88rem}.stats-table th,.stats-table td{text-align:left;padding:7px 8px;border-bottom:1px solid var(--border);font-variant-numeric:tabular-nums}.stats-table th{color:var(--text-muted);font-weight:500;font-size:.78rem;text-transform:uppercase;letter-spacing:.05em}.result-won{color:var(--success);font-weight:500}.result-abandoned{color:var(--danger);font-weight:500}.scope-toggle{display:flex;gap:4px}.scope-toggle button{padding:5px 10px;font-size:.8rem;color:var(--text-muted)}.scope-toggle button.active{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent)}.leaderboard-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}.leaderboard-list li{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:6px;font-size:.88rem}.leaderboard-list li.current-user{background:color-mix(in srgb,var(--accent) 12%,transparent);font-weight:500}.leaderboard-list .rank{color:var(--text-muted);width:30px;font-variant-numeric:tabular-nums}.leaderboard-list li:nth-child(-n+3) .rank{color:var(--warning);font-weight:600}.leaderboard-list .name{flex:1}.leaderboard-list .time{font-variant-numeric:tabular-nums}.auth-card{background:var(--bg-panel);border:1px solid var(--border);border-radius:14px;padding:32px;width:100%;max-width:400px;display:flex;flex-direction:column;gap:12px;box-shadow:var(--shadow);animation:rise-in .35s ease-out both}.auth-card h1{margin:0;font-size:1.7rem;display:flex;align-items:center;gap:10px}.auth-subtitle{margin:0 0 8px;color:var(--text-muted);font-size:.88rem}.auth-tabs{display:flex;border:1px solid var(--border);border-radius:8px;overflow:hidden;margin-bottom:6px}.auth-tabs button{flex:1;background:transparent;border:none;color:var(--text-muted);padding:9px;font-weight:500}.auth-tabs button.active{background:var(--accent);color:var(--accent-ink)}.auth-card label{display:flex;flex-direction:column;gap:4px;font-size:.85rem;color:var(--text-muted)}.auth-card input[type=email],.auth-card input[type=password],.auth-card input[type=text]{background:var(--bg-panel-alt);border:1px solid var(--border);border-radius:6px;padding:9px 10px;color:var(--text);font-size:.95rem;font-family:inherit}.auth-card input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent)}.difficulty-picker{border:1px solid var(--border);border-radius:8px;padding:10px;display:flex;flex-wrap:wrap;gap:8px}.difficulty-picker legend{color:var(--text-muted);font-size:.8rem;padding:0 4px}.difficulty-picker label{flex-direction:row;align-items:center;gap:6px;border:1px solid var(--border);border-radius:6px;padding:5px 10px;color:var(--text);cursor:pointer}.difficulty-picker label.active{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent)}.auth-error{color:var(--danger);font-size:.85rem;margin:0}.auth-hint{margin:8px 0 0;font-size:.78rem;color:var(--text-muted);text-align:center}.auth-hint code{font-family:var(--font-ui);background:var(--bg-panel-alt);padding:1px 5px;border-radius:4px}.auth-repo-link{display:inline-flex;align-items:center;justify-content:center;gap:7px;margin-top:4px;padding-top:12px;border-top:1px solid var(--border);color:var(--text-muted);font-size:.82rem;text-decoration:none}.auth-repo-link:hover{color:var(--accent)}.auth-repo-link svg{width:16px;height:16px}.game-page{max-width:920px}.game-status-bar{display:flex;align-items:center;gap:16px;margin-bottom:20px;flex-wrap:wrap}.game-timer{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:1.35rem;font-weight:600;min-width:4ch}.game-timer.paused{animation:pulse 1.4s ease-in-out infinite}.mistake-counter{color:var(--text-muted);font-size:.9rem;font-variant-numeric:tabular-nums;display:inline-flex;align-items:center;gap:6px}.mistake-counter .pips{display:inline-flex;gap:4px}.mistake-counter .pip{width:9px;height:9px;border-radius:50%;border:1.5px solid var(--border-strong);background:transparent}.mistake-counter .pip.hit{background:var(--warning);border-color:var(--warning)}.mistake-counter.warn .pip.hit{background:var(--danger);border-color:var(--danger)}.mistake-counter.warn{color:var(--danger)}.game-status-actions{margin-left:auto;display:flex;gap:8px}.game-body{display:flex;gap:24px;align-items:flex-start;flex-wrap:wrap;transition:filter .3s ease}.game-body.blurred{filter:blur(7px) saturate(.7);pointer-events:none;-webkit-user-select:none;user-select:none}.sudoku-grid{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));width:min(100%,520px);aspect-ratio:1;background:var(--border);border:2.5px solid var(--border-strong);border-radius:8px;overflow:hidden;gap:1px;box-shadow:var(--shadow);flex:none}.sudoku-cell{background:var(--bg-panel);border:none;outline:none;display:flex;align-items:center;justify-content:center;padding:0;aspect-ratio:1;position:relative;color:var(--text);transition:background-color .12s ease}.sudoku-cell:focus-visible{outline:none}.sudoku-cell.box-top{border-top:2px solid var(--border-strong)}.sudoku-cell.box-left{border-left:2px solid var(--border-strong)}.sudoku-cell.crosshair{background:var(--crosshair)}.sudoku-cell.same-digit{box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--entered-text) 45%,transparent)}.sudoku-cell.selected{background:var(--highlight);box-shadow:inset 0 0 0 2.5px var(--accent);z-index:1}.sudoku-cell.conflict{background:color-mix(in srgb,var(--danger) 14%,var(--bg-panel))}.sudoku-cell.conflict .cell-value{color:var(--danger)}.cell-value{font-size:clamp(1.05rem,3.6vw,1.55rem);font-weight:600;line-height:1}.given .cell-value{font-family:var(--font-display);color:var(--given-text)}.entered .cell-value{font-family:var(--font-hand);font-size:clamp(1.35rem,4.6vw,2rem);font-weight:600;color:var(--entered-text);animation:pop-in .16s cubic-bezier(.2,1.4,.4,1) both;transform:rotate(-3deg)}.entered .cell-value.shake{animation:shake .32s ease both}.cell-notes{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);width:90%;height:90%}.cell-note{display:flex;align-items:center;justify-content:center;font-family:var(--font-hand);font-size:clamp(.62rem,1.9vw,.8rem);font-weight:500;color:var(--note-text);line-height:1}.game-side-panel{flex:1;min-width:230px;display:flex;flex-direction:column;gap:16px}.toolbar{display:flex;flex-direction:column;gap:10px}.mode-toggle{display:flex;border:1px solid var(--border);border-radius:8px;overflow:hidden;background:var(--bg-panel)}.mode-toggle button{flex:1;background:transparent;border:none;color:var(--text-muted);padding:9px;font-size:.85rem;font-weight:500;display:inline-flex;align-items:center;justify-content:center;gap:6px}.mode-toggle button svg{width:15px;height:15px}.mode-toggle button.active{background:var(--accent);color:var(--accent-ink)}.toolbar-actions{display:flex;gap:8px}.toolbar-actions button{flex:1;padding:8px;display:inline-flex;align-items:center;justify-content:center;gap:6px}.toolbar-actions button svg{width:15px;height:15px}.toolbar-actions button:disabled{opacity:.4;cursor:default}.shortcut-hint{margin:0;font-size:.75rem;color:var(--text-muted);line-height:1.6}.shortcut-hint kbd{font-family:var(--font-ui);font-size:.7rem;border:1px solid var(--border);border-bottom-width:2px;border-radius:4px;padding:0 5px;background:var(--bg-panel)}.number-pad{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.number-pad-btn{background:var(--bg-panel);border:1px solid var(--border);color:var(--text);border-radius:10px;padding:10px 0 8px;display:flex;flex-direction:column;align-items:center;gap:2px;box-shadow:var(--shadow)}.number-pad-btn .digit{font-family:var(--font-hand);font-size:1.7rem;font-weight:600;line-height:1;color:var(--entered-text)}.number-pad-btn .remaining{font-size:.68rem;color:var(--text-muted);font-variant-numeric:tabular-nums}.number-pad-btn:hover:not(:disabled){border-color:var(--border-strong)}.number-pad-btn.active{border-color:var(--accent);background:var(--highlight);box-shadow:0 0 0 1px var(--accent)}.number-pad-btn.complete{opacity:.45;cursor:default;box-shadow:none}.number-pad-btn.complete .digit{color:var(--text-muted);text-decoration:line-through}.number-pad-btn.complete .remaining{color:var(--success)}.modal-overlay{position:fixed;inset:0;background:color-mix(in srgb,var(--bg) 55%,transparent);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;z-index:20;padding:20px;animation:fade-in .2s ease both}.modal{background:var(--bg-panel);border:1px solid var(--border);border-radius:14px;padding:28px;width:100%;max-width:400px;text-align:center;box-shadow:var(--shadow);animation:rise-in .3s cubic-bezier(.2,1.2,.4,1) both;position:relative;overflow:hidden}.modal h2{margin:0 0 10px;font-size:1.5rem}.pb-banner{display:inline-block;background:var(--warning);color:#2b2925;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:4px 12px;border-radius:999px;margin-bottom:10px;animation:rise-in .4s .25s cubic-bezier(.2,1.4,.4,1) both}.victory-time{font-family:var(--font-display);font-size:2.6rem;font-weight:600;font-variant-numeric:tabular-nums;margin:4px 0 16px;line-height:1}.victory-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0 0 20px}.victory-stats dt{color:var(--text-muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.05em}.victory-stats dd{margin:2px 0 0;font-weight:600;font-variant-numeric:tabular-nums}.victory-actions{display:flex;flex-direction:column;gap:8px}.victory-actions button{padding:10px}.confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden}.confetti span{position:absolute;top:-12px;width:8px;height:12px;border-radius:2px;opacity:0;animation:confetti-fall 2.4s ease-out both}.profile-tabs{display:flex;gap:8px;margin-bottom:18px;flex-wrap:wrap}.profile-tabs button{color:var(--text-muted)}.profile-tabs button.active{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent)}@keyframes pop-in{0%{transform:scale(.4) rotate(-3deg);opacity:0}to{transform:scale(1) rotate(-3deg);opacity:1}}@keyframes shake{0%,to{transform:translate(0) rotate(-3deg)}20%{transform:translate(-4px) rotate(-3deg)}40%{transform:translate(4px) rotate(-3deg)}60%{transform:translate(-3px) rotate(-3deg)}80%{transform:translate(3px) rotate(-3deg)}}@keyframes rise-in{0%{transform:translateY(10px) scale(.98);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.35}}@keyframes confetti-fall{0%{transform:translateY(0) rotate(0);opacity:1}to{transform:translateY(420px) rotate(720deg);opacity:0}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
