:root{--font:-apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--bg:#f4f5fa;--surface:#fff;--surface-2:#eceef7;--text:#1a1e33;--muted:#667089;--line:#d3d7e6;--line-strong:#232845;--accent:#4357d9;--accent-text:#fff;--accent-soft:#e4e8fd;--cell-selected:#bcc6fa;--cell-peer:#e9ecfc;--cell-same:#d3d9fa;--given:#1a1e33;--entered:#3447c4;--note:#6f7794;--error:#cf3040;--error-bg:#fbdfe3;--easy:#2f9e6b;--medium:#d08a1c;--hard:#d4572a;--expert:#a23bc4;--shadow:0 8px 28px #1a1e332e}:root[data-theme=dark]{--bg:#0f1220;--surface:#181c31;--surface-2:#222745;--text:#eceef9;--muted:#98a0c0;--line:#2d3355;--line-strong:#8d96c8;--accent:#8c9bff;--accent-text:#0f1220;--accent-soft:#272d57;--cell-selected:#3b4694;--cell-peer:#1d2244;--cell-same:#2c3672;--given:#eceef9;--entered:#a1adff;--note:#8f97bb;--error:#ff7d89;--error-bg:#4a2029;--easy:#4cc590;--medium:#eaa940;--hard:#f2805a;--expert:#cf7bef;--shadow:0 8px 28px #00000080}@media (prefers-color-scheme:dark){:root:not([data-theme]){--bg:#0f1220;--surface:#181c31;--text:#eceef9}}*,:before,:after{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);font-family:var(--font);overscroll-behavior:none;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;margin:0;font-size:16px;line-height:1.35}#app{height:100%}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;background:0 0;border:0;margin:0;padding:0}button:disabled{cursor:default}h1,h2,p{margin:0}.muted{color:var(--muted)}.screen{-webkit-overflow-scrolling:touch;height:100dvh;padding:max(env(safe-area-inset-top), 10px) max(env(safe-area-inset-right), 16px) max(env(safe-area-inset-bottom), 12px) max(env(safe-area-inset-left), 16px);max-width:560px;margin:0 auto;overflow-y:auto}.icon-btn{width:44px;height:44px;color:var(--text);border-radius:12px;place-items:center;display:grid}.icon-btn:active{background:var(--surface-2)}.icon-btn.subtle{color:var(--muted)}.home{flex-direction:column;gap:22px;padding-bottom:32px;display:flex}.home-head{justify-content:space-between;align-items:center;padding-top:4px;display:flex}.home-head h1{letter-spacing:-.02em;font-size:34px;font-weight:800}.home h2{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:10px;font-size:13px;font-weight:700}.continue{background:var(--accent);width:100%;color:var(--accent-text);text-align:left;box-shadow:var(--shadow);border-radius:18px;align-items:center;gap:14px;padding:16px 18px;display:flex}.continue:active{transform:scale(.985)}.continue-icon{background:#ffffff38;border-radius:50%;place-items:center;width:44px;height:44px;display:grid}:root[data-theme=dark] .continue-icon{background:#0f12202e}.continue-text{flex-direction:column;display:flex}.continue-text strong{font-size:20px}.continue-text small{opacity:.85;font-size:14px}.levels{grid-template-columns:1fr 1fr;gap:10px;display:grid}.level{background:var(--surface);text-align:left;border-left:5px solid var(--lvl);border-radius:16px;flex-direction:column;align-items:flex-start;gap:2px;padding:16px;display:flex;box-shadow:0 1px 2px #0000000f}.level strong{font-size:18px}.level small{color:var(--muted);font-size:13px}.level:active:not(:disabled){transform:scale(.97)}.level:disabled{opacity:.5}.level.easy,.badge.easy{--lvl:var(--easy)}.level.medium,.badge.medium{--lvl:var(--medium)}.level.hard,.badge.hard{--lvl:var(--hard)}.level.expert,.badge.expert{--lvl:var(--expert)}.list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.row{background:var(--surface);border-radius:14px;align-items:center;padding-right:4px;display:flex}.row-main{text-align:left;flex:1;align-items:center;gap:12px;min-width:0;padding:12px 8px 12px 12px;display:flex}.badge{text-align:center;min-width:78px;color:var(--lvl);background:color-mix(in srgb, var(--lvl) 16%, transparent);border-radius:999px;flex:none;padding:4px 10px;font-size:13px;font-weight:700}.row-info{flex-direction:column;min-width:70px;display:flex}.row-info small{color:var(--muted);font-size:12px}.row-progress{flex:1;justify-content:flex-end;align-items:center;gap:8px;display:flex}.row-progress small{text-align:right;width:38px;color:var(--muted);font-size:12px}.bar-track{background:var(--surface-2);border-radius:3px;flex:1;max-width:90px;height:6px;overflow:hidden}.bar-fill{background:var(--accent);border-radius:3px;height:100%;display:block}.row-done{color:var(--easy);flex:1;justify-content:flex-end;align-items:center;gap:4px;font-size:13px;font-weight:600;display:flex}.empty{text-align:center;padding:8px 0}.game{--board:min(calc(100vw - 24px), calc(100dvh - 350px), 540px);flex-direction:column;display:flex;overflow:hidden}.bar{flex:none;justify-content:space-between;align-items:center;height:52px;display:flex}.bar-title{flex-direction:column;align-items:center;line-height:1.15;display:flex}.bar-title strong{font-size:16px}.timer{font-variant-numeric:tabular-nums;color:var(--muted);border-radius:8px;padding:2px 10px;font-size:14px}.timer:active:not(:disabled){background:var(--surface-2)}.board-wrap{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:10px;min-height:0;display:flex}.board{width:var(--board);height:var(--board);background:var(--surface);border:2px solid var(--line-strong);touch-action:manipulation;--cell:calc(var(--board) / 9);border-radius:6px;grid-template-rows:repeat(9,1fr);grid-template-columns:repeat(9,1fr);display:grid;position:relative;overflow:hidden}.cell{border-right:1px solid var(--line);border-bottom:1px solid var(--line);font-size:calc(var(--cell) * .6);place-items:center;line-height:1;display:grid;position:relative}.cell:nth-child(9n){border-right:0}.cell:nth-child(n+73){border-bottom:0}.cell.bx{border-right:2px solid var(--line-strong)}.cell.by{border-bottom:2px solid var(--line-strong)}.cell.peer{background:var(--cell-peer)}.cell.same{background:var(--cell-same)}.cell.selected{background:var(--cell-selected)}.value{color:var(--entered);font-weight:500}.cell.given .value{color:var(--given);font-weight:700}.cell.wrong{background:var(--error-bg)}.cell.wrong .value{color:var(--error)}.notes{width:100%;height:100%;font-size:calc(var(--cell) * .26);color:var(--note);grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);padding:1px;font-weight:600;display:grid}.notes span{place-items:center;display:grid}.notes .hl{color:var(--accent);background:var(--accent-soft);border-radius:50%;font-weight:800}.board.paused .cell>*{visibility:hidden}.pause-cover{background:var(--surface);color:var(--muted);place-items:center;font-size:18px;font-weight:600;display:grid;position:absolute;inset:0}.done-banner{color:var(--easy);font-weight:700}.controls{width:var(--board);flex-direction:column;flex:none;gap:10px;margin:0 auto;padding-bottom:4px;display:flex}.tools{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.tools button{color:var(--text);border-radius:12px;flex-direction:column;align-items:center;gap:3px;padding:8px 0 6px;font-size:12px;display:flex;position:relative}.tools button:active:not(:disabled){background:var(--surface-2)}.tools button:disabled{color:var(--muted);opacity:.45}.tools button.on{background:var(--accent);color:var(--accent-text)}.tools em{opacity:.85;font-size:9px;font-style:normal;font-weight:800;position:absolute;top:3px;right:6px}.pad{grid-template-columns:repeat(9,1fr);gap:5px;display:grid}.pad button{background:var(--surface);height:clamp(50px,8dvh,64px);color:var(--entered);border-radius:12px;place-items:center;display:grid;position:relative;box-shadow:0 1px 2px #0000001a}.pad b{margin-top:-4px;font-size:clamp(24px,6.4vw,30px);font-weight:600;line-height:1}.pad small{text-align:center;color:var(--muted);font-size:10px;line-height:1;position:absolute;bottom:4px;left:0;right:0}.pad.note-mode button{color:var(--note);background:var(--accent-soft)}.pad button:active:not(:disabled){background:var(--accent);color:var(--accent-text)}.pad button:disabled{opacity:.35}.toast{left:50%;bottom:calc(max(env(safe-area-inset-bottom), 12px) + 190px);background:var(--text);color:var(--bg);box-shadow:var(--shadow);pointer-events:none;white-space:nowrap;border-radius:999px;padding:10px 18px;font-size:15px;font-weight:600;position:fixed;transform:translate(-50%)}.backdrop{z-index:10;background:#080a1680;justify-content:center;align-items:flex-end;animation:.15s ease-out fade;display:flex;position:fixed;inset:0}.backdrop.center{align-items:center}.sheet{background:var(--surface);width:100%;max-width:560px;padding:20px 20px calc(max(env(safe-area-inset-bottom), 12px) + 8px);border-radius:22px 22px 0 0;flex-direction:column;gap:14px;animation:.2s ease-out rise;display:flex}.sheet h2{font-size:20px}.menu{flex-direction:column;display:flex}.menu button{text-align:left;border-top:1px solid var(--line);align-items:center;gap:14px;padding:15px 4px;font-size:17px;display:flex}.menu button:first-child{border-top:0}.menu button:disabled{opacity:.4}.actions{justify-content:flex-end;gap:10px;display:flex}.btn{background:var(--surface-2);border-radius:12px;min-height:46px;padding:0 20px;font-size:16px;font-weight:600}.btn.primary{background:var(--accent);color:var(--accent-text)}.btn.danger{background:var(--error);color:#fff}.loading{background:var(--surface);box-shadow:var(--shadow);border-radius:20px;flex-direction:column;align-items:center;gap:14px;padding:26px 32px;display:flex}.spinner{border:4px solid var(--surface-2);border-top-color:var(--accent);border-radius:50%;width:34px;height:34px;animation:.8s linear infinite spin}.segmented{background:var(--surface-2);border-radius:12px;grid-template-columns:repeat(3,1fr);padding:3px;display:grid}.segmented button{color:var(--muted);border-radius:10px;padding:9px 0;font-weight:600}.segmented button.on{background:var(--surface);color:var(--text);box-shadow:0 1px 3px #00000026}.toggle{justify-content:space-between;align-items:center;gap:16px;padding:6px 0;display:flex}.toggle span{flex-direction:column;display:flex}.toggle small{color:var(--muted);font-size:13px}.toggle input{opacity:0;pointer-events:none;position:absolute}.toggle i{background:var(--line);border-radius:999px;flex:none;width:52px;height:31px;transition:background .15s;position:relative}.toggle i:after{content:"";background:#fff;border-radius:50%;width:27px;height:27px;transition:transform .15s;position:absolute;top:2px;left:2px;box-shadow:0 1px 3px #0000004d}.toggle input:checked+i{background:var(--easy)}.toggle input:checked+i:after{transform:translate(21px)}@keyframes fade{0%{opacity:0}}@keyframes rise{0%{opacity:0;transform:translateY(30px)}}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
