@import"https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@400;500&display=swap";:root{font-family:IBM Plex Mono,monospace;color:#e1e9e8;background:#29363e;font-synthesis:none}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}html,body,#app,#app *,.touch-controls,.touch-controls *{touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}canvas{display:block;width:100%;height:100%}button{font:inherit}.hud{position:fixed;inset:0;pointer-events:none;background:linear-gradient(180deg,#0d161b55 0%,transparent 24%,transparent 70%,#0d161b80 100%)}.topbar{display:flex;justify-content:space-between;align-items:flex-start;padding:30px 38px}.brand{font:800 32px/.87 Barlow Condensed,sans-serif;letter-spacing:.035em}.brand em{font-style:normal;color:#92b5ba}.eyebrow{margin-top:10px;font-size:9px;letter-spacing:.25em;color:#a5b7ba}.route{text-align:right;font-size:10px;color:#b0bfc1;letter-spacing:.13em}.route strong{display:block;font:600 18px Barlow Condensed,sans-serif;margin-bottom:5px;letter-spacing:.1em;color:#e2e9e8}.route-line{width:172px;height:2px;margin-top:12px;background:#8b9fa044}.route-line span{display:block;height:100%;width:0%;background:#a4c3c6}.telemetry{position:absolute;bottom:32px;left:38px;display:flex;align-items:flex-end;gap:30px}.speed{display:flex;align-items:baseline;gap:9px}.speed strong{font:600 78px/.8 Barlow Condensed,sans-serif;font-variant-numeric:tabular-nums;letter-spacing:-.02em}.speed span{color:#9bafb2;font-size:10px}.gear{border-left:1px solid #afc2c244;padding-left:22px;font:600 31px/.9 Barlow Condensed,sans-serif}.gear small{display:block;margin-top:8px;font:9px IBM Plex Mono,monospace;letter-spacing:.16em;color:#9bafb2}.controls{position:absolute;right:38px;bottom:33px;text-align:right;font-size:9px;color:#a9b9bb;line-height:2;letter-spacing:.04em}.controls b{font-weight:500;color:#e0e9e8}.status{position:absolute;bottom:116px;left:38px;color:#a5c4c5;font-size:10px;letter-spacing:.2em;height:14px}.performance{position:absolute;right:38px;top:111px;font-size:9px;color:#91a8ab}.overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;background:#0d171b5e;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.overlay[hidden]{display:none}.panel{width:min(460px,100%);padding:36px 38px;border:1px solid #a6bfc23b;background:linear-gradient(135deg,#18282eed,#142027ed);box-shadow:0 20px 90px #06101466}.kicker{font-size:9px;color:#a1bec2;letter-spacing:.24em}h1{margin:15px 0 12px;font:700 58px/.9 Barlow Condensed,sans-serif;text-transform:uppercase;letter-spacing:.025em}.panel p{font-size:11px;line-height:1.8;color:#b2c2c4}.input-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px;margin:28px 0;padding-top:23px;border-top:1px solid #9bb3b32d;font-size:10px;color:#b8c8ca}.input-grid b{display:block;color:#e0e9e8;margin-bottom:6px;font-weight:500}.primary{width:100%;padding:14px 18px;border:1px solid #acc8c9;background:#abc5c8;color:#14262d;cursor:pointer;text-transform:uppercase;font-size:11px;font-weight:500;letter-spacing:.16em}.primary:hover{background:#c4d7d8}.panel-foot{margin-top:14px;text-align:center;font-size:9px;color:#7e9b9f}@media(max-width:600px){.topbar{padding:22px}.brand{font-size:27px}.route strong{font-size:15px}.route{font-size:8px}.route-line{width:120px}.telemetry{left:22px;bottom:24px;gap:18px}.speed strong{font-size:61px}.controls{right:22px;bottom:22px;font-size:8px}.status{left:22px;bottom:97px}.performance{right:22px;top:96px}}.race-position{position:absolute;top:27px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:9px}.race-position strong{font:600 48px/.9 Barlow Condensed,sans-serif}.race-position span{font-size:8px;color:#9bafb2;line-height:1.8;letter-spacing:.12em}.impact-flash{position:absolute;inset:0;opacity:0;background:radial-gradient(ellipse at center,transparent 35%,#b5785f)}@media(max-width:600px){.race-position{top:87px;left:22px;transform:none}.race-position strong{font-size:34px}}.race-position{left:calc(50% - 100px)}.race-clock{position:absolute;top:23px;left:calc(50% + 32px);display:flex;align-items:baseline;gap:7px}.race-clock>span{position:absolute;top:0;left:1px;white-space:nowrap;color:#a5b7ba;font-size:8px;letter-spacing:.15em}.race-clock strong{margin-top:13px;font:600 50px/.9 Barlow Condensed,sans-serif;font-variant-numeric:tabular-nums}.race-clock small{color:#9bafb2;font-size:8px}.low-time strong{color:#e4a69b}.route-meta{margin-top:8px;font-size:8px;color:#91a8ab}.performance{top:124px}.countdown{position:absolute;top:38%;width:100%;text-align:center;font:700 130px/1 Barlow Condensed,sans-serif;text-shadow:0 5px 40px #101e24}.checkpoint-notice{position:absolute;top:133px;width:100%;text-align:center;color:#bddbdb;font:600 25px Barlow Condensed,sans-serif;letter-spacing:.09em}.results{display:flex;gap:36px;margin:26px 0;padding-top:22px;border-top:1px solid #9bb3b32d}.results[hidden],.input-grid[hidden]{display:none}.results>div{color:#92aeb2;font-size:9px;letter-spacing:.12em}.results strong{display:block;margin-top:8px;color:#e1e9e8;font:600 30px Barlow Condensed,sans-serif;letter-spacing:.02em}@media(max-width:800px){.race-position{top:103px;left:38px;transform:none}.race-clock{top:91px;left:122px}.race-position strong,.race-clock strong{font-size:38px}.checkpoint-notice{top:163px}}@media(max-width:600px){.race-position{left:22px}.race-clock{left:106px}.countdown{font-size:100px}}:root{color:#e5f5f5;background:#08101b}.hud{background:linear-gradient(180deg,#040d1b85 0%,transparent 25%,transparent 72%,#040a1580 100%)}.brand em,.status,.route-line span{color:#65e6e8}.brand em{text-shadow:0 0 19px #39cfd74d}.route-line span{background:#65e6e8;box-shadow:0 0 8px #65e6e86e}.eyebrow,.route-meta,.performance{color:#86afb9}.race-clock strong{color:#f6cb83;text-shadow:0 0 20px #db9a3530}.low-time strong{color:#fa8fae}.checkpoint-notice,.countdown{color:#91f6ef;text-shadow:0 0 25px #36cad76b,0 5px 30px #071019}.panel{border-color:#66d9e34d;background:linear-gradient(135deg,#0b1c2cf5,#0a1223f2);box-shadow:0 20px 90px #02050ccc,inset 0 1px #a2edfa18}.kicker{color:#78d8df}.primary{background:#8fe8e3;border-color:#b8fff7;color:#0a2330}.primary:hover{background:#b4fff3;box-shadow:0 0 20px #6fe6df30}.impact-flash{background:radial-gradient(ellipse at center,transparent 35%,#d75c82)}.audio-controls{position:fixed;right:38px;bottom:104px;z-index:10;display:flex;align-items:center;gap:13px;font-size:8px;letter-spacing:.08em;pointer-events:auto}.mute-button{padding:9px 11px;border:1px solid #78c9d24d;color:#b9ebec;background:#071321cc;cursor:pointer;font-size:9px;letter-spacing:.08em}.mute-button:hover,.mute-button:focus-visible{border-color:#83f1e7;color:#e9fffc;outline:none}.mute-button[aria-pressed=true]{color:#e8bd9d;border-color:#b58c6b73}.audio-controls a{color:#8db4c0;text-decoration:none}.audio-controls a:hover{color:#b9f9f2;text-decoration:underline}@media(max-width:600px){.audio-controls{right:22px;bottom:99px;gap:8px}.audio-controls a{max-width:32px;line-height:1.5}}.finish-banner{position:absolute;top:30%;left:0;width:100%;text-align:center;color:#a9ffff;font-size:clamp(28px,5vw,72px);font-weight:900;letter-spacing:.12em;text-shadow:0 0 24px #12aabf}.finish-banner span{display:block;color:#ffc16e;font-size:.45em;margin-top:14px;letter-spacing:.2em}.overlay:has(.results:not([hidden])){background:linear-gradient(90deg,rgba(3,8,18,.85),rgba(3,8,18,.3) 55%,transparent);-webkit-backdrop-filter:none;backdrop-filter:none}.touch-controls{position:fixed;inset:0;z-index:4;pointer-events:none;user-select:none;-webkit-user-select:none}.touch-controls[hidden]{display:none}.touch-zone{position:absolute;bottom:0;width:50%;height:42%;pointer-events:auto;touch-action:none;border-top:1px solid #65e6e815;background:linear-gradient(0deg,#13a1bd0a,transparent 70%)}.touch-left{left:0;border-right:1px solid #65e6e818}.touch-right{right:0}.touch-zone:after{position:absolute;bottom:32%;color:#8cffff45;font:600 32px Barlow Condensed,sans-serif}.touch-left:after{content:"‹";left:16%}.touch-right:after{content:"›";right:16%}.touch-hint{position:absolute;bottom:16px;width:100%;text-align:center;color:#98e4e8;font-size:9px;letter-spacing:.08em;text-shadow:0 2px 6px #000}.touch-mode .controls{display:none}.touch-mode .telemetry{bottom:38px}.touch-mode .audio-controls{bottom:auto;top:150px;right:20px}@media(max-height:520px){.topbar{padding:16px 22px}.brand{font-size:25px}.route{font-size:8px}.eyebrow{margin-top:6px;font-size:7px}.panel{padding:20px 28px;max-width:460px}h1{font-size:40px;margin:10px 0}.input-grid{margin:14px 0;gap:10px;padding-top:12px}.panel p{font-size:10px}.panel-foot{margin-top:8px}.touch-mode .audio-controls{top:92px}.performance{top:73px}.touch-mode .telemetry{left:22px}.speed strong{font-size:55px}.race-position{top:18px;left:calc(50% - 80px)}.race-clock{top:8px;left:calc(50% + 15px)}.checkpoint-notice{top:95px}.results{margin:16px 0;padding-top:12px}}.overlay:has(.results:not([hidden])){justify-content:flex-start;padding:32px}.overlay:has(.results:not([hidden])) .panel{width:min(390px,100%);background:linear-gradient(135deg,#0b1c2ce6,#0a1223ca)}.finish-grade{margin-top:24px;color:#ffc876;font:700 31px Barlow Condensed,sans-serif;letter-spacing:.07em;text-shadow:0 0 20px #e49e4155}.finish-grade[hidden]{display:none}.touch-zone.pressed{background:linear-gradient(0deg,#23d3e51b,transparent 80%)}.touch-controls[data-drifting=true] .touch-zone{border-top-color:#ef5aba55}@media(max-width:600px){.overlay:has(.results:not([hidden])){padding:18px;align-items:center}.overlay:has(.results:not([hidden])) .panel{max-width:340px}}.touch-zone{height:100%;border-top:0}.touch-left{border-right:0}.touch-zone:after{bottom:70px}.touch-zone>span{display:none}