*{box-sizing:border-box}html,body{color:#fff;-webkit-user-select:none;user-select:none;background:#000;height:100%;margin:0;font-family:Segoe UI,system-ui,sans-serif;overflow:hidden}#app canvas{display:block}#hud{pointer-events:none;position:fixed;inset:0}.panel{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-left:3px solid var(--team,#e10600);background:#0a0c129e;border-radius:10px;padding:10px 14px;position:absolute}.timing{font-variant-numeric:tabular-nums;min-width:210px;top:16px;left:16px}.timing .row{justify-content:space-between;gap:18px;font-size:15px;line-height:1.6;display:flex}.timing .row.big{font-size:22px;font-weight:700}.timing .row.best span:last-child{color:#c77dff}.label{color:#9aa3b5;letter-spacing:.08em;font-weight:600}.dash{width:250px;bottom:16px;right:16px}.rpm{background:#222630;border-radius:5px;height:10px;margin-bottom:8px;overflow:hidden}#rpm-fill{background:linear-gradient(90deg,#22c55e 0%,#eab308 70%,#ef4444 100%);width:0;height:100%;transition:width 50ms linear}#rpm-fill.redline{animation:.12s steps(2,end) infinite blink}@keyframes blink{50%{opacity:.35}}.dash-row{justify-content:space-between;align-items:flex-end;display:flex}.gear-box,.speed-box{font-variant-numeric:tabular-nums;flex-direction:column;align-items:center;display:flex}.gear-box span{color:#ffc400;font-size:46px;font-weight:800;line-height:1}.speed-box span{font-size:54px;font-weight:800;line-height:1}small{color:#9aa3b5;letter-spacing:.14em;font-size:11px}.settings-btn{pointer-events:auto;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#d6dbe6;cursor:pointer;background:#0a0c129e;border:0;border-radius:10px;width:40px;height:40px;padding:8px;transition:color .15s,background .15s;position:absolute;top:16px;right:16px}.settings-btn svg{fill:currentColor;width:100%;height:100%;transition:transform .3s;display:block}.settings-btn:hover{color:#fff}.settings-btn:hover svg,.settings-btn.active svg{transform:rotate(60deg)}.settings-btn.active{color:#fff;background:#0a0c12d9}.settings{pointer-events:auto;z-index:2;background:#0a0c12e0;width:320px;top:64px;right:16px}.settings[hidden]{display:none}.settings h2{letter-spacing:.16em;text-transform:uppercase;margin:2px 0 10px;font-size:13px}.settings h3{letter-spacing:.14em;text-transform:uppercase;color:#9aa3b5;margin:14px 0 6px;font-size:11px}.settings-toggles{flex-direction:column;gap:6px;display:flex}.setting{color:#fff;width:100%;font:inherit;text-align:left;cursor:pointer;background:#ffffff0d;border:0;border-radius:8px;justify-content:space-between;align-items:center;gap:12px;padding:8px 10px;display:flex}.setting:hover{background:#ffffff17}.setting b{font-size:14px;display:block}.setting small{letter-spacing:.02em;margin-top:2px;display:block}.switch{background:#3a4050;border-radius:10px;flex:none;width:36px;height:20px;transition:background .15s;position:relative}.switch:after{content:"";background:#fff;border-radius:50%;width:16px;height:16px;transition:transform .15s;position:absolute;top:2px;left:2px}.setting.on .switch{background:var(--team,#e10600)}.setting.on .switch:after{transform:translate(16px)}.help{color:#d6dbe6;font-size:13px;line-height:1.6}.help b{color:#fff}.help .dim{color:#8790a3}#flash{letter-spacing:.06em;text-shadow:0 2px 12px #0009;opacity:0;font-size:34px;font-weight:800;transition:opacity .25s,transform .25s;position:absolute;top:18%;left:50%;transform:translate(-50%,-10px)}#flash.show{opacity:1;transform:translate(-50%)}#flash.best{color:#c77dff}#flash.warn{color:#ff5a3c}#surface{color:#ffb020;letter-spacing:.2em;font-weight:700;position:absolute;top:28%;left:50%;transform:translate(-50%)}#error{color:#ff6b6b;font-size:18px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.compound-pick{border-bottom:1px solid #ffffff14;margin-bottom:10px;padding-bottom:10px}.compound-head{justify-content:space-between;align-items:baseline;margin-bottom:6px;font-size:11px;display:flex}.compound-head .label{letter-spacing:.14em;font-size:10px}#tyre-fitted{color:#9aa3b5;font-variant-numeric:tabular-nums;font-weight:700}#tyre-fitted i{font-style:italic;font-weight:900}.compounds{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.compound{pointer-events:auto;color:#8790a3;font:inherit;letter-spacing:.1em;cursor:pointer;opacity:.6;background:#ffffff0a;border:2px solid #0000;border-radius:8px;flex-direction:column;align-items:center;gap:2px;padding:5px 0 4px;font-size:9px;font-weight:800;transition:opacity .15s,border-color .15s,background .15s,transform .15s;display:flex;position:relative}.compound svg{width:34px;height:34px;display:block}.compound kbd{font:inherit;color:#5c6476;font-size:9px;position:absolute;top:3px;right:5px}.compound:hover{opacity:.9}.compound.selected{opacity:1;color:#fff;border-color:var(--c);background:color-mix(in srgb, var(--c) 16%, transparent);transform:translateY(-1px)}.compound.selected svg{filter:drop-shadow(0 0 6px color-mix(in srgb, var(--c) 70%, transparent))}.wing-change{pointer-events:auto;color:#8790a3;width:100%;font:inherit;letter-spacing:.1em;cursor:pointer;opacity:.75;background:#ffffff0a;border:2px solid #0000;border-radius:8px;align-items:center;gap:8px;margin-top:6px;padding:5px 26px 5px 8px;font-size:9px;font-weight:800;transition:opacity .15s,border-color .15s,background .15s;display:flex;position:relative}.wing-change svg{fill:currentColor;flex:none;width:30px;height:11px}.wing-change b{margin-left:auto;font-size:10px}.wing-change kbd{font:inherit;color:#5c6476;font-size:9px;position:absolute;top:3px;right:5px}.wing-change:hover{opacity:.95}.wing-change.selected{opacity:1;color:#fff;border-color:var(--team);background:color-mix(in srgb, var(--team) 18%, transparent)}.wing-change.needed:not(.selected){color:#ffb020;opacity:1;animation:1.2s ease-in-out infinite wing-pulse}@keyframes wing-pulse{50%{border-color:#ffb02099}}.tyres{justify-content:space-between;align-items:center;gap:12px;margin-top:10px;display:flex}.tyre-grid{grid-template-columns:repeat(2,44px);gap:4px 18px;display:grid}.tyre{font-variant-numeric:tabular-nums;color:#0a0c12;background:#4c8dff;border:2px solid #0000;border-radius:6px;justify-content:center;align-items:center;height:30px;font-size:12px;font-weight:700;display:flex;position:relative;overflow:hidden}.tyre:after{content:"";height:4px;width:var(--dmg,0%);background:#ff2a2a;position:absolute;bottom:0;left:0}.tyre.damaged{outline-offset:1px;outline:2px dashed #ff2a2a}.tyre-grid{padding-top:9px;position:relative}.wing-ind{grid-template-columns:1fr 1fr;gap:3px;height:5px;display:grid;position:absolute;top:0;left:0;right:0}.wing-ind i{background:#3fa34d;border-radius:2px}.wing-ind i.lost{outline-offset:-1px;background:0 0;outline:1px dashed #ff2a2a}.tyre.slide{border-color:#fff}.tyre.kerb{box-shadow:0 0 0 2px #e10600}.tyre.grass{box-shadow:0 0 0 2px #3fa34d}.tyre.gravel{box-shadow:0 0 0 2px #c9b48a}.tyre.runoff{box-shadow:0 0 0 2px #4f7fb0}.aids{flex-direction:column;align-items:flex-end;gap:4px;display:flex}.aids span{letter-spacing:.1em;color:#9aa3b5;background:#2a2f3a;border-radius:4px;padding:2px 6px;font-size:11px;font-weight:800}.aids span.on{color:#fff;background:#1f6f3f}.aids span.active{color:#0a0c12;background:#ffc400}.timing .row.track{letter-spacing:.1em;text-transform:uppercase;color:#fff;font-size:13px;font-weight:700}.damage-map{flex-direction:column;align-items:center;gap:4px;width:70px;padding:8px 8px 6px;display:flex;bottom:16px;right:282px}.damage-map svg{width:54px;height:112px;display:block}.damage-map small{letter-spacing:.12em;color:#9aa3b5;font-size:8px;font-weight:800}.damage-map.off svg{opacity:.3}.damage-map.off small{color:#5c6476}#damage-car .chassis{fill:#3a4050}#damage-car .part{fill:#3fa34d;stroke:#00000059;stroke-width:.6px}#damage-car line.part{fill:none;stroke:#3fa34d;stroke-width:2.4px;stroke-linecap:round}#damage-car .part.lost{fill:#0000;stroke:#ff2a2a;stroke-dasharray:2 1.5;stroke-width:.8px}#damage-car line.part.lost{stroke:#ff2a2a;stroke-width:1px}.map{width:200px;height:200px;padding:10px;top:16px;right:64px}#minimap{width:100%;height:100%;display:block}#hud.menu-open>:not(#error){display:none}#menu{background:radial-gradient(#080a108c,#080a10e0);flex-direction:column;justify-content:safe center;align-items:center;gap:10px;padding:24px 16px;display:flex;position:fixed;inset:0;overflow-y:auto}#menu[hidden]{display:none}#menu.showroom:has(#step-team:not([hidden])){background:linear-gradient(#0000 35%,#080a10e0 60%)}#menu.showroom:has(#step-team:not([hidden])) h1{margin-bottom:auto}#menu.showroom:has(#step-track:not([hidden])){background:#080a10}#menu h1{letter-spacing:.08em;margin:0;font-size:56px;font-style:italic;font-weight:900}#menu h1 span{color:#e10600}#menu .sub{color:#9aa3b5;letter-spacing:.25em;text-transform:uppercase;margin:14px 0 6px;font-size:13px}#menu .hint{color:#8790a3;text-align:center;margin-top:4px;font-size:13px}.menu-step{flex-direction:column;align-items:center;gap:10px;width:100%;display:flex}.menu-step[hidden]{display:none}.menu-step .step-label{color:#e10600;letter-spacing:.3em;text-transform:uppercase;margin:10px 0 -8px;font-size:12px;font-weight:800}.menu-actions{justify-content:center;gap:14px;margin-top:14px;display:flex}.menu-btn{color:#fff;min-width:140px;font:inherit;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;background:#141720e6;border:2px solid #3a4152;border-radius:999px;padding:12px 28px;font-size:16px;font-weight:800;transition:transform .15s,background .15s,border-color .15s,box-shadow .15s}.menu-btn:hover{border-color:#fff;transform:translateY(-2px)}.menu-btn.primary{background:#e10600;border-color:#e10600}.menu-btn.primary:hover{background:#ff1a10;border-color:#ff1a10;box-shadow:0 6px 24px #e1060073}.menu-btn.go{letter-spacing:.2em;min-width:200px;font-size:22px;font-style:italic}#menu-tracks{flex-wrap:wrap;justify-content:center;gap:12px;max-width:1240px;display:flex}#menu-tracks .track-card{width:184px;padding:10px 12px}#menu-tracks .track-card svg{height:104px;margin-bottom:6px}#menu-tracks .track-name{font-size:15px}#menu-tracks .track-meta,#menu-tracks .track-best{font-size:12px}#menu-tracks .track-best{margin-top:4px}.track-card{color:#fff;width:230px;font:inherit;text-align:left;cursor:pointer;background:#141720d9;border:2px solid #0000;border-radius:12px;padding:14px 14px 12px;transition:transform .15s,border-color .15s,background .15s}.track-card svg{color:#cfd5e2;width:100%;height:150px;margin-bottom:10px;display:block}.track-card.focused{background:#202430f2;border-color:#e10600;transform:translateY(-4px)}.track-card.focused svg{color:#fff}.track-name{font-size:17px;font-weight:800}.track-meta{color:#9aa3b5;margin-top:2px;font-size:13px}.track-best{color:#9aa3b5;font-variant-numeric:tabular-nums;margin-top:8px;font-size:13px}.night-tag{vertical-align:2px;color:#ffd36b;letter-spacing:.08em;text-transform:uppercase;background:#1d2647;border-radius:6px;margin-left:4px;padding:1px 6px;font-size:10px;font-weight:800;display:inline-block}.track-best span{color:#c77dff;font-weight:700}.timing .row.team{letter-spacing:.12em;text-transform:uppercase;color:var(--team-accent,#9aa3b5);margin-top:-4px;font-size:12px;font-weight:700}#menu-teams{flex-wrap:wrap;justify-content:center;gap:12px;max-width:1240px;display:flex}.team-card{border:2px solid #0000;border-top:4px solid var(--c1);color:#fff;width:186px;font:inherit;text-align:left;cursor:pointer;background:#141720d9;border-radius:12px;padding:10px 12px;transition:transform .15s,border-color .15s,background .15s}.team-card .team-logo{width:100%;height:56px;margin-bottom:6px;display:block}.team-card .team-name{font-size:15px}.team-card .team-swatches{gap:4px;margin-top:6px;display:flex}.team-card .team-swatches i{border-radius:3px;width:18px;height:6px}.team-card.selected{border-color:var(--c1);border-top-color:var(--c1);background:#202430f2}.team-card.selected .team-name:after{content:" ✓";color:var(--c3)}.menu-row.active .focused{transform:translateY(-4px);box-shadow:0 0 0 2px #fff}.menu-row:not(.active) .track-card.focused{transform:none}#touch,#rotate{display:none}#touch{--l:max(12px, env(safe-area-inset-left));--r:max(12px, env(safe-area-inset-right));--b:max(12px, env(safe-area-inset-bottom));position:absolute;inset:0}#touch-steer,#touch button{pointer-events:auto;touch-action:none;-webkit-touch-callout:none;color:#fff;font:inherit;background:#0a0c1259;border:2px solid #ffffff59;border-radius:14px;font-weight:800}#touch-steer{left:var(--l);bottom:var(--b);width:216px;height:96px;display:flex;position:absolute;overflow:hidden}#touch-steer span{flex:1;justify-content:center;align-items:center;font-size:28px;display:flex}#touch-steer span:first-child{border-right:2px solid #fff3}#touch-steer span.active,#touch button.active{background:#ffffff4d}.touch-pedals{right:var(--r);bottom:var(--b);align-items:flex-end;gap:12px;display:flex;position:absolute}#touch .touch-pedals button{letter-spacing:.08em;width:92px;height:96px;font-size:13px}#touch .touch-pedals .gas{border-color:#22c55ecc;height:124px}#touch .touch-pedals .brake{border-color:#ef4444cc}.touch-tools{top:max(8px, env(safe-area-inset-top));right:calc(var(--r) + 48px);gap:6px;display:flex;position:absolute}#touch .touch-tools button{letter-spacing:.06em;background:#0a0c129e;border-width:0;border-radius:10px;width:56px;height:44px;padding:0;font-size:10px}@media (pointer:coarse){html,body{overscroll-behavior:none;-webkit-tap-highlight-color:transparent}#touch{display:block}#menu .hint,.settings h3,.settings .help,.compound-pick,.tyres,.timing .row.track,.timing .row.team{display:none}.timing,.dash,.damage-map{transform-origin:0 0;bottom:auto;right:auto}.timing{top:8px;left:max(8px, env(safe-area-inset-left));transform:scale(.6)}.dash{top:8px;left:calc(max(8px, env(safe-area-inset-left)) + 134px);transform:scale(.6)}.damage-map{top:84px;left:max(8px, env(safe-area-inset-left));transform:scale(.45)}.map{top:60px;right:max(8px, env(safe-area-inset-right));transform-origin:100% 0;transform:scale(.45)}.settings-btn{top:max(8px, env(safe-area-inset-top));right:max(8px, env(safe-area-inset-right));width:44px;height:44px}.settings{top:60px;right:max(8px, env(safe-area-inset-right));max-height:calc(100dvh - 68px);overflow-y:auto}}@media (pointer:coarse) and (height<=500px){#menu{padding:8px max(12px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));gap:2px}#menu h1{align-self:flex-start;font-size:24px}.menu-step{gap:4px}.menu-step .step-label{display:none}#menu .sub{margin:0;font-size:11px}#menu-teams{flex-wrap:nowrap;justify-content:flex-start;width:100%;max-width:none;padding:4px;overflow-x:auto}.team-card{flex:none;width:124px;padding:6px 8px}.team-card canvas{max-height:34px}.team-card .track-meta,.team-swatches{display:none}#menu-tracks .track-card{width:150px}#menu-tracks .track-card svg{height:60px}.menu-actions{margin-top:4px;position:sticky;bottom:0}.menu-btn{padding:8px 22px}}@media (pointer:coarse) and (orientation:portrait) and (width<=600px){#rotate{z-index:100;text-align:center;background:#080a10;flex-direction:column;justify-content:center;align-items:center;gap:10px;display:flex;position:fixed;inset:0}#rotate b{font-size:20px}.rotate-icon{border:4px solid #fff;border-radius:9px;width:44px;height:76px;margin-bottom:20px;animation:2.4s ease-in-out infinite rotate-hint}}@keyframes rotate-hint{0%,25%{transform:rotate(0)}60%,to{transform:rotate(90deg)}}#loading{z-index:50;opacity:0;pointer-events:none;background:radial-gradient(#12141aeb,#06070afa);justify-content:center;align-items:center;padding:16px;transition:opacity .25s;display:flex;position:fixed;inset:0}#loading.visible{opacity:1;pointer-events:auto}.loading-panel{color:#fff;width:min(520px,100%)}.loading-kicker{letter-spacing:.18em;text-transform:uppercase;color:var(--team,#e10600);font-size:12px;font-weight:700}.loading-title{margin:4px 0 16px;font-size:26px;font-weight:700}.loading-track{background:#ffffff1f;border-radius:3px;height:6px;overflow:hidden}.loading-fill{background:linear-gradient(90deg, var(--team,#e10600), #ff6a3d);transform-origin:0;height:100%;transition:transform .2s ease-out;transform:scaleX(0)}.loading-track{position:relative}.loading-track:after{content:"";background:linear-gradient(90deg,#0000,#ffffff59,#0000);width:30%;animation:1.1s linear infinite loading-sweep;position:absolute;inset:0}@keyframes loading-sweep{0%{transform:translate(-100%)}to{transform:translate(340%)}}.loading-step{color:#ffffffa6;min-height:1.2em;margin-top:10px;font-size:13px}