/* Viewport and scroll ownership only. Approved art, cards and tab palettes stay in their own stylesheets. */
:root {
  --rl-viewport-height: 100vh;
  --rl-top: max(8px, env(safe-area-inset-top));
  --rl-right: max(8px, env(safe-area-inset-right));
  --rl-bottom: max(8px, env(safe-area-inset-bottom));
  --rl-left: max(8px, env(safe-area-inset-left));
  --rl-available-height: calc(var(--rl-viewport-height) - var(--rl-top) - var(--rl-bottom));
  --rl-available-width: calc(100vw - var(--rl-left) - var(--rl-right));
  --rl-menu-bottom: calc(72px + env(safe-area-inset-bottom));
}
@supports (height: 100dvh) {
  :root { --rl-viewport-height: 100dvh; }
}

/* A button must not move its hit area out from under a pointer at its edge. */
body .topLeftTabsV693 button:is(:hover, .active) { transform: none; }

/* The active main menu owns input. These are map controls, never menu close controls. */
body.nonameMajorScreenOpenV62792 :is(
  #topHudHoverZoneV6217, .topHudHoverZoneV6217, #topLeftTabsV693, #game > .hud,
  #onlinePlayerCountV62872, #miniMap, .miniMap, #sectorMapLauncher,
  .galaxyChatToggleV6261, #returnCarrierBtnV61311,
  #sectorTravelStatus, #commandDamageAlert, #warpOverlay
) {
  display: none !important;
  pointer-events: none !important;
}

/* Anchored panels account for their real bottom offset instead of a percentage of height. */
body :is(
  #mapActionPanel.mapActionPanel, #targetCard.targetCard,
  #npcCombatPanel.npcCombatPanel, .fuelPortalPromptV6190,
  .traderPanelV61320, .wayfarerPanelV6203, .salvagePanelV61318,
  .p1DistressPanelV6221, .planetJumpMenuV6226
) {
  box-sizing: border-box !important;
  right: var(--rl-right) !important;
  bottom: var(--rl-menu-bottom) !important;
  max-width: var(--rl-available-width) !important;
  max-height: calc(var(--rl-viewport-height) - var(--rl-top) - var(--rl-menu-bottom)) !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  scroll-padding-block: 8px;
}
body #carrierInfoPanel.carrierInfoPanel {
  box-sizing: border-box !important;
  right: var(--rl-right) !important;
  bottom: var(--rl-menu-bottom) !important;
  width: min(430px, var(--rl-available-width)) !important;
  max-width: 430px !important;
  max-height: min(650px, calc(var(--rl-viewport-height) - var(--rl-top) - var(--rl-menu-bottom))) !important;
  overflow: hidden !important;
}
body #carrierInfoPanel.carrierInfoPanel > :is(.carrierInfoHead, .carrierTabsV62790) {
  flex: 0 0 auto;
}
body #carrierInfoPanel.carrierInfoPanel > .carrierTabPagesV62790 {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none !important;
  overflow-y: auto;
  overscroll-behavior: contain;
  scroll-padding-block: 8px;
}
/* Equipment names may wrap within their own grid cell without touching counts. */
body #carrierInfoPanel :is(
  #carrierLaserEquipmentV62779, #carrierShieldEquipmentV62779, #carrierWarpEquipmentV62779
) > span {
  min-width: 0;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
}
body #carrierInfoPanel :is(
  #carrierLaserEquipmentV62779, #carrierShieldEquipmentV62779, #carrierWarpEquipmentV62779
) > b { white-space: nowrap; }
@media (max-width: 390px) {
  body #carrierInfoPanel :is(
    #carrierLaserEquipmentV62779, #carrierShieldEquipmentV62779, #carrierWarpEquipmentV62779
  ) {
    grid-template-columns: 24px minmax(0, 1fr) auto !important;
    gap: 4px !important;
  }
  body #carrierInfoPanel :is(
    #carrierLaserEquipmentV62779, #carrierShieldEquipmentV62779, #carrierWarpEquipmentV62779
  ) > img { width: 24px !important; height: 24px !important; }
}
body #militaryRankPanelV6274.militaryRankPanelV6274 {
  box-sizing: border-box !important;
  right: var(--rl-right) !important;
  bottom: var(--rl-menu-bottom) !important;
  max-width: var(--rl-available-width) !important;
  max-height: min(560px, calc(var(--rl-viewport-height) - var(--rl-top) - var(--rl-menu-bottom))) !important;
}
body #militaryRankPanelV6274 > :not(.rankRosterV6274) { flex-shrink: 0; }
body #militaryRankPanelV6274 .rankRosterV6274 {
  flex: 1 1 auto;
  min-height: 0;
  overscroll-behavior: contain;
}

