/* Original illustrated DRIFT HUD with live HTML/SVG readouts. */
#app[data-screen="race"]{min-height:0}
#app[data-screen="race"] .topbar{height:13.5vh;padding:0;pointer-events:none;background:none}
#app[data-screen="race"] .top-actions,#app[data-screen="race"] .race-header{display:none}
#app[data-screen="race"] .brand{top:0;left:50%;width:42%;height:14vh;transform:translateX(-50%);background:none;filter:none;clip-path:none}
#app[data-screen="race"] .brand img{visibility:visible;width:91%;height:100%;object-fit:contain}
#race-screen{inset:0;pointer-events:none;--hud-unit:min(1vw,1.7778vh)}
#race-screen button{pointer-events:auto}
#race-screen .leaderboard,#race-screen .mini-map,#race-screen .speedometer,#race-screen .health-panel,#race-screen .power-panel,#race-screen .collection-panel{border:0;border-image:none;padding:0;box-shadow:none;filter:none}
#race-screen .leaderboard{position:absolute;top:5.85%;left:.45%;width:16.87%;height:53.77%;border-radius:0;clip-path:polygon(8% 0,91% 0,100% 6%,100% 94%,91% 100%,7% 100%,0 96%,0 4%)}
.leaderboard>.panel-title{display:none}
#leaderboard{position:absolute;inset:3.9% 5.6% 3.7% 6%;background:linear-gradient(110deg,#020812,#051322);display:flex;flex-direction:column}
#race-screen .standing{height:12.5%;flex:1;gap:3%;padding:0 2%;font-size:calc(var(--hud-unit)*1.4);border-bottom:1px solid #264c70;min-height:0}
#race-screen .standing:last-child{border:0}
#race-screen .standing>strong{width:16%;height:83%;display:grid;place-items:center;border:1px solid #77858d;border-radius:5px;box-shadow:inset 0 0 6px #bdd5eb50,0 0 4px #4a6b9650;background:linear-gradient(#111b28,#03050c);font-size:calc(var(--hud-unit)*2.4);line-height:1;font-weight:700;color:#eef8ff}
#race-screen .standing:nth-child(1)>strong,#race-screen .standing:nth-child(3)>strong{border-color:#efb541;box-shadow:inset 0 0 8px #ffaa3455,0 0 7px #ffaa3444;color:#fff4b9}
#race-screen .standing img{width:44%;height:93%;object-fit:contain;filter:drop-shadow(0 0 3px var(--racer-color))}
#race-screen .standing span{font-size:calc(var(--hud-unit)*1.25);font-weight:700;color:#bac6df;letter-spacing:0}
#race-screen .standing small{display:block;color:#ffd857;font-size:calc(var(--hud-unit)*1.7);width:11%;text-shadow:0 0 7px #ffd15d}
#race-screen .standing.player{background:linear-gradient(90deg,#0773bd99,#00344c66);box-shadow:inset 0 0 6px #3bdaff,inset 0 0 18px #008eff}
#race-screen .standing.player>strong{background:#006baf;border-color:#75e5ff;box-shadow:0 0 8px #41c9ff,inset 0 0 8px #c4faff}
#race-screen .standing.player span{color:#91e9ff}
#race-screen .telemetry{position:static;width:auto}
#race-screen .mini-map{position:absolute;top:5.2%;right:.55%;width:17.46%;height:29.86%;display:block;clip-path:polygon(11% 0,95% 0,100% 6%,100% 94%,93% 100%,8% 100%,0 91%,0 10%)}
#race-screen .mini-map svg{position:absolute;inset:9% 8% 10%;width:84%;height:81%;background:radial-gradient(ellipse at center,#061728,#020a15);border-radius:7%}
#race-screen .mini-map path{stroke:#dbf8ff;stroke-width:3.5;fill:none;filter:drop-shadow(0 0 3px #168dff)}
#race-screen .mini-map small{display:none}
#race-screen .speedometer{position:absolute;top:34.2%;right:.55%;width:17.35%;height:20.08%;margin:0;clip-path:polygon(8% 0,96% 0,100% 10%,100% 87%,89% 100%,0 85%,0 14%)}
#race-screen .speedometer:before{display:none}
#race-screen .speedometer>span{position:absolute;left:43%;top:12%;width:47%;height:44%;display:grid;place-items:center;background:#020c18;font-size:calc(var(--hud-unit)*4.3);line-height:1;font-style:italic;text-shadow:0 0 9px #33c5ff55;color:#c1f5ff}
#race-screen .speedometer>small,#race-screen .speedometer>div{display:none}
#race-screen .race-top-center{position:absolute;top:14%;left:50%;transform:translateX(-50%);width:15%;border:0;padding:0;background:#020a15bb;clip-path:polygon(5% 0,95% 0,100% 50%,95% 100%,5% 100%,0 50%)}
#race-screen .race-top-center .eyebrow{justify-content:center;font-size:calc(var(--hud-unit)*.55);letter-spacing:.15em;padding:6px 0 0;color:#a9daff}
#race-screen .lap-display{font-size:calc(var(--hud-unit)*.8);margin:0;line-height:1.2}
#race-screen .lap-display b{font-size:calc(var(--hud-unit)*1.3)}
#race-screen .race-progress{height:2px;margin:5px 10% 0}
#race-screen .race-bottom{position:static;display:block}
#race-screen .health-panel{position:absolute;left:.48%;top:62.7%;width:21.35%;height:17.22%;min-height:0;clip-path:polygon(5% 0,95% 0,100% 11%,100% 87%,94% 100%,5% 100%,0 88%,0 14%)}
#race-screen .health-panel:before{content:'';position:absolute;left:5%;right:6%;top:10%;height:58%;background:radial-gradient(#0a1524,#020913)}
#race-screen .health-panel>img{position:absolute;left:6%;top:10%;width:85%;height:54%;margin:0;background:none;object-fit:contain;transform:scale(1.5);pointer-events:none}
#race-screen .health-title{position:absolute;left:67%;right:7%;top:65%;height:22%;background:#020a17;display:flex;align-items:center;justify-content:flex-end;gap:0}
#race-screen .health-title>span{display:none}
#race-screen .health-title strong{white-space:nowrap;font-size:calc(var(--hud-unit)*1.7);font-style:italic;line-height:1}
#race-screen .health-title small{font-size:calc(var(--hud-unit)*1.2)}
#race-screen .health-track{position:absolute;left:18.2%;top:70.4%;height:15.5%;width:46.2%;margin:0;background:#030d0b;border-radius:0;overflow:hidden;box-shadow:none;display:flex;align-items:center}
#race-screen .health-track>span{display:block;height:55%;border-radius:5px;box-shadow:inset 0 0 3px #d2ff99,0 0 5px #48ff3655}
#health-state{display:none}
#race-screen .power-panel{position:absolute;left:22.25%;top:65.78%;width:56.52%;height:14.56%;min-height:0;clip-path:polygon(3% 0,97% 0,100% 16%,100% 86%,97% 100%,2% 100%,0 87%,0 20%)}
#race-screen .power-panel .panel-title{display:none}
#race-screen #power-grid{position:absolute;inset:10% 2.6% 8% 2.8%;display:grid;grid-template-columns:repeat(8,1fr);gap:1.7%;background:none}
#race-screen .power-icon{height:100%;min-width:0;opacity:1;background:none;border:0;box-shadow:none;transform:none;filter:none;border-radius:8px}
#race-screen .power-icon>.power-art,#race-screen .power-icon>small{visibility:hidden}
#race-screen .power-icon.active{background:color-mix(in srgb,var(--power) 18%,transparent);box-shadow:inset 0 0 10px var(--power),0 0 24px var(--power);filter:brightness(1.4)}
#race-screen .collection-panel{position:absolute;left:74.76%;top:76.83%;width:24.7%;height:18.92%;min-height:0;text-align:right;clip-path:polygon(9% 0,95% 0,100% 11%,100% 89%,93% 100%,5% 100%,0 89%,0 16%)}
#race-screen .collection-coins{display:none}
#race-screen .collection-panel>small{display:none}
#race-screen .collection-panel strong{position:absolute;left:45%;right:6%;top:15%;height:53%;margin:0;background:#040c17;font-size:calc(var(--hud-unit)*5.8);line-height:1;letter-spacing:-.04em;display:flex;align-items:center;justify-content:center;color:#ffcf48;font-style:italic;text-shadow:2px 2px 1px #a46010,0 0 8px #ffb80044}
#race-screen .collection-panel em{font-size:.75em}
#race-screen #coin-trail{display:none}
.coin-panel{position:absolute;left:.42%;top:80.45%;width:29.18%;height:15.62%;clip-path:polygon(6% 0,95% 0,100% 17%,100% 84%,94% 100%,4% 100%,0 86%,0 16%)}
#race-coin-trail{position:absolute;inset:17% 8% 14% 7%;display:flex;gap:3%;background:#030b17;align-items:center;justify-content:flex-start}
.collected-coin{display:flex;flex-direction:column;width:17.6%;height:100%;align-items:center;justify-content:center}
.collected-coin i{display:block;width:85%;height:69%;border-radius:50%;filter:drop-shadow(0 0 5px #ffb62e44)}
.collected-coin b{color:#fff;font-size:calc(var(--hud-unit)*1.6);line-height:1;font-style:italic}
.coin-tray-empty{position:absolute;top:45%;left:9%;right:9%;text-align:center;color:#729ec6;font-size:calc(var(--hud-unit)*.7);letter-spacing:.15em}
.race-wager-console{position:absolute;left:29.72%;top:80.02%;width:44.68%;height:16.26%;clip-path:polygon(5% 0,96% 0,100% 15%,100% 82%,96% 100%,4% 100%,0 86%,0 18%)}
.committed-wager{position:absolute;inset:17% 51% 20% 4%;background:#030a17;display:flex;align-items:center;justify-content:space-between;gap:3%;border-radius:6px}
.committed-wager>strong{font-size:calc(var(--hud-unit)*2.2);font-weight:700;line-height:1;background:#07101b;flex:1;text-align:center;display:flex;align-items:center;justify-content:center;height:69%;border:1px solid #183145;clip-path:polygon(7% 0,93% 0,100% 17%,100% 83%,93% 100%,7% 100%,0 83%,0 17%)}
.committed-wager>small{position:absolute;top:100%;left:0;right:0;text-align:center;letter-spacing:.2em;color:#49baff;font-size:calc(var(--hud-unit)*.48)}
.wager-dec,.wager-inc{width:20%;height:91%;display:block;opacity:.8;clip-path:polygon(22% 0,78% 0,100% 19%,100% 81%,78% 100%,22% 100%,0 81%,0 19%)}
.race-wager-console>.race-button{position:absolute;left:50%;top:4%;width:45.2%;height:84%;padding:0;min-width:0;font-size:calc(var(--hud-unit)*3.2);line-height:1;letter-spacing:0;background:var(--gold-art) center/100% 140% no-repeat;filter:drop-shadow(0 0 8px #ffbf4c55)}
#race-screen .race-toolbar{position:absolute;left:31%;right:25%;top:96.5%;bottom:auto;height:3%;display:flex;align-items:center;justify-content:center;gap:3%}
#race-screen .race-toolbar .small-button{border:0;background:#03122599;height:100%;font-size:calc(var(--hud-unit)*.55);padding:0 8px;letter-spacing:.1em;white-space:nowrap}
#race-screen .race-toolbar>span{font-size:calc(var(--hud-unit)*.5);letter-spacing:.05em;white-space:nowrap}
#race-screen .race-toolbar b{font-size:inherit;margin-left:5px}
#race-screen #race-announcement{top:33%;left:50%;width:53%;font-size:calc(var(--hud-unit)*2.4);text-shadow:0 2px 7px #000,0 0 20px currentColor}
#race-screen #race-announcement small{font-size:calc(var(--hud-unit)*.8)}
#race-screen #countdown{top:34%;font-size:calc(var(--hud-unit)*8)}

/* One complete purpose-illustrated RGBA dashboard. Live content occupies its
   intentionally blank wells; there are no screenshot crops or cover patches. */
#hud-illustration{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;pointer-events:none;z-index:-1}
#race-screen{isolation:isolate}
#race-screen .leaderboard,#race-screen .mini-map,#race-screen .speedometer,#race-screen .health-panel,#race-screen .power-panel,#race-screen .collection-panel,#race-screen .coin-panel,#race-screen .race-wager-console{background:none;clip-path:none}
#race-screen .leaderboard{left:.5%;top:8.8%;width:20.5%;height:49%}
#leaderboard{inset:6% 9% 7%;background:none}
#race-screen .standing{border-color:#2773ad55}
#race-screen .standing img{width:42%}
#race-screen .standing span{font-size:calc(var(--hud-unit)*1.3)}
#race-screen .mini-map{right:.6%;top:8.8%;width:20.4%;height:31.2%}
#race-screen .mini-map svg{background:none;inset:10%;width:80%;height:80%}
#race-screen .speedometer{right:.6%;top:40.4%;width:20.4%;height:17.4%}
#race-screen .speedometer>span{left:52%;width:39%;top:24%;height:40%;background:none;font-size:calc(var(--hud-unit)*3.65)}
#race-screen .speedometer>small{position:absolute;display:block;left:51%;right:7%;top:63%;text-align:center;letter-spacing:.14em;font-style:italic;font-size:calc(var(--hud-unit)*1.1)}
#race-screen .race-top-center{top:16%;background:linear-gradient(90deg,transparent,#020a16ad,transparent)}
#race-screen .health-panel{left:.5%;top:60.5%;width:21.7%;height:18%}
#race-screen .health-panel:before{display:none}
#race-screen .health-panel>img{left:8%;top:9%;width:84%;height:52%;transform:scale(1.45)}
#race-screen .health-title{left:67%;right:8%;top:73%;height:16%;background:none}
#race-screen .health-title strong{font-size:calc(var(--hud-unit)*1.45)}
#race-screen .health-title small{font-size:calc(var(--hud-unit)*1)}
#race-screen .health-track{left:25%;top:73%;width:38%;height:14%;background:none}
#race-screen .health-track>span{height:50%;box-shadow:inset 0 0 3px #caffc3,0 0 9px #39ff60}
#race-screen .power-panel{left:22.8%;top:60.9%;width:55%;height:18.1%}
#race-screen #power-grid{inset:11% 2.5% 11%;gap:1%;align-items:center}
#race-screen .power-icon{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;height:100%;border-radius:4px}
#race-screen .power-icon>.power-art{visibility:visible;width:100%;height:auto;aspect-ratio:1;max-height:82%}
#race-screen .power-icon>small{visibility:visible;display:block;font-size:calc(var(--hud-unit)*.72);line-height:1;margin-top:-1%;text-shadow:0 0 7px var(--power);color:var(--power)}
#race-screen .power-icon.active{background:none;box-shadow:none;filter:brightness(1.5) drop-shadow(0 0 9px var(--power));transform:translateY(-2%)}
#race-screen .coin-panel{left:.5%;top:79.6%;width:29.9%;height:17.7%}
#race-coin-trail{inset:17% 7% 13%;background:none}
.collected-coin i{background:url('../public/assets/ui-v2/coin.png') center/contain no-repeat;border-radius:0}
#race-screen .race-wager-console{left:30.5%;top:79.6%;width:42.3%;height:17.7%}
.committed-wager{inset:21% 50% 20% 5%;background:none}
.committed-wager>strong{background:linear-gradient(#10253b88,#03091688);font-size:calc(var(--hud-unit)*2)}
.committed-wager>small{font-size:calc(var(--hud-unit)*.52);top:94%}
.wager-dec,.wager-inc{height:74%;display:grid;place-items:center;border:8px solid transparent;border-image:var(--frame) 16% fill stretch;clip-path:none;color:#a9edff;font-size:calc(var(--hud-unit)*2.4);text-shadow:0 0 7px #19afff;line-height:1}
.race-wager-console>.race-button{background:none;filter:none;left:52%;top:17%;width:43%;height:69%;font-size:calc(var(--hud-unit)*2.8);letter-spacing:.02em}
.race-wager-console>.race-button:hover{background:#fff1;transform:none;filter:drop-shadow(0 0 12px #ffdd39)}
#race-screen .collection-panel{left:73.4%;top:74.7%;width:26.1%;height:22.5%}
#race-screen .collection-panel strong{left:49%;right:7%;top:23%;height:47%;background:none;font-size:calc(var(--hud-unit)*4.8)}
#race-screen .collection-panel>small{display:block;position:absolute;left:48%;right:7%;top:73%;text-align:center;font-size:calc(var(--hud-unit)*.7);letter-spacing:.04em;color:#bed0e3;font-style:italic}
#race-screen .race-toolbar{top:97.5%;height:2.3%}
