:root{--ad-bottom:0px;--safe-bottom:calc(env(safe-area-inset-bottom) + var(--ad-bottom));--bg-1:#1b1624;--bg-2:#2a2135;--surface:#ffffff12;--surface-2:#ffffff1f;--line:#ffffff24;--text:#f6f1e7;--muted:#bdb3c8;--accent:#f1dcaa;--accent-2:#e8b64c;--accent-ink:#2a1f0c;--brand-ink:#f6efe0;--brand-slot:#1b1624;--danger:#f07a62;--shadow:0 10px 30px #00000059;--radius:16px;--font:system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", "Noto Sans Hebrew", "Noto Sans Arabic", "Noto Sans Devanagari", "Noto Sans CJK SC", "PingFang SC", "Hiragino Sans", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}:root[data-theme=light]{--bg-1:#f6f1e7;--bg-2:#e6dccb;--surface:#281c320f;--surface-2:#281c321c;--line:#281c3229;--text:#231d2b;--muted:#5e5468;--accent:#8a5f12;--accent-2:#c48a1c;--accent-ink:#fffaf0;--brand-ink:#2a1f35;--brand-slot:#e4d8c2;--danger:#b4402b;--shadow:0 10px 30px #3c28142e;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:light){:root[data-theme=system]{--bg-1:#f6f1e7;--bg-2:#e6dccb;--surface:#281c320f;--surface-2:#281c321c;--line:#281c3229;--text:#231d2b;--muted:#5e5468;--accent:#8a5f12;--accent-2:#c48a1c;--accent-ink:#fffaf0;--brand-ink:#2a1f35;--brand-slot:#e4d8c2;--danger:#b4402b;--shadow:0 10px 30px #3c28142e;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}}*{box-sizing:border-box}html,body{overscroll-behavior:none;height:100%;margin:0;overflow:hidden}body{font-family:var(--font);color:var(--text);background:radial-gradient(120% 80% at 50% 0%, var(--bg-2), var(--bg-1) 70%) fixed;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation}button,select,input{font:inherit;color:inherit}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}#app{padding:env(safe-area-inset-top) env(safe-area-inset-right) var(--safe-bottom) env(safe-area-inset-left);position:fixed;inset:0}.screen{max-width:980px;height:100%;margin:0 auto}.btn{border:1px solid var(--line);background:var(--surface);cursor:pointer;letter-spacing:.01em;border-radius:14px;justify-content:center;align-items:center;gap:10px;min-height:48px;padding:10px 18px;font-weight:600;transition:transform .12s,background .2s,box-shadow .2s;display:inline-flex}.btn:hover{background:var(--surface-2)}.btn:active{transform:scale(.97)}.btn:focus-visible,.icon-btn:focus-visible,.ctrl:focus-visible,.level-tile:focus-visible,.tab:focus-visible,.dpad-btn:focus-visible,.stage:focus-visible{outline:3px solid var(--accent-2);outline-offset:2px}.btn.primary{color:#2a1f0c;background:linear-gradient(#f6e2b0,#e2b553);border-color:#0000;box-shadow:0 6px 18px #e2b55352}.btn.big{min-height:58px;padding:12px 26px;font-size:1.12rem}.btn.small{min-height:40px;padding:6px 14px;font-size:.92rem}.btn.ghost{color:var(--muted);background:0 0;border-color:#0000}.btn.danger{color:var(--danger)}.btn .icon svg{width:20px;height:20px;display:block}.icon{display:inline-flex}.icon-btn{border:1px solid var(--line);background:var(--surface);cursor:pointer;border-radius:14px;flex:none;place-items:center;width:48px;height:48px;display:grid}.icon-btn svg{width:22px;height:22px}.badge{background:var(--accent-2);color:#2a1f0c;border-radius:999px;padding:0 7px;font-size:.8rem}[dir=rtl] .flip-rtl svg{transform:scaleX(-1)}.home{flex-direction:column;align-items:center;gap:10px;height:100%;padding:18px 16px 16px;display:flex}.brand{text-align:center;flex-direction:column;align-items:center;display:flex}.brand h1{color:var(--brand-ink);margin:4px 0 0;line-height:0}.brand .logo svg{will-change:transform;width:clamp(190px,52vw,300px);height:auto;display:block;overflow:visible}.tagline{color:var(--muted);margin:4px 0 0;font-size:.98rem}.home-hero{flex:auto;width:100%;min-height:140px;position:relative}.progress-line{color:var(--muted);margin:0;font-size:.92rem}.home-menu{flex-direction:column;gap:10px;width:min(420px,100%);display:flex}.home-row{grid-template-columns:1fr 1fr;gap:10px;display:grid}.stage{touch-action:none;outline:none;position:absolute;inset:0}.stage canvas{width:100%;height:100%;display:block}.topbar{align-items:center;gap:12px;padding:10px 12px 4px;display:flex}.topbar h2{margin:0;font-size:1.15rem}.topbar .title{text-align:center;flex:1;min-width:0}.topbar .subtitle{color:var(--muted);font-size:.85rem}.topbar-meta{color:var(--accent);margin-inline-start:auto;font-weight:700}.levels{flex-direction:column;height:100%;display:flex}.tabs{scrollbar-width:none;gap:8px;padding:8px 12px;display:flex;overflow-x:auto}.tab{border:1px solid var(--line);background:var(--surface);cursor:pointer;border-radius:14px;flex-direction:column;flex:none;align-items:flex-start;gap:2px;min-height:52px;padding:8px 14px;display:flex;position:relative}.tab[aria-selected=true]{background:var(--surface-2);border-color:var(--accent-2)}.tab-n{color:var(--muted);font-size:.75rem}.tab-name{font-weight:650}.tab .tiny{inset-inline-end:6px;position:absolute;top:6px}.tab .tiny svg{width:14px;height:14px}.level-grid{touch-action:pan-y;flex:1;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));align-content:start;gap:10px;padding:8px 12px 24px;display:grid;overflow-y:auto}.level-tile{aspect-ratio:1;border:1px solid var(--line);background:var(--surface);cursor:pointer;border-radius:18px;flex-direction:column;justify-content:center;align-items:center;gap:4px;transition:transform .12s;display:flex}.level-tile:active{transform:scale(.95)}.level-tile.solved{background:linear-gradient(160deg, var(--surface-2), var(--surface));border-color:#e8b64c73}.level-tile.locked{opacity:.45;cursor:not-allowed}.level-tile .num{font-size:1.35rem;font-weight:750}.level-tile .size{color:var(--muted);font-size:.7rem}.stars{gap:1px;display:flex}.star svg{width:14px;height:14px;color:var(--line)}.star.on svg{color:var(--accent-2)}.lock svg{width:16px;height:16px}.locked-world{text-align:center;color:var(--muted);grid-column:1/-1;padding:40px 10px}.locked-world svg{width:40px;height:40px}.play{flex-direction:column;height:100%;display:flex}.hud{align-items:center;gap:12px;padding:4px 14px;display:flex}.goal-wrap{background:var(--surface);border:1px solid var(--line);border-radius:14px;flex-direction:column;align-items:center;padding:6px;display:flex}.goal-wrap .stat-label{margin-top:2px}.stats{flex:1;grid-template-columns:repeat(auto-fit,minmax(64px,1fr));gap:8px;display:grid}.stat{background:var(--surface);border-radius:12px;flex-direction:column;align-items:center;padding:6px 4px;display:flex}.stat-label{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-size:.72rem}.stat-value{font-variant-numeric:tabular-nums;font-size:1.25rem;font-weight:750}.coach{background:linear-gradient(90deg,#e8b64c2e,#e8b64c0f);border:1px solid #e8b64c66;border-radius:14px;align-items:center;gap:10px;margin:6px 14px 0;padding:10px 14px;animation:.35s both rise;display:flex}.coach p{flex:1;margin:0;font-size:.95rem;line-height:1.35}.coach[hidden]{display:none}.stage-slot{flex:auto;min-height:200px;position:relative}.hint-text{text-align:center;min-height:1.4em;color:var(--accent);padding:0 12px;font-size:.9rem}.controls{will-change:transform;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;padding:6px 12px 12px;display:flex}.ctrl{border:1px solid var(--line);background:var(--surface);cursor:pointer;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:2px;min-width:72px;min-height:56px;font-size:.75rem;display:flex}.ctrl svg{width:22px;height:22px}.ctrl:active,.dpad-btn:active{transform:scale(.95)}.ctrl.pulse{border-color:var(--accent-2);animation:1.4s ease-in-out infinite pulse}.dpad{direction:ltr;grid-template-rows:repeat(2,30px);grid-template-columns:repeat(3,44px);gap:4px;margin-inline-start:6px;display:grid}.dpad-btn{border:1px solid var(--line);background:var(--surface);cursor:pointer;border-radius:10px;place-items:center;display:grid;position:relative}.dpad-btn svg{width:18px;height:18px}.dpad-btn .dpad-spin{color:var(--accent-2);pointer-events:none;display:grid;position:absolute;top:2px;right:3px}.dpad-btn .dpad-spin svg{stroke-width:2.6px;width:11px;height:11px}.dpad-U{grid-area:1/2}.dpad-L{grid-area:2/1}.dpad-D{grid-area:2/2}.dpad-R{grid-area:2/3}.modal-root:empty{display:none}.modal{-webkit-backdrop-filter:blur(6px);padding:calc(16px + env(safe-area-inset-top)) calc(16px + env(safe-area-inset-right)) calc(16px + var(--safe-bottom)) calc(16px + env(safe-area-inset-left));z-index:20;background:#0a06108c;place-items:center;animation:.2s both fade;display:grid;position:fixed;inset:0}.panel{width:min(460px,100%);max-height:calc(100dvh - 32px - env(safe-area-inset-top) - var(--safe-bottom));background:linear-gradient(180deg, var(--bg-2), var(--bg-1));border:1px solid var(--line);box-shadow:var(--shadow);touch-action:pan-y;-webkit-user-select:text;user-select:text;border-radius:22px;flex-direction:column;gap:10px;padding:22px 20px;animation:.28s cubic-bezier(.2,.9,.3,1.2) both rise;display:flex;overflow-y:auto}:root[data-shell=native] .panel{-webkit-user-select:none;user-select:none}.panel h2{text-align:center;margin:0 0 4px}.panel h3{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:10px 0 0;font-size:.8rem}.panel p{margin:0;line-height:1.45}.row{justify-content:space-between;align-items:center;gap:12px;min-height:44px;display:flex}.row select{background:var(--surface);border:1px solid var(--line);border-radius:10px;max-width:55%;padding:8px}.row select option{background:var(--bg-1)}.row input[type=checkbox]{appearance:none;background:var(--surface-2);cursor:pointer;border-radius:999px;flex:none;width:46px;height:26px;transition:background .2s;position:relative}.row input[type=checkbox]:after{content:"";top:3px;background:#fff;border-radius:50%;width:20px;height:20px;transition:transform .2s;position:absolute;inset-inline-start:3px}.row input[type=checkbox]:checked{background:var(--accent-2)}.row input[type=checkbox]:checked:after{transform:translate(20px)}[dir=rtl] .row input[type=checkbox]:checked:after{transform:translate(-20px)}.row input[type=range]{width:50%;accent-color:var(--accent-2)}.settings-actions{flex-wrap:wrap;gap:10px;margin-top:8px;display:flex}.muted{color:var(--muted)}.small{font-size:.86rem}.link{color:var(--accent)}.win-stars{justify-content:center;gap:6px;display:flex}.big-star svg{width:44px;height:44px;color:var(--line)}.big-star.on svg{color:var(--accent-2);filter:drop-shadow(0 4px 10px #e8b64c73);animation:.45s cubic-bezier(.2,.9,.3,1.4) both pop}.big-star.on:nth-child(2) svg{animation-delay:.12s}.big-star.on:nth-child(3) svg{animation-delay:.24s}.win-stats{text-align:center;grid-template-columns:1fr 1fr;gap:10px;display:grid}.win-stats>div{background:var(--surface);border-radius:14px;flex-direction:column;padding:10px;display:flex}.win-stats strong{font-variant-numeric:tabular-nums;font-size:1.6rem}.win-actions{flex-direction:column;gap:8px;margin-top:6px;display:flex}.badge-line,.optimal-line{text-align:center;color:var(--accent);font-weight:700}.panel>p{text-align:start}.howto{flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.howto li{align-items:flex-start;gap:10px;line-height:1.4;display:flex}.howto-n{background:var(--accent-2);color:#2a1f0c;border-radius:50%;flex:none;place-items:center;width:26px;height:26px;font-size:.85rem;font-weight:700;display:grid}.howto-diagram{justify-content:center;display:flex}.howto-diagram svg{max-width:100%;height:auto}.toast-root{inset-inline:0;bottom:calc(14px + var(--safe-bottom));pointer-events:none;z-index:30;flex-direction:column;align-items:center;gap:8px;display:flex;position:fixed}.toast{pointer-events:auto;color:#f6f1e7;box-shadow:var(--shadow);background:#140e1ceb;border:1px solid #ffffff26;border-radius:14px;align-items:center;gap:12px;max-width:calc(100% - 32px);padding:10px 14px;animation:.25s both rise;display:flex}.consent{inset-inline:12px;bottom:calc(12px + var(--safe-bottom));background:linear-gradient(180deg, var(--bg-2), var(--bg-1));border:1px solid var(--line);max-width:560px;box-shadow:var(--shadow);z-index:25;border-radius:18px;flex-direction:column;gap:10px;margin:0 auto;padding:14px;display:flex;position:fixed}.consent p{color:var(--muted);margin:4px 0 0;font-size:.9rem}.consent-actions{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.fatal{text-align:center;place-content:center;gap:12px;height:100%;display:grid}:root[data-host=netlify] .controls,:root[data-host=netlify] .home{padding-bottom:calc(60px + var(--safe-bottom))}:root[data-host=netlify] .level-grid{padding-bottom:72px}:root[data-host=netlify] .toast-root,:root[data-host=netlify] .consent{bottom:calc(64px + var(--safe-bottom))}@keyframes rise{0%{opacity:0;transform:translateY(10px)}}@keyframes fade{0%{opacity:0}}@keyframes pop{0%{opacity:0;transform:scale(.3)}}@keyframes pulse{50%{box-shadow:0 0 0 6px #e8b64c40}}:root[data-reduced-motion=true] *,:root[data-reduced-motion=true] :before,:root[data-reduced-motion=true] :after{transition-duration:1ms!important;animation-duration:1ms!important}@media (max-width:420px){.ctrl{min-width:62px}.stat-value{font-size:1.1rem}.dpad{grid-template-columns:repeat(3,40px)}}@media (max-height:640px){.tagline{display:none}.brand .logo svg{width:180px}.ctrl span:not(.icon){display:none}.ctrl{min-height:48px}}@media (orientation:landscape) and (min-width:760px){.play{grid-template-rows:auto auto auto 1fr auto;grid-template-columns:minmax(0,1fr) 300px;display:grid}.play .topbar{grid-column:1/-1}.play .stage-slot{grid-area:2/1/6}.play .hud{flex-direction:column;grid-area:2/2;align-items:stretch}.play .coach{grid-area:3/2}.play .hint-text{grid-area:4/2}.play .controls{grid-area:5/2}.home{grid-template-rows:auto 1fr auto auto;grid-template-columns:1fr minmax(300px,400px);column-gap:24px;display:grid}.home .brand,.home .progress-line,.home .home-menu{grid-column:2}.home .home-hero{grid-area:1/1/5}.home .brand{grid-row:1;align-self:end}}@media (orientation:landscape) and (max-height:540px){.play{grid-template:"top stage ctrl""hud stage ctrl""hint stage ctrl""coach stage ctrl"minmax(0,1fr)/minmax(190px,250px) minmax(0,1fr) auto;column-gap:10px;padding:6px 8px;display:grid}[dir=rtl] .play{grid-template-columns:auto minmax(0,1fr) minmax(190px,250px);grid-template-areas:"ctrl stage top""ctrl stage hud""ctrl stage hint""ctrl stage coach"}.play .topbar{grid-area:top;gap:6px;padding:0}.play .topbar .icon-btn{width:40px;height:40px}.play .topbar h2{font-size:1rem}.play .topbar h2,.play .topbar .subtitle{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.play .topbar .subtitle{font-size:.74rem}.play .hud{flex-direction:row;grid-area:hud;align-items:stretch;gap:6px;padding:6px 0 0}.play .goal-wrap{justify-content:center;padding:4px}.play .goal{width:52px!important;height:52px!important}.play .stats{grid-template-columns:1fr 1fr;gap:4px}.play .stat{justify-content:center;padding:2px 4px}.play .stat-label{font-size:.62rem}.play .stat-value{font-size:1rem}.play .hint-text{grid-area:hint;min-height:1.3em;padding:2px 0 0;font-size:.82rem}.play .coach{flex-direction:column;grid-area:coach;align-self:start;align-items:stretch;gap:4px;max-height:100%;margin:4px 0 0;padding:6px 8px;overflow-y:auto}.play .coach p{font-size:.82rem;line-height:1.3}.play .coach .btn.small{align-self:flex-end;min-height:32px;padding:2px 10px}.play .stage-slot{grid-area:stage;min-height:0}.play .controls{grid-area:ctrl;grid-template-columns:repeat(3,44px);align-content:end;gap:6px;padding:0;display:grid}.play .ctrl{min-width:0;min-height:44px}.play .ctrl span:not(.icon){display:none}.play .dpad{grid-column:1/-1;grid-template-rows:repeat(2,40px);grid-template-columns:repeat(3,44px);gap:6px;margin:0}:root[data-host=netlify] .play .controls{padding-bottom:calc(68px + var(--safe-bottom))}.home{grid-template:"brand hero""progress hero""menu hero"".hero"minmax(0,1fr)/minmax(0,1fr) minmax(280px,380px);align-items:stretch;gap:6px 20px;padding:10px 16px;display:grid}[dir=rtl] .home{grid-template-columns:minmax(280px,380px) minmax(0,1fr);grid-template-areas:"hero brand""hero progress""hero menu""hero."}.home .brand{grid-area:brand;align-self:auto}.home .brand .logo svg{width:170px}.home .progress-line{text-align:center;grid-area:progress}.home .home-menu{grid-area:menu;justify-self:center;gap:8px}.home .home-row{gap:8px}.home .home-menu .btn{min-height:44px;padding:6px 14px}.home .home-menu .btn.ghost{min-height:36px}.home .home-hero{grid-area:hero;min-height:0}:root[data-host=netlify] .home{padding-bottom:10px}:root[data-host=netlify] .home .home-hero{margin-bottom:calc(58px + var(--safe-bottom))}.levels .topbar{padding-top:6px}.tabs{padding:4px 12px}.tab{min-height:44px;padding:4px 12px}.modal{padding:calc(8px + env(safe-area-inset-top)) calc(8px + env(safe-area-inset-right)) calc(8px + var(--safe-bottom)) calc(8px + env(safe-area-inset-left))}:root[data-host=netlify] .modal{padding-bottom:calc(68px + var(--safe-bottom))}.panel{gap:6px;width:min(620px,100%);max-height:100%;padding:12px 18px}.panel h2{margin:0;font-size:1.25rem}.panel .btn{min-height:42px}.panel .btn.big{min-height:46px;font-size:1.02rem}[data-testid=pause-modal]{grid-template-columns:1fr 1fr;display:grid}[data-testid=pause-modal]>h2,[data-testid=pause-modal]>.btn.primary{grid-column:1/-1}.big-star svg{width:30px;height:30px}.win-stars+h2{margin-top:-4px}.win-stats>div{padding:2px 10px}.win-stats strong{font-size:1.25rem}.win-actions{flex-flow:wrap;margin-top:2px}.win-actions .btn{flex:1 1 0}.win-actions .btn.primary{flex:1.6 1 0}.consent{gap:6px;padding:10px 14px}}
