.action.flag {
  width: 48px;
  height: 48px;
  left: auto;
  right: 138px;
  top: 0;
  bottom: auto;
  border-color: #ffd56a55;
}
.action.flag span { color: var(--gold); font-size: 15px; }
.action.warp {
  width: 56px;
  height: 56px;
  left: auto;
  right: 198px;
  top: 27px;
  border-color: #72ffc188;
}
.action.warp span { color: var(--green); font-size: 17px; }
.action.warp:disabled { opacity: .42; filter: saturate(.45); }

.actions { width: 270px; height: 112px; }
.action.fire { right: 0; bottom: 0; }
.action.boost { right: 78px; top: 0; }
.action.mine { left: auto; right: 138px; bottom: 0; }
.action.bomb {
  width: 54px;
  height: 54px;
  right: 78px;
  bottom: 0;
  border-color: #ff946f88;
}
.action.bomb span { color: #ff9c62; font-size: 16px; }

.ship-chip {
  border: 1px solid #70e5ff66; border-radius: 12px; background: #08182acc;
  color: #9feeff; font: 800 8px Inter, sans-serif; letter-spacing: 1px;
  padding: 4px 8px; min-height: 44px;
}
.ship-panel {
  position: relative; width: min(960px, calc(100vw - 24px)); max-height: min(760px, calc(100vh - 24px));
  overflow: auto; padding: 24px; border-radius: 18px;
}
.ship-panel h2 { margin: 5px 36px 6px 0; color: #f3fbff; font: 28px Georgia, serif; }
.ship-panel > p { margin: 0 0 16px; color: #9eb1c4; font-size: 12px; }
.ship-grid { display: grid; grid-template-columns: repeat(4, minmax(145px, 1fr)); gap: 9px; }
.ship-card {
  min-height: 274px; padding: 10px 12px 12px; text-align: left; border: 1px solid #57708c66;
  border-radius: 13px; color: #dbeeff; background: linear-gradient(145deg,#0b1829e8,#060c18e8);
}
.ship-card.selected { border-color: var(--ship-color,#70e5ff); box-shadow: 0 0 24px color-mix(in srgb,var(--ship-color,#70e5ff) 28%,transparent); }
.ship-card:disabled { opacity: .56; }
.ship-card strong,.ship-card small,.ship-card span { display: block; }
.ship-card strong { color: var(--ship-color,#70e5ff); letter-spacing: 1.5px; font-size: 13px; }
.ship-card small { color: #fff; margin: 3px 0 8px; font-size: 9px; }
.ship-card span { color: #8ea4b8; font-size: 9px; line-height: 1.35; }
.ship-preview { display: block; width: 100%; height: 58px; margin: -2px 0 2px; }
.hull-stats { display: grid; gap: 3px; margin-top: 8px; }
.hull-stats > span { display: grid; grid-template-columns: 48px 1fr; align-items: center; gap: 5px; }
.hull-stats b { color: #8298aa; font-size: 7px; letter-spacing: .6px; }
.hull-stats i { display: grid; grid-template-columns: repeat(5,1fr); gap: 2px; min-height: 3px; }
.hull-stats em { display: block; height: 3px; border-radius: 2px; background: var(--ship-color,#70e5ff); box-shadow: 0 0 5px var(--ship-color,#70e5ff); }
.ship-compare,.starting-ship-summary { margin-top: 12px; color: #9db6ca; font: 10px/1.45 Inter,sans-serif; }
.ship-compare b,.starting-ship-summary b { color: #fff; }
.welcome select { width: 100%; min-height: 42px; border-radius: 8px; border: 1px solid #5d83a777; background: #071423; color: #dffaff; padding: 0 10px; }

@media (max-width: 720px) {
  .ship-panel { padding: 18px 14px; }
  .ship-panel h2 { font-size: 22px; }
  .ship-grid { grid-template-columns: repeat(2,minmax(128px,1fr)); }
  .ship-card { min-height: 250px; }
}
@media (max-height: 520px) and (orientation: landscape) {
  .ship-panel { max-height: calc(100vh - 10px); padding: 12px; }
  .ship-panel > p { margin-bottom: 8px; }
  .ship-grid { grid-template-columns: repeat(7,minmax(105px,1fr)); }
  .ship-card { min-height: 190px; padding: 6px; }
  .ship-card > span { display: none; }
  .ship-preview { height: 42px; }
  .hull-stats > span { display: grid; }
}

/* The steering wrapper is only geometry. Its transparent overlap must not
   intercept the compact vitals; the two actual controls opt back in. */
.steering { pointer-events: none !important; }
.steering .joystick,.steering .steering-mode { pointer-events: auto; }

/* v32 compact portrait: two disjoint thumb zones without shrinking actions below 44px. */
@media (max-width: 390px) and (orientation: portrait) {
  .steering { left: 4px; width: 104px; transform: none; }
  .steering .joystick { left: 0; transform: none; }
  .steering-mode { left: 0 !important; top: -46px !important; width: 104px !important; min-height: 44px !important; }
  .actions { right: 4px; width: 208px; transform: none; }
  .actions .fire { width: 62px; height: 62px; right: 0; }
  .actions .boost { width: 48px; height: 48px; right: 64px; }
  .actions .bomb { width: 48px; height: 48px; right: 64px; }
  .actions .mine { width: 48px; height: 48px; right: 114px; }
  .actions .warp { width: 48px; height: 48px; right: 160px; }
}

/* Compact launch flow for short iPhone landscape viewports. Keep the primary
   decision and launch action above Safari's bottom chrome without scrolling. */
@media (max-height: 520px) and (orientation: landscape) {
  .modal-backdrop { padding: max(4px,var(--safe-top)) max(10px,var(--safe-right)) max(4px,var(--safe-bottom)) max(10px,var(--safe-left)); }
  .welcome {
    width: min(760px,calc(100vw - var(--safe-left) - var(--safe-right) - 20px));
    max-height: calc(100dvh - 8px); padding: 9px 16px; display: grid;
    grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 3px 12px;
    align-items: end; text-align: left;
  }
  .welcome .planet-mark { display: none; }
  .welcome > small,.welcome > h1,.welcome > p,.welcome > .starting-ship-summary { grid-column: 1 / -1; }
  .welcome h1 { margin: 0; font-size: 21px; line-height: 1.05; }
  .welcome p { margin: 1px 0; font-size: 9px; line-height: 1.25; }
  .welcome label { margin: 2px 0 0; }
  .welcome input,.welcome select { height: 34px; min-height: 34px; margin-top: 3px; padding: 6px 9px; }
  .welcome .starting-ship-summary { max-height: 45px; overflow: hidden; margin: 2px 0; font-size: 8px; line-height: 1.25; }
  .welcome button { min-height: 44px; margin: 3px 0; padding: 7px; }
  .welcome > span { align-self: center; text-align: right; font-size: 7px; }
  .topbar { height: 52px; padding: 5px 8px; }
  .brand { gap: 7px; }.brand strong { font-size: 12px; }.brand small { display: none; }
  .sigil { width: 32px; height: 32px; font-size: 15px; }
  .server span,.server b { display: none; }
  .topbar .icon-button { width: 44px; height: 44px; margin-left: 4px; }
  .vitals { top: calc(max(6px,var(--safe-top)) + 58px); width: 190px; padding: 8px; }
  .radar { top: calc(max(6px,var(--safe-top)) + 58px); width: 122px; padding: 5px; }
  .radar > div { margin-bottom: 2px; }.radar > div span { display: none; }
  #minimap { width: 110px; height: 68px; }
  .leaderboard { display: none; }
}

.topbar .arsenal-open {
  position: static; inset: auto; flex: 0 0 44px; width: 44px; min-width: 44px;
  height: 44px; min-height: 44px; margin-left: 4px; padding: 0;
  display: grid; place-items: center; border-radius: 50%;
}
.topbar .arsenal-open span { margin: 0; font-size: 18px; line-height: 1; }
.topbar .arsenal-open b { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* Full-height tactical tray for short iPhone landscape viewports. Safari must
   not magnify its labels, and every actionable cell keeps a 44px tap target. */
@media (max-height: 520px) and (orientation: landscape) {
  body.arsenal-active > .topbar,
  body.arsenal-active > .vitals,
  body.arsenal-active > .objective,
  body.arsenal-active > .radar,
  body.arsenal-active > .leaderboard,
  body.arsenal-active > .touch-controls,
  body.arsenal-active > .keyboard-help,
  body.arsenal-active > .flag-banner,
  body.arsenal-active > .toast,
  body.arsenal-active > .connection-banner,
  body.arsenal-active > .rotate-hint { visibility: hidden; }
  .arsenal-backdrop {
    z-index: 100; align-items: stretch; padding: 0;
    background: #02050e; backdrop-filter: none;
  }
  .arsenal-panel {
    position: absolute; top: 3px; bottom: 3px;
    left: max(6px,var(--safe-left)); right: max(6px,var(--safe-right));
    width: auto; height: auto; max-height: none; padding: 7px 9px;
    border-radius: 10px; background: #060d1b; overflow: auto;
  }
  .arsenal-panel header { min-height: 44px; align-items: center; }
  .arsenal-panel h2 { margin: 0; font-size: 17px; line-height: 1; }
  .arsenal-panel header small { font-size: 7px; }
  .arsenal-panel > p { display: none; }
  .arsenal-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 3px; }
  .arsenal-grid button { min-width: 0; min-height: 46px; padding: 3px 2px; border-radius: 7px; -webkit-appearance: none; appearance: none; }
  .arsenal-grid button:disabled { opacity: .58; filter: none; background: #0a1220; }
  .arsenal-grid button > span { display: none; }
  .arsenal-grid button > b { font-size: 7px; letter-spacing: .4px; }
  .arsenal-grid button > small { margin-top: 2px; font-size: 6px; line-height: 1.15; }
  .systems-heading { display: none; }
  .systems-grid { grid-template-columns: repeat(5,minmax(0,1fr)); gap: 3px; margin-top: 4px; }
  .systems-grid button { min-width: 0; min-height: 44px; padding: 2px; border-radius: 7px; -webkit-appearance: none; appearance: none; }
  .systems-grid button:disabled { opacity: .58; filter: none; background: #080f1d; }
  .systems-grid button > span { display: none; }
  .systems-grid button > b { font-size: 7px; }
  .systems-grid button > small { font-size: 6px; }
  .emp-status,.arsenal-status { margin-top: 3px; padding: 3px 6px; font-size: 7px; }
}
/* Shared original hull art and system icons, desktop and mobile. */
#startingHullGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;grid-column:1/-1}
#onboarding .welcome{width:min(680px,94vw);padding:18px 24px}
#onboarding .planet-mark{display:none}
#onboarding .welcome h1{font-size:26px;margin:8px 0}
#onboarding .welcome p{font-size:12px;margin:8px 0}
#onboarding .starting-hull{margin:0;padding:5px;background:#081725;letter-spacing:0;min-height:92px}
#onboarding .starting-hull[aria-pressed="true"]{background:#153a40}
.starting-hull{min-width:0;background:#081725;color:#d8efff;border:1px solid #355469;border-radius:8px;padding:4px;cursor:pointer}
.starting-hull .ship-preview{display:block;width:100%;height:56px;margin:auto}
.starting-hull b,.starting-hull small{display:block;font-size:10px;line-height:1.3}
.starting-hull small{font-size:8px;color:#9db5c8}
.starting-hull[aria-pressed="true"]{border-color:#71ffd4;background:#153a40;box-shadow:inset 0 0 0 1px #71ffd4}
.welcome{max-height:94dvh;overflow:auto}
.systems-grid button>span{display:block!important;width:52px;height:52px;margin:auto;font-size:0;background-image:url('/assets/ship-systems.png?v=60');background-size:500% auto;background-repeat:no-repeat;background-position:0 50%}
.systems-grid [data-system="cloak"]>span{background-position:25% 50%}
.systems-grid [data-system="stealth"]>span{background-position:50% 50%}
.systems-grid [data-system="xradar"]>span{background-position:75% 50%}
.systems-grid [data-system="antiwarp"]>span{background-position:100% 50%}
.systems-grid button:disabled{border-color:#c54c5c;color:#e47a84;opacity:.7}
.systems-grid button:not(:disabled){border-color:#4d9fea;color:#7fbfff}
.systems-grid button[aria-pressed="true"]{border-color:#65f0a3;color:#65f0a3;background:#12352b}
.system-rail{position:fixed;left:12px;top:245px;z-index:8;display:grid;grid-template-columns:68px;gap:4px;padding:5px;max-height:calc(100vh - 270px);overflow-y:auto}
.system-rail button{min-height:57px;padding:2px;font-size:8px}
.system-rail button>span{width:30px;height:30px}
.system-rail button>b{font-size:7px}.system-rail button>small{font-size:7px}
@media(max-height:650px){.system-rail{top:165px;max-height:calc(100vh - 315px);grid-template-columns:50px}.system-rail button{min-height:42px}.system-rail button>b{display:none}}
.quick-systems{position:fixed;z-index:7;left:16px;top:300px;width:72px;grid-template-columns:1fr;gap:4px}
.quick-systems button{min-height:64px;padding:4px 2px;background:#071321dd}
.quick-systems button>span{width:32px!important;height:32px!important}
.quick-systems button>b{font-size:7px;letter-spacing:0}
.quick-systems button>small{font-size:6px;letter-spacing:0}
.equipment-help{font-size:11px;color:#bed6e5;line-height:1.5;margin:8px 0}
.upgrade-progress{font-size:9px;line-height:1.5;color:#b9dbe5;margin:5px 0;max-width:235px}
.arsenal-grid button:disabled:after{content:"SIN CARGAS"}
@media(pointer:coarse){.quick-systems{display:none}}

/* Compact combat inventory: server quantities, not decorative availability. */
.leaderboard[hidden]{display:none!important}
.arsenal-backdrop{align-items:flex-start;padding-top:max(76px,env(safe-area-inset-top))}
.arsenal-panel{max-height:calc(100dvh - 90px);overflow-y:auto}
.consumable-rail{position:fixed;right:14px;top:246px;z-index:8;display:grid;grid-template-columns:repeat(2,72px);gap:4px;padding:5px;width:auto;max-height:calc(100dvh - 370px);overflow-y:auto}
.consumable-rail button{min-height:57px;padding:3px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.consumable-rail button>span{font-size:19px;width:24px;height:24px}
.consumable-rail button>b{font-size:8px;letter-spacing:0}
.consumable-rail button>small{font-size:9px;letter-spacing:0;color:#9be4ff}
.consumable-rail button:disabled{border-color:#a44b6077;color:#bd7a8b;opacity:.75}
.consumable-rail button:disabled:after{content:none}
.quick-systems.system-rail{grid-template-columns:58px;gap:2px;padding:3px;top:285px}
.quick-systems.system-rail button{min-height:43px;padding:2px}
.quick-systems.system-rail button>span{width:22px!important;height:22px!important}
.quick-systems.system-rail button>b{font-size:7px;display:block}
.quick-systems.system-rail button>small{font-size:7px}
@media(max-height:650px){.consumable-rail{top:180px;max-height:calc(100dvh - 240px)}.quick-systems.system-rail{top:180px;max-height:calc(100dvh - 240px)}.arsenal-backdrop{padding-top:12px}.arsenal-panel{max-height:calc(100dvh - 24px)}}
/* Mobile web matches the native two-thumb control scheme. */
.weapon-joystick { display:none; }
body.dual-touch .steering-mode { display:none!important; }
body.dual-touch .steering { left:max(16px,env(safe-area-inset-left))!important; width:124px!important; height:124px!important; }
body.dual-touch .joystick { width:116px!important; height:116px!important; touch-action:none; }
body.dual-touch .joystick i { left:38px!important; top:38px!important; width:40px!important; height:40px!important; pointer-events:none; }
body.dual-touch .weapon-joystick { display:block; left:auto!important; right:max(16px,env(safe-area-inset-right)); bottom:0; }
.weapon-joystick b { position:absolute; font-size:7px; color:#a9c9de; pointer-events:none; }
.weapon-north { top:8px; left:42px; }.weapon-south { bottom:8px; left:44px; }
.weapon-west { left:4px; top:53px; }.weapon-east { right:4px; top:53px; }
body.dual-touch .actions { right:calc(max(16px,env(safe-area-inset-right)) + 126px)!important; bottom:0; width:48px!important; height:48px!important; transform:none!important; pointer-events:none; }
body.dual-touch .actions .action { display:none; }
body.dual-touch .actions .warp { display:block; left:0; right:auto; bottom:0; top:auto; width:46px!important; height:46px!important; pointer-events:auto; }
body.dual-touch .keyboard-help { display:none; }
@media(max-height:650px){
 body.dual-touch .system-rail,body.dual-touch .consumable-rail {
  top:180px;max-height:max(44px,calc(100dvh - 330px));
 }
}