:root{--bg:#0b0d10;--panel:#12161b;--panel2:#171c22;--line:#232a32;--red:#e10600;--teal:#00d2be;--txt:#eef1f4;--mut:#8a949e}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--txt);font:15px/1.5 Inter,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.mono{font:500 11px/1.3 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
.num{font-family:'JetBrains Mono',monospace;font-variant-numeric:tabular-nums}
.disp{font-family:Archivo,sans-serif;font-stretch:125%;font-weight:900;text-transform:uppercase;line-height:.9;letter-spacing:-.01em}
.wrap{max-width:1320px;margin:0 auto;padding:0 32px}
nav{position:sticky;top:0;z-index:20;background:rgba(11,13,16,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
nav .wrap{display:flex;align-items:center;gap:26px;height:56px}
.logo{display:flex;align-items:center;gap:9px;font:800 15px Archivo;font-stretch:125%;text-transform:uppercase;white-space:nowrap}.logo img{width:26px;border-radius:7px}.logo .r{color:var(--red)}
.links{display:flex;gap:4px;font-size:13px;font-weight:600;color:#c5ccd3;overflow-x:auto;scrollbar-width:none;flex:1}.links::-webkit-scrollbar{display:none}
.links a{padding:7px 11px;border-radius:6px;white-space:nowrap}.links a:hover{color:#fff;background:var(--panel)}.links a.on{color:#fff;background:var(--panel2);box-shadow:inset 0 -2px 0 var(--red)}
#clock{white-space:nowrap}
section{padding:56px 0;border-bottom:1px solid var(--line)}
h1.disp{font-size:clamp(48px,9vw,132px)}h2.disp{font-size:clamp(34px,5vw,64px);margin:6px 0 22px}h3{font:800 18px Archivo;font-stretch:125%;text-transform:uppercase}
.slash{color:var(--red)}.teal{color:var(--teal)}.red{color:var(--red)}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px}
.grid{display:grid;gap:16px}.g3{grid-template-columns:repeat(3,1fr)}.g2{grid-template-columns:1fr 1fr}
.live-grid{display:grid;grid-template-columns:330px 1fr 300px;gap:16px}
.pill{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:99px;padding:4px 10px;font:600 12px Inter}
.dot{width:8px;height:8px;border-radius:50%;background:var(--red);box-shadow:0 0 10px var(--red)}.dot.off{background:#56606a;box-shadow:none}
.toggle{display:inline-flex;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:3px}.toggle button{padding:6px 12px;border-radius:6px;font:600 12px Inter;color:var(--mut)}.toggle button.on{background:var(--panel2);color:#fff}
.tower .row{display:grid;grid-template-columns:26px 4px 46px 1fr 74px 22px;align-items:center;gap:8px;padding:6px 6px;border-radius:6px;font-size:13px;cursor:pointer}
.tower .row:hover,.tower .row.sel{background:var(--panel2)}.tower .bar{height:18px;border-radius:2px}
.tyre{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;border:2.5px solid;font:800 9px Inter}
.hero-lap{display:flex;align-items:flex-end;gap:24px;flex-wrap:wrap}
.scrub{position:relative;height:54px;margin:26px 0 6px}.scrub .trk{position:absolute;left:0;right:0;top:24px;height:6px;background:var(--line);border-radius:3px}
.scrub .fill{position:absolute;left:0;top:24px;height:6px;background:var(--red);border-radius:3px}
.scrub .mk{position:absolute;top:8px;width:2px;height:38px;transform:translateX(-1px)}.scrub .mk.pit{background:var(--teal)}.scrub .mk.sc{background:#ffd400;width:4px}.scrub .mk.ov{background:#fff;opacity:.5;height:14px;top:30px}
.scrub input{position:absolute;inset:0;width:100%;opacity:0;cursor:pointer}
.scrub .knob{position:absolute;top:17px;width:20px;height:20px;border-radius:50%;background:#fff;border:3px solid var(--red);transform:translateX(-10px);pointer-events:none}
.legend{display:flex;gap:16px;flex-wrap:wrap}.legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:-1px}
.big{font:900 64px/0.9 Archivo;font-stretch:125%}
.strip{display:grid;grid-template-columns:repeat(var(--n),1fr);gap:4px}
.rd{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:8px 4px;text-align:center;min-height:86px;display:flex;flex-direction:column;justify-content:space-between}
.rd .w{font:900 13px Archivo;font-stretch:125%;padding:3px 0;border-radius:3px;color:#000}.rd.next{border-color:var(--red)}.rd.fut .w{background:transparent!important;color:var(--mut);border:1px dashed var(--line)}
.chips{display:flex;flex-wrap:wrap;gap:8px}.chip{display:flex;align-items:center;gap:8px;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-weight:700}
.chip b{font:900 18px Archivo;font-stretch:125%}
.podium{display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:16px;align-items:end}
.pcard{border-radius:14px;padding:22px;position:relative;overflow:hidden;border:1px solid var(--line);background:var(--panel)}
.pcard .bign{position:absolute;right:-6px;bottom:-26px;font:900 150px/1 Archivo;font-stretch:125%;opacity:.12}
.table .tr{display:grid;grid-template-columns:40px 1fr 2fr 70px 70px;gap:12px;align-items:center;padding:9px 6px;border-bottom:1px solid var(--line)}
.table .tr:hover{background:var(--panel)}.track{height:8px;background:var(--line);border-radius:4px;overflow:hidden}.track>div{height:100%}
.road{position:relative;border-radius:12px;background:repeating-linear-gradient(90deg,transparent 0 40px,rgba(255,255,255,.03) 40px 41px),var(--panel);border:1px solid var(--line);padding:12px 18px}
.lane{position:relative;height:44px;border-bottom:1px dashed var(--line)}.lane .car{position:absolute;top:8px;transform:translateX(-100%);transition:left .8s}
.lane .lbl{position:absolute;left:0;top:18px;width:14%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;color:var(--mut);font-weight:600}
.dcard{display:block;border-radius:12px;padding:16px;border:1px solid var(--line);background:var(--panel);position:relative;overflow:hidden}.dcard:hover{border-color:#3a444e}
.dcard .n{font:900 56px/1 Archivo;font-stretch:125%;opacity:.9}
.av{display:grid;place-items:center;border-radius:50%;font:900 18px Archivo;font-stretch:125%;color:#000}
.bars{display:flex;align-items:flex-end;gap:5px;height:180px;border-bottom:1px solid var(--line)}.bars div{flex:1;border-radius:3px 3px 0 0;position:relative;min-height:2px}
.bars div span{position:absolute;top:-17px;left:50%;transform:translateX(-50%);font:600 10px 'JetBrains Mono'}
.stat{border-left:2px solid var(--red);padding-left:12px}.stat b{display:block;font:900 34px/1 Archivo;font-stretch:125%}
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--red);color:#fff;border-radius:8px;padding:10px 16px;font-weight:700}.btn.ghost{background:transparent;border:1px solid var(--line)}
select{background:var(--panel2);color:var(--txt);border:1px solid var(--line);border-radius:8px;padding:8px 10px;font:600 13px Inter}
.odds .tr{display:grid;grid-template-columns:150px 1fr 70px;gap:12px;align-items:center;padding:8px 0}
.note{font-size:12px;color:var(--mut);margin-top:10px}
.hub a.panel{display:block}.hub a.panel:hover{border-color:var(--red)}
footer{padding:48px 0 80px;color:var(--mut)}footer .cols{display:grid;grid-template-columns:repeat(5,1fr);gap:24px}footer a{display:block;padding:3px 0;font-size:13px}footer a:hover{color:#fff}
.fb button{border:1px solid var(--line);border-radius:8px;padding:8px 14px;margin-right:6px}.fb button.on{border-color:var(--teal);color:var(--teal)}
.skel{color:var(--mut);padding:40px 0}
.carsvg text{font:600 11px 'JetBrains Mono';fill:#c5ccd3}
@media(max-width:1100px){.live-grid{grid-template-columns:1fr 1fr}.live-grid>.map{grid-column:1/-1;order:-1}}
@media(max-width:760px){.wrap{padding:0 16px}nav .wrap{gap:10px}#clock{display:none}.logo span{display:none}.live-grid,.g3,.g2{grid-template-columns:1fr}
.podium{grid-template-columns:1fr}.podium .p1{order:-1}.table .tr{grid-template-columns:30px 1fr 60px;}.table .tr .hide{display:none}
.strip{grid-template-columns:repeat(6,1fr)}footer .cols{grid-template-columns:1fr 1fr}.big{font-size:44px}section{padding:36px 0}.odds .tr{grid-template-columns:90px 1fr 56px}}
/* portraits + car art */
.av{position:relative;overflow:hidden;flex:none}.av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 12%;transform:scale(1.15) translateY(6%)}
.av.ph .av-fb{visibility:hidden}.av + .av{margin-left:-10px;box-shadow:0 0 0 3px var(--panel)}
.carimg{display:block;height:auto;max-width:100%;filter:drop-shadow(0 6px 10px #0008)}
.pcard{position:relative;overflow:hidden}.pcard .pc-car{position:relative;z-index:1;margin:14px 0 -6px auto;width:min(260px,70%)}
.dcard .dc-car{margin:12px 0 -4px auto;width:min(220px,75%)}.dcard .tc-car{margin:2px 0 10px;width:min(240px,80%)}
/* constructors road: label row on top, car below so nothing overlaps */
.road .lane{height:auto;padding:6px 0 10px;display:grid;grid-template-columns:1fr auto;grid-template-rows:auto 40px;align-items:start}
.road .lane .lbl{position:static;width:auto;font-size:12px;overflow:visible}
.road .lane .num{position:static!important;grid-column:2;grid-row:1}
.road .lane .car{--w:110px;position:relative;grid-column:1/3;grid-row:2;top:auto;width:var(--w);transform:none;left:calc(var(--p) * (100% - var(--w)))}
.road .lane .car .carimg{width:var(--w)}
@media (max-width:600px){.road .lane .car{--w:84px}}
