/*
 * Lupen interface foundation
 * --------------------------
 * Shared tokens and interaction rules live here. Individual screens retain
 * their own layout while consuming the same frame, type, colour and control
 * language. This file loads last so new screens can adopt the system without
 * reopening the historical stylesheet.
 */

:root {
  --lupen-screen-width: 1200px;
  --lupen-screen-height: 700px;
  --lupen-screen-gutter: 12px;
  --lupen-screen-radius: 18px;
  --lupen-panel-radius: 12px;
  --lupen-control-radius: 10px;

  --lupen-cyan: #56dcf5;
  --lupen-cyan-bright: #77edff;
  --lupen-blue: #2784d7;
  --lupen-blue-deep: #155da7;
  --lupen-text: #f3f8fc;
  --lupen-text-soft: #c2d1dd;
  --lupen-text-muted: #8fa6b7;
  --lupen-line: rgba(75, 174, 220, 0.42);
  --lupen-line-soft: rgba(83, 170, 208, 0.22);
  --lupen-panel: rgba(2, 15, 27, 0.93);
  --lupen-panel-raised: rgba(6, 27, 40, 0.94);

  --lupen-stat-hull: #557fa0;
  --lupen-stat-shield: #18cceb;
  --lupen-stat-armor: #7695ad;
  --lupen-stat-cargo: #d9bd00;
  --lupen-stat-jump: #3a90c5;
  --lupen-stat-evasion: #13cda9;
  --lupen-success: #46e99b;
  --lupen-warning: #ffd45f;
  --lupen-danger: #ff765f;

  --lupen-title-size: clamp(38px, 4vw, 52px);
  --lupen-section-title-size: 22px;
  --lupen-body-size: 14px;
  --lupen-label-size: 11px;
}

.lupen-app-screen {
  width: min(var(--lupen-screen-width), calc(100vw - (var(--lupen-screen-gutter) * 2))) !important;
  max-width: var(--lupen-screen-width) !important;
  height: min(var(--lupen-screen-height), calc(100dvh - (var(--lupen-screen-gutter) * 2))) !important;
  max-height: var(--lupen-screen-height) !important;
  border-radius: var(--lupen-screen-radius) !important;
  border-color: var(--lupen-line) !important;
  color: var(--lupen-text);
}

/* Historical screen rules use ID selectors, so the shared frame needs an
   equally specific final guard while those screens are migrated. */
:is(
  #journeyScreen,
  #marketScreen,
  #bountyScreen,
  #pilotProfileScreen,
  #upgradeForgeScreen,
  #storeScreen,
  #hangarScreen
).lupen-app-screen.active {
  width: min(var(--lupen-screen-width), calc(100vw - (var(--lupen-screen-gutter) * 2))) !important;
  max-width: var(--lupen-screen-width) !important;
  height: min(var(--lupen-screen-height), calc(100dvh - (var(--lupen-screen-gutter) * 2))) !important;
  max-height: var(--lupen-screen-height) !important;
  box-sizing: border-box !important;
}

/* The shared screen border replaces the Pilot Profile's older inset frame. */
#pilotProfileScreen.pilot-profile-screen.lupen-app-screen::before {
  content: none !important;
  display: none !important;
}

/* Crop the frame painted into the Pilot artwork behind the shared outer border. */
#pilotProfileScreen.pilot-profile-screen.lupen-app-screen {
  background-size: cover, cover, cover, calc(100% + 48px) calc(100% + 48px) !important;
}

.lupen-app-screen .lupen-screen-header {
  min-width: 0;
}

