:root{--teal: #11616a;--orange: #e5743a;--magenta: #b8406a;--gold: #ffd25e;--plum: #2a1730;--head: Impact, "Arial Narrow Bold", "Helvetica Neue", system-ui, sans-serif;--body: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--pad-h: max(96px, 18vh)}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--plum);color:#fff;font-family:var(--body);overflow:hidden;overscroll-behavior:none}body{-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}#stage{position:fixed;inset:0;width:100%;height:100%;touch-action:none}#river{position:absolute;inset:0;width:100%;height:100%;display:block}[hidden]{display:none!important}h1,h2{font-family:var(--head);font-weight:400;text-transform:uppercase;letter-spacing:.04em;margin:0;line-height:.95}h1{font-size:clamp(2.4rem,8vw,5rem)}h2{font-size:clamp(1.8rem,6vw,3.4rem)}.gold{color:var(--gold)}kbd{font-family:var(--body);font-size:.68em;font-weight:700;padding:.1em .45em;border-radius:6px;background:#ffffff24;border:1px solid rgba(255,255,255,.28);margin-left:.35em;vertical-align:.1em;white-space:nowrap}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.panel{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:max(16px,env(safe-area-inset-top)) 16px max(16px,env(safe-area-inset-bottom));text-align:center;overflow-y:auto;touch-action:pan-y;background:#2a17308c;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);animation:slide-in .22s ease-out both}@keyframes slide-in{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}.panel>*{max-width:680px}.eyebrow{font-family:var(--head);letter-spacing:.14em;font-size:clamp(.78rem,2.2vw,1rem);color:var(--gold);text-transform:uppercase}.howto{margin:0;font-size:clamp(.95rem,2.6vw,1.15rem);line-height:1.45;color:#ffffffdb}.buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}.btn{font-family:var(--head);text-transform:uppercase;letter-spacing:.06em;font-size:clamp(1.1rem,3vw,1.5rem);min-height:56px;min-width:200px;padding:10px 22px;border-radius:14px;border:2px solid rgba(255,210,94,.55);background:#11616abf;color:#fff;transition:transform .12s ease,background .12s ease}.btn:hover{transform:translateY(-2px);background:#11616af2}.btn:active{transform:translateY(1px) scale(.98)}.btn-primary{background:var(--gold);color:var(--plum);border-color:var(--gold)}.btn-primary:hover{background:#ffe08a}.btn-primary kbd{background:#2a173024;border-color:#2a17304d}.btn-quiet{background:#2a173099}.best{font-family:var(--head);letter-spacing:.1em;font-size:clamp(.9rem,2.6vw,1.15rem);color:var(--gold)}.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 16px;font-size:.88rem;color:#fffc}.chips kbd{margin-left:0;margin-right:.3em}.chips-duo{font-size:.82rem}.chips-touch{display:none;font-family:var(--head);letter-spacing:.1em;font-size:.85rem;color:#fffc;text-transform:uppercase}@media(pointer:coarse){.chips,.chips-duo,.btn kbd{display:none}.chips-touch{display:block}}.chips .lio{color:#f28cb0}.chips .mae{color:#ffa877}.offset-line{display:flex;align-items:center;gap:10px;font-family:var(--head);letter-spacing:.1em;font-size:.9rem;color:#ffffffbf}.tiny{width:44px;height:44px;border-radius:10px;border:1px solid rgba(255,255,255,.3);background:#ffffff14;font-size:1.3rem;line-height:1}.all-games{color:var(--gold);text-decoration:none;font-family:var(--head);letter-spacing:.1em;font-size:.95rem;padding:10px 14px;border-radius:10px}.all-games:hover{background:#ffd25e1f}.panel-entry{justify-content:flex-start;padding-top:max(24px,6vh);gap:16px}@media(min-height:760px){.panel-entry{justify-content:center}}.panel-entry h1{max-width:16ch}.panel-result h2{max-width:14ch}.result-score{font-family:var(--head);font-size:clamp(2.6rem,10vw,5rem);color:var(--gold);line-height:1;display:flex;align-items:baseline;gap:14px;font-variant-numeric:tabular-nums}.new-best{font-size:.32em;letter-spacing:.14em;background:var(--magenta);color:#fff;padding:.3em .6em;border-radius:8px;animation:pop .4s ease-out both}@keyframes pop{0%{transform:scale(.6);opacity:0}to{transform:none;opacity:1}}.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px 18px;width:100%;max-width:560px}.stats div{display:flex;flex-direction:column;gap:2px;padding:8px 6px;border-radius:10px;background:#2a17308c}.stats b{font-family:var(--head);font-weight:400;font-size:1.5rem;letter-spacing:.04em;font-variant-numeric:tabular-nums}.stats span{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:#ffffffb3}.stats .p1 b{color:#f28cb0}.stats .p2 b{color:#ffa877}.calib-count{font-family:var(--head);font-size:clamp(3rem,14vw,7rem);color:var(--gold);line-height:1;min-height:1em;font-variant-numeric:tabular-nums}.hud{position:absolute;left:0;right:0;top:0;z-index:1;display:grid;grid-template-columns:1fr auto 1fr;align-items:start;gap:8px;padding:max(10px,env(safe-area-inset-top)) 12px 0;pointer-events:none;font-family:var(--head);letter-spacing:.06em;text-transform:uppercase}.hud:before{content:"";position:absolute;inset:0 0 -28px;z-index:-1;background:linear-gradient(to bottom,#2a173099,#2a173000);pointer-events:none}.hud-left{display:flex;flex-direction:column}.score{font-size:36px;line-height:1;color:var(--gold);font-variant-numeric:tabular-nums;text-shadow:0 2px 0 rgba(42,23,48,.8)}.combo{font-size:15px;color:#ffffffd9;margin-top:4px;text-shadow:0 1px 0 rgba(42,23,48,.8);transition:color .15s}.combo.hot{color:var(--gold)}.hud-mid{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:120px;width:min(34vw,320px);padding-top:8px}.progress{width:100%;height:8px;border-radius:4px;background:#2a173099;border:1px solid rgba(255,210,94,.35);overflow:hidden}.progress i{display:block;height:100%;width:0;background:var(--gold);transition:width .12s linear}.bpm{font-size:14px;color:#fffc;font-variant-numeric:tabular-nums}.hud-right{display:flex;justify-content:flex-end;align-items:center;gap:8px;pointer-events:auto}.hulls{display:flex;gap:4px;margin-right:4px}.hulls svg{width:16px;height:26px}.hulls svg path{fill:var(--gold);stroke:var(--gold);stroke-width:1.5}.hulls svg.lost path{fill:#2a173080;stroke:#ffd25e66}.icon-btn{width:56px;height:56px;border-radius:14px;border:1px solid rgba(255,210,94,.35);background:#2a1730b3;display:grid;place-items:center;padding:0}.icon-btn svg{fill:var(--gold);stroke:var(--gold);stroke-width:2;stroke-linecap:round;fill-rule:evenodd}.icon-btn svg .wave,.icon-btn svg .cross{fill:none}#muteBtn .cross,#muteBtn[aria-pressed=true] .wave{display:none}#muteBtn[aria-pressed=true] .cross{display:block}#muteBtn[aria-pressed=true]{opacity:.75}@media(max-width:640px){.hud{grid-template-columns:1fr auto;row-gap:4px}.hud-mid{grid-column:1 / -1;grid-row:2;flex-direction:row;justify-self:center;width:min(60vw,260px);padding-top:0;gap:10px}.progress{flex:1;height:6px}.score{font-size:30px}.bpm{font-size:12px;white-space:nowrap}.combo{font-size:13px;white-space:nowrap}.hulls svg{width:13px;height:22px}}.pads{position:absolute;left:0;right:0;bottom:0;height:var(--pad-h);display:grid;grid-template-columns:1fr 1fr;pointer-events:none}.pad{display:flex;align-items:flex-end;justify-content:center;padding-bottom:max(14px,env(safe-area-inset-bottom));font-family:var(--head);letter-spacing:.12em;font-size:15px;color:#ffffff8c;background:linear-gradient(to top,#2a17308c,#2a173000);transition:background 80ms}.pad-left{color:#f28cb0cc}.pad-right{color:#ffa877cc}.pad.hit{background:linear-gradient(to top,#ffd25e73,#ffd25e00);color:#fff}@media(hover:hover)and (pointer:fine){.pads{display:none}}@media(max-height:500px){:root{--pad-h: 64px}.pad{font-size:12px;padding-bottom:8px}}.countdown{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--head);font-size:clamp(5rem,24vw,12rem);color:var(--gold);text-shadow:0 4px 0 var(--plum);pointer-events:none}@media(prefers-reduced-motion:reduce){.panel,.new-best{animation:none}.btn{transition:none}}