:root{color:#f7fbf4;touch-action:none;-webkit-font-smoothing:antialiased;background:#07100f;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif}*{box-sizing:border-box}html,body,#app{background:#07100f;width:100%;height:100%;margin:0;overflow:hidden}button{font:inherit;color:inherit}.game-shell{background:radial-gradient(circle at 50% 12%,#1e4a3d 0,#07100f 62%);width:100vw;height:100dvh;position:relative;overflow:hidden}canvas{touch-action:none;width:100%;height:100%;position:absolute;top:0;bottom:0;left:0;right:0}.top-hud{left:max(14px,env(safe-area-inset-left));right:max(14px,env(safe-area-inset-right));top:max(12px,env(safe-area-inset-top));z-index:5;pointer-events:none;justify-content:space-between;align-items:flex-start;gap:12px;display:flex;position:absolute}.brand,.meters,.side-hud,.controls button,.card{-webkit-backdrop-filter:blur(18px)saturate(1.25);background:linear-gradient(135deg,#081212c7,#192d278a);border:1px solid #ffffff24;box-shadow:0 18px 50px #00000047}.brand{border-radius:18px;max-width:min(50vw,310px);padding:10px 12px}.brand b{letter-spacing:-.04em;font-size:20px;display:block}.brand span{color:#b7cbc2;margin-top:2px;font-size:11px;line-height:1.2;display:block}.meters{border-radius:18px;align-items:center;gap:7px;padding:8px;display:flex}.meters span{text-align:center;color:#b7cbc2;text-transform:uppercase;letter-spacing:.06em;flex-direction:column;min-width:48px;font-size:10px;display:flex}.meters b,#dist{color:#fff;letter-spacing:-.02em;font-size:15px}.side-hud{left:max(14px,env(safe-area-inset-left));z-index:5;pointer-events:none;border-radius:20px;width:112px;padding:10px 12px;position:absolute;top:112px}#combo{letter-spacing:-.06em;color:#ffd84f;text-shadow:0 0 22px #ffd84f59;font-size:28px;font-weight:950}.side-hud small{color:#c7d8d1;font-size:11px;line-height:1.25;display:block}.controls{left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));z-index:8;grid-template-columns:1fr 1.12fr 1fr;gap:10px;display:grid;position:absolute}.controls button{letter-spacing:-.03em;touch-action:none;border:0;border-radius:22px;height:64px;font-weight:950}.signal{color:#10120a;background:linear-gradient(135deg,#ffb82bd1,#ff77309e)!important}.brake{color:#fff;font-size:20px;background:linear-gradient(135deg,#ff3b4d,#a61126)!important;box-shadow:0 16px 38px #ff3b4d52!important}.panel{z-index:20;background:radial-gradient(circle at 50% 20%,#54d8ff2b,#00000094 48%,#000000bd);place-items:center;padding:20px;display:grid;position:absolute;top:0;bottom:0;left:0;right:0}.panel[hidden]{display:none}.card{color:#f8fff9;border-radius:32px;width:min(560px,100%);max-height:min(760px,100dvh - 36px);padding:24px;overflow:auto}.eyebrow{color:#54d8ff;text-transform:uppercase;letter-spacing:.16em;margin:0 0 8px;font-size:11px;font-weight:950}.card h1,.card h2{color:#fff;letter-spacing:-.065em;margin:0;line-height:.95}.card h1{font-size:clamp(48px,14vw,88px)}.card h2{font-size:clamp(32px,9vw,58px)}.lead{color:#d8e7df;margin:16px 0;font-size:16px;line-height:1.48}.fine{color:#9eb3aa;font-size:12px;line-height:1.35}.statgrid{grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0;display:grid}.statgrid span{color:#adc2b9;text-transform:uppercase;letter-spacing:.07em;background:#ffffff0d;border:1px solid #ffffff1f;border-radius:18px;padding:12px;font-size:11px}.statgrid b{color:#fff;text-transform:none;letter-spacing:-.04em;margin-top:4px;font-size:20px;display:block}.primary,.card button{background:#ffffff1a;border:0;border-radius:18px;width:100%;margin-top:10px;padding:15px 16px;font-weight:900}.primary{color:#061211;box-shadow:0 16px 38px #54d8ff33;background:linear-gradient(135deg,#54d8ff,#55ee9e)!important}.how{gap:9px;margin:18px 0;display:grid}.how div,.stage-list button{text-align:left;background:#ffffff0f;border:1px solid #ffffff1f;border-radius:20px;width:100%;padding:13px 14px;display:block}.how b,.stage-list b{color:#fff;display:block}.how span,.stage-list span,.stage-list small{color:#b9ccc4;margin-top:3px;font-size:13px;line-height:1.32;display:block}.stage-list{gap:10px;margin:16px 0;display:grid}.rank{color:#081211;letter-spacing:-.1em;background:linear-gradient(135deg,#ffd84f,#ff5aa5);border-radius:32px;place-items:center;width:104px;height:104px;margin:18px auto;font-size:64px;font-weight:1000;display:grid;box-shadow:0 20px 60px #ffd84f33}.actions{grid-template-columns:1fr 1fr 1fr;gap:8px;display:grid}.actions button{padding:13px 10px}.toast{z-index:12;color:#fff;text-align:center;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#060e0ed1;border:1px solid #ffffff24;border-radius:999px;max-width:min(86vw,420px);padding:12px 16px;font-weight:850;position:absolute;top:19%;left:50%;transform:translate(-50%);box-shadow:0 15px 45px #00000059}@media (max-width:520px){.top-hud{align-items:stretch}.brand{max-width:42vw;padding:9px 10px}.brand b{font-size:18px}.meters{gap:4px;padding:7px}.meters span{min-width:40px;font-size:9px}.meters b,#dist{font-size:13px}.side-hud{width:96px;top:100px}.controls{gap:8px}.controls button{border-radius:19px;height:58px;font-size:13px}.brake{font-size:18px}.card{border-radius:28px;padding:20px}.actions{grid-template-columns:1fr}.statgrid{gap:7px}.lead{font-size:15px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}