.lupen-app-screen .lupen-screen-header p,
.lupen-app-screen .lupen-screen-header .forge-lupen-heading > p {
  margin: 0 0 4px;
  color: var(--lupen-cyan-bright);
  font-size: 0.86rem;
  font-weight: 950;
  line-height: 1;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.lupen-app-screen .lupen-screen-header h2,
.lupen-app-screen .lupen-screen-header .forge-lupen-heading > h2 {
  margin: 0;
  color: var(--lupen-text);
  font-size: var(--lupen-title-size);
  font-weight: 950;
  line-height: 0.98;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.lupen-app-screen .hangar-subtitle,
.lupen-app-screen .pilot-profile-subtitle,
.lupen-app-screen .trade-terminal-station-copy {
  display: block;
  margin-top: 5px;
  color: var(--lupen-text-soft);
  font-size: 0.82rem;
  line-height: 1.2;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.lupen-app-screen .lupen-back-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 92px !important;
  min-width: 92px !important;
  max-width: 92px !important;
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  border: 1px solid rgba(72, 184, 239, 0.74) !important;
  border-radius: var(--lupen-control-radius) !important;
  clip-path: none !important;
  background: rgba(3, 17, 33, 0.92) !important;
  color: var(--lupen-text) !important;
  font-family: "Arial Black", Arial, sans-serif !important;
  font-size: 0.84rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-transform: none !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
  cursor: pointer;
}

.lupen-app-screen .lupen-back-button::before,
.lupen-app-screen .lupen-back-button::after {
  content: none !important;
  display: none !important;
}

.lupen-app-screen .lupen-back-button:hover {
  border-color: var(--lupen-cyan-bright) !important;
  background: rgba(13, 55, 91, 0.94) !important;
}

/*
 * Legacy specificity bridge
 * -------------------------
 * Historical screen layouts still contain highly specific Back-button rules.
 * These selectors keep the shared component authoritative until those layouts
 * are migrated, without changing their screen-specific header geometry.
 */
#pilotProfileScreen.pilot-profile-screen.lupen-app-screen .lupen-back-button,
#upgradeForgeScreen.upgrade-forge-screen.lupen-app-screen .lupen-back-button,
#hangarScreen.hangar-screen.lupen-app-screen.active:has(#hangarOverviewSection.active) .lupen-back-button,
#hangarScreen.hangar-screen.lupen-app-screen.active:has(#hangarOwnedSection.active) .lupen-back-button,
#hangarScreen.hangar-screen.lupen-app-screen.active:has(#hangarShipyardSection.active) .lupen-back-button,
#hangarScreen.hangar-screen.lupen-app-screen.active:has(#hangarPlansSection.active) .lupen-back-button,
#hangarScreen.hangar-screen.lupen-app-screen.active:has(#hangarVaultSection.active) .lupen-back-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 92px !important;
  min-width: 92px !important;
  max-width: 92px !important;
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  border: 1px solid rgba(72, 184, 239, 0.74) !important;
  border-radius: var(--lupen-control-radius) !important;
  clip-path: none !important;
  background: rgba(3, 17, 33, 0.92) !important;
  color: var(--lupen-text) !important;
  font-family: "Arial Black", Arial, sans-serif !important;
  font-size: 0.84rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-transform: none !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

.lupen-app-screen button,
.lupen-app-screen input,
.lupen-app-screen select {
  font-family: inherit;
}

.lupen-app-screen button,
.lupen-app-screen input,
.lupen-app-screen select,
.lupen-app-screen [tabindex] {
  outline: none;
}

.lupen-app-screen button:focus-visible,
.lupen-app-screen input:focus-visible,
.lupen-app-screen select:focus-visible,
.lupen-app-screen [tabindex]:focus-visible {
  outline: 2px solid var(--lupen-cyan-bright);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(86, 220, 245, 0.16);
}

.lupen-app-screen button:disabled {
  filter: saturate(0.55);
}

.lupen-app-screen ::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

.lupen-app-screen ::-webkit-scrollbar-track {
  background: rgba(1, 10, 18, 0.78);
  border-radius: 999px;
}

.lupen-app-screen ::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #69c9e3, #287fa7);
  border: 2px solid rgba(1, 10, 18, 0.88);
  border-radius: 999px;
}

.lupen-app-screen .modern-store-panel-header,
.lupen-app-screen .panel-kicker,
.lupen-app-screen .hangar-section-title h3,
.lupen-app-screen .fleet-roster-header > span,
.lupen-app-screen .compatible-vault-panel > header span {
  color: var(--lupen-cyan-bright);
}

/* One stat colour language across Loadout, Fleet, Exchange, Vault and Profile. */
.lupen-app-screen [class*="stat"][data-stat="hull"],
.lupen-app-screen .hull-stat {
  --stat-accent: var(--lupen-stat-hull);
}

.lupen-app-screen [class*="stat"][data-stat="shield"],
.lupen-app-screen .shield-stat {
  --stat-accent: var(--lupen-stat-shield);
}

.lupen-app-screen [class*="stat"][data-stat="armor"],
.lupen-app-screen [class*="stat"][data-stat="armour"],
.lupen-app-screen .armor-stat {
  --stat-accent: var(--lupen-stat-armor);
}

.lupen-app-screen [class*="stat"][data-stat="cargo"],
.lupen-app-screen .cargo-stat {
  --stat-accent: var(--lupen-stat-cargo);
}

.lupen-app-screen [class*="stat"][data-stat="jump"],
.lupen-app-screen .jump-stat {
  --stat-accent: var(--lupen-stat-jump);
}

.lupen-app-screen [class*="stat"][data-stat="evasion"],
.lupen-app-screen .evasion-stat {
  --stat-accent: var(--lupen-stat-evasion);
}

@media (max-height: 740px), (max-width: 1240px) {
  :root {
    --lupen-screen-gutter: 8px;
    --lupen-title-size: clamp(34px, 3.7vw, 46px);
  }
}

@media (max-width: 900px) {
  .lupen-app-screen {
    overflow-y: auto !important;
  }
}

/* Station Store: shared hierarchy and player-facing purchase states. */
#storeScreen.lupen-app-screen {
  padding: 18px !important;
}

#storeScreen .store-header-row {
  min-height: 76px;
  margin: 0 0 10px;
  padding: 0 2px;
  align-items: center;
}

#storeScreen .store-header-actions {
  align-self: center;
}

#storeScreen .store-credits-inline {
  min-height: 44px;
  box-sizing: border-box;
  border-radius: var(--lupen-control-radius);
}

#storeScreen .modern-store-topbar {
  min-height: 40px;
  margin: 0 0 10px;
}

#storeScreen #storeFilterBar {
  gap: 8px;
}

