.play-page{--bg: #f5f6f2;--surface: #ffffff;--on-surface: #202d28;--on-surface-variant: #637168;--outline: #c5cec7;--primary: #326b58;--primary-button: #326b58;--timer-green: #2e7d32;--given: #000000;--user: #326b58;--conflict: #bc3542;--note: #637168;--cell-selected: rgb(50 107 88 / .2);--cell-related: rgb(50 107 88 / .12);--cell-same: rgb(50 107 88 / .23);--grid-line: rgb(142 142 147 / .28);--grid-bold: rgb(142 142 147 / .7);--gray-soft: rgb(142 142 147 / .1);--easy: #4caf50;--medium: #2196f3;--hard: #ff9800;--expert: #f44336;--hint: #ffcc00;--shadow-board: 0 4px 12px rgb(0 0 0 / .08);--shadow-pad: 0 1px 3px rgb(0 0 0 / .05);--shadow-circle: 0 2px 4px rgb(0 0 0 / .06);--shadow-card: 0 2px 8px rgb(0 0 0 / .08);background:var(--bg);color:var(--on-surface);font-family:Inter,system-ui,-apple-system,sans-serif}@media(prefers-color-scheme:dark){.play-page{--bg: #111a17;--surface: #1b2722;--on-surface: #edf3ee;--on-surface-variant: #a9b9ae;--outline: #44584d;--primary: #8dcbb0;--primary-button: #39765f;--timer-green: #47b04c;--given: #ffffff;--user: #8dcbb0;--conflict: #ff8790;--note: #a9b9ae;--cell-selected: rgb(141 203 176 / .25);--cell-related: rgb(141 203 176 / .15);--cell-same: rgb(141 203 176 / .23);--easy: #66bb6a;--medium: #42a5f5;--hard: #ffb74d;--expert: #ef5350;--shadow-board: 0 4px 12px rgb(0 0 0 / .35);--shadow-pad: 0 1px 3px rgb(0 0 0 / .3);--shadow-circle: 0 2px 4px rgb(0 0 0 / .3);--shadow-card: 0 2px 8px rgb(0 0 0 / .35);color-scheme:dark}}.play-page .display{font-family:Manrope,Inter,system-ui,sans-serif}.game{display:flex;flex-direction:column;gap:14px;width:100%;max-width:520px;margin:0 auto;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}.chip-row{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}.chip-row::-webkit-scrollbar{display:none}.chip{flex:none;display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 14px;border-radius:999px;border:1px solid var(--gray-soft);background:var(--surface);color:var(--on-surface-variant);font:500 13px/1 Inter,system-ui,sans-serif;box-shadow:var(--shadow-pad);cursor:pointer;transition:background .15s,color .15s,transform .1s}.chip:active:not(:disabled){transform:scale(.96)}.chip[aria-pressed=true]{background:var(--primary-button);border-color:var(--primary-button);color:#fff}.chip:disabled{cursor:default;opacity:.55;box-shadow:none}.chip .soon{font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}.dash{width:14px;height:3px;border-radius:2px}.topbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 2px;color:var(--on-surface-variant);font-size:13px}.topbar .stat{display:flex;flex-direction:column;gap:2px}.topbar .stat-label{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;opacity:.8}.topbar .stat-value{font-weight:600;font-size:15px;color:var(--on-surface);font-variant-numeric:tabular-nums}.topbar .timer{display:flex;align-items:center;gap:8px;justify-self:end}.icon-btn{display:grid;place-items:center;width:36px;height:36px;border-radius:999px;border:1px solid var(--gray-soft);background:var(--surface);color:var(--on-surface);box-shadow:var(--shadow-circle);cursor:pointer}.icon-btn svg{width:16px;height:16px}.board-wrap{position:relative}.board{container-type:inline-size;position:relative;display:grid;grid-template-columns:repeat(9,1fr);aspect-ratio:1;width:100%;background:var(--surface);border:2px solid var(--grid-bold);border-radius:10px;overflow:hidden;box-shadow:var(--shadow-board);touch-action:manipulation}.cell{position:relative;display:grid;place-items:center;min-width:0;padding:0;border:0;border-right:.5px solid var(--grid-line);border-bottom:.5px solid var(--grid-line);background:transparent;color:var(--user);font:500 calc(100cqi / 9 * .56) / 1 "Inter",system-ui,sans-serif;cursor:pointer;outline:none}.cell.c8{border-right:0}.cell.r8{border-bottom:0}.cell.box-r{border-right:2px solid var(--grid-bold)}.cell.box-b{border-bottom:2px solid var(--grid-bold)}.cell.related{background:var(--cell-related)}.cell.same{background:var(--cell-same)}.cell.selected{background:var(--cell-selected);box-shadow:inset 0 0 0 2px var(--primary)}.cell.given{color:var(--given);font-weight:600}.cell.wrong{color:var(--conflict)}.cell.hinted:after{content:"";position:absolute;top:3px;right:3px;width:5px;height:5px;border-radius:50%;background:var(--hint)}.cell.pop{animation:pop .22s ease-out}@keyframes pop{50%{transform:scale(1.18)}}.notes{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);width:100%;height:100%;padding:2px;color:var(--note);font:500 calc(100cqi / 27 * .62) / 1 "Inter",system-ui,sans-serif}.notes span{display:grid;place-items:center}.notes span.match{color:var(--primary);font-weight:700}.board-paused{position:absolute;inset:0;display:grid;place-items:center;border-radius:10px;background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:blur(6px)}.board-paused .inner{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}.controls{display:flex}.control{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;padding:0;border:0;background:none;color:var(--on-surface-variant);font:500 12px/1 Inter,system-ui,sans-serif;cursor:pointer}.control .circle{position:relative;display:grid;place-items:center;width:52px;height:52px;border-radius:999px;background:var(--surface);border:1px solid var(--gray-soft);color:var(--on-surface);box-shadow:var(--shadow-circle);transition:transform .1s,background .15s}.control:active:not(:disabled) .circle{transform:scale(.94)}.control.active .circle{background:color-mix(in srgb,var(--primary) 15%,var(--surface));box-shadow:inset 0 0 0 2px var(--primary);color:var(--primary)}.control.accent .circle{color:var(--primary)}.control:disabled{cursor:default}.control:disabled .circle{background:var(--gray-soft);box-shadow:none;color:var(--on-surface-variant);opacity:.5}.control svg{width:22px;height:22px}.badge{position:absolute;top:-3px;right:-3px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--primary-button);color:#fff;font:600 10px/18px Inter,system-ui,sans-serif;text-align:center}.pad{display:flex;gap:4px}.pad button{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:0;height:60px;padding:0;border-radius:8px;border:1px solid var(--gray-soft);background:var(--surface);color:var(--primary);box-shadow:var(--shadow-pad);cursor:pointer;transition:transform .1s}.pad button:active:not(:disabled){transform:scale(.95)}.pad .digit{font:600 26px/1 Inter,system-ui,sans-serif}.pad .count{height:10px;font:400 10px/10px Inter,system-ui,sans-serif;color:var(--on-surface-variant);opacity:.7}.pad button.done{opacity:.4;cursor:default}.pad button.done .count{color:var(--timer-green);opacity:1}.pad.notes-mode button{color:var(--on-surface-variant)}.pad.notes-mode .digit{font-weight:500}.scrim{position:fixed;inset:0;z-index:60;display:grid;place-items:end center;padding:16px;background:#0006;animation:fade .2s ease-out}@media(min-width:640px){.scrim{place-items:center}}.sheet{width:100%;max-width:420px;max-height:calc(100dvh - 32px);overflow-y:auto;padding:24px 20px 20px;border-radius:20px;background:var(--surface);color:var(--on-surface);box-shadow:var(--shadow-card);animation:rise .25s ease-out}@keyframes fade{0%{opacity:0}}@keyframes rise{0%{transform:translateY(24px);opacity:0}}.stat-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.stat-tile{padding:12px 8px;border-radius:12px;background:var(--gray-soft);text-align:center}.stat-tile .v{font:700 18px/1.2 Manrope,Inter,sans-serif;font-variant-numeric:tabular-nums}.stat-tile .l{margin-top:2px;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--on-surface-variant)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:50px;padding:0 20px;border-radius:12px;border:0;font:600 15px/1 Inter,system-ui,sans-serif;cursor:pointer;text-decoration:none;transition:transform .1s,filter .15s}.btn:active{transform:scale(.98)}.btn-primary{background:var(--primary-button);color:#fff;box-shadow:0 3px 8px color-mix(in srgb,var(--primary) 25%,transparent)}.btn-primary:hover{filter:brightness(1.08)}.btn-outline{background:transparent;color:var(--on-surface);border:1px solid var(--outline)}.ad-slot{display:block;width:100%;overflow:hidden}.ad-label{margin-bottom:4px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--on-surface-variant);opacity:.7;text-align:center}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}@media(max-width:639px){.game{gap:10px;max-width:max(280px,min(100%,calc(100dvh - 350px)))}.chip{height:30px;padding:0 12px}.pad button{height:52px}.control .circle{width:46px;height:46px}.control svg{width:20px;height:20px}}@media(prefers-reduced-motion:reduce){.play-page *,.play-page *:before,.play-page *:after{animation:none!important;transition:none!important}}.pad .count svg{width:10px;height:10px}@media(min-width:640px){.game{max-width:clamp(340px,calc(100dvh - 424px),520px)}}