:root{--bg: #05070f;--panel: rgba(12, 18, 38, .92);--line: #24325c;--text: #e8eeff;--muted: #8f9bc4;--plus: #3d9dff;--minus: #ff8a1f;--accent: #5cffc8;--danger: #ff4d6d;--radius: 14px;--sat: env(safe-area-inset-top, 0px);--sab: env(safe-area-inset-bottom, 0px);--sal: env(safe-area-inset-left, 0px);--sar: env(safe-area-inset-right, 0px);color-scheme:dark;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0;background:var(--bg);color:var(--text);overflow:hidden}body{overscroll-behavior:none;-webkit-tap-highlight-color:transparent}button,input{font:inherit}.app{position:fixed;inset:0}.app.hc{--panel: #000;--line: #fff;--text: #fff;--muted: #e0e0e0;--plus: #33bbff;--minus: #ffb000}.surface{position:absolute;inset:0;touch-action:none;user-select:none;-webkit-user-select:none}.surface canvas{display:block}.overlay{position:absolute;inset:0;padding:calc(16px + var(--sat)) calc(16px + var(--sar)) calc(16px + var(--sab)) calc(16px + var(--sal));display:flex;flex-direction:column;gap:14px;overflow-y:auto;z-index:10}.overlay.center{align-items:center;justify-content:center;text-align:center}.overlay.dim{background:#03050cb8;backdrop-filter:blur(3px)}.overlay.no-block{pointer-events:none}.overlay.no-block button{pointer-events:auto}.menu{background:radial-gradient(ellipse at center,#05070f40,#05070fd9)}.logo{font-size:clamp(2.6rem,9vw,5.5rem);font-weight:900;letter-spacing:.06em;margin:0;line-height:1;text-shadow:0 0 24px rgba(61,157,255,.55)}.logo span{color:var(--minus);margin-left:.25em;text-shadow:0 0 24px rgba(255,138,31,.55)}.tagline{margin:0;color:var(--muted);font-size:1.05rem}h2{margin:0;font-size:1.4rem}.muted{color:var(--muted)}.small{font-size:.85rem}.label{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}.stack{display:flex;flex-direction:column;gap:10px;width:min(420px,100%)}.row{display:flex;gap:10px;align-items:flex-end}.row.wrap{flex-wrap:wrap;justify-content:center}.center-row{justify-content:center;flex-wrap:wrap}.grow{flex:1;text-align:left}.btn{appearance:none;border:1px solid var(--line);background:#141e3ed9;color:var(--text);padding:10px 16px;border-radius:10px;cursor:pointer;min-height:44px;transition:transform .08s,border-color .15s,background .15s}.btn:hover{border-color:var(--plus)}.btn:active{transform:scale(.97)}.btn:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.btn:disabled{opacity:.5;cursor:default}.btn.primary{background:linear-gradient(135deg,#2a7fe0,#3d9dff);border-color:#6bb6ff;color:#fff;font-weight:700}.btn.big{font-size:1.15rem;padding:14px 20px}.btn.ghost{background:transparent}.btn.danger{border-color:var(--danger);color:#ffd0d8;background:#500a1999}.btn.icon{min-width:44px;padding:8px}.btn.small{min-height:32px;padding:4px 10px;font-size:.85rem}.hc .btn{border-width:2px;background:#000}.hc .btn.primary{background:#0050a0}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:18px;width:min(560px,100%);max-height:100%;overflow-y:auto;text-align:left;display:flex;flex-direction:column;gap:12px;box-shadow:0 20px 60px #00000080}.panel-head{display:flex;justify-content:space-between;align-items:center}.tabs{display:flex;gap:6px}.tab{flex:1;padding:8px;border-radius:8px;border:1px solid var(--line);background:transparent;color:var(--muted);cursor:pointer;min-height:40px}.tab.on{color:var(--text);border-color:var(--plus);background:#3d9dff26}.board{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:4px}.board li{display:grid;grid-template-columns:2.5em 1fr auto;gap:8px;padding:8px 10px;border-radius:8px;background:#ffffff08}.board li.me{outline:2px solid var(--accent)}.board .rank{color:var(--muted);font-weight:700}.board .score{font-variant-numeric:tabular-nums;font-weight:700}input[type=text],input:not([type]){width:100%;padding:10px;border-radius:8px;border:1px solid var(--line);background:#0a1024;color:var(--text);min-height:44px}.best-row{display:flex;gap:24px}.best-row strong{font-size:1.3rem}.confirm{border:1px solid var(--danger);border-radius:10px;padding:10px}.note{color:var(--accent);margin:0}.howto{margin:0;padding-left:1.2em;display:flex;flex-direction:column;gap:8px;line-height:1.45}.slider{display:flex;flex-direction:column;gap:4px}.slider input{width:100%;accent-color:var(--plus)}.toggles{display:flex;flex-direction:column;gap:8px}.toggle{display:flex;gap:10px;align-items:flex-start;cursor:pointer;min-height:32px}.toggle input{width:22px;height:22px;accent-color:var(--plus);flex:none}.toggle small{display:block;color:var(--muted)}.glyph{display:inline-flex;align-items:center;justify-content:center;font-weight:900;color:#05070f;vertical-align:middle;flex:none}.glyph.plus{background:var(--plus);border-radius:50%}.glyph.minus{background:var(--minus);transform:rotate(45deg);border-radius:4px}.glyph.minus>span{transform:rotate(-45deg)}.hc .glyph{outline:2px solid #fff}.hud{position:absolute;inset:0;pointer-events:none;padding:calc(10px + var(--sat)) calc(12px + var(--sar)) calc(10px + var(--sab)) calc(12px + var(--sal));z-index:5;display:flex;flex-direction:column}.hud button{pointer-events:auto}.hud-top{display:flex;gap:14px;align-items:flex-start}.hud-top>div{background:#05081499;border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:8px 12px}.hc .hud-top>div{background:#000;border-color:#fff}.hud-score{min-width:180px}.hud .value{font-size:1.9rem;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.1;text-shadow:0 2px 8px #000}.hud-combo .value{color:var(--accent)}.record{display:flex;flex-direction:column;gap:3px;font-size:.75rem;color:var(--muted);margin-top:4px}.record .bar{height:5px;background:#ffffff1a;border-radius:3px;overflow:hidden}.record .fill{height:100%;background:linear-gradient(90deg,var(--plus),var(--accent))}.hud-pol,.hud-next{display:flex;flex-direction:column;align-items:center;gap:4px}.next{display:flex;align-items:center;gap:8px}.pause-btn{margin-left:auto;font-size:.9rem}.tutorial{margin:auto auto 12vh;background:#050814d9;border:2px solid var(--accent);border-radius:12px;padding:12px 18px;font-size:1.15rem;font-weight:700;text-align:center;max-width:90%}.tutorial .step{display:block;font-size:.72rem;color:var(--accent);letter-spacing:.12em;text-transform:uppercase}.countdown{font-size:clamp(5rem,22vw,11rem);font-weight:900;text-shadow:0 0 40px rgba(61,157,255,.8);animation:pop .9s ease-out}.countdown.small-cd{font-size:5rem}.rm .countdown{animation:none}@keyframes pop{0%{transform:scale(1.6);opacity:0}30%{opacity:1}to{transform:scale(1)}}.hint{margin:0}.results{align-items:center;text-align:center}.big-score{font-size:clamp(3rem,12vw,5rem);font-weight:900;font-variant-numeric:tabular-nums;line-height:1}.badge{background:var(--accent);color:#002a1c;font-weight:900;padding:4px 12px;border-radius:999px;letter-spacing:.1em}.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px;width:100%}.stats>div{background:#ffffff0a;border-radius:10px;padding:8px}.stats strong{font-size:1.2rem}.verify{min-height:1.6em}.verify .ok{color:var(--accent)}.verify .warn{color:#ffcf66}.status{position:absolute;bottom:calc(10px + var(--sab));left:0;right:0;padding:0 16px}.renderer{opacity:.6}@media(orientation:portrait),(max-width:700px){.hud-top{display:grid;grid-template-columns:1fr auto auto;grid-template-areas:"score combo pause" "pol next next";gap:8px}.hud-score{grid-area:score;min-width:0}.hud-combo{grid-area:combo}.hud-pol{grid-area:pol;flex-direction:row;justify-content:center}.hud-next{grid-area:next;flex-direction:row;justify-content:center}.pause-btn{grid-area:pause}.hud .value{font-size:1.5rem}.tutorial{margin-bottom:calc(8vh + var(--sab));font-size:1rem}}@media(max-height:460px)and (orientation:landscape){.hud-top>div{padding:4px 8px}.hud .value{font-size:1.3rem}.record{display:none}.tutorial{margin-bottom:8px;font-size:.95rem}}@media(prefers-reduced-motion:reduce){.countdown{animation:none}}.glyph.unknown{background:#8a93ad;border-radius:6px;color:#05070f;animation:blink .8s steps(2) infinite}.rm .glyph.unknown{animation:none}@keyframes blink{50%{opacity:.55}}.powerups{display:flex;gap:6px;align-items:center;justify-content:center;margin-top:4px;min-height:16px}.shield-badge{color:var(--accent);font-size:1.1rem;line-height:1;text-shadow:0 0 8px var(--accent)}.od-pips{display:inline-flex;gap:4px;padding:2px}.od-pips i{width:8px;height:8px;transform:rotate(45deg);border:1px solid #ffd54a;display:inline-block}.od-pips i.on{background:#ffd54a;box-shadow:0 0 6px #ffd54a}.od-active{color:#ffd54a;font-weight:800;font-size:.72rem;letter-spacing:.05em;animation:blink .5s steps(2) infinite}.rm .od-active{animation:none}