#storeScreen #storeFilterBar .store-filter-btn {
  min-height: 40px;
  border-radius: var(--lupen-control-radius);
  color: var(--lupen-text-soft);
  font-size: 0.72rem;
  letter-spacing: 0.1em;
}

#storeScreen #storeFilterBar .store-filter-btn.active {
  border-color: rgba(93, 211, 255, 0.82);
  color: var(--lupen-text);
}

#storeScreen .modern-store-layout {
  grid-template-columns: minmax(0, 1.45fr) minmax(380px, 0.8fr);
  gap: 12px;
}

#storeScreen .modern-store-catalog-panel,
#storeScreen .modern-store-detail-panel {
  border-radius: var(--lupen-panel-radius);
  padding: 12px;
}

#storeScreen .modern-store-panel-header {
  min-height: 28px;
  margin: 0 0 8px;
  align-items: center;
}

#storeScreen .modern-store-panel-header > span {
  font-size: 0.72rem;
  letter-spacing: 0.14em;
}

#storeScreen .store-catalog-count {
  color: var(--lupen-text-soft);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#storeScreen .store-catalog-grid {
  gap: 8px;
  padding: 0 8px 8px 0;
}

#storeScreen .store-catalog-card {
  min-height: 154px;
  height: 154px;
  max-height: 154px;
  border-radius: var(--lupen-control-radius);
}

#storeScreen .store-catalog-card:hover {
  transform: translateY(-1px);
}

#storeScreen .store-catalog-card:focus-visible {
  outline-offset: -2px;
}

#storeScreen .modern-store-detail-panel .modern-store-panel-header {
  margin-bottom: 8px;
}

#storeScreen .store-detail-content {
  gap: 6px;
  padding: 0 3px 6px 0;
  overflow-y: auto;
}

#storeScreen .store-detail-shell {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 0;
}

#storeScreen .simplified-store-detail .store-detail-visual {
  min-height: 124px !important;
  max-height: 124px !important;
  flex: 0 0 124px;
  border-radius: var(--lupen-control-radius) !important;
}

#storeScreen .store-detail-visual .quality-fx__item {
  max-height: 110px !important;
}

#storeScreen .store-detail-heading {
  display: grid;
  gap: 3px;
}

#storeScreen .store-detail-kicker {
  margin: 0;
  color: var(--lupen-cyan-bright);
  font-size: 0.68rem;
  letter-spacing: 0.14em;
}

#storeScreen .store-detail-title {
  margin: 0;
  color: var(--lupen-text);
  font-size: 1.34rem;
  line-height: 1.05;
  letter-spacing: 0.035em;
}

#storeScreen .store-detail-desc {
  color: var(--lupen-text-soft);
  font-size: 0.76rem;
  line-height: 1.35;
}

#storeScreen .store-item-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

#storeScreen .store-summary-cell {
  min-width: 0;
  min-height: 44px;
  box-sizing: border-box;
  padding: 7px 8px;
  border: 1px solid rgba(91, 187, 255, 0.2);
  border-radius: var(--lupen-control-radius);
  background: rgba(3, 12, 23, 0.78);
}

#storeScreen .store-summary-cell > span,
#storeScreen .store-detail-section-heading,
#storeScreen .compact-detail-stat-card > span {
  display: block;
  color: var(--lupen-text-muted);
  font-size: 0.56rem;
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

#storeScreen .store-summary-cell > strong {
  display: block;
  margin-top: 5px;
  overflow: hidden;
  color: var(--lupen-text);
  font-size: 0.78rem;
  line-height: 1.05;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#storeScreen .store-summary-availability {
  grid-column: 1 / -1;
  min-height: 36px;
  display: grid;
  grid-template-columns: auto minmax(86px, auto) minmax(0, 1fr);
  align-items: center;
  gap: 8px;
}

#storeScreen .store-summary-availability > strong {
  margin: 0;
}

#storeScreen .store-summary-availability > small {
  overflow: hidden;
  color: var(--lupen-text-soft);
  font-size: 0.62rem;
  line-height: 1.15;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#storeScreen .store-summary-availability.is-available > strong,
#storeScreen .store-summary-availability.is-owned > strong {
  color: #76ffc6;
}

#storeScreen .store-summary-availability.is-credits > strong,
#storeScreen .store-summary-availability.is-locked > strong,
#storeScreen .store-summary-availability.is-sold-out > strong {
  color: #ffb36f;
}

#storeScreen .store-detail-section-heading {
  margin-top: 1px;
}

#storeScreen .compact-detail-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

#storeScreen .compact-detail-stat-card {
  min-height: 42px;
  padding: 6px 8px;
  border-radius: var(--lupen-control-radius);
}

#storeScreen .compact-detail-stat-card > strong {
  margin-top: 4px;
  font-size: 0.88rem;
  line-height: 1;
}

#storeScreen .store-transaction-status {
  min-height: 32px;
  box-sizing: border-box;
  padding: 8px 10px;
  border: 1px solid rgba(91, 187, 255, 0.28);
  border-radius: var(--lupen-control-radius);
  background: rgba(5, 21, 35, 0.88);
  color: var(--lupen-text-soft);
  font-size: 0.7rem;
  font-weight: 800;
  line-height: 1.2;
}

