/* r115: measured desktop targets were40.8px and32px high.
   Keep square settings art and reserve space beside the capacity meter. */
.stage:not([data-screen^="manual"]) .gear-button {
  width: max(44px, 2.55rem); height: max(44px, 2.55rem);
  min-width: 44px; min-height: 44px; aspect-ratio: 1;
}
.stage:not([data-screen^="manual"]) .top-runtime { right: calc(3% + 52px); }
.stage[data-screen="backpack"] .inventory-filter { min-width: 44px; min-height: 44px; }

/* Intermediate landscape also had a40px settings return target. */
@media (orientation: landscape) and (min-width: 640px) and (max-height: 760px),
       (orientation: landscape) and (min-width: 640px) and (max-width: 1280px) {
  .stage[data-screen="settings"] .settings-content .action-button[data-action="home"] { min-height: 44px; }
}

/* Keep management screens at one physical size on short landscape devices.
   Layout uses CSS pixels; game rules and the manual puzzle canvas are untouched. */
@media (orientation: landscape) and (min-width: 640px) and (max-height: 560px) {
  .app-shell:has(.stage:is([data-screen="home"], [data-screen="explore"], [data-screen="route"], [data-screen="backpack"], [data-screen="museum"], [data-screen="robots"], [data-screen="commissions"], [data-screen="settings"], [data-screen="settlement"])) {
    width: calc(100vw - 12px);
    max-width: none;
  }
  .stage:is([data-screen="home"], [data-screen="explore"], [data-screen="route"], [data-screen="backpack"], [data-screen="museum"], [data-screen="robots"], [data-screen="commissions"], [data-screen="settings"], [data-screen="settlement"]) {
    height: calc(100dvh - 66px);
    aspect-ratio: auto;
  }
  .stage:not([data-screen^="manual"]) .gear-button {
    top: 5px; right: 2%; width: 44px; height: 44px;
    min-width: 44px; min-height: 44px;
  }
  .stage:not([data-screen^="manual"]) .top-runtime { right: calc(2% + 52px); }
  .stage:not([data-screen^="manual"]) .nav-hitbar {
    left: 3%; right: 3%; bottom: 3px; height: 48px;
  }
  .stage:not([data-screen^="manual"]) .nav-hit {
    min-height: 48px; font-size: 14px; padding: 8px; line-height: 1.2;
  }
  .stage:not([data-screen^="manual"]) .action-button,
  .stage[data-screen="robots"] .robot-detail-upgrade-button {
    min-width: 0; min-height: 48px; font-size: 14px; line-height: 1.2;
    padding: 7px 10px; white-space: normal; overflow-wrap: anywhere;
  }
  .stage:not([data-screen^="manual"]) .action-button > span { min-width: 0; }
  .stage:not([data-screen^="manual"]) > .screen-runtime > .action-dock {
    left: 3%; right: 3%; bottom: 57px; width: auto; max-width: none;
    display: grid; gap: 6px;
  }
  .stage[data-screen="home"] > .screen-runtime > .action-dock {
    left: 48%; grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  /* Keep six-character Chinese actions and icon + four-character actions
     intact at640px. Preserve14px text,48px hit height and the existing art. */
  .stage[data-screen="home"] > .screen-runtime > .action-dock .action-button {
    padding-inline: 6px;
    white-space: nowrap;
    overflow-wrap: normal;
  }
  .stage[data-screen="home"] .home-title { top: 57px; right: 3%; width: 49%; }
  .stage[data-screen="home"] .home-title h1 { font-size: clamp(32px, 5.2vw, 44px); line-height: 1.2; }
  .stage[data-screen="home"] .runtime-card {
    left: 3%; bottom: 57px; max-width: 42%; width: 42%;
    max-height: calc(100% - 114px); overflow: auto; padding: 14px 16px;
  }
  .stage[data-screen="home"] .runtime-card h2 { font-size: 16px; }
  .stage[data-screen="home"] .runtime-card p { font-size: 13px; }
  .stage[data-screen="explore"] > .screen-runtime > .action-dock { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .stage[data-screen="explore"] .manual-explore-intro { top: 55px; left: 3%; width: 53%; }
  .stage[data-screen="explore"] .manual-explore-intro h2 { font-size: 16px; }
  .stage[data-screen="explore"] .exploration-islands { top: 101px; bottom: 113px; width: 53%; }
  .stage[data-screen="explore"] .explore-panel {
    top: 55px; bottom: 113px; height: auto; right: 3%; width: 39%;
    padding: 12px 14px;
  }
  .stage[data-screen="explore"] .expedition-fleet { min-height: 0; flex: 1 1 auto; }
  .stage[data-screen="explore"] .explore-capacity { flex: 0 0 auto; }
  .stage[data-screen="backpack"] > .screen-runtime > .action-dock { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .stage[data-screen="backpack"] :is(.backpack-detail-panel, .inventory-panel) {
    top: 55px; bottom: 109px; height: auto; max-height: none;
    border-width: 8.05px 5.6px; padding: 3px 6px;
  }
  .stage[data-screen="backpack"] .inventory-panel { grid-template-rows: 44px minmax(0, 1fr); }
  .stage[data-screen="backpack"] .screen-runtime > .inventory-panel { border-width: 8.05px 5.6px; padding: 3px 6px; }
  .stage[data-screen="backpack"] .inventory-filter { min-width: 44px; min-height: 44px; font-size: 13px; padding: 4px; }
  .stage[data-screen="backpack"] .inventory-grid { grid-auto-rows: minmax(64px, max-content); }
  .stage[data-screen="backpack"] .inventory-cell { min-height: 64px; }
  .stage[data-screen="backpack"] .backpack-focus-icon { width: min(100%, 80px); }
  .stage[data-screen="backpack"] .inventory-cell strong,
  .stage[data-screen="backpack"] .selection-card strong { font-size: 13px; }
  .stage[data-screen="backpack"] .selection-card :is(span, small) { font-size: 12px; }
  .stage[data-screen="robots"] > .screen-runtime > .action-dock {
    right: 51%; grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .stage[data-screen="robots"] .robot-panel.robot-detail { top: 55px; bottom: 57px; height: auto; max-height: none; }
  .stage[data-screen="robots"] .robot-showcase { top: 55px; bottom: 113px; }
  .stage[data-screen="commissions"] > .screen-runtime > .action-dock { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stage[data-screen="commissions"] .commission-board-title { top: 53px; }
  .stage[data-screen="commissions"] .commission-cards { top: 79px; bottom: 113px; height: auto; }
  .stage[data-screen="commissions"] .commission-summary { top: 55px; bottom: 113px; height: auto; max-height: none; }
  .stage[data-screen="settings"] .settings-panel { top: 55px; bottom: 9px; height: auto; max-height: none; }
  .stage[data-screen="settings"] .settings-toggle { min-height: 44px; }
  .stage[data-screen="settings"] .settings-content .action-button,
  .stage[data-screen="settings"] .settings-content .action-button[data-action="home"] { min-height: 48px; font-size: 14px; }
  .stage[data-screen="museum"] > .screen-runtime > .action-dock { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .stage[data-screen="museum"] .museum-showcase { top: 55px; bottom: 113px; }
  .stage[data-screen="museum"] .museum-showcase > h2 { display: inline; margin: 0; font-size: 16px; line-height: 20px; }
  .stage[data-screen="museum"] .museum-showcase > p { display: inline; margin: 0 0 0 8px; font-size: 11px; line-height: 20px; }
  .stage[data-screen="museum"] .museum-slots { top: 20px; padding: 0; }
  .stage[data-screen="museum"] .museum-slot { min-height: 120px; }
  .stage[data-screen="museum"] .museum-panel { top: 55px; bottom: 113px; height: auto; max-height: none; }
  .stage[data-screen="museum"] .action-button:disabled { opacity: 1; filter: grayscale(.85); color: var(--ink); }
  .stage[data-screen="museum"] .action-button:disabled > span { background: var(--paper); padding: 2px 4px; border-radius: 3px; }
  .stage[data-screen="route"] > .screen-runtime > .action-dock { right: 54%; bottom: 5px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stage[data-screen="route"] .route-map { top: 55px; bottom: 63px; height: auto; width: 49%; }
  .stage[data-screen="route"] .route-panel { top: 55px; bottom: 9px; height: auto; width: 44%; padding: 14px; }
  .stage[data-screen="route"] .robot-pick { min-height: 44px; }
  .stage[data-screen="settlement"] > .screen-runtime > .action-dock { bottom: 5px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
}