#touchcontrols{position:fixed;inset:0;z-index:6;pointer-events:none;user-select:none;-webkit-user-select:none;--pad:184px;--cluster:1.12}
#touchcontrols button,.touch-stick{pointer-events:auto;touch-action:none;-webkit-tap-highlight-color:transparent}
.touch-menu{position:absolute;top:max(8px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);font-size:20px;padding:4px 16px;background:#1117;border:1px solid #fff4;border-radius:12px;min-height:40px;color:#ddd}
.touch-stick{position:absolute;left:max(44px,env(safe-area-inset-left));bottom:max(24px,env(safe-area-inset-bottom));width:var(--pad);height:var(--pad);border:2px solid #fff5;border-radius:50%;background:#0002;box-shadow:inset 0 0 0 22px #0001}
.touch-stick span{position:absolute;left:50%;top:50%;width:35%;height:35%;border-radius:50%;background:#ffffff3d;border:2px solid #fff7;transform:translate(-50%,-50%);pointer-events:none}
.touch-actions{position:absolute;right:max(36px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));width:202px;height:208px;scale:var(--cluster);transform-origin:bottom right}
.touch-actions:before{content:'';position:absolute;left:12px;top:20px;width:144px;height:144px;border:2px solid #ffffff16;border-radius:50%;background:#0001;pointer-events:none}
#touchcontrols [data-action]{position:absolute;width:48px;height:48px;padding:11px;border:0;background:transparent;color:#ddd;border-radius:50%;box-shadow:none}
#touchcontrols [data-action] svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;pointer-events:none;filter:drop-shadow(0 1px 2px #000)}
#touchcontrols [data-action].pressed{background:#ffffff26;color:#fff}
.touch-actions [data-action=jump],.touch-actions [data-action=forward]{left:82px;top:42px}
.touch-actions [data-action=walk],.touch-actions [data-action=backward]{left:30px;top:100px}
.touch-actions [data-action=next]{left:148px;top:18px}
.touch-actions [data-action=turret]{left:154px;top:96px}
.touch-actions [data-action=enter]{left:24px;top:158px}
.touch-actions [data-action=fire]{left:104px;top:162px}
.touch-actions [data-action=ride]{left:-32px;top:145px}
.touch-actions [data-action=previous]{left:100px;top:-14px;width:40px;height:40px}
.touch-actions [data-action=horn]{left:-28px;top:96px}
.touch-actions [data-action=flash]{left:-28px;top:38px}
#touchcontrols[data-mode=driver] .touch-actions [data-action=jump]{left:24px;top:-8px}
#touchcontrols > [data-action=left],#touchcontrols > [data-action=right]{position:fixed;left:max(20px,env(safe-area-inset-left));bottom:max(44px,env(safe-area-inset-bottom));top:auto;width:68px;height:68px;padding:20px;border:1px solid #fff5;background:#0003}
#touchcontrols > [data-action=right]{left:calc(max(20px,env(safe-area-inset-left)) + 84px)}
#touchcontrols > [data-action].pressed{background:#ffffff38}
.touch-playing #sessionbadge{bottom:auto;top:calc(max(8px,env(safe-area-inset-top)) + 42px);font-size:10px;padding:3px 6px;white-space:nowrap}
.touch-playing #starttip{display:none}
@media(max-width:520px){#touchcontrols{--pad:158px;--cluster:.9}.touch-stick{left:max(28px,env(safe-area-inset-left))}}
@media(max-width:360px){#touchcontrols{--pad:136px;--cluster:.82}}
@media(max-height:420px){#touchcontrols{--pad:176px;--cluster:1}}

#touchcontrols[data-mode=passenger] .touch-actions:before{display:none}
@media(max-width:360px){#touchcontrols > [data-action=left],#touchcontrols > [data-action=right]{width:54px;height:54px;padding:15px;left:max(12px,env(safe-area-inset-left))}#touchcontrols > [data-action=right]{left:calc(max(12px,env(safe-area-inset-left)) + 64px)}}
/* Driving prioritizes the three pedals; weapon actions remain compact. */
.touch-label{display:none}
#touchcontrols[data-mode=driver] .touch-actions{width:224px;height:224px}
#touchcontrols[data-mode=driver] .touch-actions:before{display:none}
#touchcontrols[data-mode=driver] .touch-actions [data-action=forward],#touchcontrols[data-mode=driver] .touch-actions [data-action=backward]{top:122px;width:64px;height:88px;padding:13px 17px 30px;border:1px solid #fff7;border-radius:14px;background:#0005}
#touchcontrols[data-mode=driver] .touch-actions [data-action=forward]{left:152px}
#touchcontrols[data-mode=driver] .touch-actions [data-action=backward]{left:76px}
#touchcontrols[data-mode=driver] .touch-actions [data-action=jump]{left:8px;top:142px;width:56px;height:60px;padding:10px 15px 24px;border:1px solid #fff5;background:#0004}
#touchcontrols[data-mode=driver] .touch-label{display:block;position:absolute;left:0;bottom:9px;width:100%;font:bold 9px monospace;text-align:center;color:#eee}
#touchcontrols[data-mode=driver] .touch-actions [data-action=fire]{left:164px;top:64px;width:44px;height:44px;padding:12px;opacity:.75}
#touchcontrols[data-mode=driver] .touch-actions [data-action=next]{left:108px;top:64px;width:44px;height:44px;padding:12px;opacity:.75}
#touchcontrols[data-mode=driver] .touch-actions [data-action=enter]{left:8px;top:68px;width:44px;height:44px;padding:12px;opacity:.75}
#touchcontrols[data-mode=driver] [data-action].pressed{background:#ffffff38;opacity:1}

@media(max-width:360px){#touchcontrols{--pad:136px}#touchcontrols[data-mode=foot] .touch-actions [data-action=enter]{left:30px}}
@media(max-width:320px){#touchcontrols[data-mode=driver] .touch-actions [data-action=jump]{top:-4px}}
#touchcontrols[data-labels=on] .touch-label{display:block;position:absolute;left:0;bottom:-1px;width:100%;font:bold 8px monospace;line-height:10px;text-align:center;color:#f0f0e8;text-shadow:0 1px 2px #000,1px 0 2px #000,-1px 0 2px #000;pointer-events:none;white-space:nowrap}
#touchcontrols[data-labels=on][data-mode=driver] .touch-actions [data-action=forward] .touch-label,#touchcontrols[data-labels=on][data-mode=driver] .touch-actions [data-action=backward] .touch-label,#touchcontrols[data-labels=on][data-mode=driver] .touch-actions [data-action=jump] .touch-label{bottom:9px;font-size:9px}
#touchcontrols[data-labels=on] > [data-action=left] .touch-label,#touchcontrols[data-labels=on] > [data-action=right] .touch-label{bottom:6px}
#touchcontrols[data-labels=off] .touch-label{display:none!important}

#touchcontrols[data-labels=on] .touch-menu{padding-bottom:12px}
#touchcontrols[data-labels=on] .touch-menu .touch-label{bottom:2px}

@media(max-width:360px){.touch-stick{left:max(24px,env(safe-area-inset-left))}#touchcontrols[data-mode=foot] .touch-actions{bottom:max(190px,env(safe-area-inset-bottom))}}

#touchcontrols[data-mode=foot] .touch-actions [data-action=ride]{left:30px;top:100px}
@media(max-width:520px){#touchcontrols[data-mode=driver] .touch-actions [data-action=jump]{top:0}}

/* Walking controls follow the central-fire controller layout. */
#touchcontrols[data-mode=foot] .touch-actions:before{display:none}
#touchcontrols[data-mode=foot] .touch-actions [data-action=fire]{left:64px;top:66px;width:76px;height:76px;padding:18px 17px 23px;border:1px solid #fff7;background:#0004}
#touchcontrols[data-mode=foot] .touch-actions [data-action=fire].pressed{background:#ffffff38}
#touchcontrols[data-mode=foot] .touch-actions [data-action=ride]{left:0;top:82px}
#touchcontrols[data-mode=foot] .touch-actions [data-action=jump]{left:152px;top:82px}
#touchcontrols[data-mode=foot] .touch-actions [data-action=enter]{left:18px;top:158px}
#touchcontrols[data-mode=foot] .touch-actions [data-action=turret]{left:138px;top:158px}
#touchcontrols[data-mode=foot] .touch-actions [data-action=previous]{left:54px;top:8px;width:48px;height:48px}
#touchcontrols[data-mode=foot] .touch-actions [data-action=next]{left:120px;top:8px}
#touchcontrols[data-labels=on][data-mode=foot] .touch-actions [data-action=fire] .touch-label{bottom:9px;font-size:10px}

/* Driver: steering wheel and Brake / Handbrake / Gas pedal row. */
#touchcontrols[data-mode=driver] .touch-actions [data-action=backward]{left:8px;top:122px}
#touchcontrols[data-mode=driver] .touch-actions [data-action=jump]{left:80px;top:122px;width:64px;height:88px;border-radius:14px;padding:13px 17px 30px}
#touchcontrols[data-mode=driver] > [data-action=left],#touchcontrols[data-mode=driver] > [data-action=right]{left:max(44px,env(safe-area-inset-left));width:72px;height:72px;padding:19px;border-radius:18px}
#touchcontrols[data-mode=driver] > [data-action=right]{left:calc(max(44px,env(safe-area-inset-left)) + 88px)}
@media(max-width:520px){#touchcontrols[data-mode=driver] > [data-action=left],#touchcontrols[data-mode=driver] > [data-action=right]{left:max(28px,env(safe-area-inset-left));width:60px;height:68px;padding:16px}#touchcontrols[data-mode=driver] > [data-action=right]{left:calc(max(28px,env(safe-area-inset-left)) + 72px)}}
#matchhud{position:fixed;left:50%;top:100px;transform:translateX(-50%);max-width:90vw;padding:6px 10px;z-index:5;color:#ffdf83;background:#000a;font:bold 12px monospace;text-align:center;pointer-events:none}
#levelchoices input[type=number]{max-width:160px}
#bonusnotice{position:fixed;left:50%;top:140px;transform:translateX(-50%);max-width:88vw;z-index:5;text-align:center;color:#ffdd78;background:#000a;padding:8px 12px;font:bold 15px monospace;text-shadow:1px 1px #000;pointer-events:none}

/* Passenger aiming retains the familiar foot weapon cluster without movement actions. */
#touchcontrols[data-mode=passenger] .touch-actions [data-action=ride]{left:30px;top:100px}
#touchcontrols[data-mode=passenger] .touch-actions:before{display:none}
#touchcontrols[data-mode=passenger] .touch-actions [data-action=fire]{left:64px;top:66px;width:76px;height:76px;padding:18px 17px 23px;border:1px solid #fff7;background:#0004}
#touchcontrols[data-mode=passenger] .touch-actions [data-action=fire].pressed{background:#ffffff38}
#touchcontrols[data-mode=passenger] .touch-actions [data-action=ride]{left:0;top:82px}
#touchcontrols[data-mode=passenger] .touch-actions [data-action=jump]{left:152px;top:82px}
#touchcontrols[data-mode=passenger] .touch-actions [data-action=enter]{left:18px;top:158px}
#touchcontrols[data-mode=passenger] .touch-actions [data-action=turret]{left:138px;top:158px}
#touchcontrols[data-mode=passenger] .touch-actions [data-action=previous]{left:54px;top:8px;width:48px;height:48px}
#touchcontrols[data-mode=passenger] .touch-actions [data-action=next]{left:120px;top:8px}
#touchcontrols[data-labels=on][data-mode=passenger] .touch-actions [data-action=fire] .touch-label{bottom:9px;font-size:10px}
@media(max-width:360px){#touchcontrols[data-mode=passenger] .touch-actions{bottom:max(190px,env(safe-area-inset-bottom))}}
#touchcontrols{z-index:50}#migration-panel{position:fixed;left:8px;top:8px;z-index:60;background:#000b;color:#eee;padding:6px;font:11px monospace;max-width:300px}#migration-panel label,#migration-panel output,#migration-panel p{display:none}#migration-panel:hover label,#migration-panel:hover output,#migration-panel.expanded label,#migration-panel.expanded output,#migration-panel.expanded p{display:block}#migration-panel output{overflow-wrap:anywhere}
.migration-playing{overflow:hidden!important}.migration-playing #topnav{display:none!important}.migration-playing #game{position:fixed!important;inset:0!important}.migration-playing #tools{display:none!important}.migration-playing.migration-options #tools{display:flex!important;z-index:70;bottom:48%;max-width:95vw}.migration-playing #minimap-toggle,.migration-playing #map-open{display:none!important}#migration-panel strong{font-size:9px}
#migration-panel button{display:none}#migration-panel.expanded button{display:block;font:11px monospace}
/* Keep the portrait action cluster clear of the larger walking joypad. */
@media (max-width:520px) and (orientation:portrait){
 #touchcontrols[data-mode=foot] .touch-actions{bottom:max(110px,env(safe-area-inset-bottom))}
}

#touchcontrols[data-mode=driver] .touch-actions [data-action=horn]{left:80px;top:18px;width:48px;height:44px;padding:10px;opacity:.8}

#migration-desktop-options{display:none}.migration-playing #migration-desktop-options{display:block;position:fixed;top:8px;left:50%;transform:translateX(-50%);z-index:55;background:#111b;color:#eee;border:1px solid #777;border-radius:12px;padding:12px;font:11px sans-serif}.migration-playing.touch-playing #migration-desktop-options{display:none}

/* Driving: weapons / handbrake above the Brake / Rev and Gas pedals. */
#mobile-landscape-prompt{position:fixed;z-index:80;top:max(64px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);width:max-content;max-width:85vw;padding:8px 14px;text-align:center;border:1px solid #ffffff66;border-radius:12px;background:#111e;color:#eee;font:12px monospace}
#mobile-landscape-prompt[hidden]{display:none}
#mobile-landscape-prompt p{margin:0 0 7px}
#mobile-landscape-prompt button{padding:10px;border:1px solid #aaa;border-radius:6px;background:#333;color:white;touch-action:manipulation}
#touchcontrols[data-mode=driver] .touch-actions [data-action=backward]{left:76px;top:122px}
#touchcontrols[data-mode=driver] .touch-actions [data-action=jump]{left:152px;top:46px;width:64px;height:64px;padding:10px 17px 24px}
#touchcontrols[data-mode=driver] .touch-actions [data-action=fire]{left:96px;top:58px}
#touchcontrols[data-mode=driver] .touch-actions [data-action=next]{left:40px;top:58px}
#touchcontrols[data-mode=driver] .touch-actions [data-action=enter]{left:8px;top:144px}
#touchcontrols[data-mode=driver] .touch-actions [data-action=horn]{left:80px;top:2px}
#connection-diagnostics{position:fixed;z-index:85;bottom:max(6px,env(safe-area-inset-bottom));left:8px;max-width:min(420px,90vw);background:#111e;color:#eee;border:1px solid #777;border-radius:8px;padding:8px;font:11px monospace}#connection-diagnostics summary{cursor:pointer}#connection-diagnostics pre{max-height:28vh;overflow:auto;white-space:pre-wrap}#connection-diagnostics button{padding:8px;background:#333;color:white;border:1px solid #aaa} .touch-playing #connection-diagnostics:not([open]){bottom:auto;top:8px;left:8px;font-size:9px}