#storeScreen .store-transaction-status.is-success,
#storeScreen .store-transaction-status.is-available {
  border-color: rgba(85, 235, 173, 0.38);
  color: #9fffd2;
}

#storeScreen .store-transaction-status.is-unavailable {
  border-color: rgba(255, 157, 100, 0.34);
  color: #ffc296;
}

#storeScreen .store-buy-footer {
  position: relative;
  z-index: 2;
  margin: 0;
  gap: 8px;
  padding-top: 8px;
}

#storeScreen .simplified-store-actions button {
  min-height: 42px;
  border-radius: var(--lupen-control-radius);
  font-size: 0.78rem;
}

@media (max-height: 740px) {
  #storeScreen.lupen-app-screen {
    padding: 14px !important;
  }

  #storeScreen .store-header-row {
    min-height: 68px;
  }

  #storeScreen .simplified-store-detail .store-detail-visual {
    min-height: 146px !important;
    max-height: 146px !important;
    flex-basis: 146px;
  }

  #storeScreen .store-detail-visual .quality-fx__item {
    max-height: 132px !important;
  }

  #storeScreen .store-detail-title {
    font-size: 1.26rem;
  }
}

/* Forge: concise upgrade decisions and shared screen hierarchy. */
#upgradeForgeScreen .forge-lupen-header {
  min-height: 88px;
}

#upgradeForgeScreen .forge-lupen-heading .hangar-subtitle {
  max-width: 640px;
}

#upgradeForgeScreen .forge-lupen-info {
  border-radius: var(--lupen-control-radius);
}

#upgradeForgeScreen .forge-shard-pill,
#upgradeForgeScreen .forge-panel,
#upgradeForgeScreen .forge-showcase,
#upgradeForgeScreen .forge-owned-item,
#upgradeForgeScreen .forge-level-node,
#upgradeForgeScreen .forge-preview-cost,
#upgradeForgeScreen .forge-start-btn {
  border-radius: var(--lupen-control-radius) !important;
}

#upgradeForgeScreen .modern-store-panel-header span {
  font-size: 0.74rem !important;
  letter-spacing: 0.14em !important;
}

#upgradeForgeScreen .modern-store-panel-header em {
  color: var(--lupen-text-soft);
  font-size: 0.62rem;
}

#upgradeForgeScreen .forge-owned-copy > strong {
  font-size: 1rem !important;
}

#upgradeForgeScreen .forge-owned-tags > span.vault {
  color: var(--lupen-text-soft) !important;
  border-color: rgba(143, 166, 183, 0.38) !important;
}

#upgradeForgeScreen .forge-state-preview {
  color: var(--lupen-text-soft) !important;
  font-size: 0.66rem !important;
}

#upgradeForgeScreen .forge-map1-preview h3 {
  font-size: 0.72rem !important;
}

#upgradeForgeScreen .forge-level-node > small {
  color: var(--forge-tier-color);
}

#upgradeForgeScreen .forge-level-flow--maximum {
  grid-template-columns: 1fr !important;
}

#upgradeForgeScreen .forge-level-flow--maximum > .forge-level-node--maximum {
  width: 100%;
  min-height: 52px !important;
  box-sizing: border-box;
}

#upgradeForgeScreen .forge-preview-stat--maximum {
  grid-template-columns: minmax(110px, 1fr) 84px 94px !important;
}

#upgradeForgeScreen .forge-preview-stat--maximum em {
  color: var(--forge-tier-color) !important;
  font-size: 0.66rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#upgradeForgeScreen .forge-upgrade-action-row {
  grid-template-columns: minmax(220px, 0.92fr) minmax(280px, 1.08fr);
}

#upgradeForgeScreen .forge-preview-cost {
  gap: 3px;
  min-height: 72px !important;
}

#upgradeForgeScreen .forge-cost-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

#upgradeForgeScreen .forge-cost-heading > span {
  color: var(--lupen-cyan-bright);
  font-size: 0.6rem;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

#upgradeForgeScreen .forge-cost-heading > em {
  padding: 2px 6px;
  border: 1px solid rgba(255, 212, 95, 0.34);
  border-radius: 999px;
  color: var(--lupen-warning);
  font-size: 0.52rem;
  font-style: normal;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

#upgradeForgeScreen .forge-preview-cost.ready .forge-cost-heading > em {
  border-color: rgba(70, 233, 155, 0.42);
  color: var(--lupen-success);
}

#upgradeForgeScreen .forge-preview-cost.maximum .forge-cost-heading > em {
  border-color: rgba(var(--forge-tier-rgb), 0.5);
  color: var(--forge-tier-color);
}

#upgradeForgeScreen .forge-cost-balance {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  color: var(--lupen-text-muted);
  font-size: 0.58rem;
  font-weight: 800;
  text-transform: uppercase;
}

#upgradeForgeScreen .forge-cost-balance b {
  margin-left: 3px;
  color: var(--lupen-text);
}

#upgradeForgeScreen .forge-preview-cost.blocked .forge-cost-balance span:last-child b {
  color: var(--lupen-warning);
}

#upgradeForgeScreen .forge-preview-cost strong.forge-maximum-label {
  display: block !important;
  margin-top: 4px !important;
  color: var(--forge-tier-color) !important;
  font-size: 0.82rem !important;
  line-height: 1.1 !important;
  text-transform: uppercase;
}

