@font-face{font-family:Sans;src:url(/fonts/sans-400.woff2)format("woff2");font-weight:400;font-display:block}@font-face{font-family:Sans;src:url(/fonts/sans-600.woff2)format("woff2");font-weight:600;font-display:block}@font-face{font-family:Sans;src:url(/fonts/sans-700.woff2)format("woff2");font-weight:700;font-display:block}@font-face{font-family:Sans;src:url(/fonts/sans-900.woff2)format("woff2");font-weight:900;font-display:block}:root{--ink:#1b1b2f;--ink-soft:#4a4a63;--paper:#fff;--sky:#9fd8ff;--sky-light:#e8f6ff;--yellow:#f5c518;--squish:#3b5bff;--squish-soft:#dfe5ff;--squeak:#ff3b3b;--squeak-soft:#ffe1e1;--brick:#a14a37;--line:3px solid var(--ink);--lift:0 6px 0 var(--ink);--radius:22px;--font:"Sans", system-ui, -apple-system, "Segoe UI", sans-serif}*{box-sizing:border-box}html,body{background:var(--sky);height:100%;color:var(--ink);font-family:var(--font);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;margin:0;overflow:hidden}#scene{width:100%;height:100%;position:fixed;inset:0}.panel{background:var(--paper);border:var(--line);border-radius:var(--radius);box-shadow:var(--lift);gap:12px;padding:20px;display:grid}.pill{border:var(--line);color:#fff;border-radius:999px;justify-self:start;padding:5px 12px 6px;font-size:17px;font-weight:900;line-height:1}.btn{font:inherit;border:var(--line);min-height:54px;box-shadow:0 4px 0 var(--ink);color:var(--ink);cursor:pointer;border-radius:16px;padding:0 18px;font-size:18px;font-weight:900;transition:transform 80ms ease-out,box-shadow 80ms ease-out}.btn:active{box-shadow:0 0 0 var(--ink);transform:translateY(4px)}.btn:focus-visible{outline:3px solid var(--squish);outline-offset:3px}.btn.primary{background:var(--yellow);min-height:60px;font-size:21px}.btn.secondary{background:var(--paper);font-size:16px;font-weight:700}.overlay{padding:max(16px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom));place-items:center;display:grid;position:fixed;inset:0;overflow-y:auto}.overlay[hidden]{display:none}#menu{background:linear-gradient(var(--sky) 0%, #9fd8ffd9 55%, #9fd8ff33 100%)}.stack{gap:10px;width:min(100%,500px);display:grid}.logo{text-align:center;white-space:nowrap;letter-spacing:-.02em;color:#fff;-webkit-text-stroke:6px var(--ink);paint-order:stroke fill;text-shadow:0 6px 0 var(--ink);margin:0;font-size:clamp(36px,11.5vw,60px);font-weight:900;line-height:1}.logo span{color:var(--yellow)}.tagline{text-align:center;color:var(--ink);margin:0 0 8px;font-size:17px;font-weight:700}.rules{grid-template-columns:1fr 1fr;gap:10px;display:grid}.rule{border:var(--line);border-radius:16px;align-content:start;gap:8px;padding:12px;display:grid}.rule.squish{background:var(--squish-soft)}.rule.squeak{background:var(--squeak-soft)}.rule.squish .pill{background:var(--squish)}.rule.squeak .pill{background:var(--squeak)}.rule-car{width:100%;height:64px;overflow:visible}.rule-car .beam{fill:var(--brick);stroke:var(--ink);stroke-width:2px}.rule p{color:var(--ink-soft);margin:0;font-size:14px;line-height:1.35}.rule strong{color:var(--ink)}.row{grid-template-columns:1fr 1fr;gap:10px;display:grid}.note{text-align:center;color:var(--ink-soft);margin:2px 0 0;font-size:13px}.note.error{color:#c4122f;font-weight:700}.narrow{text-align:center;width:min(100%,380px)}.pill.solo{background:var(--ink);justify-self:center}h2{letter-spacing:-.01em;margin:0;font-size:30px;font-weight:900}.body{color:var(--ink-soft);margin:0;font-size:16px;line-height:1.4}.progress{border:var(--line);background:var(--sky-light);border-radius:999px;height:18px;overflow:hidden}.progress .fill{background:var(--squish);width:0%;height:100%}.readout{font-variant-numeric:tabular-nums;color:var(--ink-soft);margin:0;font-weight:700}.splat{color:var(--squeak);-webkit-text-stroke:5px var(--ink);paint-order:stroke fill;text-shadow:0 5px 0 var(--ink);font-size:48px}.big-score{color:var(--ink-soft);margin:4px 0 0;font-size:16px;font-weight:700}.big-score span{color:var(--ink);font-size:64px;font-weight:900;line-height:1;display:block}#hud{pointer-events:none;padding:max(14px, env(safe-area-inset-top)) 14px 14px;justify-content:space-between;align-items:flex-start;display:flex;position:fixed;inset:0}#hud[hidden]{display:none}.hud-left,.hud-right{gap:8px;display:grid}.hud-right{justify-items:end}.chip{background:var(--paper);border:var(--line);box-shadow:0 3px 0 var(--ink);border-radius:999px;justify-self:start}.meter{align-items:center;gap:8px;padding:6px 10px 6px 8px;display:flex}.mic{width:22px;height:22px;fill:var(--squeak);stroke:var(--ink);stroke-width:2px;stroke-linecap:round}.mic path{fill:none}.bar{border:2px solid var(--ink);background:var(--sky-light);border-radius:999px;width:min(38vw,180px);height:14px;overflow:hidden}.bar .fill{transform-origin:0;background:#b8bccb;width:100%;height:100%;transition:transform 80ms linear;transform:scaleX(0)}.bar .fill.bass{background:var(--squish)}.bar .fill.treble{background:var(--squeak)}.mode{padding:5px 12px 6px;font-size:15px;font-weight:900}.mode.bass{background:var(--squish);color:#fff}.mode.treble{background:var(--squeak);color:#fff}.score{font-variant-numeric:tabular-nums;justify-self:end;padding:2px 16px 4px;font-size:32px;font-weight:900}.lives{gap:4px;display:flex}.lives svg{width:34px;height:22px;overflow:visible}.lives svg.lost{opacity:.25;filter:grayscale()}.lives svg.just-lost{animation:.45s ease-out pop}@keyframes pop{0%{opacity:1;filter:none;transform:scale(1.6)rotate(-12deg)}to{transform:scale(1)}}@media (height<=640px){.rule-car{height:44px}.tagline{margin-bottom:2px}}@media (prefers-reduced-motion:reduce){.lives svg.just-lost{animation:none}.btn{transition:none}}.difficulty{border:var(--line);background:var(--paper);border-radius:16px;grid-template-columns:repeat(3,1fr);display:grid;overflow:hidden}.difficulty label{cursor:pointer;position:relative}.difficulty label+label{border-left:var(--line)}.difficulty input{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}.difficulty span{min-height:44px;color:var(--ink-soft);place-items:center;font-size:16px;font-weight:700;display:grid}.difficulty input:checked+span{background:var(--ink);color:#fff;font-weight:900}.difficulty input:focus-visible+span{outline:3px solid var(--squish);outline-offset:-6px;border-radius:10px}.hud-top{align-items:center;gap:8px;display:flex}.pause-btn{pointer-events:auto;border:var(--line);background:var(--paper);width:46px;height:46px;box-shadow:0 3px 0 var(--ink);cursor:pointer;border-radius:50%;place-items:center;padding:0;display:grid}.pause-btn svg{width:22px;height:22px;fill:var(--ink)}.pause-btn:active{box-shadow:none;transform:translateY(3px)}.pause-btn:focus-visible{outline:3px solid var(--squish);outline-offset:3px}.overlay.dim{background:#1b1b2f59}.listen{justify-content:center;align-items:center;gap:10px;min-height:24px;display:flex}.level{background:var(--sky-light);border:2px solid var(--ink);border-radius:999px;width:64px;height:8px;overflow:hidden}.level .fill{transform-origin:0;background:var(--ink);width:100%;height:100%;transition:transform 60ms linear;transform:scaleX(0)}.readout.heard{color:var(--ink)}