/* The race view keeps the road open: mirror above, three charging symbols on the car. */
#app[data-screen="race"] .brand{display:none}
#rearview-hud{position:absolute;top:1.5%;left:50%;width:42%;max-width:740px;transform:translateX(-50%);pointer-events:none;z-index:2}
.rearview-shell{position:relative;width:100%;aspect-ratio:5.4;isolation:isolate}
.rearview-frame{position:absolute;left:0;top:-44%;width:100%;height:200%;object-fit:fill;pointer-events:none}
#rearview-viewport{position:absolute;left:2%;right:2%;top:10%;bottom:13%;border-radius:12% / 42%;background:transparent}
#health-pods{--health-color:#4dff85;display:flex;gap:7px;justify-content:center;align-items:center;width:max-content;max-width:100%;height:28px;margin:1px auto 0;padding:5px 15px;border-radius:8px 8px 17px 17px;border:1px solid #5b789c;background:linear-gradient(#172230,#050a10 65%);box-shadow:0 2px 5px #000b,inset 0 1px 1px #aac5d64d}
#health-pods[data-tone="orange"]{--health-color:#ffac36}
#health-pods[data-tone="red"]{--health-color:#ff3b50}
#health-pods>i{position:relative;display:block;width:11px;height:18px;overflow:hidden;border-radius:4px;border:1px solid #49647266;background:#0b141b;box-shadow:inset 0 1px 3px #000}
#health-pods>i:after{content:'';position:absolute;inset:0;background:linear-gradient(#e4ffeab5,transparent 38%),var(--health-color);transform:scaleY(var(--fill,1));transform-origin:bottom;border-radius:3px;box-shadow:inset 0 0 4px #fff9}
#health-pods>i.lit{border-color:color-mix(in srgb,var(--health-color) 70%,white);box-shadow:0 0 8px color-mix(in srgb,var(--health-color) 60%,transparent)}
#health-pods.repairing{animation:health-repair .8s ease-out}
@keyframes health-repair{0%{filter:brightness(3);box-shadow:0 0 24px #ffe67c}100%{filter:brightness(1);box-shadow:0 2px 5px #000b}}
.accessible-inventory{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
#race-screen .race-top-center{top:calc(1.5% + min(7.78vw,137px) + 34px);background:#020a1580;width:13%;min-width:115px}
#race-screen .race-top-center .eyebrow{display:none}
#race-screen .lap-display{line-height:1.5}
#race-screen #pickup-notice{top:72%;max-width:80%;white-space:normal;text-align:center;font-size:clamp(10px,.9vw,16px)}
#app[data-screen="race"] #pause-overlay{top:0}
@media(prefers-reduced-motion:reduce){#health-pods.repairing{animation:none}}
#app[data-reduced-motion="true"] #health-pods.repairing{animation:none}
@media(max-width:900px) and (orientation:portrait){
 #rearview-hud{top:10px;width:67%;max-width:540px}
 #health-pods{height:24px;padding:4px 12px;gap:5px;margin-top:0}
 #health-pods>i{height:15px;width:9px}
 #race-screen .race-top-center{top:calc(10px + 12.4vw + 31px);width:23%;min-width:90px;left:50%}
 #race-screen .collection-panel{top:auto;bottom:139px;left:auto;right:8px;width:31%;height:76px}
 #race-screen .collection-panel strong{font-size:36px}
 #race-screen .collection-panel>small{font-size:7px}
 #race-screen #pickup-notice{top:auto;bottom:227px;font-size:11px}
}
@media(max-width:600px) and (orientation:portrait){
 #rearview-hud{top:7px;width:88%;max-width:none}
 #health-pods{height:22px;padding:3px 12px;gap:5px;margin-top:0}
 #health-pods>i{height:14px;width:8px;border-radius:3px}
 #race-screen .race-top-center{top:calc(7px + 16.3vw + 26px);width:28%;min-width:0;left:51.5%}
 #race-screen .collection-panel{bottom:96px;right:5px;width:37%;height:62px}
 #race-screen .collection-panel strong{font-size:30px}
 #race-screen .collection-panel>small{font-size:5px}
 #race-screen .coin-panel{top:auto;bottom:96px;left:5px;right:auto;width:60%;height:62px}
 #race-screen .race-wager-console{bottom:25px;height:65px}
 #race-screen .collected-coin i{width:29px;height:28px}
 #race-screen .collected-coin b{font-size:10px}
 #race-screen .coin-tray-empty{font-size:6px}
 #race-screen #pickup-notice{top:auto;bottom:165px;font-size:9px}
}
@media(max-height:500px) and (orientation:landscape){
 #rearview-hud{top:1%;width:38%;max-width:440px}
 #health-pods{height:18px;padding:2px 10px;gap:4px;margin-top:0}
 #health-pods>i{height:11px;width:7px;border-radius:2px}
 #race-screen .race-top-center{top:calc(1% + min(7.04vw,81.5px) + 23px);width:12%;min-width:85px}
 #race-screen .lap-display{font-size:7px}
 #race-screen .lap-display b{font-size:13px}
}