#upgradeForgeScreen .forge-start-btn {
  min-height: 72px !important;
  font-size: 0.86rem !important;
}

#upgradeForgeScreen .forge-bounty-help {
  color: var(--lupen-text-soft) !important;
}

#upgradeForgeScreen .terminal-empty-state {
  height: 100%;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 6px;
  padding: 24px;
  color: var(--lupen-text-soft);
  text-align: center;
}

#upgradeForgeScreen .terminal-empty-state strong {
  color: var(--lupen-text);
  font-size: 0.86rem;
}

#upgradeForgeScreen .terminal-empty-state span {
  max-width: 310px;
  font-size: 0.7rem;
  line-height: 1.4;
}

@media (max-height: 780px) and (min-width: 901px) {
  #upgradeForgeScreen .forge-lupen-header {
    min-height: 82px;
  }

  #upgradeForgeScreen .forge-lupen-heading > h2 {
    font-size: 2.55rem;
  }

  #upgradeForgeScreen .forge-lupen-heading .hangar-subtitle {
    margin-top: 3px;
    font-size: 0.68rem;
  }

  #upgradeForgeScreen .forge-preview-cost,
  #upgradeForgeScreen .forge-start-btn {
    min-height: 66px !important;
  }
}

/* Bounty Board: shared hierarchy and contract-state presentation. */
#bountyScreen.bounty-board-screen.lupen-app-screen {
  padding: 18px !important;
}

#bountyScreen .bounty-board-header {
  min-height: 78px;
  align-items: center;
}

#bountyScreen .bounty-board-header .hangar-subtitle {
  max-width: 640px;
}

#bountyScreen .bounty-status-strip {
  min-height: 42px !important;
  border-radius: var(--lupen-control-radius) !important;
}

#bountyScreen .bounty-status-message {
  color: var(--lupen-text-soft);
  font-size: 0.76rem;
}

#bountyScreen .bounty-reset-chip {
  border-radius: var(--lupen-control-radius);
}

#bountyScreen .bounty-main-grid {
  grid-template-columns: minmax(0, 1.72fr) minmax(380px, 0.98fr) !important;
  gap: 12px !important;
}

#bountyScreen .bounty-list-panel,
#bountyScreen .selected-contract-panel {
  border-radius: var(--lupen-panel-radius) !important;
}

#bountyScreen .bounty-list-header,
#bountyScreen .selected-contract-heading {
  min-height: 40px !important;
  padding: 0 14px !important;
}

#bountyScreen .bounty-list-header > span,
#bountyScreen .selected-contract-heading > span {
  font-size: 0.7rem !important;
  letter-spacing: 0.14em !important;
}

#bountyScreen .bounty-list-count {
  color: var(--lupen-text-soft) !important;
  font-size: 0.6rem !important;
}

#bountyScreen .bounty-board-layout-refined .bounty-contract-grid.bounty-list {
  gap: 8px !important;
  padding: 10px !important;
}

#bountyScreen .bounty-board-layout-refined .bounty-contract-card.bounty-card {
  grid-template-columns: 88px minmax(0, 1fr) 156px !important;
  gap: 12px !important;
  padding: 10px 12px !important;
  border-radius: var(--lupen-control-radius) !important;
}

#bountyScreen .bounty-board-layout-refined .bounty-card-icon.bounty-card__icon-frame {
  width: 80px !important;
  height: 80px !important;
  min-width: 80px !important;
  border-radius: var(--lupen-control-radius) !important;
}

#bountyScreen .bounty-card__body {
  gap: 5px !important;
}

#bountyScreen .bounty-card__title {
  font-size: 0.98rem !important;
}

#bountyScreen .bounty-card__subtitle {
  color: var(--lupen-text-soft) !important;
  font-size: 0.7rem !important;
}

#bountyScreen .bounty-card__chips {
  gap: 5px;
}

#bountyScreen .bounty-chip {
  min-height: 18px;
  padding: 3px 6px;
  font-size: 0.48rem !important;
}

#bountyScreen .bounty-card-threat {
  color: #ffd79f;
}

#bountyScreen .bounty-reward-box,
#bountyScreen .bounty-board-layout-refined .bounty-card-reward.bounty-reward-box {
  width: 156px !important;
  min-height: 62px !important;
  padding: 6px 9px !important;
  border-radius: var(--lupen-control-radius) !important;
}

#bountyScreen .bounty-reward-box__label {
  color: var(--lupen-cyan-bright);
  font-size: 0.52rem;
}

#bountyScreen .bounty-reward-box__value {
  font-size: 0.7rem !important;
}

#bountyScreen .bounty-status-chip {
  padding: 3px 7px;
  font-size: 0.5rem;
}

#bountyScreen .selected-contract-body.bounty-detail-body {
  grid-template-rows: auto auto auto minmax(0, 1fr) auto auto !important;
  gap: 6px !important;
  padding: 10px !important;
}

#bountyScreen .selected-bounty-header.selected-contract-top {
  min-height: 94px !important;
  padding: 10px !important;
  grid-template-columns: 78px minmax(0, 1fr) !important;
  gap: 10px !important;
  border-radius: var(--lupen-control-radius) !important;
}

