/* Driving has its own viewport; garage panels never cover the racing line. */
body.race-active{height:100dvh;overflow:hidden}
.race-active header{height:54px;min-height:54px;padding:0 24px;flex-wrap:nowrap;align-items:center}
.race-active main{height:calc(100dvh - 54px);min-height:0;display:block}
.race-active .workspace{height:100%;min-height:0}
.race-active footer,.race-active .car-selector,.race-active #exploded-index,.race-active #system-trajectories,.race-active #assembly-links{display:none!important}
.race-active .brand{font-size:15px}.race-active .brand-sub,.race-active .header-right{display:none}
.race-active .main-nav{order:0;width:auto;height:100%;padding:0;border:0;gap:24px}
#race-hud{background:linear-gradient(#07101966,transparent 24%,transparent 72%,#07101970)}
.race-top{padding:20px 24px;gap:6px;align-items:flex-start}
.race-top>div{background:#0a111bd9;border-top:2px solid #71818e55;padding:10px 14px;min-width:94px;backdrop-filter:blur(5px)}
.race-top>div:first-child{border-top-color:#ed414b;min-width:220px}
.race-top small{font:9px ui-monospace,monospace;letter-spacing:1px;color:#bac5d1}
.race-top strong{font:600 18px ui-monospace,monospace;letter-spacing:-.6px;padding-top:7px}
.race-top>div:first-child strong{font:700 13px Arial,sans-serif;letter-spacing:1.8px}
.race-bottom{bottom:40px;left:24px;right:24px;gap:20px;align-items:flex-end}
.speedometer{position:relative;align-items:center;gap:8px;padding:17px 16px 10px;background:#09121cda;border-bottom:2px solid #ed414b;min-width:185px}
.speedometer strong{font-size:48px;font-weight:700;letter-spacing:-2px;min-width:83px;text-align:right}
.speedometer span{font-size:8px}.speedometer b{font:600 30px ui-monospace,monospace;padding-left:12px;margin-left:3px;min-width:32px}
.rev-strip{position:absolute;top:0;left:0;right:0;height:5px;background:#233240}
.rev-strip i{display:block;height:100%;width:0;background:linear-gradient(90deg,#64deb0,#eaca5f 65%,#ed414b)}
.race-telemetry{display:block;width:190px;background:#09121ccf;padding:8px 12px}
.race-telemetry meter{width:110px;height:8px;accent-color:#64deb0}#race-brake{accent-color:#ed414b}
.race-telemetry label{margin-top:5px}.race-telemetry p{margin:7px 0 0;font-size:7px}
.race-buttons{display:flex;gap:5px;width:auto}.race-buttons button{padding:9px 11px;font-size:10px;background:#09121cd9;min-height:36px}
.race-buttons button:hover{background:#263b4b}
.race-map{position:absolute;left:25px;bottom:160px;width:130px;opacity:.9}.race-map svg{width:100%;height:auto;overflow:visible}.race-map path{fill:none;stroke:#e1e7ed;stroke-width:7;stroke-linejoin:round;filter:drop-shadow(0 2px 2px #000)}.race-map circle{fill:#ed414b;stroke:white;stroke-width:3}.race-map small{display:block;font:7px monospace;letter-spacing:1.5px;color:#d1dae4;margin-top:5px}
@media(max-height:620px){.race-map{display:none}}
.race-help{bottom:9px;font-size:8px;line-height:1.5;letter-spacing:.3px}.race-help span{display:none}
#race-message{top:105px;font-weight:700;font-size:12px;color:#fff3d7}
#race-message:not(:empty){left:50%;width:auto;transform:translateX(-50%);background:#111a24df;border-left:3px solid #ed414b;padding:10px 18px}
@media(max-width:1000px){.best-clock{display:none}.race-top>div:first-child{min-width:180px}.race-top{gap:4px;padding:16px}.race-top>div{padding:8px 10px}.race-bottom{left:16px;right:16px}.race-telemetry{width:170px}.race-telemetry meter{width:90px}.race-buttons button{padding:8px}.race-top strong{font-size:16px}}
@media(max-width:760px){.lap-clock{display:none}.race-top>div:first-child{min-width:0;width:auto}.race-top{flex-wrap:nowrap;gap:3px;padding:10px}.race-top>div{min-width:64px;padding:8px}.race-top small{font-size:7px}.race-top>div:first-child strong{font-size:10px}.race-top strong{font-size:13px}.race-bottom{left:10px;right:10px;bottom:34px;gap:8px;flex-wrap:wrap}.race-telemetry{display:none}.speedometer{min-width:154px;padding:13px 10px 8px}.speedometer strong{font-size:38px;min-width:65px}.race-buttons{margin-left:auto;flex-wrap:wrap;justify-content:flex-end;max-width:230px}.race-buttons button{font-size:9px;min-height:32px}.race-help{font-size:6px}.race-active header{padding:0 14px}.race-active .main-nav{gap:12px}.race-active .main-nav button{font-size:8px}.race-active .brand{font-size:12px}.race-active .mark{font-size:22px}}
@media(max-width:440px){.race-top>div:first-child small{max-width:105px;line-height:1.5}.race-top>div{min-width:54px}.race-top strong{font-size:12px}.race-buttons{max-width:170px}.race-buttons button{padding:7px}.race-active .main-nav{gap:8px}.race-active .main-nav button{font-size:7px}#race-message{top:92px;white-space:nowrap;font-size:10px}}

.race-active.cockpit-active .race-telemetry{display:none}

@media(max-width:760px){.race-active.cockpit-active .race-map{display:none}}

.touch-controls{display:none}
@media(pointer:coarse),(max-width:760px){
 .race-active header{padding-left:max(10px,env(safe-area-inset-left));padding-right:max(10px,env(safe-area-inset-right))}
 .race-active .main-nav button{min-height:44px}
 .race-active .race-top{padding:8px max(10px,env(safe-area-inset-right)) 0 max(10px,env(safe-area-inset-left))}
 .race-active .race-top>div:first-child{display:none}
 .race-active .race-bottom{bottom:calc(112px + env(safe-area-inset-bottom));left:max(10px,env(safe-area-inset-left));right:max(10px,env(safe-area-inset-right));gap:8px}
 .race-active .race-buttons{max-width:none;gap:4px;flex-wrap:nowrap}
 .race-active .race-buttons button{min-height:44px;padding:6px;font-size:9px}
 .race-active .speedometer{min-width:108px;padding:8px;gap:4px}
 .race-active .speedometer strong{font-size:28px;min-width:40px}
 .race-active .speedometer b{font-size:20px;min-width:18px;padding-left:5px}
 .race-active .race-map,.race-active .race-help,.race-active .race-telemetry{display:none}
 .race-active.touch-driving .touch-controls{display:flex;position:absolute;left:max(10px,env(safe-area-inset-left));right:max(10px,env(safe-area-inset-right));bottom:calc(16px + env(safe-area-inset-bottom));justify-content:space-between;gap:10px;pointer-events:none}
 .touch-steering,.touch-pedals{display:flex;gap:6px;align-items:flex-end}
 .touch-controls button{pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;width:54px;height:76px;border:1px solid #93a5b6aa;border-radius:12px;background:#101d2ce8;color:white;font:bold 11px Arial}
 .touch-controls [data-drive="deploy"]{width:46px;height:52px;font-size:9px}
 .touch-controls [data-drive="throttle"]{background:#245d4be8}
 .touch-controls [data-drive="brake"]{background:#812b35e8}
 .touch-controls button.pressed{background:#e4edf4;color:#0c1721;border-color:white}
}
@media(pointer:coarse) and (orientation:landscape){
 .race-active header{height:44px;min-height:44px}
 .race-active main{height:calc(100dvh - 44px)}
 .race-active .race-bottom{bottom:calc(16px + env(safe-area-inset-bottom));left:50%;right:auto;transform:translateX(-50%);flex-direction:column;align-items:center}
 .race-active .race-top{padding-top:5px}
 .race-active .race-top>div{padding:4px 8px}
 .race-active #race-message{top:64px;font-size:9px;padding:4px}
}
