/* Web beta. Touch prompts contain actions rather than key names. */
* { touch-action:none; }
#interface { --safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);inset:var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left); }
.menu-panel,.menu-panel *,.fleet-list,.fleet-list * { touch-action:pan-y; }
.menu-panel input { touch-action:none; }
button:disabled { cursor:default;transform:none;opacity:.55; }
.launch-art { position:absolute;inset:0;width:100%;height:100%;object-fit:cover;image-rendering:pixelated; }
body[data-screen='title'] #world { visibility:hidden; }
.wordmark { top:19%; }
.wordmark p { font-size:clamp(8px,.85vw,11px); }
.beta-tag { color:var(--cream);padding:6px 8px;border:1px solid var(--cream);background:var(--bg);font-size:clamp(6px,.6vw,8px); }
.coin-wallet { display:flex;align-items:center;gap:9px;color:var(--money);font-size:clamp(9px,1vw,13px);white-space:nowrap; }
.coin-wallet small { color:var(--dim);font-size:clamp(6px,.6vw,8px); }
.coin-icon { display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border:2px solid var(--money);font-size:clamp(7px,.65vw,9px); }
.coin-icon::after { content:'C'; }
.title-wallet { position:absolute;top:40px;right:38px;padding:10px 12px;background:var(--bg);border:1px solid #38445c; }
.departure-panel { width:min(520px,46vw);bottom:36px; }
.plane-choice { display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #38445c;margin-bottom:16px;padding-bottom:16px;gap:12px; }
.plane-choice strong { display:block;font-size:clamp(11px,1.1vw,15px);font-weight:400;margin:9px 0; }
.plane-choice small { display:block;font-size:clamp(6px,.6vw,8px);color:var(--dim); }
.plane-choice button { padding:11px 10px;font-size:clamp(7px,.7vw,9px);letter-spacing:0; }
.mode-row { gap:7px; }
.mode-row button { font-size:clamp(6px,.7vw,9px); }
.launch-options { display:flex;gap:18px;justify-content:space-between;padding-bottom:16px; }
.launch-options .text-button { min-height:30px; }
.hangar-screen { background:transparent; }
.hangar-header { position:absolute;left:20px;right:20px;top:20px;display:flex;justify-content:space-between;align-items:center;gap:18px; }
.hangar-header h1 { font-size:clamp(16px,2vw,26px);font-weight:400;text-shadow:3px 3px 0 var(--bg); }
.hangar-header .coin-wallet { background:var(--bg);padding:12px; }
.hangar-detail { position:absolute;left:24px;bottom:28px;width:42%;max-width:530px;padding:20px;background:var(--bg);border:2px solid #38445c;box-shadow:var(--drop); }
.hangar-detail h2 { font-size:clamp(18px,2.2vw,30px);font-weight:400;margin:12px 0; }
.hangar-detail>p { font-size:clamp(7px,.8vw,11px);line-height:1.8; }
.hangar-specs { display:flex;margin:20px 0;border:1px solid #38445c; }
.hangar-specs>div { flex:1;padding:12px 9px; }
.hangar-specs>div+div { border-left:1px solid #38445c; }
.hangar-specs span { display:block;color:var(--dim);font-size:clamp(6px,.6vw,8px); }
.hangar-specs strong { display:block;font-size:clamp(9px,.9vw,12px);font-weight:400;margin-top:12px; }
.hangar-detail .fbs-btn { width:100%;font-size:clamp(8px,.85vw,11px); }
#hangar-note { color:var(--dim);margin-top:14px; }
.fleet-list { position:absolute;right:20px;top:96px;bottom:24px;width:44%;display:grid;grid-template-columns:1fr 1fr;align-content:start;gap:12px;overflow-y:auto;scrollbar-width:none;padding:2px 2px 6px; }
.fleet-card { position:relative;min-height:138px;text-align:left;background:var(--bg);border:2px solid #38445c;color:var(--cream);padding:15px 12px;letter-spacing:0;box-shadow:var(--drop); }
.fleet-card.selected { border-color:var(--accent); }
.fleet-role { display:block;font-size:clamp(5px,.55vw,8px);color:var(--dim); }
.fleet-card strong { display:block;font-size:clamp(9px,.95vw,13px);font-weight:400;margin:12px 0; }
.fleet-status { position:absolute;left:12px;bottom:15px;font-size:clamp(6px,.65vw,9px);color:var(--accent); }
.fleet-silhouette { position:absolute;right:18px;bottom:15px;width:40px;height:30px;background:#8a8f9a;clip-path:polygon(47% 0,53% 0,58% 36%,100% 53%,100% 64%,58% 55%,57% 85%,76% 95%,76% 100%,24% 100%,24% 95%,43% 85%,42% 55%,0 64%,0 53%,42% 36%); }
.fleet-silhouette.twin,.fleet-silhouette.cargo { width:48px;background:#d2c6a7; }
.fleet-silhouette.airliner,.fleet-silhouette.widebody,.fleet-silhouette.business { height:46px; }
.fleet-silhouette.float { background:#2f7c78; }
.flight-strip { bottom:95px;padding:10px 12px;max-width:calc(100vw - 370px); }
.flight-strip strong { font-size:clamp(7px,.75vw,10px);margin-top:6px; }
.power-row { padding-top:8px;margin-top:8px;gap:12px; }
.flight-actions { position:absolute;right:18px;bottom:295px;display:flex;gap:8px;pointer-events:auto; }
.flight-actions button { font-size:clamp(7px,.7vw,9px);padding:10px;letter-spacing:0; }
.flight-actions button:disabled { background:var(--panel);border-color:#38445c;color:var(--dim);opacity:1; }
.flight-wallet { position:absolute;top:95px;left:18px;background:var(--bg);border:1px solid #38445c;padding:8px 10px; }
.throttle-control { top:140px; }
#map-toggle { display:none;position:absolute;right:14px;top:77px;pointer-events:auto;min-height:44px;padding:10px 12px;font-size:clamp(7px,.7vw,9px); }
body.touch #map-toggle { display:block; }
body.touch .map-panel { display:none; }
body.touch.map-open .map-panel { display:block; }
body.touch .map-title .text-button { min-height:44px; }
body.touch .throttle-control .text-button { min-height:44px; }
body.touch #flight-message { font-size:clamp(7px,.8vw,10px); }
body.touch .flight-wallet { top:80px; }
body.touch .flight-strip { bottom:155px; }
body:has(#instrument-panel:not([hidden])) .flight-strip { bottom:180px; }
body.control-drag #stick { display:none; }
.skydiving .throttle-control,.skydiving #touch-brake { display:none; }
.skydiving .flight-actions { bottom:40px; }
.skydiving .vs-cell { display:none; }
body.skydiving .flight-strip { top:128px;bottom:auto; }
.airliner #cockpit-frame i { width:18px; }
.menu-panel { position:relative;padding-top:30px; }
.menu-close { position:sticky;top:-15px;float:right;z-index:2;background:var(--bg);padding:8px 10px;min-height:44px; }
.menu-actions { position:sticky;bottom:-28px;background:var(--bg);border-top:1px solid #38445c;padding:14px 0;margin-top:14px; }
#flight-earned { margin:16px 0; }
#save-note { font-family:var(--font-pixel-body);font-size:clamp(16px,1.6vw,20px);color:var(--danger);line-height:1.3; }
#zoom-hatch { position:fixed;left:0;top:0;transform-origin:0 0;z-index:1000;pointer-events:auto; }
#performance { position:absolute;left:14px;bottom:6px;font-family:var(--font-pixel-body);font-size:clamp(13px,1.1vw,16px);color:var(--cream);background:var(--bg);padding:3px 6px; }
@media (max-height:500px) and (min-width:600px) {
  .studio { top:12px; }
  .title-wallet { top:14px;right:18px;padding:6px 8px; }
  .wordmark { top:29%; }
  .wordmark strong { font-size:clamp(36px,5.5vw,54px); }
  .departure-panel { width:46vw;bottom:18px;padding:12px 14px; }
  .plane-choice { padding-bottom:9px;margin-bottom:10px; }
  .plane-choice strong { font-size:clamp(9px,1vw,12px);margin:6px 0; }
  .plane-choice small { display:none; }
  .plane-choice button { padding:8px; }
  .departure-panel .mode-row { margin:9px 0; }
  .departure-panel>p { margin:8px 0;font-size:clamp(7px,.75vw,9px); }
  .launch-options { padding-bottom:8px; }
  .departure-actions button { min-height:44px; }
  .hangar-header { top:12px;left:14px;right:14px; }
  .hangar-header h1 { font-size:clamp(12px,1.6vw,18px); }
  .hangar-detail { left:14px;bottom:14px;padding:12px;width:43%; }
  .hangar-detail h2 { font-size:clamp(14px,2vw,20px);margin:9px 0; }
  .hangar-detail>p { font-size:clamp(6px,.7vw,8px); }
  .hangar-specs { margin:12px 0; }
  .hangar-specs>div { padding:8px; }
  .hangar-specs strong { margin-top:8px; }
  #hangar-note { margin-top:8px; }
  .fleet-list { top:75px;bottom:14px;right:14px;gap:8px; }
  .fleet-card { min-height:108px;padding:10px; }
  .fleet-card strong { margin:10px 0;font-size:clamp(8px,.95vw,11px); }
  .fleet-status { left:10px;bottom:12px; }
  .fleet-silhouette { width:30px;height:25px;right:12px;bottom:12px; }
  .fleet-silhouette.airliner,.fleet-silhouette.widebody,.fleet-silhouette.business { height:33px; }
  .flight-wallet,body.touch .flight-wallet { top:74px;left:14px;padding:6px 8px; }
  .flight-strip,body.touch .flight-strip,body:has(#instrument-panel:not([hidden])) .flight-strip { bottom:142px;left:14px;max-width:45vw; }
  body.skydiving .flight-strip { top:128px;bottom:auto; }
  .throttle-control { right:18px;top:auto;bottom:16px;width:44px; }
  #throttle { height:100px; }
  .flight-actions { right:76px;top:77px;bottom:auto;flex-direction:row;align-items:stretch; }
  .flight-actions button { min-height:44px; }
  .map-panel { top:125px;right:76px;width:166px; }
  .skydiving .flight-actions { top:auto;bottom:25px;right:18px; }
  .menu-actions { bottom:-18px; }
  .menu-close { top:-12px; }
}
@media (max-width:599px) {
  .launch-art { object-position:64% center; }
  .studio { top:18px;left:15px;gap:8px; }
  .studio span { font-size:clamp(7px,1.8vw,9px); }
  .studio .beta-tag { font-size:clamp(5px,1.4vw,7px); }
  .title-wallet { top:72px;left:18px;right:auto;padding:8px; }
  .wordmark { top:19%;left:18px; }
  .wordmark p { font-size:clamp(7px,1.9vw,9px); }
  .departure-panel { width:auto;left:12px;right:12px;bottom:42px;padding:14px; }
  .plane-choice { padding-bottom:12px;margin-bottom:12px; }
  .plane-choice strong { font-size:clamp(10px,2.6vw,14px); }
  .plane-choice button { font-size:clamp(7px,1.8vw,9px); }
  .mode-row button { font-size:clamp(6px,1.65vw,8px); }
  .launch-options .text-button { font-size:clamp(6px,1.7vw,8px);min-height:40px; }
  .departure-panel>p { font-size:clamp(7px,1.8vw,9px);margin:12px 0; }
  .hangar-header { left:12px;right:12px;top:12px;gap:8px; }
  .hangar-header h1 { font-size:clamp(12px,3.3vw,17px); }
  .hangar-header .fbs-btn { padding:10px 8px;font-size:clamp(7px,1.8vw,9px); }
  .hangar-detail { top:36%;bottom:auto;left:12px;right:12px;width:auto;padding:12px; }
  .hangar-detail h2 { font-size:clamp(15px,4vw,22px);margin:8px 0; }
  .hangar-detail>p { font-size:clamp(7px,1.8vw,9px); }
  .hangar-specs { margin:10px 0; }
  .hangar-specs>div { padding:8px; }
  .hangar-specs strong { margin-top:8px;font-size:clamp(8px,2.1vw,10px); }
  .hangar-detail .fbs-btn { font-size:clamp(8px,2vw,10px); }
  #hangar-note { margin-top:8px;font-size:clamp(6px,1.65vw,8px); }
  .fleet-list { left:12px;right:12px;top:calc(36% + 242px);bottom:12px;width:auto;gap:8px; }
  .fleet-card { min-height:110px;padding:10px; }
  .fleet-card strong { font-size:clamp(9px,2.3vw,12px); }
  .fleet-role { font-size:clamp(5px,1.4vw,7px); }
  .fleet-status { font-size:clamp(6px,1.6vw,8px); }
  .fleet-silhouette { width:30px;right:10px; }
  .telemetry .vs-cell { display:none; }
  .flight-wallet,body.touch .flight-wallet { top:74px;left:12px; }
  #map-toggle { top:74px;right:12px; }
  .map-panel { top:125px;right:12px; }
  .throttle-control { left:auto;right:14px;top:auto;bottom:132px; }
  body:has(#instrument-panel:not([hidden])) .throttle-control { bottom:138px; }
  .flight-strip,body.touch .flight-strip,body:has(#instrument-panel:not([hidden])) .flight-strip { left:12px;right:auto;bottom:275px;max-width:calc(100% - 95px);padding:8px 10px; }
  .flight-strip strong { font-size:clamp(7px,1.8vw,9px); }
  .flight-strip .power-row { gap:8px;font-size:clamp(5px,1.3vw,7px); }
  .flight-actions { bottom:94px;right:14px;flex-direction:row;gap:7px; }
  .flight-actions button { min-height:44px;font-size:clamp(6px,1.6vw,8px);padding:9px 8px; }
  body:has(#instrument-panel:not([hidden])) .flight-actions { bottom:105px; }
  #instrument-panel { bottom:14px; }
  body:has(#instrument-panel:not([hidden])) #stick { bottom:155px;left:14px; }
  #touch-brake,body:has(#instrument-panel:not([hidden])) #touch-brake { bottom:99px;left:14px;font-size:clamp(7px,1.8vw,9px);min-height:44px;padding:10px; }
  .skydiving .flight-actions { bottom:30px; }
  .skydiving #stick { bottom:18px; }
  body.skydiving .flight-strip { top:128px;bottom:auto; }
  .menu-actions { bottom:-18px; }
}