#bountyScreen .bounty-board-layout-refined .selected-contract-icon.bounty-detail-icon {
  width: 72px !important;
  height: 72px !important;
  min-width: 72px !important;
  border-radius: var(--lupen-control-radius) !important;
}

#bountyScreen .selected-contract-copy {
  display: grid;
  grid-template-columns: max-content max-content minmax(0, 1fr);
  align-items: center;
  gap: 5px 6px;
}

#bountyScreen .selected-contract-copy > .bounty-chip {
  grid-column: 1;
}

#bountyScreen .selected-contract-state {
  grid-column: 2;
  width: max-content;
}

#bountyScreen .selected-contract-active-badge,
#bountyScreen .selected-contract-check {
  grid-column: 3;
}

#bountyScreen .selected-contract-copy > strong,
#bountyScreen .selected-contract-copy > span:last-child {
  grid-column: 1 / -1;
}

#bountyScreen .selected-contract-copy > strong {
  margin: 2px 0 0;
  font-size: 1.12rem !important;
}

#bountyScreen .selected-contract-copy > span:last-child {
  color: var(--lupen-text-soft);
  font-size: 0.7rem;
}

#bountyScreen .selected-contract-progress {
  padding: 7px 9px !important;
  border-radius: var(--lupen-control-radius) !important;
}

#bountyScreen .selected-contract-timer {
  min-height: 40px !important;
  grid-template-columns: auto auto;
  justify-content: space-between;
  padding: 6px 9px !important;
  border-radius: var(--lupen-control-radius) !important;
}

#bountyScreen .selected-contract-timer strong {
  font-size: 1.05rem !important;
}

#bountyScreen .selected-contract-rows {
  align-content: start;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px !important;
  overflow-y: auto;
}

#bountyScreen .selected-contract-row {
  min-height: 34px !important;
  padding: 6px 8px !important;
  border-radius: var(--lupen-control-radius) !important;
}

#bountyScreen .selected-contract-row > span {
  color: var(--lupen-text-muted) !important;
  font-size: 0.52rem !important;
  letter-spacing: 0.08em;
}

#bountyScreen .selected-contract-row > strong {
  font-size: 0.68rem !important;
}

#bountyScreen .selected-bounty-info-row--wide {
  grid-column: 1 / -1;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
}

#bountyScreen .bounty-payout-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  min-width: 0;
}

#bountyScreen .bounty-payout-summary > span {
  min-width: 0;
  display: grid;
  gap: 2px;
  padding-left: 8px;
  border-left: 1px solid rgba(91, 213, 255, 0.2);
}

#bountyScreen .bounty-payout-summary small {
  color: var(--lupen-text-muted);
  font-size: 0.48rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#bountyScreen .bounty-payout-summary b {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  overflow: hidden;
  color: var(--lupen-text);
  font-size: 0.68rem;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#bountyScreen .bounty-payout-summary img {
  width: 18px;
  height: 18px;
  object-fit: contain;
  filter: drop-shadow(0 0 7px rgba(91, 213, 255, 0.54));
}

#bountyScreen .selected-contract-actions {
  gap: 6px !important;
}

#bountyScreen .selected-contract-action,
#bountyScreen .selected-contract-actions button {
  min-height: 42px !important;
  border-radius: var(--lupen-control-radius) !important;
  font-size: 0.78rem !important;
}

#bountyScreen .bounty-detail-note.compact {
  color: var(--lupen-text-soft);
  font-size: 0.62rem;
  line-height: 1.25;
}

#bountyScreen .bounty-empty {
  height: 100%;
  display: grid;
  place-items: center;
  color: var(--lupen-text-soft);
  font-size: 0.76rem;
}

@media (max-height: 740px) {
  #bountyScreen.bounty-board-screen.lupen-app-screen {
    padding: 14px !important;
  }

  #bountyScreen .bounty-board-header {
    min-height: 70px;
  }

  #bountyScreen .bounty-board-layout-refined .bounty-card-icon.bounty-card__icon-frame {
    width: 70px !important;
    height: 70px !important;
    min-width: 70px !important;
  }
}

/* Journey alignment: state-aware guidance and reward claim clarity. */
#journeyScreen .journey-body {
  height: min(574px, calc(100vh - 174px));
}

#journeyScreen .journey-header {
  min-height: 88px;
}

#journeyScreen .journey-subtitle {
  display: block;
  max-width: 560px;
  margin-top: 5px;
  color: var(--lupen-text-soft);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

#journeyScreen .journey-briefing,
#journeyScreen .journey-chapters-panel,
#journeyScreen .journey-current-path,
#journeyScreen .journey-frontier-status,
#journeyScreen .journey-galaxy-strip {
  border-radius: var(--lupen-panel-radius);
}

#journeyScreen .journey-chapter-route__item,
#journeyScreen .journey-summary-compact,
#journeyScreen .journey-assignment-card {
  border-radius: var(--lupen-control-radius);
}

#journeyScreen .journey-chapter-route__item--pending .journey-chapter-route__status {
  color: var(--lupen-warning);
}

