/* Touch controls sit over the game, including the CRT presentation surface. */
body.touch-device{touch-action:manipulation}
body.touch-device.immersive{touch-action:none;overscroll-behavior:none}
#touch-controls{touch-action:none;display:none;position:absolute;inset:0;z-index:4;pointer-events:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.touch-device.running #touch-controls{display:block}
#touch-controls button,.touch-stick{pointer-events:auto;touch-action:none;-webkit-tap-highlight-color:transparent}
#touch-controls button{padding:0;border:1px solid #f2ffe866;background:#12201155;color:#f3ffe7;text-shadow:0 1px 3px #000;font-size:11px;font-weight:600;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);box-shadow:0 2px 14px #0002}
#touch-controls button.pressed{background:#c5fa61aa;color:#13200a;border-color:#d8ffa0;text-shadow:none}
.touch-stick{position:absolute;left:max(22px,env(safe-area-inset-left));bottom:max(20px,env(safe-area-inset-bottom));width:clamp(112px,33dvh,148px);aspect-ratio:1;border-radius:50%;border:1px solid #f2ffe866;background:radial-gradient(circle,#12201122 25%,#12201144);display:grid;place-items:center}
.touch-stick:before,.touch-stick:after{content:"";position:absolute;background:#eaffda22}
.touch-stick:before{width:1px;height:75%}.touch-stick:after{height:1px;width:75%}
.touch-knob{width:44%;height:44%;border:1px solid #eaffda80;border-radius:50%;background:#d9edca25;box-shadow:0 2px 10px #0002;z-index:1;pointer-events:none}
.touch-stick.pressed .touch-knob{background:#c5fa6155;border-color:#d8ffa0}
.touch-actions{position:absolute;right:max(20px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));width:194px;height:180px}
.touch-actions button{position:absolute;width:54px;height:54px;border-radius:50%}
.touch-actions .gas{width:72px;height:72px;bottom:0;left:62px;background:#abd56b40!important;font-size:12px!important}
.touch-actions .brake{left:0;top:61px}.touch-actions .jump{right:0;top:61px}.touch-actions .turbo{left:70px;top:0}
.touch-actions .pressed.gas{background:#c5fa61aa!important}
.touch-shoulders{position:absolute;display:flex;gap:10px;right:max(25px,env(safe-area-inset-right));bottom:208px}
.touch-shoulders button,.touch-roll button{height:36px;min-width:68px;border-radius:20px}
.touch-roll{position:absolute;display:flex;gap:8px;left:max(20px,env(safe-area-inset-left));bottom:calc(clamp(112px,33dvh,148px) + 34px)}
.touch-roll button{min-width:63px}
.touch-top{position:absolute;left:50%;top:max(10px,env(safe-area-inset-top));transform:translateX(-50%);display:flex;gap:8px;white-space:nowrap}
.touch-top button{height:34px;min-width:44px;border-radius:18px;padding:0 10px!important;font-size:10px!important}
#rotate-hint{display:none}
body.immersive{overflow:hidden}
body.immersive .screen{position:fixed;inset:0;width:100%;height:100dvh;min-height:0;z-index:20;align-items:center;background:#000}
body.immersive .screen #canvas{width:100%;height:100%;max-height:none;object-fit:contain}
body.immersive .screen #loader{padding:20px;padding-top:max(20px,env(safe-area-inset-top))}
.touch-device .screen{touch-action:none}
@media(pointer:coarse){.toolbar button{min-height:44px}.toolbar{gap:8px}.multiplayer input{min-width:0;width:100%}.multiplayer .room-actions{gap:8px}header{height:64px}.intro{padding:22px 0}.tagline{display:none}}
@media(orientation:portrait){.touch-device.running #touch-controls{display:none}.touch-device.running #rotate-hint{display:flex;position:absolute;inset:0;z-index:3;background:#061005bb;color:#f0fbe8;align-items:center;justify-content:center;text-align:center;flex-direction:column;gap:10px;padding:24px;pointer-events:none}.touch-device #rotate-hint strong{font-size:19px}.touch-device #rotate-hint span{font-size:12px;color:#bccab2}}
@media(orientation:landscape) and (max-height:360px){.touch-actions{transform:scale(.85);transform-origin:right bottom}.touch-shoulders{bottom:175px}.touch-shoulders button{height:32px;min-width:61px}.touch-top{gap:5px}.touch-top button{height:30px;min-width:38px;font-size:9px!important}.touch-roll{bottom:146px}.touch-roll button{height:32px;min-width:54px}}

.screen:fullscreen{min-height:0}
