@font-face{font-family:Anton;src:url(/fonts/Anton-Regular.ttf) format("truetype");font-display:swap}@font-face{font-family:Barlow;src:url(/fonts/BarlowCondensed-Medium.ttf) format("truetype");font-weight:500;font-display:swap}@font-face{font-family:Barlow;src:url(/fonts/BarlowCondensed-Bold.ttf) format("truetype");font-weight:700;font-display:swap}:root{--navy: #07111c;--ink: #f6f1e6;--gold: #f0c14a;--gold-deep: #c8922a;--blue: #3c7dff;--red: #e23d3d;--green: #3dff8a;color:var(--ink);font-family:Barlow,Arial Narrow,sans-serif;background:#04070d}*{box-sizing:border-box}html,body{margin:0;height:100%}body{min-height:100dvh;display:grid;place-items:center}button,kbd{font:inherit}#app{width:min(100vw,460px);height:100dvh;max-height:960px;position:relative;overflow:hidden;background:var(--navy);user-select:none;touch-action:none}@media(min-width:520px){#app{height:min(100dvh - 32px,920px);border-radius:28px;border:1px solid rgba(240,193,74,.22)}}.screen{position:absolute;inset:0}.hidden{display:none!important}#title{background:linear-gradient(to bottom,#04080e00 42%,#07111c8c,#07111c 70%),url(/bg-title.jpg) center top / cover no-repeat;display:flex;align-items:flex-end}.sheet{width:100%;padding:56px 22px calc(22px + env(safe-area-inset-bottom));background:linear-gradient(to bottom,#07111c00 0,#07111c 42px)}.kicker,.eyebrow{margin:0;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);font-weight:700;font-size:13px}.sheet h2,.results h2,.overlay h2{margin:4px 0 12px;font-family:Anton,Impact,sans-serif;font-size:34px;font-weight:400;letter-spacing:.02em;line-height:.95}.matchup{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center;margin-bottom:8px}.matchup b{display:block;font-size:18px;letter-spacing:.04em;text-transform:uppercase}.matchup span,.song,.hint,.sub{color:#f6f1e6b8;font-size:15px}.matchup div:last-child{text-align:right}.vs{font-family:Anton,Impact,sans-serif;color:var(--gold);font-size:22px}.song{margin:0 0 14px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);font-weight:700}.song-picker{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:-6px 0 16px}.song-picker button{border:1.5px solid rgba(240,193,74,.35);border-radius:12px;background:#f0c14a0f;color:#f6f1e6d9;font-weight:700;letter-spacing:.04em;padding:12px 10px;cursor:pointer}.song-picker button.active{border-color:var(--gold);background:#f0c14a2e;color:var(--gold)}.song-picker.levels{grid-template-columns:repeat(3,1fr)}.tools{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:-4px 0 14px}.tools button{border:1px solid rgba(246,241,230,.2);border-radius:999px;background:transparent;color:#f6f1e6cc;font-weight:700;font-size:14px;letter-spacing:.06em;padding:9px 10px;cursor:pointer}.tools button[aria-pressed=true]{border-color:var(--gold);color:var(--gold)}#sync-value{color:var(--gold)}#sync{background:linear-gradient(to bottom,#050a1299,#07111c 55%),url(/bg-battle.jpg) center 20% / cover no-repeat;display:flex;align-items:flex-end}.sync-sheet{background:none}.sync-pad{display:block;width:168px;height:168px;margin:18px auto 14px;border-radius:50%;border:3px solid var(--gold);background:radial-gradient(circle,#f0c14a52,#f0c14a0a 70%);cursor:pointer;touch-action:none}.sync-pad.hit{animation:sync-hit .18s ease-out}@keyframes sync-hit{0%{transform:scale(.94);background-color:#f0c14a80}to{transform:scale(1)}}.sync-status{text-align:center;font-weight:700;font-size:18px;letter-spacing:.06em;margin:0 0 10px;min-height:24px}.sync-dots{display:flex;justify-content:center;gap:6px;margin-bottom:16px;min-height:8px}.sync-dots i{width:8px;height:8px;border-radius:50%;background:#f6f1e633}.sync-dots i.on{background:var(--gold)}#sync-start{margin-bottom:12px}#sync .tools{margin:0}button.gold,#play,#resume,#again{width:100%;border:0;border-radius:999px;padding:15px 18px;background:var(--gold);color:#1a1203;font-family:Anton,Impact,sans-serif;font-size:22px;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}#play:disabled{opacity:.7}.hint{text-align:center;line-height:1.35;margin:12px 0 0}#stage{background:#050a12}.battle-bg{position:absolute;inset:0;background:linear-gradient(to bottom,#050a1240,#050a120d 22%,#050a1259 48%,#050a12e0 70%,#050a12),url(/bg-battle.jpg) center 18% / cover no-repeat}#highway{position:absolute;inset:0;width:100%;height:100%}.hud-top,.hud-bottom,.touch,.callout,.judge,.overlay{position:absolute;z-index:2}.hud-top{top:0;left:0;right:0;display:grid;grid-template-columns:48px 1fr auto;gap:10px;align-items:center;padding:calc(12px + env(safe-area-inset-top)) 14px 0}#pause{width:42px;height:42px;border-radius:50%;border:1px solid rgba(246,241,230,.25);background:#050a128c;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:4px}#pause i{width:3px;height:14px;border-radius:2px;background:var(--ink);display:block}.turn{justify-self:center;padding:6px 12px;border-radius:999px;background:#050a129e;letter-spacing:.16em;text-transform:uppercase;font-weight:700;font-size:13px}.turn.player{color:var(--gold)}.turn.rival{color:#ff8d8d}.scoreblock{text-align:right;min-width:72px}#score{display:block;font-family:Anton,Impact,sans-serif;font-size:28px;line-height:.9}#combo{display:block;min-height:16px;color:var(--gold);letter-spacing:.08em;font-weight:700}#combo.hot{color:#ff7a3c}.callout{left:0;right:0;top:22%;text-align:center;font-family:Anton,Impact,sans-serif;font-size:52px;letter-spacing:.04em;text-transform:uppercase;opacity:0;transform:scale(.92);text-shadow:0 8px 24px rgba(0,0,0,.45)}.callout.show{animation:punch .7s ease}.callout.player{color:var(--gold)}.callout.rival{color:#fff}@keyframes punch{0%{opacity:0;transform:scale(.86)}18%{opacity:1;transform:scale(1)}70%{opacity:1}to{opacity:0;transform:scale(1.04)}}.judge{left:0;right:0;top:60%;text-align:center;font-family:Anton,Impact,sans-serif;font-size:34px;letter-spacing:.12em;text-transform:uppercase;opacity:0;pointer-events:none}.judge.pop{animation:judge .52s ease}.judge.perfect{color:var(--green)}.judge.good{color:#8eb6ff}.judge.miss{color:#ff5d5d}@keyframes judge{0%{opacity:0;transform:translateY(8px)}20%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-10px)}}.touch{left:0;right:0;bottom:0;height:38%;display:grid;grid-template-columns:repeat(4,1fr);z-index:3}.touch button{border:0;background:transparent;color:transparent;padding:0}.hud-bottom{left:14px;right:14px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:4;pointer-events:none}.lane-names{display:grid;grid-template-columns:repeat(4,1fr);text-align:center;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin-bottom:8px;color:#f6f1e6db}.lane-names kbd{display:none;font-weight:500;opacity:.7}@media(hover:hover)and (pointer:fine){.lane-names kbd{display:inline}}.crowd{height:4px;border-radius:99px;background:#ffffff1f;overflow:hidden;margin-bottom:8px}#crowd-fill{display:block;height:100%;width:58%;background:var(--gold)}.momentum{position:relative;height:22px;border-radius:99px;background:#8d2430;overflow:hidden}#you-fill{height:100%;width:50%;background:#2457c9}.momentum span{position:absolute;top:0;height:22px;line-height:22px;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}#you-label{left:10px}#them-label{right:10px}.overlay{inset:0;z-index:6;background:#04080ec7;display:flex;flex-direction:column;justify-content:flex-end;padding:28px 22px calc(28px + env(safe-area-inset-bottom))}#results{background:linear-gradient(to bottom,#050a1259,#07111c 42%),url(/bg-battle.jpg) center 20% / cover no-repeat;display:flex;align-items:flex-end;padding:22px 18px calc(18px + env(safe-area-inset-bottom))}.card{width:100%;background:#070e18e6;border:1px solid rgba(240,193,74,.28);border-radius:22px;padding:18px 16px 16px}.card h2{font-size:40px;margin-bottom:4px}.outcome{margin:0 0 8px;color:var(--gold);letter-spacing:.14em;text-transform:uppercase;font-weight:700}.outcome.loss{color:#ff8d8d}.overall{display:flex;align-items:baseline;gap:8px;margin:0 0 4px}.overall b{font-family:Anton,Impact,sans-serif;font-size:64px;line-height:.85;font-weight:400}.overall span{color:#f6f1e6a6;font-size:18px}.flames{display:flex;gap:4px;margin:0 0 12px}.stat{display:grid;grid-template-columns:1fr auto;gap:2px 10px;margin-bottom:8px;font-size:15px;letter-spacing:.06em;text-transform:uppercase}.stat i{grid-column:1 / -1;display:block;height:4px;border-radius:99px;background:#ffffff1a;position:relative}.stat i:before{content:"";position:absolute;inset:0 auto 0 0;width:var(--p);background:var(--gold);border-radius:inherit}.rewards{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0}.rewards div{background:#ffffff0a;border-radius:12px;padding:8px;text-align:center}.rewards b{display:block;font-family:Anton,Impact,sans-serif;font-size:22px;font-weight:400;color:var(--gold)}.rewards span{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#f6f1e69e}.standings{display:flex;justify-content:space-between;margin:0 0 12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}