html,body{background:#000;height:100%;margin:0;overflow:hidden}#app{--hud-color:#cfe8ff;--boost-color:#ffd60a;--alert-color:#ff4d6a;--hud-font:ui-monospace, SFMono-Regular, Menlo, monospace;--display-font:"Helvetica Neue", "Segoe UI", system-ui, sans-serif;width:100%;height:100%;position:relative}#app canvas{display:block}[hidden]{display:none!important}.hud{color:var(--hud-color);pointer-events:none;-webkit-user-select:none;user-select:none;position:absolute;inset:0}.key{letter-spacing:.22em;border:1px solid;border-radius:3px;padding:4px 3px 4px 6px}.qte-lanes{opacity:0;pointer-events:none;transition:opacity .35s ease-out;position:absolute}.qte-lanes.is-playing{opacity:1}.cockpit{width:280px;color:var(--hud-color);font:10px/1 var(--hud-font);letter-spacing:.28em;text-transform:uppercase;pointer-events:none;-webkit-user-select:none;user-select:none;justify-items:center;gap:10px;transition:opacity .4s ease-out;display:grid;position:absolute;bottom:26px;left:50%;transform:translate(-50%)}.cockpit:before{z-index:-1;-webkit-backdrop-filter:blur(10px)brightness(.35);backdrop-filter:blur(10px)brightness(.35);content:"";background:#0000004d;position:absolute;inset:-34px -70px -30px;-webkit-mask-image:radial-gradient(closest-side,#000 45%,#0000);mask-image:radial-gradient(closest-side,#000 45%,#0000)}.cockpit.is-out{opacity:.25}.speed{align-items:baseline;gap:10px;margin-left:58px;display:flex}.speed-value{min-width:2.4ch;font:200 46px/1 var(--display-font);font-variant-numeric:tabular-nums;letter-spacing:.04em;text-align:center;text-shadow:0 0 18px color-mix(in srgb, var(--hud-color) 50%, transparent);transition:color .25s,text-shadow .25s}.speed-unit{opacity:.55;width:48px}.is-boosting .speed-value{color:var(--boost-color);text-shadow:0 0 24px var(--boost-color)}.gauge{background:color-mix(in srgb, var(--hud-color) 9%, transparent);width:100%;height:8px;box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--hud-color) 30%, transparent);transition:filter .25s;position:relative;transform:skew(-24deg)}.is-ready .gauge{filter:drop-shadow(0 0 5px color-mix(in srgb, var(--boost-color) 50%, transparent))}.gauge-fill{transform-origin:0;background:linear-gradient(90deg, color-mix(in srgb, var(--boost-color) 60%, #6b3d00), var(--boost-color) 75%, #fff6c2);transition:transform 90ms linear;position:absolute;inset:0;transform:scaleX(0)}.gauge:after{content:"";background:linear-gradient(#000,#000) 25% 0/2px 100% no-repeat,linear-gradient(#000,#000) 50% 0/2px 100% no-repeat,linear-gradient(#000,#000) 75% 0/2px 100% no-repeat;position:absolute;inset:0}.is-full .gauge{animation:1.1s ease-in-out infinite alternate gauge-full}.is-boosting .gauge{filter:drop-shadow(0 0 9px var(--boost-color));animation:none}.is-boosting .gauge-fill{background:linear-gradient(90deg, var(--boost-color), #fff6c2 65%, #fff)}.is-boosting .gauge-fill:after{content:"";background:repeating-linear-gradient(90deg,#0000 0 16px,#ffffffa6 16px 24px);animation:.3s linear infinite gauge-burn;position:absolute;inset:0}@keyframes gauge-full{0%{filter:drop-shadow(0 0 4px color-mix(in srgb, var(--boost-color) 50%, transparent))}to{filter:drop-shadow(0 0 11px var(--boost-color))}}@keyframes gauge-burn{to{background-position:-24px 0}}.gauge-legend{justify-content:space-between;align-items:center;width:100%;display:flex}.gauge-label{opacity:.6;transition:color .25s,opacity .25s}.is-full .gauge-label,.is-boosting .gauge-label{color:var(--boost-color);opacity:1}.gauge-key{letter-spacing:.22em;opacity:.3;border:1px solid;border-radius:3px;padding:4px 5px 4px 8px;transition:color .2s,background-color .2s,opacity .2s,box-shadow .2s}.is-ready .gauge-key{color:var(--boost-color);opacity:.9}.is-boosting .gauge-key{border-color:var(--boost-color);background:var(--boost-color);box-shadow:0 0 12px var(--boost-color);color:#000;opacity:1}.spectator{font:10px/1 var(--hud-font);letter-spacing:.28em;text-transform:uppercase;white-space:nowrap;justify-items:center;gap:14px;display:grid;position:absolute;bottom:34px;left:50%;transform:translate(-50%)}.spectator-watching{text-shadow:0 0 10px #000;padding-left:.28em;font-size:12px}.spectator-name{text-shadow:0 0 12px,0 0 10px #000;font-weight:700}.spectator-keys{opacity:.6;align-items:center;gap:8px;display:flex}.spectator-fast{align-items:center;gap:8px;margin-left:14px;transition:color .2s;display:flex}.spectator-fast.is-on{color:var(--boost-color)}.scoreboard{width:236px;font:11px/1 var(--hud-font);letter-spacing:.08em;gap:2px;display:grid;position:absolute;top:16px;left:18px}.score-row{background:linear-gradient(90deg,#02060c9e,#02060c2e);grid-template-columns:14px 3px 1fr auto 26px;align-items:center;gap:9px;padding:6px 10px 6px 8px;transition:opacity .4s;display:grid}.score-row.is-out{opacity:.38}.score-rank{opacity:.5;font-variant-numeric:tabular-nums;text-align:right}.score-chip{background:var(--bike-color);box-shadow:0 0 8px var(--bike-color);align-self:stretch}.score-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.is-player .score-name,.is-player .ranking-name{color:#fff;font-weight:700}.score-row.is-watched{box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--bike-color) 70%, transparent);opacity:1}.score-bot{opacity:.45;letter-spacing:.2em;text-transform:uppercase;margin-left:7px;font-size:8px;font-weight:400}.score-gain{color:var(--boost-color);font-variant-numeric:tabular-nums}.score-points{font-variant-numeric:tabular-nums;text-align:right;font-weight:700}.round-info{font:10px/1 var(--hud-font);letter-spacing:.28em;text-shadow:0 0 10px #000;text-transform:uppercase;white-space:nowrap;justify-items:center;gap:8px;display:grid;position:absolute;top:16px;left:50%;transform:translate(-50%)}.round-number{font:300 17px/1 var(--display-font);letter-spacing:.35em;padding-left:.35em}.round-riding{opacity:.6;padding-left:.28em}.feed{letter-spacing:.12em;text-transform:none;justify-items:center;gap:7px;margin-top:8px;display:grid}.feed-line{background:#02060c8c;padding:5px 10px;font-size:11px;animation:.25s ease-out feed-in}.feed-name{font-weight:700}@keyframes feed-in{0%{opacity:0;translate:0 -6px}}.countdown{color:#e8f6ff;text-transform:uppercase;justify-items:center;gap:6px;display:grid;position:absolute;top:30%;left:50%;transform:translate(-50%)}.countdown-caption{font:12px/1 var(--hud-font);letter-spacing:.4em;opacity:.75;text-shadow:0 0 10px #000;padding-left:.4em}.countdown-value{font:200 150px/1 var(--display-font);font-variant-numeric:tabular-nums;text-shadow:0 0 40px #19e6ffbf,0 0 12px #000c}.banner{color:#e8f6ff;font:14px/1.8 var(--hud-font);letter-spacing:.08em;text-align:center;text-shadow:0 0 14px #19e6ffb3;white-space:pre-line;pointer-events:none;-webkit-user-select:none;user-select:none;position:absolute;top:24%;left:50%;transform:translate(-50%)}.banner[hidden]{display:none}.banner-title{font:200 36px/1.3 var(--display-font);letter-spacing:.35em;text-transform:uppercase;margin-bottom:6px;padding-left:.35em}.settings-tag,.settings{color:var(--hud-color);font:10px/1 var(--hud-font);letter-spacing:.28em;text-transform:uppercase;-webkit-user-select:none;user-select:none}.settings-tag{z-index:3;opacity:.45;pointer-events:none;align-items:center;gap:8px;display:flex;position:absolute;top:16px;right:18px}.settings-tag[hidden],.settings[hidden],.settings-tag-muted[hidden]{display:none}.settings-tag-muted{color:var(--alert-color);margin-right:10px}.settings-tag-key{letter-spacing:.22em;border:1px solid;border-radius:3px;padding:4px 3px 4px 6px}.settings{z-index:3;border:1px solid color-mix(in srgb, var(--hud-color) 28%, transparent);-webkit-backdrop-filter:blur(14px)brightness(.45);backdrop-filter:blur(14px)brightness(.45);width:340px;box-shadow:0 0 40px #0009, inset 0 1px 0 color-mix(in srgb, var(--hud-color) 18%, transparent);box-sizing:border-box;background:#02060c9e;border-radius:4px;gap:22px;padding:26px 28px 22px;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.settings-title{font:200 22px/1 var(--display-font);letter-spacing:.4em;text-align:center;text-shadow:0 0 18px color-mix(in srgb, var(--hud-color) 50%, transparent);padding-left:.4em}.settings-row{grid-template-columns:76px 1fr 3ch;align-items:center;gap:14px;display:grid}.settings-row.is-wide{grid-template-columns:76px 1fr}.settings-label{opacity:.6}.settings-value{font-variant-numeric:tabular-nums;text-align:right}.settings-slider{--level:0%;appearance:none;cursor:pointer;background:0 0;outline:none;width:100%;height:20px;margin:0;transition:opacity .2s}.settings-slider::-webkit-slider-runnable-track{background:linear-gradient(var(--hud-color), var(--hud-color)) 0 0 / var(--level) 100% no-repeat, color-mix(in srgb, var(--hud-color) 9%, transparent);height:8px;box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--hud-color) 30%, transparent);transform:skew(-24deg)}.settings-slider::-moz-range-track{background:linear-gradient(var(--hud-color), var(--hud-color)) 0 0 / var(--level) 100% no-repeat, color-mix(in srgb, var(--hud-color) 9%, transparent);height:8px;box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--hud-color) 30%, transparent);transform:skew(-24deg)}.settings-slider::-webkit-slider-thumb{width:4px;height:18px;box-shadow:0 0 10px var(--hud-color);appearance:none;background:#fff;border-radius:0;margin-top:-5px}.settings-slider::-moz-range-thumb{width:4px;height:18px;box-shadow:0 0 10px var(--hud-color);background:#fff;border:0;border-radius:0}.settings-slider:focus-visible::-webkit-slider-runnable-track{box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--hud-color) 70%, transparent), 0 0 10px color-mix(in srgb, var(--hud-color) 45%, transparent)}.settings-slider:focus-visible::-moz-range-track{box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--hud-color) 70%, transparent), 0 0 10px color-mix(in srgb, var(--hud-color) 45%, transparent)}.is-muted .settings-slider,.is-muted .settings-value{opacity:.3}.settings-switch{border:1px solid var(--hud-color);background:color-mix(in srgb, var(--hud-color) 85%, transparent);min-width:64px;box-shadow:0 0 12px color-mix(in srgb, var(--hud-color) 45%, transparent);color:#000;font:inherit;letter-spacing:.22em;text-transform:inherit;cursor:pointer;border-radius:3px;outline:none;justify-self:start;padding:7px 8px 7px 12px;transition:color .2s,background-color .2s,border-color .2s,box-shadow .2s}.settings-switch:focus-visible{box-shadow:0 0 0 2px #000, 0 0 0 3px var(--hud-color)}.is-muted .settings-switch{border-color:var(--alert-color);box-shadow:none;color:var(--alert-color);background:0 0}.settings-hint{opacity:.45;justify-content:center;align-items:center;gap:8px;display:flex}.settings-hint .settings-tag-key:not(:first-child){margin-left:14px}.screen{z-index:2;color:var(--hud-color);font:11px/1 var(--hud-font);letter-spacing:.2em;text-transform:uppercase;-webkit-user-select:none;user-select:none;background:radial-gradient(#0000004d,#000000c7);place-content:center;justify-items:center;margin:0;display:grid;position:absolute;inset:0}.title{color:#f2fbff;font:200 92px/1 var(--display-font);letter-spacing:.5em;text-shadow:0 0 50px #19e6ffb3,0 0 12px #19e6ff99;margin:0;padding-left:.5em}.title.is-small{letter-spacing:.4em;padding-left:.4em;font-size:44px}.subtitle{letter-spacing:.4em;opacity:.7;margin:18px 0 34px;padding-left:.4em}.panel{border:1px solid color-mix(in srgb, var(--hud-color) 28%, transparent);-webkit-backdrop-filter:blur(14px)brightness(.5);backdrop-filter:blur(14px)brightness(.5);width:400px;box-shadow:0 0 40px #0009, inset 0 1px 0 color-mix(in srgb, var(--hud-color) 18%, transparent);box-sizing:border-box;background:#02060c9e;border-radius:4px;gap:20px;padding:28px 30px 26px;display:grid}.form-row{grid-template-columns:84px 1fr;align-items:center;gap:14px;min-height:30px;display:grid}.form-label{opacity:.6}.text-input{border:0;border-bottom:1px solid color-mix(in srgb, var(--hud-color) 40%, transparent);box-sizing:border-box;color:#fff;width:100%;font:14px/1 var(--hud-font);letter-spacing:.12em;background:0 0;border-radius:0;outline:none;padding:7px 0;transition:border-color .2s,box-shadow .2s}.text-input::placeholder{color:color-mix(in srgb, var(--hud-color) 35%, transparent)}.text-input:focus{border-color:var(--hud-color);box-shadow:0 8px 12px -10px var(--hud-color)}.stepper{align-items:center;gap:12px;display:flex}.stepper-value{color:#fff;font-variant-numeric:tabular-nums;letter-spacing:.08em;text-align:center;width:3ch;font-size:14px}.stepper-button,.segment,.secondary-button{border:1px solid color-mix(in srgb, var(--hud-color) 40%, transparent);color:var(--hud-color);font:inherit;letter-spacing:inherit;text-transform:inherit;cursor:pointer;background:0 0;border-radius:3px;outline:none;transition:color .2s,background-color .2s,border-color .2s,box-shadow .2s,opacity .2s}.stepper-button{letter-spacing:0;width:28px;height:28px;padding:0;font-size:14px}.stepper-button:disabled{opacity:.25;cursor:default}.segmented{grid-auto-columns:1fr;grid-auto-flow:column;gap:6px;display:grid}.segment{padding:8px 0 8px .2em}.stepper-button:hover:not(:disabled),.segment:hover,.secondary-button:hover{border-color:var(--hud-color)}.segment.is-on{border-color:var(--hud-color);background:color-mix(in srgb, var(--hud-color) 85%, transparent);box-shadow:0 0 12px color-mix(in srgb, var(--hud-color) 40%, transparent);color:#000}.primary-button{color:#000;font:700 12px/1 var(--hud-font);letter-spacing:.3em;text-transform:inherit;cursor:pointer;background:#e8f6ff;border:1px solid #e8f6ff;border-radius:3px;outline:none;margin-top:6px;padding:13px 0 13px .3em;transition:background-color .2s,box-shadow .2s;box-shadow:0 0 18px #19e6ff73}.primary-button:hover{background:#fff;box-shadow:0 0 28px #19e6ffbf}.secondary-button{letter-spacing:.3em;margin-top:6px;padding:13px 0 13px .3em;font-size:12px}.stepper-button:focus-visible,.segment:focus-visible,.secondary-button:focus-visible,.primary-button:focus-visible{box-shadow:0 0 0 2px #000, 0 0 0 3px var(--hud-color)}.button-row{grid-template-columns:1fr 2fr;gap:10px;display:grid}.controls{opacity:.55;flex-wrap:wrap;justify-content:center;gap:10px 22px;max-width:560px;margin-top:30px;font-size:10px;display:flex}.control{align-items:center;gap:8px;display:flex}.button-column{gap:10px;display:grid}.button-column .secondary-button{margin-top:0}.button-row.is-single{grid-template-columns:1fr}.form-section{border-top:1px solid color-mix(in srgb, var(--hud-color) 16%, transparent);opacity:.5;padding-top:16px;font-size:9px}.notice{opacity:.75;text-align:center;line-height:1.6}.home .notice{color:var(--alert-color);opacity:1}.is-locked{pointer-events:none}.is-locked .stepper-button{visibility:hidden}.is-locked .segment:not(.is-on){opacity:.3}.lobby .subtitle{margin-top:10px}.link-button{border:1px solid color-mix(in srgb, var(--hud-color) 40%, transparent);color:#fff;font:13px/1 var(--hud-font);letter-spacing:.08em;text-transform:none;cursor:copy;-webkit-user-select:text;user-select:text;background:#02060c9e;border-radius:3px;outline:none;margin-top:18px;padding:9px 14px;transition:border-color .2s}.link-button:hover,.link-button:focus-visible{border-color:var(--hud-color)}.ranking-row.is-player-row{grid-template-columns:3px 1fr auto}.spectator-waiting{color:var(--boost-color);text-shadow:0 0 10px #000}.results .panel{width:460px}.ranking{letter-spacing:.08em;text-transform:none;gap:2px;display:grid}.ranking-row{background:#ffffff08;grid-template-columns:16px 3px 1fr 92px 52px;align-items:center;gap:10px;padding:8px 10px 8px 8px;font-size:12px;display:grid}.ranking-row.is-head{letter-spacing:.2em;opacity:.5;text-transform:uppercase;background:0 0;font-size:9px}.ranking-row.is-first{background:color-mix(in srgb, var(--bike-color) 16%, transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--bike-color) 55%, transparent)}.ranking-rank{opacity:.55;font-variant-numeric:tabular-nums;text-align:right}.ranking-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.ranking-wins,.ranking-points{font-variant-numeric:tabular-nums;text-align:right}.ranking-points{font-weight:700}.dev-panel{border:1px solid color-mix(in srgb, var(--hud-color) 25%, transparent);color:var(--hud-color);font:12px/1.6 var(--hud-font);pointer-events:none;-webkit-user-select:none;user-select:none;background:#0000008c;border-radius:6px;margin:0;padding:10px 12px;position:absolute;bottom:12px;left:12px}