/* Centered main menus retain their existing widths and scroll at the viewport edge. */
body :is(.galaxyGarageV6141, .planet1BaseMenuV6142, .enterBasePromptV6142),
body #sectorNavigation.nnMenuPanel {
  box-sizing: border-box !important;
  left: calc(50% + (var(--rl-left) - var(--rl-right)) / 2) !important;
  top: calc(50% + (var(--rl-top) - var(--rl-bottom)) / 2) !important;
  max-width: var(--rl-available-width) !important;
  max-height: var(--rl-available-height) !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  scroll-padding-block: 8px;
}
body .galaxyGarageV6141 .carrierChooserHeadV6148 {
  position: sticky;
  top: 0;
  z-index: 5002;
  padding-top: 6px;
  margin-top: 0;
  background: linear-gradient(180deg, #081925, #030d16);
}
body .galaxyGarageV6141 .carrierChooserHeadV6148 > div { min-width: 0; }
body .galaxyGarageV6141 .carrierChooserHeadV6148 .garageCloseV6141 {
  position: relative;
  inset: auto;
  flex-shrink: 0;
}
body .fuelBaseOverlay,
body #mailOverlayV62831.mailOverlayV62831 {
  box-sizing: border-box;
  padding: var(--rl-top) var(--rl-right) var(--rl-bottom) var(--rl-left);
}
body .fuelBaseOverlay .fuelBasePanel {
  box-sizing: border-box;
  max-width: 100%;
  max-height: var(--rl-available-height);
  overflow-y: auto;
  overscroll-behavior: contain;
}
body #mailOverlayV62831 .mailWindowV62831 {
  box-sizing: border-box;
  max-width: 100% !important;
  max-height: min(720px, var(--rl-available-height)) !important;
  min-height: 0;
}
body #mailOverlayV62831 .mailInboxListV62831 {
  min-height: 0;
  max-height: none;
  overflow-y: auto;
  overscroll-behavior: contain;
}
body #topLeftPanelV693.warScreenV62792 {
  left: calc(50% + (var(--rl-left) - var(--rl-right)) / 2) !important;
  top: calc(50% + (var(--rl-top) - var(--rl-bottom)) / 2) !important;
  max-width: var(--rl-available-width) !important;
  max-height: min(760px, var(--rl-available-height)) !important;
}
body #topLeftPanelV693.warScreenV62792 .warPanelV62792 {
  max-height: min(760px, var(--rl-available-height));
  min-height: 0;
}
body #topLeftPanelV693.warScreenV62792 .warReportListV62792 {
  min-height: 0;
  overscroll-behavior: contain;
}
body #topLeftPanelV693:not(.warScreenV62792) {
  box-sizing: border-box;
  max-width: var(--rl-available-width) !important;
  max-height: calc(var(--rl-viewport-height) - var(--rl-top) - 24px) !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
}

/* Native child dialogs keep their own open/hidden lifecycle and top-layer behavior. */
body :is(
  #commandRepairDialog, #commandHeroUpgradeDialog, #systemUpgradeDialog,
  #storageUpgradeDialog, #nonameMenuHelpDialog
).nnMenuPanel {
  box-sizing: border-box;
  inset: var(--rl-top) var(--rl-right) var(--rl-bottom) var(--rl-left);
  max-width: var(--rl-available-width) !important;
  max-height: var(--rl-available-height) !important;
  overflow-y: auto;
  overscroll-behavior: contain;
  scroll-padding-block: 8px;
}

