/* Landscape thumb controls stay inside the phone's safe area at every height. */
@media(orientation:landscape){
 body.touch-mode{--mobile-left:max(12px,env(safe-area-inset-left));--mobile-right:max(12px,env(safe-area-inset-right));--mobile-bottom:max(12px,env(safe-area-inset-bottom));--mobile-cell:clamp(44px,12dvh,52px);--mobile-fire:clamp(60px,17dvh,72px);--mobile-stick:clamp(86px,25dvh,110px);--mobile-cluster:calc(var(--mobile-cell)*2 + var(--mobile-fire) + 16px)}
 body.touch-mode #touchControls .touch-right{position:absolute;right:var(--mobile-right);bottom:var(--mobile-bottom);display:grid;grid-template-columns:var(--mobile-cell) var(--mobile-cell) var(--mobile-fire);grid-template-rows:repeat(3,var(--mobile-cell));gap:8px;align-items:center;justify-items:center}
 body.touch-mode #touchControls .touch-right>button{position:static;inset:auto;width:var(--mobile-cell);height:var(--mobile-cell);min-width:44px;min-height:44px;margin:0;padding:4px;font-size:8px;line-height:1.2;letter-spacing:.3px;transform:none;touch-action:none}
 body.touch-mode #touchControls #touchDash{grid-column:1;grid-row:1}body.touch-mode #touchControls #touchAim{grid-column:2;grid-row:1}body.touch-mode #touchControls #touchSwap{grid-column:3;grid-row:1}
 body.touch-mode #touchControls #touchJump{grid-column:1;grid-row:2;font-size:10px}body.touch-mode #touchControls #touchSlide{grid-column:1;grid-row:3}body.touch-mode #touchControls #touchReload{grid-column:2;grid-row:3}
 body.touch-mode #touchControls #touchFire{grid-column:3;grid-row:2/4;width:var(--mobile-fire);height:var(--mobile-fire);font-size:10px;border-width:2px}
 body.touch-mode #joystick{left:var(--mobile-left);bottom:var(--mobile-bottom);width:var(--mobile-stick);height:var(--mobile-stick)}body.touch-mode #joystick i{left:calc(50% - 22px);top:calc(50% - 22px)}body.touch-mode #joystick>span{font-size:6px}
 body.touch-mode .hud-bottom{position:absolute;top:auto;left:calc(var(--mobile-left) + var(--mobile-stick) + 12px);right:calc(var(--mobile-right) + var(--mobile-cluster) + 12px);bottom:var(--mobile-bottom);display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:12px;max-width:262px;align-items:end}
 body.touch-mode .hud-bottom .vitals,body.touch-mode .hud-bottom .weapon-hud{position:relative;inset:auto;width:100%;min-width:0;margin:0}
 body.touch-mode .health-label{gap:5px}body.touch-mode .health-label strong{font-size:25px}body.touch-mode .health-label>span{width:22px;height:22px;font-size:15px}body.touch-mode .health-label small{font-size:5px;letter-spacing:.5px}body.touch-mode .health-track{margin:5px 0;height:4px}body.touch-mode #statusText{font-size:5px;letter-spacing:.5px}
 body.touch-mode #shieldPanel{margin-bottom:5px}body.touch-mode .shield-label{height:19px;gap:5px}body.touch-mode .shield-label strong{font-size:17px}body.touch-mode .shield-label>span{font-size:18px}body.touch-mode .shield-label small{font-size:5px;letter-spacing:.5px}body.touch-mode .shield-track{height:4px}
 body.touch-mode #plateButton{position:relative;inset:auto;width:100%;min-height:34px;padding:5px;margin:0 0 6px;gap:5px}body.touch-mode #plateButton>span:nth-child(2){display:flex;align-items:center;gap:5px}body.touch-mode #plateButton .plate-icon{font-size:18px}body.touch-mode #plateButton b{font-size:7px;letter-spacing:.2px}body.touch-mode #plateButton small{font-size:8px}body.touch-mode #plateButton kbd{display:none}
 body.touch-mode .ammo>span{font-size:29px;letter-spacing:-1px}body.touch-mode .ammo>small{font-size:10px}body.touch-mode .weapon-name{gap:4px}body.touch-mode .weapon-name strong{font-size:8px;letter-spacing:.2px;white-space:normal}body.touch-mode .weapon-name>span{display:none}body.touch-mode #reloadIndicator{top:auto;bottom:calc(100% + 5px);right:0;min-width:92px;padding:5px;font-size:6px}
 body.touch-mode .hud-top{inset:max(8px,env(safe-area-inset-top)) var(--mobile-right) auto var(--mobile-left)}body.touch-mode .radar-wrap{width:82px}body.touch-mode #radar{width:82px;height:66px}body.touch-mode .radar-label{font-size:5px;padding:5px;letter-spacing:.5px}body.touch-mode #compass{font-size:8px;min-width:135px;padding-bottom:5px}body.touch-mode #zone{display:none}body.touch-mode .scorebox{padding:4px 6px;gap:6px}body.touch-mode .scorebox strong{font-size:20px}body.touch-mode .scorebox button{min-height:40px;min-width:40px;padding:8px}
 body.touch-mode #brHud{top:max(8px,env(safe-area-inset-top));left:calc(var(--mobile-left) + 92px);width:142px;padding:7px;gap:4px 7px;grid-template-columns:35px 1fr}body.touch-mode .br-alive strong{font-size:22px}body.touch-mode .br-storm b{font-size:18px;margin-top:2px}body.touch-mode .br-storm small{font-size:5px}body.touch-mode #brStormHint{display:none}
 body.touch-mode .zombie-hud{top:max(8px,env(safe-area-inset-top));left:calc(var(--mobile-left) + 92px);width:142px;padding:7px}body.touch-mode #killfeed{right:var(--mobile-right);top:64px;max-height:42px;overflow:hidden}
 body.touch-mode #brInteract,body.touch-mode #wallBuy{top:calc(50% - 72px);bottom:auto;left:50%;transform:translateX(-50%);width:clamp(190px,35vw,310px);min-height:44px;padding:7px 10px}body.touch-mode #brInteract strong,body.touch-mode #wallBuy strong{font-size:9px}body.touch-mode #brInteract small{font-size:6px}
 body.touch-mode #brDrop .drop-readout{right:var(--mobile-right);top:78px;min-width:0;display:flex;align-items:flex-start;gap:14px}body.touch-mode #brDrop .drop-meter{display:none}body.touch-mode #brDrop .drop-readout strong{font-size:12px}body.touch-mode #brDrop .drop-header{top:24%;left:50%}body.touch-mode #brDrop .drop-header strong{font-size:15px}body.touch-mode #brDrop .drop-header small{display:none}body.touch-mode #brDrop .drop-prompt{bottom:auto;top:calc(50% + 29px);padding:6px 9px;max-width:190px}body.touch-mode #brDrop .drop-prompt small{display:none}
 body.touch-mode .modal-card{max-height:calc(100dvh - 24px);padding:16px}body.touch-mode .overlay{padding:max(10px,env(safe-area-inset-top)) var(--mobile-right) max(10px,env(safe-area-inset-bottom)) var(--mobile-left)}body.touch-mode .pause-card{max-height:calc(100dvh - 24px);overflow-y:auto;overscroll-behavior:contain;padding:6px}body.touch-mode .pause-card h2{font-size:30px;margin:12px 0}body.touch-mode .pause-card .primary{padding:12px;margin-top:12px}
}

@media(orientation:landscape) and (max-width:700px){body.touch-mode .compass-wrap{display:none}}
