:root{--night:#05060a;--sky:#170728;--dash:#12151d;--ink:#f8fbff;--muted:#8b9aaa;--hot:#ff2b45;--nitro:#34eaff;--acid:#d9ff35;--tilt:0deg;--bill-radius:3px;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--night);color:var(--ink)}body{font-family:Arial Black,Impact,Arial,sans-serif;overflow-x:hidden}button,a{font:inherit}.race-world{position:relative;isolation:isolate;min-height:100vh;display:grid;place-items:center;padding:clamp(12px,3vw,42px);overflow:hidden;background:radial-gradient(ellipse at 50% 28%,color-mix(in srgb,var(--hot) 25%,transparent),transparent 30%),linear-gradient(var(--sky) 0 46%,var(--night) 72%)}
.city{position:absolute;z-index:-3;left:0;right:0;top:18%;height:34%;display:flex;align-items:end;justify-content:space-around;border-bottom:3px solid var(--nitro);filter:drop-shadow(0 0 9px var(--nitro))}.city i{width:9%;height:var(--h,65%);background:repeating-linear-gradient(90deg,#090a10 0 12px,transparent 12px 19px),repeating-linear-gradient(0deg,transparent 0 13px,var(--hot) 13px 16px),#0b0c12;clip-path:polygon(8% 9%,38% 9%,38% 0,65% 0,65% 15%,100% 15%,100% 100%,0 100%)}.city i:nth-child(2n){--h:90%}.city i:nth-child(3n){--h:48%}
.speed-field i{position:absolute;z-index:-1;width:clamp(80px,12vw,190px);height:3px;background:linear-gradient(90deg,transparent,var(--nitro));box-shadow:0 0 9px var(--nitro);transform:rotate(var(--r,-18deg));animation:shoot 1.2s linear infinite}.cockpit{position:relative;width:min(1180px,98vw);transform:perspective(1200px) rotateZ(var(--tilt));filter:drop-shadow(0 30px 35px #000)}.roof-strip{display:flex;justify-content:center;align-items:center;gap:22px;padding:8px 18px;border:4px solid var(--hot);border-bottom:0;background:#08090e;color:var(--ink);clip-path:polygon(7% 0,93% 0,100% 100%,0 100%);font-size:clamp(10px,1.8vw,18px);font-style:italic;letter-spacing:.12em}.flag{font-family:monospace;color:var(--acid);letter-spacing:-.35em}
.windshield{position:relative;height:clamp(390px,56vw,650px);overflow:hidden;border:clamp(8px,1.2vw,16px) solid #171923;border-bottom-width:24px;background:linear-gradient(#110822 0 54%,#08090c 55%);clip-path:polygon(6% 0,94% 0,100% 100%,0 100%)}.glass-sheen{position:absolute;z-index:7;inset:0;pointer-events:none;background:linear-gradient(125deg,#fff2 0 3%,transparent 3% 42%,#fff1 42% 44%,transparent 44%);mix-blend-mode:screen}.road{position:absolute;inset:50% -20% -30%;background:linear-gradient(100deg,transparent 49%,#fff8 49% 51%,transparent 51%) center/18% 100%,linear-gradient(115deg,transparent 48%,var(--hot) 49% 50%,transparent 51%) left/50% 100%,linear-gradient(65deg,transparent 48%,var(--nitro) 49% 50%,transparent 51%) right/50% 100%,#0b0c11;clip-path:polygon(43% 0,57% 0,85% 100%,15% 100%)}.road span{position:absolute;left:49%;width:2%;height:30%;background:var(--acid);animation:road 1s linear infinite}
.billboard{position:absolute;z-index:2;top:7%;left:50%;width:min(52%,600px);height:68%;transform:translateX(-50%) perspective(600px) rotateX(2deg);display:grid;place-items:center;overflow:hidden;border:7px solid var(--hot);border-radius:var(--bill-radius);background:linear-gradient(135deg,#090d18,#1c0925);box-shadow:9px 9px 0 #000,0 0 22px var(--hot)}.billboard::before{content:"LIVE // NIGHT FEED";position:absolute;z-index:5;top:7px;left:8px;padding:4px 7px;background:var(--hot);font:900 9px Arial,sans-serif;letter-spacing:.15em}.billboard img{grid-area:1/1;width:100%;height:100%;object-fit:cover}.billboard #banner-image{opacity:.48;filter:saturate(1.5) contrast(1.2)}.billboard #hero-image{z-index:2;width:88%;height:88%;object-fit:contain;filter:drop-shadow(9px 9px 0 #000)}.billboard.banner-only #banner-image{opacity:1}.media-fallback{display:grid;place-items:center;text-align:center}.media-fallback span{font:900 clamp(100px,19vw,220px)/.7 Impact,sans-serif;color:var(--hot);-webkit-text-stroke:3px var(--acid);text-shadow:9px 9px 0 #000}.media-fallback b{font-size:clamp(16px,3vw,30px);font-style:italic;letter-spacing:.12em}
.nameplate{position:absolute;z-index:8;left:3%;top:12%;width:25%;transform:skewY(-4deg)}.nameplate small{display:inline-block;padding:4px 8px;background:var(--acid);color:#070900;font-size:9px;letter-spacing:.12em}.nameplate h1{margin:5px 0;font-size:clamp(31px,6vw,76px);line-height:.78;text-transform:uppercase;font-style:italic;letter-spacing:-.06em;text-shadow:4px 4px 0 var(--hot),8px 8px 0 #000;overflow-wrap:anywhere}.nameplate p{margin:13px 0;padding:7px;background:#05070bdd;border-left:5px solid var(--nitro);font:900 clamp(10px,1.4vw,15px)/1.15 Arial,sans-serif;letter-spacing:.07em}.windshield-ticker{position:absolute;z-index:9;left:5%;right:5%;bottom:5%;overflow:hidden;background:#06080def;border-block:3px solid var(--nitro);color:var(--acid);white-space:nowrap;font:900 clamp(13px,2vw,21px)/1.7 Consolas,monospace}.windshield-ticker span{display:inline-block;min-width:max-content;animation:crawl 9s linear infinite}
.dashboard{position:relative;z-index:10;margin-top:-8px;display:grid;grid-template-columns:minmax(150px,1fr) minmax(290px,1.55fr) minmax(150px,1fr);align-items:center;gap:10px;padding:20px clamp(12px,4vw,50px);border:7px ridge #343844;border-radius:7px 7px 36px 36px;background:linear-gradient(105deg,#090b10,var(--dash),#07090e);box-shadow:inset 0 0 35px #000}.gauge{display:grid;place-items:center}.gauge-face{position:relative;width:min(220px,20vw);aspect-ratio:1;border:clamp(7px,1vw,12px) solid #3d414b;border-radius:50%;display:grid;place-items:center;background:repeating-conic-gradient(from -120deg,var(--ink) 0 1deg,transparent 1deg 13deg),radial-gradient(circle,#0b0e13 0 58%,var(--hot) 59% 63%,#07090d 64%);box-shadow:inset 0 0 25px #000,0 0 18px color-mix(in srgb,var(--hot) 45%,transparent)}.gauge-face::before{content:"";position:absolute;inset:15%;border-radius:50%;background:#090c12}.gauge b{position:relative;z-index:2;font:900 clamp(27px,5vw,58px)/1 Impact,sans-serif;font-style:italic}.gauge small{position:absolute;z-index:2;bottom:22%;font:900 8px Arial,sans-serif;color:var(--muted)}.needle{position:absolute;z-index:3;left:50%;bottom:48%;width:42%;height:4px;background:var(--hot);transform-origin:left;transform:rotate(var(--needle,-45deg));box-shadow:0 0 8px var(--hot)}.needle::before{content:"";position:absolute;left:-9px;top:-7px;width:18px;height:18px;border-radius:50%;background:var(--ink)}
.center-console{text-align:center}.gear-row{display:flex;justify-content:center;gap:4px;margin-bottom:8px}.gear-row span{display:grid;place-items:center;width:28px;height:24px;border:2px solid #535965;background:#080a0e;color:var(--muted);font:900 10px Arial,sans-serif}.gear-row .active{border-color:var(--acid);background:var(--acid);color:#080a00;box-shadow:0 0 12px var(--acid)}.ignition{width:100%;min-height:100px;border:5px solid var(--hot);clip-path:polygon(4% 0,96% 0,100% 18%,100% 82%,96% 100%,4% 100%,0 82%,0 18%);padding:10px 28px;background:linear-gradient(165deg,#301019,#090b10 55%);color:var(--ink);cursor:pointer;box-shadow:inset 0 0 18px var(--hot);transition:.15s}.ignition:hover{background:var(--hot);color:#fff}.ignition span,.ignition strong,.ignition small,.ignition em{display:block}.ignition span{font-size:9px;letter-spacing:.2em;color:var(--acid)}.ignition strong{font-size:clamp(17px,3vw,31px);font-style:italic}.ignition small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:10px Consolas,monospace}.ignition em{margin-top:4px;color:var(--nitro);font:900 9px Arial,sans-serif}.social-panel{display:flex;justify-content:center;gap:7px;margin-top:9px}.social-panel a{display:flex;align-items:center;gap:6px;padding:6px 10px;border:2px solid var(--nitro);color:var(--ink);text-decoration:none;font:900 10px Arial,sans-serif}.social-panel a:hover{background:var(--nitro);color:#02060a}.social-panel i{font-size:17px}.nitro-row{display:flex;justify-content:center;align-items:center;gap:7px;margin-top:10px;color:var(--acid);font:900 9px Arial,sans-serif;letter-spacing:.12em}.nitro-row i{width:8px;height:8px;border-radius:50%;background:var(--nitro);box-shadow:0 0 8px var(--nitro);animation:blink .6s steps(1) infinite}.nitro-row i:nth-child(2){animation-delay:-.2s}.nitro-row i:nth-child(3){animation-delay:-.4s}
.bumper-crawl{overflow:hidden;border:4px solid var(--acid);background:#050609;color:var(--hot);white-space:nowrap;font:900 15px/1.8 Consolas,monospace;letter-spacing:.14em;transform:perspective(400px) rotateX(-7deg)}.bumper-crawl span{display:inline-block;min-width:max-content;animation:crawl 12s linear infinite}
.layout-driver .billboard{left:65%;width:52%}.layout-driver .nameplate{width:40%;top:21%}.layout-wide .billboard{width:72%;height:72%}.layout-wide .nameplate{top:auto;bottom:15%;width:34%}.layout-drift .billboard{transform:translateX(-50%) rotate(-2deg);clip-path:polygon(6% 0,100% 0,94% 100%,0 100%)}.layout-drift .nameplate{transform:skewY(5deg)}.frame-round .billboard{--bill-radius:50% 50% 8px 8px}.frame-slash .billboard{clip-path:polygon(7% 0,100% 0,93% 100%,0 100%)}
@keyframes crawl{to{transform:translateX(-50%)}}@keyframes road{from{top:-35%}to{top:110%}}@keyframes shoot{from{translate:-130vw 0}to{translate:130vw 0}}@keyframes blink{50%{opacity:.2}}
@media(max-width:720px){.race-world{padding:8px}.cockpit{width:100%;transform:none}.roof-strip{gap:5px}.flag{display:none}.windshield{height:470px;clip-path:polygon(2% 0,98% 0,100% 100%,0 100%)}.billboard,.layout-driver .billboard,.layout-wide .billboard{left:50%;top:8%;width:86%;height:58%}.nameplate,.layout-driver .nameplate,.layout-wide .nameplate{left:7%;top:auto;bottom:9%;width:75%;transform:none}.nameplate h1{font-size:42px}.nameplate p{max-width:80%}.dashboard{grid-template-columns:72px minmax(0,1fr) 72px;padding:12px 5px}.gauge-face{width:70px}.gauge small{display:none}.ignition{min-height:88px;padding:8px}.social-panel{flex-wrap:wrap}.social-panel a span{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition:none!important}}