/* Keep these overrides separate from the prototype's visual design. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
button{-webkit-appearance:none;appearance:none}
.hero{height:100vh;height:100svh}
#game{height:100vh;height:100svh;min-height:0}
@supports(height:100dvh){#game{height:100dvh}}
.icon-button{-webkit-backdrop-filter:blur(10px)}
.timer,.cargo,.route-panel{-webkit-backdrop-filter:blur(14px)}
.flight-card{-webkit-backdrop-filter:blur(12px)}
.hero-grid{-webkit-mask-image:linear-gradient(90deg,#000,transparent 80%)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .timer,.cargo,.route-panel,.icon-button{background:#193632}
  .flight-card{background:#07101f}
}
#world,.touch-controls{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.game-top{padding-top:max(18px,env(safe-area-inset-top));padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right))}
.curtain{overflow-y:auto;overscroll-behavior:contain;padding-bottom:max(25px,env(safe-area-inset-bottom));background:linear-gradient(90deg,#122e2cf5 0%,#122e2cdd 30%,#122e2c30 72%,#122e2c00)}
#load-error{margin-top:20px;color:#d0dccd;font-size:13px;max-width:100%}
#load-error-message{white-space:pre-wrap;overflow-wrap:anywhere}
@media(max-width:700px){.curtain{background:linear-gradient(90deg,#122e2cf5,#122e2cbb 70%,#122e2c55)}}
@media(any-pointer:coarse){
  .touch-controls{position:absolute;left:max(24px,env(safe-area-inset-left));right:max(24px,env(safe-area-inset-right));bottom:max(24px,env(safe-area-inset-bottom));display:flex;justify-content:space-between;align-items:end;pointer-events:none}
  .touch-controls button{pointer-events:auto;touch-action:none;color:#fff;background:#193632dc;border:1px solid #fff5;width:48px;height:48px;border-radius:12px;font-size:23px;-webkit-user-select:none;user-select:none}
  .touch-controls button:active{background:#bc8551}
  .dpad{display:grid;grid-template-columns:repeat(3,48px);grid-template-rows:repeat(2,48px);gap:5px;pointer-events:auto}
  .dpad button:first-child{grid-column:2}.dpad button:nth-child(2){grid-column:1}
  .touch-controls .sprint{font-size:13px;font-weight:800;width:65px;height:65px;border-radius:50%}
  .controls{display:none}
  .interaction{bottom:calc(145px + env(safe-area-inset-bottom))}
  .route-panel{bottom:calc(165px + env(safe-area-inset-bottom))}
}
@media(any-pointer:coarse) and (max-height:570px){
  .route-panel{display:none}.interaction{bottom:calc(35px + env(safe-area-inset-bottom))}
}
/* Mobile mission HUD: keep the destination visible in either orientation. */
#map-toggle,.sound-symbol{display:none}
@media(any-pointer:coarse){
  .game-brand{font-size:16px;gap:8px}.game-brand>span{width:32px;height:32px;font-size:23px}
  .game-brand small{font-size:8px;letter-spacing:2px;white-space:nowrap}
  .shift-label,.sound-label,.keyboard-only{display:none}
  .sound-symbol{display:inline;font-size:24px}.sound-button{min-width:44px;width:44px;padding:0}
  .sound-button[aria-pressed="false"]{background:#442f2f}
  .dashboard{top:72px;left:18px;right:18px;width:auto;display:flex;gap:0;background:#193632dc;border:1px solid #fff8e82b;border-radius:12px;align-items:center}
  .timer,.cargo{background:none;border:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;padding:8px 12px}
  .timer{flex:1;display:flex;align-items:center;gap:9px}.timer>span{font-size:8px;letter-spacing:1px}
  .timer strong{font-size:30px;margin:0;line-height:1}.time-track{display:none}
  .cargo{display:block}.cargo>span,#cargo-boxes{display:none}.cargo p{margin:0;font-size:11px}.cargo strong{font-size:14px}
  .route-panel{display:block;top:126px;bottom:auto;left:18px;right:18px;width:auto;padding:10px 12px;border-radius:12px}
  .route-heading{font-size:10px;padding-right:86px}.route-heading>span{display:none}
  .next-address{margin-top:4px;gap:2px;padding-right:76px}.next-address>span:first-child{font-size:10px;letter-spacing:1px}
  .next-address strong{font-size:23px}.next-address>span:last-child{display:none}
  .target-status{font-size:12px;line-height:1.3;margin:5px 0 0}
  #map-toggle{display:block;position:absolute;right:8px;top:8px;min-height:44px;width:76px;border:1px solid #fff5;border-radius:8px;background:#fff8e8;color:#193632;font-weight:700;font-size:12px}
  #map-details{display:none}.map-expanded #map-details{display:block}
  .route-panel #map{width:min(100%,280px);margin:8px auto 4px}.route-panel .map-key{display:flex;font-size:11px}
  .dispatch{top:auto;bottom:138px;left:18px;right:18px;max-width:none;transform:none;font-size:12px;border-radius:10px;padding:8px 12px}
  .interaction{bottom:138px;z-index:2;width:max-content;max-width:calc(100% - 36px)}
  .interaction button{min-height:48px;font-size:14px}.interaction>span{font-size:12px}
  body:has(.interaction:not([hidden])) .dispatch{visibility:hidden}
  .touch-controls button:active{background:#bc8551}
}
@media(any-pointer:coarse) and (max-height:650px){
  .game-top{padding-top:8px}.dashboard{top:59px}
  .route-panel{top:111px}.route-panel #map{width:155px}.route-panel .map-key{display:none}
  .route-heading{display:none}.next-address{margin-top:0}
  .dispatch{bottom:132px;font-size:11px;padding:6px 10px}
}
@media(any-pointer:coarse) and (orientation:landscape) and (max-height:570px){
  .game-brand>div{display:none}.game-top{padding:10px 18px}
  .dashboard{top:10px;left:64px;right:auto;width:230px;height:44px}
  .timer>span{display:none}.timer strong{font-size:28px}.cargo{padding-left:0}
  .route-panel{top:62px;left:50%;right:auto;transform:translateX(-50%);width:min(340px,calc(100% - 370px));min-width:230px;padding:8px 10px}
  .next-address strong{font-size:21px}.target-status{font-size:11px}.route-panel #map{width:150px;margin:5px auto 0}
  .dispatch{left:190px;right:110px;bottom:14px;max-height:44px;overflow:auto}
  .interaction{bottom:14px}.interaction>span{display:none}
}
@media(any-pointer:coarse){
  .brief{display:grid}
  .touch-controls button.held{background:#bc8551;border-color:#ffc766}
  .game-top{padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right));padding-top:max(8px,env(safe-area-inset-top))}
  .dashboard,.route-panel{margin-left:env(safe-area-inset-left);margin-right:env(safe-area-inset-right)}
  .interaction{bottom:calc(138px + env(safe-area-inset-bottom))}
  .dispatch{bottom:calc(138px + env(safe-area-inset-bottom))}
}
@media(any-pointer:coarse) and (orientation:landscape) and (max-height:570px){
  .interaction,.dispatch{bottom:max(14px,env(safe-area-inset-bottom))}
  .route-panel{margin-left:0;margin-right:0}
}
@media(any-pointer:coarse){
  .joystick{width:104px;height:104px;flex:none;border:1px solid #fff6;border-radius:50%;background:radial-gradient(circle,#19363266 0 35%,#193632bb 36%);position:relative;pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none}
  .joystick::before,.joystick::after{content:'';position:absolute;background:#fff2;pointer-events:none}
  .joystick::before{left:50%;top:12%;width:1px;height:76%}.joystick::after{top:50%;left:12%;height:1px;width:76%}
  .joystick-knob{position:absolute;left:calc(50% - 21px);top:calc(50% - 21px);width:42px;height:42px;border-radius:50%;background:#fff8e8;border:2px solid #d6bf96;box-shadow:0 3px 10px #102d3680;pointer-events:none;z-index:1}
  .joystick.held{border-color:#ffc766}.joystick.held .joystick-knob{background:#ffc766}
  .joystick:focus-visible{outline:3px solid #ffc766;outline-offset:4px}
}