/* Keep titles and close buttons visible when a main menu or child dialog scrolls. */
body .galaxyGarageV6141 { scroll-padding-top: 124px; }
body #sectorNavigation.nnMenuPanel,
body .fuelBaseOverlay .fuelBasePanel,
body :is(
  #commandRepairDialog, #commandHeroUpgradeDialog, #systemUpgradeDialog,
  #storageUpgradeDialog, #nonameMenuHelpDialog
).nnMenuPanel { scroll-padding-top: 88px; }
body #sectorNavigation > .nnMenuHeading,
body .fuelBaseOverlay .fuelBasePanel > .fuelBaseHeading,
body :is(
  #commandRepairDialog, #commandHeroUpgradeDialog, #systemUpgradeDialog,
  #storageUpgradeDialog, #nonameMenuHelpDialog
) > .nnMenuHeading {
  position: sticky;
  top: 0;
  z-index: 10;
  padding-top: 6px;
  background: #061821;
}
body #sectorNavigation > .nnMenuHeading {
  background: linear-gradient(145deg, #142937, #08141e);
}
body .fuelBaseOverlay .fuelBasePanel > .fuelBaseHeading {
  background: linear-gradient(180deg, #081925, #030d16);
}
/* Cover the scroll container's top padding above its pinned heading. */
body #sectorNavigation > .nnMenuHeading::before,
body .fuelBaseOverlay .fuelBasePanel > .fuelBaseHeading::before,
body :is(
  #commandRepairDialog, #commandHeroUpgradeDialog, #systemUpgradeDialog,
  #storageUpgradeDialog, #nonameMenuHelpDialog
) > .nnMenuHeading::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 100%;
  height: 24px;
  background: inherit;
  pointer-events: none;
}

/* Four sale controls occupy two predictable rows, including the narrow phone layout. */
body #fuelBayPanel .fleetSaleRow {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
}
body #fuelBayPanel .fleetSaleRow > :is(select, input, button) {
  box-sizing: border-box;
  min-width: 0;
  width: 100%;
  grid-column: auto;
}
body #fuelBayPanel .fleetSaleRow > button {
  min-height: 44px;
  white-space: normal;
  overflow-wrap: anywhere;
}

/* The map keeps one bottom row: chat left, Carrier center, navigation right. */
body .galaxyChatToggleV6261 {
  left: var(--rl-left) !important;
  bottom: var(--rl-bottom) !important;
}
body #returnCarrierBtnV61311 {
  left: 50% !important;
  bottom: var(--rl-bottom) !important;
}
body #sectorMapLauncher { right: var(--rl-right); bottom: var(--rl-bottom); }
body #sectorTravelStatus { bottom: max(calc(var(--rl-bottom) + 100px),var(--map-chat-clearance,0px)); }
body #carrierRecoveryStatusV6300 {
  box-sizing: border-box;
  bottom: calc(var(--rl-bottom) + 100px);
  max-width: var(--rl-available-width);
  max-height: calc(var(--rl-available-height) - 100px);
  overflow-y: auto;
}
body .galaxyChatV6261 {
  box-sizing: border-box;
  left: var(--rl-left) !important;
  bottom: var(--rl-bottom) !important;
  max-width: var(--rl-available-width) !important;
  max-height: var(--rl-available-height) !important;
}

@media (min-width: 821px) and (pointer: fine) {
  :root { --rl-right: max(12px, env(safe-area-inset-right)); --rl-left: max(12px, env(safe-area-inset-left)); }
  body #carrierInfoPanel.carrierInfoPanel {
    width: min(540px, var(--rl-available-width)) !important;
    max-width: 540px !important;
    max-height: min(720px, calc(var(--rl-viewport-height) - var(--rl-top) - var(--rl-menu-bottom))) !important;
  }
}

/* Hidden background HUD no longer reserves a strip beneath phone menus. */
@media (max-width: 820px), (pointer: coarse) {
  :root { --rl-menu-bottom: var(--rl-bottom); }
  body #carrierInfoPanel.carrierInfoPanel { max-height: var(--rl-available-height) !important; }
  body #militaryRankPanelV6274.militaryRankPanelV6274 { max-height: min(560px, var(--rl-available-height)) !important; }
}

/* Short landscape screens scroll content instead of losing their headers above the screen. */
@media (max-height: 500px) {
  :root { --rl-menu-bottom: var(--rl-bottom); }
  body #carrierInfoPanel.carrierInfoPanel,
  body #militaryRankPanelV6274.militaryRankPanelV6274 { max-height: var(--rl-available-height) !important; }
  body .galaxyChatV6261 { height: var(--rl-available-height) !important; }
}

/* Phone damage notices use the same clearance as flight and recovery notices. */
@media (max-width: 420px) {
  body #commandDamageAlert { bottom: max(calc(var(--rl-bottom) + 100px),var(--map-chat-clearance,0px)); }
}