/* One viewport-sized game surface in Safari, Chrome, and installed web apps. */
html.touch-root{height:100%;overflow:hidden;overscroll-behavior:none;background:#142125}
body.mobile-ui{position:fixed;inset:0;width:100%;height:100dvh;height:var(--game-height,100dvh);min-height:0;display:flex;flex-direction:column;margin:0;overflow:hidden}
.mobile-ui .mobile-bar{flex:0 0 auto;width:100%;gap:6px}
.mobile-ui.v2 main{flex:1 1 0;height:auto;min-height:0;width:100%;margin:0;overflow:hidden}
.mobile-ui #game,.mobile-ui #view{width:100%;min-width:0;min-height:0}
.mobile-ui #view{scrollbar-width:thin}
.mobile-ui .race-shell{height:100%;min-height:0;max-height:none}
.mobile-ui .mobile-bar strong{min-width:0;font-size:17px}
.mobile-ui .mobile-bar .official-logo{width:64px}
.mobile-ui .mobile-bar button{padding:0 10px;flex-shrink:0}
.mobile-ui #mobile-fullscreen{font-size:21px;width:44px;min-width:44px}
.mobile-ui #modal{max-height:calc(var(--game-height,100dvh) - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 12px);padding:16px;scroll-padding-top:55px}
.mobile-ui .mobile-menu-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.mobile-ui .mobile-menu-grid button{min-height:54px;font-size:14px}
.mobile-ui .mobile-menu-extras button{font-size:13px}
.mobile-ui .layout-choice{font-size:14px}
.fullscreen-help{font-size:16px;line-height:1.55}
.fullscreen-help ol{padding-left:24px}
.fullscreen-help li{margin:12px 0}
.fullscreen-help .primary{width:100%;margin-top:12px;min-height:44px}
.mobile-ui .cover-copy{max-height:100%;overflow:auto}
.mobile-ui .opening-audio{font-size:12px;letter-spacing:.4px;line-height:1.35}
.mobile-ui .studio{min-width:0;grid-template-columns:minmax(0,1fr) clamp(220px,34vw,340px)}
.mobile-ui .dyno-layout{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:8px}
.mobile-ui .tuning-bench{min-width:0}
.mobile-ui .mechanical-heading{gap:4px;flex-wrap:wrap}
.mobile-ui .mechanical-heading h3{font-size:20px}
.mobile-ui .mechanical-card .tuning-status{font-size:12px}
.mobile-ui .dyno-note{font-size:12px;line-height:1.45}
.mobile-ui .mechanical-buttons button{font-size:13px}
.mobile-ui .turn-hint{font-size:11px;flex-wrap:wrap}
.mobile-ui .bench-live button{font-size:13px;min-height:44px}
.mobile-ui .timing-light-heading button{min-height:44px;font-size:11px}
.mobile-ui .dyno-result{font-size:13px;line-height:1.5}
.mobile-ui .stripe-tools{font-size:14px}
.mobile-ui .stripe-tools .sub,.mobile-ui .brush-live{font-size:12px}
.mobile-ui .stripe-workspace{grid-template-columns:minmax(0,1fr) clamp(195px,30vw,260px)}
.mobile-ui .race-controls label{font-size:12px}
.mobile-ui .race-card p{font-size:13px;line-height:1.4}
.mobile-ui .race-card h2{font-size:30px}
.mobile-ui .race-card .setting-group span{font-size:12px}
.mobile-ui .race-card .setting-group button{min-height:54px}
.mobile-ui .race-event .micro{font-size:10px;letter-spacing:1px}
.mobile-ui .race-utility{font-size:12px}

@media(orientation:landscape){
 .mobile-ui .cover:before{background:linear-gradient(90deg,#081a1af2,#081a1a99 45%,transparent 78%)}
 .mobile-ui .cover-copy{width:65%;padding:12px 24px}
 .mobile-ui .cover h1{font-size:clamp(35px,10dvh,54px);margin:8px 0}
 .mobile-ui .splash-brand .official-logo{width:clamp(85px,27dvh,140px)}
 .mobile-ui .cover-stamp{width:80px;height:80px;right:20px;top:18px}
 .mobile-ui .cover-stamp strong{font-size:21px}
 .mobile-ui .opening-audio{margin-top:7px}
 .mobile-ui .cover-footer{display:none}
 .mobile-ui .bench-live{padding:6px;gap:4px}
 .mobile-ui .bench-live strong{font-size:13px}
 .mobile-ui .tuning-bench{align-content:start}
 .mobile-ui .mechanism-control{height:clamp(70px,23dvh,130px)}
 .mobile-ui .race-times{bottom:var(--safe-bottom);gap:12px}
 .mobile-ui .race-times b{font-size:18px}
 .mobile-ui .race-objective{max-width:45%}
}
@media(orientation:landscape) and (max-width:740px){
 .mobile-ui .dyno-layout{display:flex;overflow:auto}
 .mobile-ui .tuning-bench{overflow:visible}
 .mobile-ui .mechanical-heading .afr-display strong,.mobile-ui .mechanical-heading .timing-readout strong{font-size:23px}
 .mobile-ui .race-times{font-size:8px;gap:6px}
 .mobile-ui .race-times>span:last-child{display:none}
 .mobile-ui .race-controls label{padding:4px 7px;font-size:11px}
}
@media(orientation:portrait){
 .mobile-ui .mobile-bar strong{font-size:15px}
 .mobile-ui .mobile-bar .official-logo{width:54px}
 .mobile-ui #mobile-sound{padding:0 6px;font-size:10px;min-width:42px}
 .mobile-ui .mobile-menu-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .mobile-ui .cover{background-position:62% center}
 .mobile-ui .cover:before{background:linear-gradient(0deg,#102729 0%,#102729dc 30%,#10272933 65%,#10272977)}
 .mobile-ui .cover-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;width:100%;height:100%;padding:24px max(22px,env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(22px,env(safe-area-inset-left))}
 .mobile-ui .splash-brand{margin-bottom:auto}
 .mobile-ui .splash-brand .official-logo{width:170px}
 .mobile-ui .cover h1{font-size:clamp(56px,17vw,85px);margin:18px 0}
 .mobile-ui .cover h1 br{display:block}
 .mobile-ui .cover h1 em{margin-left:0}
 .mobile-ui .cover-stamp{right:18px;top:120px;width:86px;height:86px}
 .mobile-ui .cover .primary{width:100%;font-size:16px;min-height:52px}
 .mobile-ui .opening-audio{margin-top:14px}
 .mobile-ui .cover-footer{display:block;margin-top:12px;font-size:10px!important}
 .mobile-ui .studio{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(200px,44%) minmax(0,1fr)}
 .mobile-ui .studio-hero{height:100%;min-width:0}
 .mobile-ui .studio-heading h2{font-size:28px}
 .mobile-ui .studio-heading{top:12px;left:15px}
 .mobile-ui .studio-bottom{bottom:10px}
 .mobile-ui .studio-bottom .primary{font-size:12px}
 .mobile-ui .view-hint{top:80px;font-size:10px}
 .mobile-ui .roster{grid-template-columns:repeat(2,minmax(0,1fr))}
 .mobile-ui .roster-car{padding:12px;min-height:92px}
 .mobile-ui .roster-car strong{font-size:19px}
 .mobile-ui .garage-tabs button{font-size:14px}
 .mobile-ui .studio-build{padding:16px}
 .mobile-ui .studio-stats span{font-size:11px}
 .mobile-ui .setup-row{grid-template-columns:1fr 1fr}
 .mobile-ui .stripe-workspace{grid-template-columns:minmax(0,1fr);grid-template-rows:clamp(185px,34dvh,310px) minmax(0,1fr);gap:10px}
 .mobile-ui .stripe-workspace>.playfield{width:100%;min-width:0}
 .mobile-ui .stripe-tools{padding:0 2px 12px}
 .mobile-ui .brush-contract{grid-template-columns:1fr auto;position:static}
 .mobile-ui .brush-contract button{grid-column:auto}
 .mobile-ui .brush-jobs button{font-size:13px}
 .mobile-ui .stripe-toolbar select{font-size:16px}
 .mobile-ui .stripe-toolbar>label{font-size:14px;min-height:44px}
 .mobile-ui .stripe-result button{font-size:14px}
 .mobile-ui .dyno-layout{height:auto;min-height:100%;display:flex;flex-direction:column;overflow:visible}
 .mobile-ui .tuning-bench{display:grid;grid-template-columns:minmax(0,1fr);overflow:visible;order:0;gap:10px}
 .mobile-ui .bench-live{grid-column:1;grid-row:1;position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;padding:10px}
 .mobile-ui .bench-live strong{font-size:17px}
 .mobile-ui .timing-light{grid-column:1;grid-row:2;padding:8px 10px}
 .mobile-ui .timing-light svg{height:44px}
 .mobile-ui .mechanical-card{padding:12px}
 .mobile-ui .mechanical-heading{flex-wrap:nowrap}
 .mobile-ui .mechanical-heading h3{font-size:25px}
 .mobile-ui .mechanism-control{height:95px}
 .mobile-ui .mechanical-heading .micro{font-size:11px}
 .mobile-ui .mechanical-heading .afr-display strong,.mobile-ui .mechanical-heading .timing-readout strong{font-size:30px}
 .mobile-ui .mechanical-buttons button{font-size:14px;min-height:48px}
 .mobile-ui .dyno-visual{order:1;overflow:visible;flex:none}
 .mobile-ui #dyno-3d{display:block;height:190px}
 .mobile-ui #tune-button{display:block;width:100%;font-size:14px}
 .mobile-ui .activity-layout{grid-template-columns:minmax(0,1fr)}
 .mobile-ui .activity-layout>aside{display:block}
 .mobile-ui.v2 .show-stage{height:290px}
 .mobile-ui .legends-hero,.mobile-ui .archive-grid{grid-template-columns:minmax(0,1fr)}
 .mobile-ui .legends-hero h2{font-size:34px}
 .mobile-ui .race-top{top:8px;gap:4px}
 .mobile-ui .race-utility{padding:8px;font-size:11px}
 .mobile-ui .race-event strong{font-size:13px}
 .mobile-ui .race-event .micro{font-size:9px;letter-spacing:0}
 .mobile-ui .race-position,.mobile-ui .race-speed{top:65px}
 .mobile-ui .race-position b,.mobile-ui .race-speed>strong{font-size:40px}
 .mobile-ui .race-objective{top:155px;max-width:90%;width:90%;font-size:17px}
 .mobile-ui #minimap{left:50%;transform:translateX(-50%);top:62px;width:85px;height:68px}
 .mobile-ui .race-times{top:auto;bottom:calc(var(--safe-bottom) + 194px);width:100%;justify-content:center;gap:22px;font-size:10px}
 .mobile-ui .race-times b{font-size:19px}
 .mobile-ui .mobile-drive button{width:56px;height:56px}
 .mobile-ui .mobile-drive [data-hold=arrowleft],.mobile-ui .mobile-drive [data-hold=arrowright],.mobile-ui .mobile-drive [data-hold=arrowup],.mobile-ui .mobile-drive [data-hold=arrowdown]{bottom:calc(var(--safe-bottom) + 54px)}
 .mobile-ui .mobile-drive [data-hold=arrowright]{left:calc(var(--safe-left) + 64px)}
 .mobile-ui .mobile-drive [data-hold=arrowdown]{right:calc(var(--safe-right) + 64px)}
 .mobile-ui .mobile-drive [data-hold=' ']{left:calc(var(--safe-left) + 32px);bottom:calc(var(--safe-bottom) + 118px)}
 .mobile-ui .mobile-drive [data-hold=shift]{right:calc(var(--safe-right) + 32px);bottom:calc(var(--safe-bottom) + 118px)}
 .mobile-ui .race-controls{bottom:var(--safe-bottom)}
 .mobile-ui .race-controls label{font-size:14px}
 .mobile-ui .race-card{padding:18px 14px}
 .mobile-ui .race-card h2{font-size:34px}
 .mobile-ui .race-card .primary{width:100%;font-size:15px;min-height:48px;margin-top:12px}
 .mobile-ui .race-card .setting-group span{font-size:12px}
 .mobile-ui[data-game-mode=drag] .race-controls button{min-width:130px;bottom:var(--safe-bottom)}
 .mobile-ui .drag-gauges{bottom:calc(var(--safe-bottom) + 125px);gap:26px}
 .mobile-ui .drag-tach{bottom:calc(var(--safe-bottom) + 70px);width:calc(100% - 40px)}
 .mobile-ui .drag-gauges strong{font-size:28px}
}

.car-rev{position:absolute;z-index:2;right:18px;top:100px;min-height:44px;padding:10px 14px;background:#213b39dd;border:1px solid #b0b891;color:#efd7ab;font:700 13px "Barlow Condensed";border-radius:5px}.mobile-ui .car-rev{right:12px;top:90px;font-size:12px}