/* Touch layout is separate so desktop controls retain their full layout. */
#touchControls,#mobileMap,.touchHelp{display:none}
body.touch{overscroll-behavior:none;-webkit-user-select:none;user-select:none}
body.touch button{touch-action:manipulation;min-height:44px}
body.touch #viewport canvas{touch-action:none}
body.touch .touchHelp{display:block}
body.touch #helpOverlay dl{display:none}
body.touch #touchControls{display:block;position:absolute;inset:0;pointer-events:none;z-index:6}
body.touch #touchControls button{pointer-events:auto;touch-action:none;background:#0c2439d9;border:1px solid #91b5c780;border-radius:10px;font-size:11px;font-weight:bold;min-width:55px;min-height:48px;-webkit-touch-callout:none}
body.touch #touchControls button.held{background:#b9d7c6;color:#102b31}
.touchSteer,.touchThrottle,.touchAltitude{position:absolute;display:flex;gap:7px;align-items:center}
.touchSteer{left:max(12px,env(safe-area-inset-left));bottom:177px}
.touchThrottle{right:max(12px,env(safe-area-inset-right));bottom:177px;flex-wrap:wrap;max-width:180px;justify-content:flex-end}
.touchAltitude{right:max(12px,env(safe-area-inset-right));bottom:235px;display:none}
body.touch.flying .touchAltitude{display:flex}
body.touch #mobileMap{display:block;position:absolute;right:max(12px,env(safe-area-inset-right));top:68px;z-index:8;padding:8px 14px;font-size:10px}
body.touch:not(.playing) #touchControls,body.touch:not(.playing) #mobileMap{display:none}
body.touch .mapPanel{display:none}
body.touch .mapPanel.expanded{display:block;top:118px;right:12px;width:min(330px,85vw);z-index:7}
body.touch .mapPanel.expanded canvas{max-height:43vh}
body.touch header{height:60px;padding:8px max(12px,env(safe-area-inset-right)) 8px max(12px,env(safe-area-inset-left))}
body.touch .brand{font-size:11px;letter-spacing:1px;gap:8px}
body.touch .brandmark{font-size:24px}
body.touch .brand small,body.touch .brand b,body.touch #clock,body.touch #sound,body.touch #quality{display:none}
body.touch .header-right{gap:6px}
body.touch .header-right button{font-size:9px;padding:8px}
body.touch #mission{top:68px;left:max(12px,env(safe-area-inset-left));width:calc(100% - 94px);max-width:370px;padding:12px;background:#0c202ccc}
body.touch #mission .eyebrow{font-size:8px}
body.touch #mission .eyebrow span{display:none}
body.touch #mission h2{font-size:18px;margin:8px 0}
body.touch #instruction{font-size:11px;min-height:0;margin:0 0 9px;line-height:1.4}
body.touch .steps{font-size:7px}
body.touch .progress{margin:8px 0}
body.touch #objectiveDetail{font-size:9px}
body.touch #radio{display:none}
body.touch footer{height:150px;padding:8px max(12px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));gap:7px;display:grid;grid-template-rows:75px 44px;align-content:start}
body.touch footer nav{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
body.touch .unit{width:auto;padding:8px;min-width:0}
body.touch .unit small{font-size:7px;letter-spacing:.4px}
body.touch .unit b{font-size:14px;margin:6px 0}
body.touch .unit span{font-size:6px;letter-spacing:0;display:block;line-height:1.4}
body.touch .actions{margin:0;display:grid;grid-template-columns:2fr 1fr;width:100%;gap:7px}
body.touch .actions button{padding:9px;font-size:10px}
body.touch .keyHint{display:none}
body.touch #telemetry{bottom:155px;left:12px;right:12px;justify-content:space-between;gap:8px}
body.touch #telemetry>div:first-child{display:none}
body.touch #telemetry strong{font-size:16px}
body.touch #telemetry small{font-size:7px;margin-bottom:3px}
body.touch #targetMarker small{font-size:8px}
body.touch .overlay{padding:max(12px,env(safe-area-inset-top)) 16px max(12px,env(safe-area-inset-bottom));overflow:auto}
body.touch .modal{width:100%;max-height:100%;padding:22px;overscroll-behavior:contain}
body.touch .modal h2{font-size:26px}
body.touch .primary{min-width:0;width:100%}
body.touch #welcome{background:linear-gradient(90deg,#061724eb,#06172485);align-items:center}
body.touch .briefing{width:min(420px,100%);margin:auto;padding:10px 0;transform:none}
body.touch h1{font-size:42px;letter-spacing:2px;margin:18px 0}
body.touch .briefing .eyebrow{font-size:8px;line-height:1.5}
body.touch .briefing .rule{margin-bottom:18px}
body.touch .briefing h3{font-size:18px;margin:12px 0}
body.touch .briefing p{font-size:12px}
body.touch .briefing ol{margin:16px 0}
body.touch .briefing li{font-size:11px;margin:12px 0}
body.touch .sceneCaption{display:none}
@media(orientation:landscape) and (max-height:600px){
 body.touch header{height:48px}body.touch .header-right button{min-height:38px}
 body.touch #mission{top:55px;width:265px;padding:9px}
 body.touch #mission .eyebrow,body.touch .steps,body.touch #mission .progress{display:none}
 body.touch #mission h2{font-size:16px;margin:0 0 5px}
 body.touch #instruction{font-size:10px;margin-bottom:6px}
 body.touch #mobileMap{top:55px}
 body.touch footer{height:78px;grid-template-columns:1fr 225px;grid-template-rows:62px;padding-top:6px;padding-bottom:6px}
 body.touch footer nav{height:62px}body.touch .unit{padding:5px 8px}body.touch .unit b{margin:4px 0;font-size:13px}
 body.touch .actions{grid-template-columns:1fr 75px}
 body.touch #telemetry{left:40%;right:160px;bottom:85px}
 body.touch .touchSteer,body.touch .touchThrottle{bottom:106px}
 body.touch .touchAltitude{bottom:162px}
 body.touch .mapPanel.expanded{top:55px;right:82px;width:230px}body.touch .mapPanel.expanded canvas{max-height:55vh}
 body.touch #welcome{align-items:flex-start}body.touch .briefing{max-width:650px;display:grid;grid-template-columns:1fr 1fr;column-gap:24px}
 body.touch .briefing>.eyebrow{grid-column:1 / -1}body.touch .briefing h1{grid-column:1;grid-row:2 / 4;font-size:36px;margin:10px 0}
 body.touch .briefing .rule,body.touch .briefing>p{display:none}body.touch .briefing h3{grid-column:2;grid-row:2}
 body.touch .briefing ol{grid-column:2;grid-row:3;margin:0}body.touch .briefing .primary{grid-column:1;grid-row:4;margin-top:8px}
 body.touch .briefNote{grid-column:2;grid-row:4;margin-top:8px;font-size:8px}
}
body.touch .touchSteer,body.touch .touchThrottle{bottom:197px}body.touch .touchAltitude{bottom:310px}@media(orientation:landscape) and (max-height:600px){body.touch .touchSteer,body.touch .touchThrottle{bottom:106px}body.touch .touchAltitude{bottom:225px}}
