*{box-sizing:border-box}html,body{margin:0;height:100%;background:#0d1b2a;color:#eef3ec;font-family:system-ui,sans-serif;overflow:hidden}#app{position:relative;height:100%;overflow:hidden}#stage{display:block;width:100%;height:100%;touch-action:none}.screen{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:1.2rem;overflow-y:auto;background:radial-gradient(ellipse at center,#0d1b2a9e,#060c14e6);z-index:5}.screen[hidden],#hud[hidden],#banner[hidden],#controls[hidden]{display:none}.panel{display:grid;gap:.8rem;justify-items:center;max-width:38rem;width:100%;margin:auto}.eyebrow{margin:0;font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;color:#ffc2bb}h1{margin:0;font-size:clamp(2.6rem,9vw,5rem);line-height:1;letter-spacing:-.02em}h2{margin:0;font-size:clamp(1.8rem,6vw,3rem);line-height:1.1}.lede{margin:0 auto;max-width:36rem;color:#cdd7d0;line-height:1.45}.lede.small{font-size:.88rem}.primary{padding:.8rem 1.8rem;border-radius:999px;border:1px solid #ff7468;background:#c0342a;color:#fff;font-weight:800;font-size:1rem;cursor:pointer;min-height:48px}.primary:hover{filter:brightness(1.12)}.ghost{padding:.8rem 1.5rem;border-radius:999px;border:1px solid #9db0a6;background:transparent;color:#eef3ec;font-weight:600;font-size:1rem;cursor:pointer;min-height:48px}.hint{margin:0;font-size:.78rem;color:#aebcb3}button:focus-visible{outline:3px solid #ffd23a;outline-offset:3px}#levels{display:flex;gap:.6rem;flex-wrap:wrap;justify-content:center}#levels button{display:grid;gap:.15rem;min-width:7.6rem;padding:.6rem .9rem;border-radius:.9rem;border:1px solid #3a5068;background:#0d1b2acc;color:#eef3ec;cursor:pointer;font:inherit;min-height:48px}#levels button[aria-checked=true]{border-color:#ff8f84;background:#e0463a38;box-shadow:0 0 0 1px #ff8f84 inset}.lv-name{font-weight:800}.lv-meta{font-size:.72rem;color:#c3cfc8}.row{display:flex;gap:.7rem;flex-wrap:wrap;justify-content:center}.stars{margin:0;font-size:2rem;letter-spacing:.25em;color:#ffc65a}.score-line{margin:0;font-weight:700}#hud{position:absolute;inset:0;display:flex;flex-direction:column;padding:max(.7rem,env(safe-area-inset-top)) .8rem max(.7rem,env(safe-area-inset-bottom));pointer-events:none;z-index:4;gap:.4rem}.hud-top{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}.hud-top span,#mute-btn{background:#080e16c7;border:1px solid #34506a;border-radius:999px;padding:.25rem .7rem;font-size:.82rem;font-weight:700;color:#f1f5f1}.hud-top span.hot{color:#ffd23a;border-color:#ffd23a}#mute-btn{pointer-events:auto;cursor:pointer;margin-left:auto;font-weight:600}.storm-track{height:8px;background:#ffffff2e;border-radius:4px;overflow:hidden}#storm-bar{height:100%;width:100%;background:#ff6b5e}#storm-bar.low{background:#ffd23a}#banner{align-self:center;margin:.2rem 0 0;padding:.4rem 1rem;border-radius:999px;background:#961e14f0;border:1px solid #ffd23a;color:#fff;font-weight:800;font-size:.9rem;text-align:center;max-width:94vw}#banner.wind{background:#14466ef0;border-color:#9fd4ff}#banner.good{background:#145a32f0;border-color:#8dffb0}#banner.bolt{animation:pulse .35s infinite alternate}.prompt{margin:auto 0 0;align-self:center;padding:.3rem .9rem;border-radius:999px;background:#080e16c7;text-align:center;font-size:1.05rem;font-weight:800}.prompt.hot{color:#ffd23a;animation:pulse .4s infinite alternate}@keyframes pulse{0%{transform:scale(1)}to{transform:scale(1.07)}}@media(prefers-reduced-motion:reduce){.prompt.hot,#banner.bolt{animation:none}}#controls{display:flex;justify-content:space-between;gap:.5rem;pointer-events:auto}#controls button{flex:1;padding:1rem;font-size:1.15rem;font-weight:800;border-radius:14px;border:1px solid #ffffff66;background:#080e16d9;color:#fff;cursor:pointer;min-height:68px;touch-action:none;user-select:none;-webkit-user-select:none}#btn-call{flex:2;background:#c0342a;border-color:#ff8f84}#keys-hint{text-align:center;align-self:center;padding:.15rem .6rem;border-radius:999px;background:#080e16b3;color:#d7e0da}@media(pointer:coarse){#keys-hint{display:none}}
