/* Touch layout is selected by device capabilities, not window width. */
.mobile-bar,.rotate-notice,.garage-tabs,.touch-inks{display:none}.studio-sidebar,.stripe-tools{display:contents}.desktop-ui .mobile-drive{display:none}
.layout-choice{display:grid;gap:8px;margin-top:20px;font-size:12px}.layout-choice select{width:100%;min-height:44px;font-size:16px}.mobile-menu-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.mobile-menu-grid button{background:#304c49;color:#f5e1b8;border:1px solid #6a8272;padding:14px 10px;font:700 15px 'Barlow Condensed';min-height:58px}.mobile-menu-grid button[aria-current]{background:#d8ac70;color:#203b38}.mobile-menu-grid small{display:block;font-size:10px;margin-bottom:5px;opacity:.7}.mobile-menu-extras{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.mobile-menu-extras button{background:#2c4542;color:#e7d7b9;min-height:44px;padding:10px;font-size:12px}.menu-wallet{font-size:12px;color:#e4b87f}
.mobile-ui{--bar-height:48px;--safe-left:max(8px,env(safe-area-inset-left));--safe-right:max(8px,env(safe-area-inset-right));--safe-bottom:max(8px,env(safe-area-inset-bottom));height:100dvh;height:var(--game-height,100dvh);overflow:hidden;overscroll-behavior:none;-webkit-text-size-adjust:100%}
.mobile-ui .masthead,.mobile-ui .ticker,.mobile-ui .game-title,.mobile-ui #modes,.mobile-ui main>footer,.mobile-ui .radio-strip{display:none}
.mobile-ui .mobile-bar{height:calc(var(--bar-height) + env(safe-area-inset-top));padding:env(safe-area-inset-top) var(--safe-right) 0 var(--safe-left);display:flex;gap:8px;align-items:center;background:#142e30;border-bottom:1px solid #6b7c67;position:relative;z-index:10}
.mobile-bar button{height:44px;min-width:48px;padding:0 13px;background:#304c49;color:#f1dbb2;font:700 13px 'Barlow Condensed';border:1px solid #576e63;border-radius:5px}.mobile-bar strong{flex:1;font:italic 800 20px 'Barlow Condensed';color:#e8c58e;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-bar #mobile-sound{font-size:11px;background:none;border:0}
.mobile-ui.v2 main{padding:0;height:calc(100% - var(--bar-height) - env(safe-area-inset-top));max-width:none}.mobile-ui #game,.mobile-ui #view{height:100%;min-height:0}.mobile-ui #view{position:relative;overflow:auto;overscroll-behavior:contain;padding:8px var(--safe-right) var(--safe-bottom) var(--safe-left)}
.mobile-ui button,.mobile-ui select,.mobile-ui input:not([type=checkbox]){min-height:44px}.mobile-ui input,.mobile-ui select{font-size:16px}.mobile-ui .swatch{width:44px;height:44px;flex:none}.mobile-ui .swatches{gap:6px;flex-wrap:wrap}.mobile-ui button{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.mobile-ui [data-hold]{touch-action:none}.mobile-ui [data-hold].held{background:#f0c381!important;color:#153737!important;box-shadow:inset 0 0 0 3px #fff1c6;transform:scale(.97)}
.mobile-ui #modal{max-height:calc(var(--game-height,100dvh) - 16px);width:min(680px,calc(100vw - 2 * var(--safe-left) - 2 * var(--safe-right)));max-width:none;margin:auto;padding:24px;overflow:auto;overscroll-behavior:contain}.mobile-ui #close-modal{position:sticky;top:0;float:right;right:0;width:44px;height:44px;min-height:44px;z-index:10;background:#b94c37;color:#fff}.mobile-ui #modal h2{font-size:30px;margin-top:0}.mobile-ui #toast{bottom:var(--safe-bottom);max-width:90vw;pointer-events:none}
.mobile-ui .cover{height:100%;min-height:0;border:0;outline:0;background-position:center}.mobile-ui .cover-copy{padding:20px 28px;width:60%}.mobile-ui .cover h1{font-size:64px;margin:15px 0}.mobile-ui .cover .eyebrow{margin-bottom:8px}.mobile-ui .cover p{font-size:13px;margin:10px 0}.mobile-ui .cover-small,.mobile-ui .cover-caption{display:none}.mobile-ui .cover-stamp{right:30px;top:25px}.mobile-ui .cover-footer{font-size:9px!important;margin-top:10px}
/* Garage: the car stays on screen while the parts/car list scrolls. */
.mobile-ui .studio{display:grid;height:100%;grid-template-columns:minmax(0,1fr) clamp(230px,34vw,340px);gap:0;overflow:hidden}.mobile-ui .studio-hero{height:100%;min-height:0}.mobile-ui .studio-heading{top:14px;left:18px}.mobile-ui .studio-heading h2{font-size:27px}.mobile-ui .studio-heading p{font-size:10px}.mobile-ui .view-hint{top:88px;left:18px;font-size:8px}.mobile-ui .studio-bottom{left:15px;right:15px;bottom:12px;flex-direction:row;align-items:end}.mobile-ui .script-name{font-size:15px;max-width:130px}.mobile-ui .studio-bottom .primary{padding:10px;font-size:10px;min-width:130px}.mobile-ui .studio-bottom .primary span{display:none}.mobile-ui .studio-sidebar{display:flex;flex-direction:column;overflow:hidden;background:#203837;min-height:0;min-width:0}.mobile-ui .garage-tabs{display:flex;flex:none;gap:4px;padding:5px;border-bottom:1px solid #536f61}.garage-tabs button{flex:1;background:#314d49;color:#e3d4b5;font:700 12px 'Barlow Condensed'}.garage-tabs button[aria-pressed=true]{background:#e2b87a;color:#233e36}.mobile-ui .roster{display:grid;grid-template-columns:1fr;grid-column:auto;grid-row:auto;overflow:auto;min-height:0;align-content:start}.mobile-ui .roster-car{min-width:0;padding:12px 15px;border-bottom:1px solid #516858}.mobile-ui .roster-car strong{font-size:20px;margin:4px 0}.mobile-ui .roster-car span,.mobile-ui .roster-car small{font-size:10px}.mobile-ui .studio-build{overflow:auto;padding:14px;min-height:0}.mobile-ui .studio-build h2{font-size:23px;margin:8px 0}.mobile-ui .studio-build h2 br{display:none}.mobile-ui .studio-stats{margin:15px 0;gap:10px}.mobile-ui .setup-row{display:grid;grid-template-columns:1fr}.mobile-ui .setup-row label{width:auto;font-size:10px}.mobile-ui .parts{display:block}.mobile-ui .part-card strong{font-size:14px}.mobile-ui .stripe-callout{font-size:12px;padding:12px 0}.mobile-ui [data-panel=cars] .studio-build,.mobile-ui [data-panel=build] .roster{display:none}
/* Track fills the available landscape viewport; controls sit within safe areas. */
.mobile-ui[data-game-mode=race] #view,.mobile-ui[data-game-mode=drag] #view{padding:0;overflow:hidden}.mobile-ui .race-shell{height:100%;min-height:0;max-height:none;border:0}.mobile-ui .race-top{top:8px;left:var(--safe-left);right:var(--safe-right);gap:6px;align-items:start}.mobile-ui .race-event{padding-top:6px}.mobile-ui .race-event strong{font-size:13px}.mobile-ui .race-event .micro{font-size:9px}.mobile-ui .race-utility{min-height:44px;padding:8px 12px;font-size:11px;background:#173535de;border-radius:5px}.mobile-ui .race-position{left:var(--safe-left);top:64px}.mobile-ui .race-position b{font-size:42px}.mobile-ui .race-position small{font-size:8px;margin-top:3px}.mobile-ui .race-objective{top:65px;max-width:60%;font-size:17px;width:auto}.mobile-ui .race-objective b{font-size:23px;margin:2px}.mobile-ui .race-speed{right:calc(var(--safe-right) + 4px);top:64px;bottom:auto}.mobile-ui .race-speed>strong{font-size:42px}.mobile-ui .race-speed>span{font-size:10px}.mobile-ui .boost-label{margin-top:8px;font-size:9px}.mobile-ui .boost-bar{width:108px;height:5px}.mobile-ui .race-times{left:50%;transform:translateX(-50%);bottom:var(--safe-bottom);font-size:8px;gap:14px;white-space:nowrap;text-align:center}.mobile-ui .race-times b{font-size:20px;margin-top:2px}.mobile-ui #minimap{width:80px;height:66px;right:auto;left:82px;top:65px;opacity:.8}.mobile-ui .mobile-drive{position:absolute;inset:0;display:block;pointer-events:none;z-index:3;padding:0}.mobile-ui .mobile-drive button{position:absolute;pointer-events:auto;width:60px;height:56px;border:1px solid #b0bf9a99;border-radius:12px;background:#183d3ce3;color:#ffedc8;font:700 13px 'Barlow Condensed';box-shadow:0 3px 12px #071d2850}.mobile-ui .mobile-drive [data-hold=arrowleft]{left:var(--safe-left);bottom:var(--safe-bottom);font-size:24px}.mobile-ui .mobile-drive [data-hold=arrowright]{left:calc(var(--safe-left) + 70px);bottom:var(--safe-bottom);font-size:24px}.mobile-ui .mobile-drive [data-hold=arrowup]{right:var(--safe-right);bottom:var(--safe-bottom);background:#376652ee}.mobile-ui .mobile-drive [data-hold=arrowdown]{right:calc(var(--safe-right) + 70px);bottom:var(--safe-bottom)}.mobile-ui .mobile-drive [data-hold=' ']{left:calc(var(--safe-left) + 35px);bottom:calc(var(--safe-bottom) + 64px)}.mobile-ui .mobile-drive [data-hold=shift]{right:calc(var(--safe-right) + 35px);bottom:calc(var(--safe-bottom) + 64px);background:#e3b775;color:#233d35}.mobile-ui .race-controls{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(var(--safe-bottom) + 45px);background:none;z-index:3;padding:0;gap:0}.mobile-ui .race-controls .drive-keys,.mobile-ui .race-controls .mouse-option,.mobile-ui .race-controls .fps,.mobile-ui #leave-race{display:none}.mobile-ui .race-controls label{min-height:44px;display:flex;align-items:center;gap:5px;font-size:11px;background:#193c3bbf;color:#efdfbf;padding:5px 10px;border-radius:5px}.mobile-ui .race-controls input{width:20px;height:20px}.mobile-ui #race-layer{padding:8px var(--safe-right) 8px var(--safe-left);overflow:auto;place-items:start center}.mobile-ui .race-card{margin:auto;width:min(590px,100%);padding:12px 20px;max-width:none}.mobile-ui .race-card h2{font-size:29px;margin:5px 0}.mobile-ui .race-card p{font-size:11px;line-height:1.3;margin:6px 0}.mobile-ui .race-card>.micro{display:none}.mobile-ui .race-card .setting-group{margin:8px 0 5px;gap:6px}.mobile-ui .setting-group button{padding:7px 5px}.mobile-ui .setting-group span{font-size:10px;margin-top:3px}.mobile-ui .course-options{gap:20px}.mobile-ui .course-options button{padding:8px 4px;font-size:12px}.mobile-ui .race-card .primary{margin-top:5px;padding:10px 20px}.mobile-ui .race-card .start-hint{display:none}.mobile-ui .result-grid{grid-template-columns:repeat(4,1fr);margin:12px 0;gap:8px}.mobile-ui .result-grid strong{font-size:21px}.mobile-ui.race-overlay .mobile-drive,.mobile-ui.race-overlay .race-controls{visibility:hidden}
.mobile-ui[data-game-mode=drag] .race-controls{inset:0;transform:none;pointer-events:none;display:block}.mobile-ui[data-game-mode=drag] .race-controls button{position:absolute;pointer-events:auto;bottom:var(--safe-bottom);height:58px;min-width:130px;border-radius:10px;font-size:14px;touch-action:none}.mobile-ui #drag-action{right:var(--safe-right)}.mobile-ui[data-game-mode=drag] [data-hold=w]{left:var(--safe-left)}.mobile-ui .drag-gauges{left:50%;transform:translateX(-50%);bottom:var(--safe-bottom);gap:15px}.mobile-ui .drag-gauges strong{font-size:23px}.mobile-ui .drag-tach{left:50%;transform:translateX(-50%);width:230px;bottom:65px}.mobile-ui .drag-tach>span{font-size:11px}.mobile-ui .drag-tach>div{height:14px}
/* Brush canvas remains available while its jobs and tools scroll separately. */
.mobile-ui[data-game-mode=stripe] .activity-head{display:none}.mobile-ui[data-game-mode=stripe] .activity-layout{height:100%;display:block}.mobile-ui[data-game-mode=stripe] .activity-layout>aside{display:none}.mobile-ui .stripe-workspace{height:100%;display:grid;grid-template-columns:minmax(0,1fr) 240px;gap:10px}.mobile-ui .stripe-workspace>.playfield{display:grid;place-items:center;margin:0;background:#163638;overflow:hidden;min-height:0}.mobile-ui #stripe-canvas{width:auto;height:auto;max-width:100%;max-height:100%;aspect-ratio:5/3;touch-action:none}.mobile-ui .stripe-tools{display:block;overflow:auto;min-height:0;padding-right:3px;overscroll-behavior:contain}.mobile-ui .brush-contract{display:grid;grid-template-columns:1fr auto;padding:10px;margin:0 0 8px;gap:8px}.mobile-ui .brush-contract strong{font-size:18px}.mobile-ui .brush-contract small{font-size:9px}.mobile-ui .brush-contract button{grid-column:1/-1;font-size:13px}.mobile-ui .brush-clock{font-size:24px}.mobile-ui .brush-jobs{gap:4px;margin:6px 0}.mobile-ui .brush-jobs button{padding:8px 4px;font-size:11px}.mobile-ui .brush-jobs small{font-size:9px;letter-spacing:0}.mobile-ui .stripe-toolbar{display:flex;flex-wrap:wrap;gap:7px;margin:8px 0}.mobile-ui .stripe-toolbar select{width:100%;max-width:none}.mobile-ui .stripe-toolbar>label{min-height:30px;display:flex;align-items:center;font-size:12px}.mobile-ui .stripe-toolbar input{width:20px;height:20px}.mobile-ui .stripe-result button{width:100%;font-size:12px;padding:10px}.mobile-ui .stripe-result .sub{font-size:11px}.mobile-ui .brush-live{font-size:10px;letter-spacing:0;gap:6px;line-height:1.4;margin:8px 0}.mobile-ui .touch-inks{display:flex;flex-wrap:wrap;gap:8px;padding:10px 0}.mobile-ui .touch-inks>span{width:100%;font-size:11px}.mobile-ui .brush-meter{margin:8px 0}
/* All dyno controls stay in one scrollable bench, with real-time power pinned. */
.mobile-ui[data-game-mode=swap] .activity-head{display:none}.mobile-ui .dyno-layout{height:100%;display:grid;grid-template-columns:minmax(180px,.7fr) minmax(390px,1.3fr);gap:10px}.mobile-ui .dyno-visual{order:0;overflow:auto;padding:0 10px 10px}.mobile-ui #dyno-3d{height:120px;margin:0 -10px}.mobile-ui .dyno-dials{padding:8px 0;gap:3px}.mobile-ui .dyno-dials strong{font-size:24px}.mobile-ui .dyno-dials small{font-size:8px;letter-spacing:0}.mobile-ui .dyno-chart canvas{height:80px}.mobile-ui .dyno-result{font-size:11px;min-height:0;margin:10px 0}.mobile-ui #tune-button{font-size:12px;padding:10px}.mobile-ui .tuning-bench{grid-template-columns:1fr 1fr;gap:8px;overflow:auto;min-height:0;position:relative}.mobile-ui .bench-live{padding:6px 10px;gap:8px;top:0;grid-column:1/-1}.mobile-ui .bench-live strong{font-size:14px}.mobile-ui .bench-live button{font-size:11px}.mobile-ui .tuning-card{padding:12px;min-width:0}.mobile-ui .tuning-card h3{font-size:23px;margin:5px 0}.mobile-ui .tuning-card p{font-size:11px;line-height:1.35}.mobile-ui .afr-display strong,.mobile-ui .timing-readout strong{font-size:32px}.mobile-ui .afr-display span{margin-left:3px;font-size:9px}.mobile-ui .distributor{width:64px;height:64px;padding:3px}.mobile-ui .distributor-cap i{height:23px;top:2px;transform-origin:50% 23px}.mobile-ui .distributor-row{gap:8px;margin:8px 0;flex-wrap:wrap}.mobile-ui .timing-readout span{font-size:8px}.mobile-ui .mixture-scale,.mobile-ui .tuning-ends{font-size:9px;letter-spacing:0;gap:6px}.mobile-ui .control-label{margin-top:12px;font-size:10px;letter-spacing:0}.mobile-ui .tuning-card input[type=range]{min-height:44px;margin:6px 0;touch-action:pan-y}.mobile-ui input[type=range]::-webkit-slider-thumb{min-width:24px;min-height:24px}.mobile-ui input[type=range]::-moz-range-thumb{width:24px;height:24px}.mobile-ui .dyno-note{font-size:10px;margin-bottom:10px}
.mobile-ui .activity-head{margin:6px 0 12px}.mobile-ui .activity-head h2{font-size:26px}.mobile-ui .activity-layout{grid-template-columns:minmax(0,1fr) 245px;gap:12px}.mobile-ui .activity-layout>.panel{padding:14px}.mobile-ui .show-stage{height:220px}.mobile-ui .legends-hero{grid-template-columns:1fr 1fr;gap:20px}.mobile-ui .archive-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(orientation:landscape) and (max-height:360px){.mobile-ui .cover h1{font-size:48px;margin:10px 0}.mobile-ui .cover p{display:none}.mobile-ui .cover-copy{padding:12px 25px}.mobile-ui .race-top{top:4px}.mobile-ui .race-objective{top:53px;font-size:14px}.mobile-ui #minimap{display:none}.mobile-ui .mobile-drive button{height:48px;width:54px}.mobile-ui .mobile-drive [data-hold=' '],.mobile-ui .mobile-drive [data-hold=shift]{bottom:calc(var(--safe-bottom) + 54px)}.mobile-ui .race-position{top:55px}.mobile-ui .race-speed{top:56px}.mobile-ui .studio-heading h2{font-size:23px}.mobile-ui .script-name{display:none}.mobile-ui .stripe-workspace{grid-template-columns:minmax(0,1fr) 215px}}
@media(prefers-reduced-motion:reduce){.mobile-ui button{transition:none}}
.mobile-ui .roster{grid-auto-rows:minmax(86px,max-content)}.mobile-ui .roster-car{min-height:86px}
.mobile-ui .stripe-workspace>.playfield{container-type:size}.mobile-ui #stripe-canvas{width:min(100cqw,calc(100cqh * 5 / 3));height:auto;max-height:none}
.mobile-ui .brush-contract{position:sticky;top:0;z-index:2}.mobile-ui .tuning-card>p:not(.tuning-status){display:none}.mobile-ui .tuning-card h3{font-size:21px}.mobile-ui .mixture-scale{margin:8px 0 6px}.mobile-ui .control-label{margin-top:8px}.mobile-ui .tuning-status{margin-top:5px;min-height:0}
@media(max-width:700px){.mobile-ui .dyno-layout{display:flex;flex-direction:column;overflow:auto}.mobile-ui .tuning-bench{flex:none;overflow:visible;order:0}.mobile-ui .dyno-visual{order:1;flex:none;overflow:visible}.mobile-ui #dyno-3d,.mobile-ui #tune-button{display:none}.mobile-ui .dyno-dials{padding:12px}.mobile-ui .dyno-chart canvas{height:100px}.mobile-ui .bench-live{position:sticky;top:0}}
.desktop-ui .stripe-workspace{display:grid;grid-template-columns:1fr}.desktop-ui .stripe-workspace>.playfield{order:4}.desktop-ui .stripe-tools>.brush-contract{order:1}.desktop-ui .stripe-tools>.brush-jobs{order:2}.desktop-ui .stripe-tools>.stripe-toolbar{order:3}.desktop-ui .stripe-tools>.brush-meter{order:5}.desktop-ui .stripe-tools>.brush-live{order:6}.desktop-ui .stripe-tools>.stripe-result{order:7}
@media(orientation:landscape) and (max-height:360px){.mobile-ui .tuning-card{padding:8px}.mobile-ui .tuning-card h3{font-size:20px;margin:3px 0}.mobile-ui .afr-display strong{font-size:26px}.mobile-ui .mixture-scale{margin:4px 0}.mobile-ui .mixture-track{height:16px}.mobile-ui .control-label{margin-top:4px}.mobile-ui .tuning-card input[type=range]{margin:0}.mobile-ui .distributor-row{margin:5px 0}}

/* Keep modal actions reachable when browser bars or a short landscape viewport
   reduce the available height. Native dialog retains its focus trap and Escape. */
.mobile-ui dialog#modal[open]{position:fixed;box-sizing:border-box;max-height:calc(var(--game-height,100dvh) - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 16px);overflow-x:hidden;overflow-y:auto;scrollbar-gutter:stable;scroll-padding-block:56px 16px}
.mobile-ui #modal-body{min-width:0;overflow-wrap:anywhere}
.mobile-ui #modal-body .picker-courses{min-width:0}
.mobile-ui #modal-body .picker-courses button{min-height:60px;text-align:left;white-space:normal}
.mobile-ui #modal-body .setting-group{flex-wrap:wrap}
.mobile-ui #modal-body .setting-group button{min-width:0;min-height:48px}
.mobile-ui #modal-body .back-garage{min-height:44px;max-width:100%;white-space:normal}
@media(orientation:landscape) and (max-height:420px){
 .mobile-ui dialog#modal[open]{padding:12px 16px}
 .mobile-ui #modal h2{font-size:26px}
 .mobile-ui #modal-body .racing-picker>p{margin:8px 0;line-height:1.4}
 .mobile-ui #modal-body .picker-courses{gap:6px}
 .mobile-ui #modal-body .picker-courses button{min-height:54px;padding:8px 12px}
}
