:root{--ink:#d7dde6;--dim:#6d7787;--line:#96aac829;--panel:#0a0c10b8;--accent:#6fd3ff;--warn:#ffb545;--hot:#ff5f5f;--mono:ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace}*{box-sizing:border-box}html,body{height:100%;color:var(--ink);font-family:var(--mono);-webkit-font-smoothing:antialiased;background:#000;margin:0;padding:0;overflow:hidden}#viewport{touch-action:none;width:100vw;height:100dvh;display:block}.hidden{display:none!important}#boot{z-index:50;background:#000;place-items:center;transition:opacity .5s;display:grid;position:fixed;inset:0}#boot.done{opacity:0;pointer-events:none}.boot-inner{text-align:center}.boot-title{letter-spacing:.62em;color:var(--ink);margin-bottom:14px;font-size:13px}.boot-sub{letter-spacing:.18em;color:var(--dim);font-size:10px}#hud{pointer-events:none;z-index:20;letter-spacing:.08em;font-size:10px;position:fixed;inset:0}.hud-cluster{text-shadow:0 1px 3px #000000d9;width:190px;padding:13px 14px 12px;position:absolute;bottom:18px;left:18px}.speed-block{align-items:baseline;gap:6px;margin-bottom:10px;display:flex}.speed{font-variant-numeric:tabular-nums;letter-spacing:-.02em;font-size:40px;font-weight:500;line-height:.9}.speed-unit{color:var(--dim);letter-spacing:.14em;font-size:9px}.gear-row{gap:6px;margin-bottom:12px;display:flex}.gear-box,.range-box{text-align:center;border:1px solid var(--line);letter-spacing:.1em;background:#0a0c1080;border-radius:2px;flex:1;padding:5px 0;font-size:11px}.gear-box{color:var(--ink)}.range-box{color:var(--accent);border-color:#6fd3ff57}.range-box.low{color:var(--warn);background:#ffb54514;border-color:#ffb54573}.meter{align-items:center;gap:7px;margin-top:5px;display:flex}.meter-label{width:24px;color:var(--dim);letter-spacing:.1em;font-size:8px}.meter-track{background:#ffffff12;border-radius:2px;flex:1;height:4px;overflow:hidden}.meter-fill{border-radius:2px;width:0%;height:100%;transition:width 50ms linear}.meter-fill.rpm{background:linear-gradient(90deg, #4a90c4, #6fd3ff 72%, var(--hot) 100%)}.meter-fill.thr{background:#7fd18a}.meter-fill.brk{background:var(--hot)}.meter-val{text-align:right;width:30px;color:var(--dim);font-variant-numeric:tabular-nums;font-size:8px}.hud-wheels{text-shadow:0 1px 3px #000000d9;width:176px;padding:11px 12px;position:absolute;bottom:18px;left:224px}.wheels-label{color:var(--dim);letter-spacing:.14em;margin-bottom:9px;font-size:8px}.wheel-grid{flex-direction:column;gap:6px;display:flex}.wheel-cell{align-items:center;gap:7px;display:flex}.wheel-tag{width:16px;color:var(--dim);font-size:8px}.wheel-track{background:#ffffff12;border-radius:2px;flex:1;height:5px;overflow:hidden}.wheel-fill{background:var(--accent);border-radius:2px;width:0%;height:100%}.wheel-cell.airborne .wheel-fill{background:var(--hot)}.wheel-cell.airborne .wheel-tag{color:var(--hot)}.wheel-cell.slipping .wheel-fill{background:var(--warn)}.wheel-load{text-align:right;width:34px;color:var(--dim);font-variant-numeric:tabular-nums;font-size:8px}.hotkeys{pointer-events:auto;gap:6px;display:flex;position:absolute;top:18px;left:18px}.keycap{border:1px solid var(--line);background:linear-gradient(180deg, #ffffff1c, #ffffff05 46%), var(--panel);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);width:26px;height:26px;color:var(--dim);font:inherit;cursor:pointer;border-bottom-color:#96aac847;border-radius:5px;place-items:center;padding:0;transition:transform 90ms,box-shadow 90ms,color .16s,border-color .16s;display:grid;position:relative;box-shadow:inset 0 1px #ffffff17,0 2px #0000008c,0 3px 7px #0006}.keycap-glyph{letter-spacing:0;font-size:11px;line-height:1;transform:translateY(.5px)}.keycap:hover{color:var(--ink);border-color:#96aac857}.keycap:active,.keycap.on{transform:translateY(2px);box-shadow:inset 0 1px #ffffff0d,0 0 #0000008c,0 1px 3px #00000059}.keycap.on{color:var(--accent);background:linear-gradient(180deg, #6fd3ff29, #6fd3ff0a 46%), var(--panel);border-color:#6fd3ff66}.keycap:focus-visible{outline:1px solid var(--accent);outline-offset:2px}.keycap-name{background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);color:var(--dim);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;opacity:0;pointer-events:none;border-radius:2px;padding:3px 6px;font-size:8px;transition:opacity .14s;position:absolute;top:calc(100% + 6px);left:50%;transform:translate(-50%)}.keycap:hover .keycap-name,.keycap:focus-visible .keycap-name{opacity:1}.keycap.hint:not(.on){animation:1.7s ease-out 3 keycap-hint}@keyframes keycap-hint{0%,to{box-shadow:inset 0 1px #ffffff17,0 2px #0000008c,0 3px 7px #0006}22%{box-shadow:inset 0 1px #ffffff17,0 2px #0000008c,0 0 0 4px #6fd3ff29}}.help{background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);border-radius:3px;padding:11px 13px;transition:transform .3s cubic-bezier(.22,.61,.36,1),opacity .2s,visibility .3s;position:absolute;top:54px;left:18px}.help.tucked{opacity:0;visibility:hidden;transform:translate(calc(-100% - 22px))}.help-title{color:var(--dim);letter-spacing:.14em;margin-bottom:8px;font-size:8px}.help-hint{opacity:.55;letter-spacing:.06em}.help-title-sub{margin-top:9px}.help table{border-collapse:collapse;font-size:9px}.help td{vertical-align:middle;padding:1.5px 0}.help td:first-child{white-space:nowrap;padding-right:11px}.help td:last-child{color:var(--dim);letter-spacing:.05em}kbd{border:1px solid var(--line);min-width:15px;font:inherit;text-align:center;color:var(--ink);background:#ffffff12;border-radius:2px;margin-right:2px;padding:1px 4px;font-size:9px;display:inline-block}.flash{background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);letter-spacing:.16em;opacity:0;border-radius:2px;padding:7px 15px;font-size:10px;transition:opacity .28s;position:absolute;top:46px;left:50%;transform:translate(-50%)}.flash.show{opacity:1}.credit-note{font:inherit;letter-spacing:.16em;color:var(--dim);opacity:.6;cursor:pointer;pointer-events:auto;background:0 0;border:0;border-radius:2px;margin:0;padding:3px 4px;font-size:8px;transition:opacity .15s,color .15s;position:absolute;bottom:14px;right:18px}.credit-note:hover,.credit-note:focus-visible{opacity:1;color:var(--warn)}.credit-note-by{letter-spacing:.1em;opacity:.75}.badge{z-index:40;background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);pointer-events:none;opacity:0;visibility:hidden;border-radius:12px;align-items:center;gap:12px;padding:11px 15px 11px 12px;transition:transform .42s cubic-bezier(.16,.84,.34,1),opacity .3s,visibility .42s;display:flex;position:fixed;bottom:40px;right:18px;transform:translate(calc(100% + 26px));box-shadow:0 6px 22px #00000080}.badge.show{opacity:1;visibility:visible;transform:translate(0)}.badge-art{filter:drop-shadow(0 2px 4px #0000008c);width:58px;height:58px;display:block}.badge.show .badge-art{animation:.55s cubic-bezier(.16,.84,.34,1) .12s both badge-strike}@keyframes badge-strike{0%{opacity:0;transform:scale(.55)rotate(-24deg)}60%{opacity:1;transform:scale(1.08)rotate(4deg)}to{opacity:1;transform:scale(1)rotate(0)}}.badge-text{flex-direction:column;gap:3px;display:flex}.badge-kicker{letter-spacing:.26em;color:var(--dim);font-size:7px}.badge-name{letter-spacing:.2em;color:var(--warn);text-shadow:0 0 14px #ffb54559;font-size:15px}.badge-note{letter-spacing:.1em;color:var(--dim);font-size:8px}@media (prefers-reduced-motion:reduce){.badge{transition:opacity .2s,visibility .2s;transform:none}.badge.show .badge-art{animation:none}}.credits{z-index:60;background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);pointer-events:auto;opacity:0;visibility:hidden;border-radius:4px;flex-direction:column;padding:12px 16px 13px;transition:transform .13s cubic-bezier(.22,.61,.36,1),opacity .13s,visibility .13s;display:flex;position:fixed;top:0;left:0;transform:scale(.94);box-shadow:0 8px 26px #0000008c}.credits.show{opacity:1;visibility:visible;transform:scale(1)}.credits{width:268px;max-height:calc(100vh - 16px);overflow-y:auto}.credits-head{justify-content:space-between;align-items:baseline;gap:10px;display:flex}.credits-title{letter-spacing:.22em;color:var(--warn);font-size:14px}.credits-version{letter-spacing:.1em;color:var(--dim);opacity:.7;font-size:8px}.credits-by{letter-spacing:.12em;color:var(--fg);margin-top:4px;font-size:9px}.credits-blurb{letter-spacing:.04em;color:var(--dim);margin:10px 0 0;font-size:9px;line-height:1.7}.credits-links{align-items:baseline;gap:9px;margin-top:12px;display:flex}.credits-sep{color:var(--dim);opacity:.6;font-size:9px}.credits-link{letter-spacing:.08em;color:var(--fg);font-size:9px;text-decoration:none;transition:color .12s}.credits-link:hover,.credits-link:focus-visible{color:var(--warn)}.credits-fine{border-top:1px solid var(--line);letter-spacing:.04em;color:var(--dim);opacity:.75;margin-top:12px;padding-top:10px;font-size:8px;line-height:1.6}.credits-attribution{white-space:pre-line;margin-top:5px}@media (prefers-reduced-motion:reduce){.credits{transition:opacity .1s,visibility .1s;transform:none}}.lil-gui{--background-color:transparent;--title-background-color:transparent;--widget-color:#ffffff17;--font-family:var(--mono);--font-size:10px;--title-height:24px;z-index:30!important}.lil-gui.gui-panel{background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);border-radius:3px;max-height:calc(100% - 72px);transition:transform .3s cubic-bezier(.22,.61,.36,1),opacity .2s,visibility .3s;top:54px;right:18px;overflow:hidden}.lil-gui.gui-panel>.lil-children{max-height:calc(100vh - 72px - var(--title-height));overflow-y:auto}.lil-gui.gui-panel .lil-gui>.lil-title{border-top:1px solid var(--line)}.lil-gui.gui-panel.tucked{opacity:0;visibility:hidden;transform:translate(calc(100% + 22px))}@media (prefers-reduced-motion:reduce){.help,.lil-gui.gui-panel{transition:opacity .15s,visibility .15s}.help.tucked,.lil-gui.gui-panel.tucked{transform:none}.keycap.hint:not(.on){animation:none}}.track-strip{flex-direction:column;gap:4px;max-height:232px;padding:4px 6px 6px;display:flex;overflow-y:auto}.track-row{color:inherit;font:inherit;text-align:left;cursor:pointer;background:#ffffff0d;border:1px solid #0000;border-radius:5px;align-items:center;gap:8px;padding:4px;display:flex}.track-row:hover{background:#ffffff1c}.track-row.on{border-color:var(--orange)}.track-hero{background-color:#00000059;background-position:50%;background-size:cover;border-radius:3px;flex:none;width:56px;height:32px}.track-name{font-family:var(--mono);text-overflow:ellipsis;white-space:nowrap;font-size:10px;line-height:1.3;overflow:hidden}.touch{z-index:35;pointer-events:none;position:fixed;inset:0}.touch-mode,.touch-mode body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;overscroll-behavior:none}.touch-caps{left:calc(14px + env(safe-area-inset-left));top:calc(11px + env(safe-area-inset-top));pointer-events:auto;gap:7px;display:flex;position:absolute}.touch-cap{border:1px solid var(--line);background:linear-gradient(180deg, #ffffff1c, #ffffff05 46%), var(--panel);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);min-width:46px;height:34px;color:var(--dim);font:inherit;letter-spacing:.16em;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;border-bottom-color:#96aac847;border-radius:6px;padding:0 10px;font-size:8px;transition:transform 90ms,box-shadow 90ms,color .16s,border-color .16s;box-shadow:inset 0 1px #ffffff17,0 2px #0000008c,0 3px 7px #0006}.touch-cap:active,.touch-cap.on{transform:translateY(2px);box-shadow:inset 0 1px #ffffff0d,0 0 #0000008c,0 1px 3px #00000059}.touch-cap.on{color:var(--accent);background:linear-gradient(180deg, #6fd3ff29, #6fd3ff0a 46%), var(--panel);border-color:#6fd3ff66}.touch-steer{pointer-events:auto;touch-action:none;-webkit-tap-highlight-color:transparent;width:46%;height:62%;position:absolute;bottom:0;left:0}.touch-hint{letter-spacing:.24em;color:var(--dim);text-shadow:0 1px 3px #000000d9;opacity:.5;font-size:8px;transition:opacity .3s;position:absolute;bottom:24%;left:26%;transform:translate(-50%)}.touch-steer.live .touch-hint,.touch-steer.used .touch-hint{opacity:0}.touch-rail{border:1px solid var(--line);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;background:#0a0c1080;border-radius:23px;width:178px;height:46px;transition:opacity .14s;position:absolute;transform:translate(-50%,-50%)}.touch-rail.live{opacity:1}.touch-knob{background:linear-gradient(#6fd3ff6b,#6fd3ff24);border:1px solid #6fd3ff80;border-radius:50%;width:38px;height:38px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 2px 8px #00000073}.touch-pedals{right:calc(15px + env(safe-area-inset-right));bottom:calc(15px + env(safe-area-inset-bottom));pointer-events:auto;align-items:flex-end;gap:10px;display:flex;position:absolute}.touch-stack{flex-direction:column;gap:8px;display:flex}.touch-pedal{border:1px solid var(--line);background:linear-gradient(180deg, #ffffff17, #ffffff03 46%), var(--panel);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);color:var(--dim);font:inherit;letter-spacing:.18em;cursor:pointer;touch-action:none;-webkit-tap-highlight-color:transparent;border-radius:16px;place-items:center;padding:0;font-size:8px;transition:transform 80ms,box-shadow 80ms,background .1s,color .12s;display:grid;box-shadow:inset 0 1px #ffffff12,0 2px #00000080,0 4px 10px #0006}.touch-pedal.thr{color:#7fd18a;letter-spacing:.22em;border-color:#7fd18a4d;border-radius:22px;width:86px;height:118px;font-size:11px}.touch-pedal.brake{width:80px;height:72px;color:var(--hot);border-color:#ff5f5f42;font-size:9px}.touch-pedal.hand{width:80px;height:38px;color:var(--warn);border-color:#ffb5453d;border-radius:12px}.touch-pedal.down{transform:translateY(2px);box-shadow:inset 0 1px #ffffff0d,0 0 #00000080,0 1px 4px #00000059}.touch-pedal.thr.down{background:linear-gradient(180deg, #7fd18a57, #7fd18a1a), var(--panel);color:#ddf7e1;border-color:#7fd18a8c}.touch-pedal.brake.down{background:linear-gradient(180deg, #ff5f5f52, #ff5f5f17), var(--panel);color:#ffdede;border-color:#ff5f5f80}.touch-pedal.hand.down{background:linear-gradient(180deg, #ffb54552, #ffb54517), var(--panel);color:#ffe9c4;border-color:#ffb54580}.touch-mode .hud-cluster{bottom:auto;left:50%;right:auto;top:calc(7px + env(safe-area-inset-top));align-items:baseline;gap:13px;width:auto;padding:3px 8px;display:flex;transform:translate(-50%)}.touch-mode .speed{font-size:30px}.touch-mode .speed-block,.touch-mode .gear-row{margin:0}.touch-mode .meter,.touch-mode .range-box,.touch-mode .hotkeys,.touch-mode #help{display:none}.touch-mode .flash{top:calc(56px + env(safe-area-inset-top))}.touch-mode .credit-note{left:50%;right:auto;bottom:calc(3px + env(safe-area-inset-bottom));transform:translate(-50%)}.touch-mode .badge{top:calc(54px + env(safe-area-inset-top));bottom:auto;right:calc(14px + env(safe-area-inset-right))}.touch-mode .lil-gui{--widget-height:26px;--padding:7px;--spacing:5px}.touch-mode .lil-gui.gui-panel{top:calc(11px + env(safe-area-inset-top));right:calc(13px + env(safe-area-inset-right));max-height:calc(100% - 170px)}.touch-mode .lil-gui.gui-panel>.lil-children{max-height:calc(100dvh - 170px - var(--title-height))}.rotate{display:none}@media (orientation:portrait) and (width<=600px){.touch-mode .rotate{z-index:55;pointer-events:auto;text-align:center;background:#000000ed;flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex;position:fixed;inset:0}}.rotate-glyph{color:var(--accent);font-size:34px;line-height:1;animation:3.4s ease-in-out infinite rotate-hint}@keyframes rotate-hint{0%,55%{transform:rotate(0)}75%,to{transform:rotate(90deg)}}.rotate-title{letter-spacing:.3em;color:var(--ink);font-size:11px}.rotate-note{letter-spacing:.16em;color:var(--dim);font-size:8px}@media (prefers-reduced-motion:reduce){.rotate-glyph{animation:none}}