#journeyScreen .journey-assignment-card.mission-state-claimable {
  border-color: rgba(70, 233, 155, 0.82);
  box-shadow:
    0 0 0 1px rgba(70, 233, 155, 0.12),
    0 0 20px rgba(70, 233, 155, 0.12),
    inset 0 0 18px rgba(70, 233, 155, 0.04);
}

#journeyScreen .journey-assignment-card.mission-state-claimed {
  border-color: rgba(70, 233, 155, 0.34);
  opacity: 0.8;
}

#journeyScreen .journey-status-pill--claimable {
  border-color: rgba(70, 233, 155, 0.72);
  background: rgba(70, 233, 155, 0.18);
  color: #a8ffd0;
  box-shadow: 0 0 12px rgba(70, 233, 155, 0.14);
}

#journeyScreen .journey-status-pill--claimed {
  border-color: rgba(70, 233, 155, 0.36);
  background: rgba(70, 233, 155, 0.08);
  color: rgba(168, 255, 208, 0.74);
}

#journeyScreen .journey-objective-action button {
  min-height: 32px;
  border-radius: var(--lupen-control-radius);
}

@media (max-height: 740px) {
  #journeyScreen .journey-header {
    min-height: 76px;
  }

  #journeyScreen .journey-subtitle {
    font-size: 0.7rem;
  }
}

/* Trade Terminal alignment: clearer decisions, contract states, and compact fit. */
#marketScreen .trade-v2-summary,
#marketScreen .trade-v2-contract-strip,
#marketScreen .trade-v2-market-overview,
#marketScreen .trade-v2-market-board,
#marketScreen .trade-v2-quick-action,
#marketScreen .trade-v2-footer,
#marketScreen .trade-v2-contract-drawer {
  border-radius: var(--lupen-panel-radius);
}

#marketScreen .trade-v2-summary-item:first-child {
  border-radius: var(--lupen-panel-radius) 0 0 var(--lupen-panel-radius);
}

#marketScreen .trade-v2-summary-item:last-child {
  border-radius: 0 var(--lupen-panel-radius) var(--lupen-panel-radius) 0;
}

#marketScreen .trade-v2-contract-strip-button,
#marketScreen .trade-v2-contract-drawer-close,
#marketScreen .trade-v2-contract-action,
#marketScreen .trade-v2-stepper button,
#marketScreen .trade-v2-stepper input,
#marketScreen .trade-v2-quick-buttons button {
  border-radius: var(--lupen-control-radius);
}

#marketScreen .trade-v2-view[data-trade-view="market-first"] .trade-v2-quick-action {
  grid-template-rows: 48px 42px minmax(78px, 1fr) 90px;
  gap: 6px;
}

#marketScreen .trade-v2-view[data-trade-view="market-first"] .trade-v2-quick-resource {
  grid-template-columns: 40px minmax(0, 1fr);
  padding-bottom: 4px;
}

#marketScreen .trade-v2-view[data-trade-view="market-first"] .trade-v2-quick-resource img {
  width: 38px;
  height: 38px;
}

#marketScreen .trade-v2-view[data-trade-view="market-first"] .trade-v2-buy-control {
  grid-template-rows: 10px 38px 12px;
  gap: 4px;
  padding-top: 3px;
}

#marketScreen .trade-v2-view[data-trade-view="market-first"] .trade-v2-buy-control > span,
#marketScreen .trade-v2-view[data-trade-view="market-first"] .trade-v2-buy-control > small {
  margin: 0;
}

#marketScreen .trade-v2-view[data-trade-view="market-first"] .trade-v2-stepper button,
#marketScreen .trade-v2-view[data-trade-view="market-first"] .trade-v2-stepper input {
  height: 38px;
  min-height: 38px;
}

#marketScreen .trade-v2-view[data-trade-view="market-first"] .trade-v2-quick-buttons {
  grid-template-rows: 34px 34px 12px;
}

#marketScreen .trade-v2-view[data-trade-view="market-first"] .trade-v2-quick-buttons button {
  height: 34px;
  min-height: 34px;
}

#marketScreen .trade-v2-view[data-trade-view="market-first"] .trade-v2-buy-control > small,
#marketScreen .trade-v2-view[data-trade-view="market-first"] .trade-v2-quick-buttons > small {
  min-height: 12px;
  overflow: hidden;
  color: var(--lupen-text-soft);
  font-size: 0.54rem;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#marketScreen .trade-v2-contract-state {
  display: inline-flex;
  min-height: 22px;
  align-items: center;
  justify-content: center;
  padding: 3px 8px;
  border: 1px solid currentColor;
  border-radius: 999px;
  font-size: 0.58rem;
  font-style: normal;
  font-weight: 950;
  letter-spacing: 0.05em;
}

#marketScreen .trade-v2-contract-state--active {
  color: var(--lupen-warning);
  background: rgba(255, 212, 95, 0.1);
}

#marketScreen .trade-v2-contract-state--locked {
  color: var(--lupen-text-muted);
  background: rgba(143, 166, 183, 0.08);
}

#marketScreen .trade-v2-contract-state--complete {
  color: var(--lupen-success);
  background: rgba(70, 233, 155, 0.1);
}

/* Hangar alignment: shared vessel browser fit and consistent interaction states. */
#hangarOwnedSection #ownedShipsList.fleet-roster-list,
#hangarShipyardSection #shipShop.vessel-card-grid {
  grid-auto-rows: 74px !important;
  gap: 8px !important;
}

#hangarOwnedSection .unified-vessel-card.vessel-exchange-card.fleet-selector-card.exchange-vessel-card.fleet-roster-card,
#hangarShipyardSection .unified-vessel-card.vessel-exchange-card.fleet-selector-card.exchange-vessel-card {
  grid-template-columns: 58px minmax(0, 1fr) !important;
  grid-template-rows: 14px 20px 14px !important;
  column-gap: 9px !important;
  row-gap: 3px !important;
  min-height: 74px !important;
  height: 74px !important;
  padding: 8px !important;
  border-radius: var(--lupen-control-radius) !important;
}

#hangarOwnedSection .unified-vessel-card.vessel-exchange-card.fleet-selector-card.exchange-vessel-card.fleet-roster-card .fleet-card-image-wrap,
#hangarShipyardSection .unified-vessel-card.vessel-exchange-card.fleet-selector-card.exchange-vessel-card .fleet-card-image-wrap {
  width: 58px !important;
  height: 58px !important;
}

#hangarOwnedSection .unified-vessel-card.vessel-exchange-card.fleet-selector-card.exchange-vessel-card.fleet-roster-card .fleet-card-image-wrap img,
#hangarShipyardSection .unified-vessel-card.vessel-exchange-card.fleet-selector-card.exchange-vessel-card .fleet-card-image-wrap img {
  width: 54px !important;
  height: 54px !important;
  max-width: 54px !important;
  max-height: 54px !important;
}

#hangarScreen .hangar-tabs button,
#hangarScreen .vessel-line-filter select,
#hangarScreen .exchange-detail-footer button,
#hangarScreen .loadout-category-toggle button,
#hangarScreen .loadout-vault-controls input,
#hangarScreen .loadout-vault-controls select,
#hangarScreen .vault-utility-row input,
#hangarScreen .vault-utility-row select {
  border-radius: var(--lupen-control-radius) !important;
}

#hangarScreen .hangar-tabs button:focus-visible,
#hangarScreen .unified-vessel-card:focus-visible,
#hangarScreen .exchange-detail-footer button:focus-visible,
#hangarScreen .loadout-category-toggle button:focus-visible,
#hangarScreen .ship-plan-card:focus-visible,
#hangarScreen .vault-storage-card:focus-visible {
  outline: 2px solid var(--lupen-cyan-bright);
  outline-offset: 2px;
}

/* Planet hub and orbit alignment: honest affordances and accessible overlays. */
.planet-home-screen .hub-logout-button,
.planet-home-screen .hub-launch-btn {
  border-radius: var(--lupen-control-radius) !important;
}

.planet-home-screen .hub-actions {
  border-radius: var(--lupen-panel-radius) !important;
}

.planet-home-screen .hub-logout-button:focus-visible,
.planet-home-screen .hub-launch-btn:focus-visible,
.planet-home-screen .hub-action-button:focus-visible,
.player-orbit-screen button:focus-visible,
.player-orbit-screen [role="tab"]:focus-visible {
  outline: 2px solid var(--lupen-cyan-bright) !important;
  outline-offset: 2px !important;
}

.player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud > .status-panel,
.player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud > .ship-panel,
.player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud > .info-panel,
.player-orbit-screen .inventory-drawer,
.player-orbit-screen .tactical-panel {
  border-radius: var(--lupen-panel-radius) !important;
}

.player-orbit-screen .stat-label.static-status,
.player-orbit-screen .stat-label.static-status:hover {
  cursor: default !important;
  filter: none !important;
}

.player-orbit-screen button#hudCargoSummary {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  color: inherit !important;
  font: inherit !important;
  text-align: inherit !important;
  appearance: none !important;
  cursor: pointer !important;
}

.player-orbit-screen button#hudCargoSummary:hover,
.player-orbit-screen button#hudCargoSummary.active {
  border-color: rgba(119, 237, 255, 0.88) !important;
  background: rgba(12, 49, 72, 0.92) !important;
  box-shadow:
    0 0 14px rgba(86, 220, 245, 0.16),
    inset 0 0 12px rgba(86, 220, 245, 0.07) !important;
}

.player-orbit-screen .inventory-drawer-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.player-orbit-screen .inventory-drawer-close,
.player-orbit-screen .close-map-btn,
.player-orbit-screen .tactical-panel-close,
.player-orbit-screen .inventory-drawer-filters button,
.player-orbit-screen .sector-scan-btn,
.player-orbit-screen .tactical-panel-nav button,
.player-orbit-screen .tactical-chat-input-row input,
.player-orbit-screen .tactical-chat-input-row button {
  border-radius: var(--lupen-control-radius) !important;
}

.player-orbit-screen .inventory-drawer-close {
  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 !important;
  display: grid;
  place-items: center;
  border: 1px solid rgba(90, 190, 255, 0.58);
  background: rgba(5, 18, 34, 0.9);
  color: var(--lupen-text);
  font-size: 1.25rem;
  line-height: 1;
}