/* ==========================================================================
   Realms of Arkovia — Sleek Global HUD V1
   Work item: ROA-MARKETPLACE-GLOBAL-UI-SLEEK-002
   Scope: every non-Map Marketplace HUD + Story/Special Dungeon surfaces.
   The accepted Map remains authoritative through roa-map-sleek-v1.css.
   ========================================================================== */

body.galaxy-bg:not(.map-page) {
  --sleek-bg-0: #04070b;
  --sleek-bg-1: #070b10;
  --sleek-bg-2: #0b1118;
  --sleek-panel: #0a1017;
  --sleek-panel-2: #101821;
  --sleek-panel-3: #151f29;
  --sleek-line: #293540;
  --sleek-line-strong: #465361;
  --sleek-text: #ebe4d9;
  --sleek-text-soft: #c6cdd2;
  --sleek-muted: #95a0aa;
  --sleek-gold: #d8bf7c;
  --sleek-gold-soft: #b9a36c;
  --sleek-positive: #8fa49c;
  --sleek-warning: #d5b56f;
  --sleek-danger: #c98787;

  /* Re-map legacy theme variables so old components cannot revive magenta. */
  --roa-purple: #66737f;
  --roa-purple-bright: #93a0ab;
  --roa-purple-deep: #1b252f;
  --roa-gold: #bca369;
  --roa-gold-bright: #e4cc90;
  --text-accent: #d7c184;
  --accent-purple: #71808c;
  --accent-violet: #71808c;
  --border-subtle: rgba(139, 152, 165, 0.18);
  --bg-card: #0a1017;

  min-height: 100vh;
  color: var(--sleek-text);
  background:
    radial-gradient(circle at 18% 8%, rgba(111, 132, 148, 0.09), transparent 30rem),
    radial-gradient(circle at 82% 4%, rgba(65, 78, 92, 0.14), transparent 28rem),
    linear-gradient(180deg, #060a0f 0%, #04070b 48%, #030508 100%) !important;
  background-color: var(--sleek-bg-0) !important;
  background-image:
    radial-gradient(circle at 18% 8%, rgba(111, 132, 148, 0.09), transparent 30rem),
    radial-gradient(circle at 82% 4%, rgba(65, 78, 92, 0.14), transparent 28rem),
    linear-gradient(180deg, #060a0f 0%, #04070b 48%, #030508 100%) !important;
  background-attachment: fixed !important;
}

body.galaxy-bg:not(.map-page)::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0.18), rgba(0, 0, 0, 0.34)),
    radial-gradient(circle at 50% 30%, transparent 0%, rgba(0, 0, 0, 0.12) 55%, rgba(0, 0, 0, 0.34) 100%);
}

/* Remove the legacy ornate frame system from all redesigned non-Map pages. */
body.galaxy-bg:not(.map-page) * {
  border-image: none !important;
}

body.galaxy-bg:not(.map-page) main.container,
body.galaxy-bg:not(.map-page) main[class*="shell"] {
  background: transparent !important;
}

/* ==========================================================================
   Shared top HUD + bottom dock
   ========================================================================== */

body.galaxy-bg:not(.map-page) .roa-topbar {
  border-bottom: 1px solid rgba(145, 157, 169, 0.14) !important;
  background: linear-gradient(180deg, #0b1118 0%, #060a0f 100%) !important;
  box-shadow:
    0 12px 30px rgba(0, 0, 0, 0.62),
    inset 0 -1px 0 rgba(255, 255, 255, 0.025) !important;
}

body.galaxy-bg:not(.map-page) .roa-topbar::after {
  opacity: 0.16 !important;
  filter: grayscale(1) !important;
}

body.galaxy-bg:not(.map-page) .roa-brand-emblem,
body.galaxy-bg:not(.map-page) .roa-player-avatar {
  border-color: rgba(183, 166, 118, 0.30) !important;
  box-shadow:
    0 0 0 1px rgba(154, 166, 178, 0.10),
    0 6px 14px rgba(0, 0, 0, 0.42) !important;
  filter: none !important;
}

body.galaxy-bg:not(.map-page) .roa-brand-copy strong {
  color: #efe7da !important;
}

body.galaxy-bg:not(.map-page) .roa-brand-copy small,
body.galaxy-bg:not(.map-page) .roa-player-copy small,
body.galaxy-bg:not(.map-page) .roa-hud-resource small {
  color: var(--sleek-muted) !important;
}

body.galaxy-bg:not(.map-page) .roa-nav-item {
  color: #aeb7bf !important;
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  opacity: 0.82 !important;
}

body.galaxy-bg:not(.map-page) .roa-nav-item img {
  opacity: 0.72 !important;
  filter: grayscale(0.30) saturate(0.52) brightness(0.90) !important;
}

body.galaxy-bg:not(.map-page) .roa-nav-item:hover,
body.galaxy-bg:not(.map-page) .roa-nav-item:focus-visible {
  color: #edf1f4 !important;
  background: rgba(114, 128, 141, 0.08) !important;
  opacity: 1 !important;
}

body.galaxy-bg:not(.map-page) .roa-nav-item.is-active,
body.galaxy-bg:not(.map-page) .roa-nav-group.is-active > .roa-nav-item {
  color: #ffffff !important;
  background: linear-gradient(180deg, rgba(117, 132, 145, 0.16), rgba(68, 81, 93, 0.06)) !important;
  box-shadow: inset 0 -2px 0 #81909c !important;
  opacity: 1 !important;
}

body.galaxy-bg:not(.map-page) .roa-nav-item.is-active::after,
body.galaxy-bg:not(.map-page) .roa-nav-group.is-active > .roa-nav-item::after {
  background: #87949f !important;
  box-shadow: none !important;
}

body.galaxy-bg:not(.map-page) .roa-nav-item.is-active img,
body.galaxy-bg:not(.map-page) .roa-nav-group.is-active > .roa-nav-item img {
  opacity: 1 !important;
  filter: grayscale(0.14) saturate(0.68) brightness(1.04) !important;
}

body.galaxy-bg:not(.map-page) .roa-hud-resource {
  border-color: rgba(145, 157, 169, 0.10) !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.galaxy-bg:not(.map-page) .roa-hud-resource strong {
  color: #e8e0d4 !important;
}

body.galaxy-bg:not(.map-page) .roa-account-trigger,
body.galaxy-bg:not(.map-page) .roa-icon-button {
  border: 1px solid #303b46 !important;
  border-radius: 10px !important;
  color: #dce2e7 !important;
  background: linear-gradient(180deg, #18212b, #0d131a) !important;
  box-shadow: none !important;
  filter: none !important;
  opacity: 1 !important;
}

body.galaxy-bg:not(.map-page) .roa-account-trigger:hover,
body.galaxy-bg:not(.map-page) .roa-account-trigger:focus-visible,
body.galaxy-bg:not(.map-page) .roa-icon-button:hover,
body.galaxy-bg:not(.map-page) .roa-icon-button:focus-visible {
  border-color: #53616e !important;
  background: linear-gradient(180deg, #202b37, #121922) !important;
  filter: none !important;
}

body.galaxy-bg:not(.map-page) .roa-settings-glyph {
  color: #dce2e7 !important;
  text-shadow: none !important;
}

body.galaxy-bg:not(.map-page) .roa-bottom-dock {
  border-top: 1px solid rgba(145, 157, 169, 0.14) !important;
  background: linear-gradient(180deg, #070b10, #030508) !important;
  box-shadow:
    0 -10px 26px rgba(0, 0, 0, 0.54),
    inset 0 1px 0 rgba(255, 255, 255, 0.02) !important;
}

body.galaxy-bg:not(.map-page) .roa-bottom-dock > a {
  color: #9ba6af !important;
  background: transparent !important;
  border-color: rgba(145, 157, 169, 0.07) !important;
  opacity: 0.82 !important;
}

body.galaxy-bg:not(.map-page) .roa-bottom-dock > a:hover,
body.galaxy-bg:not(.map-page) .roa-bottom-dock > a.is-active {
  color: #f1f4f6 !important;
  background: rgba(119, 133, 146, 0.08) !important;
  opacity: 1 !important;
}

body.galaxy-bg:not(.map-page) .roa-bottom-dock > a.is-active::before {
  background: linear-gradient(90deg, transparent, #87949f, transparent) !important;
  box-shadow: none !important;
}

body.galaxy-bg:not(.map-page) .roa-bottom-dock img,
body.galaxy-bg:not(.map-page) .roa-bottom-dock > a:hover img,
body.galaxy-bg:not(.map-page) .roa-bottom-dock > a.is-active img {
  opacity: 0.86 !important;
  filter: grayscale(0.22) saturate(0.60) brightness(0.98) !important;
}

body.galaxy-bg:not(.map-page) .roa-world-progress i {
  border-color: rgba(145, 157, 169, 0.16) !important;
  background: linear-gradient(90deg, #778692 42%, rgba(255, 255, 255, 0.045) 42%) !important;
  box-shadow: none !important;
}

/* ==========================================================================
   Shared settings / Soundtrack / Field Guide
   ========================================================================== */

body.galaxy-bg:not(.map-page) .roa-account-dropdown {
  opacity: 1 !important;
  border: 1px solid #293540 !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg, #111821 0%, #0b1017 48%, #070b10 100%) !important;
  box-shadow:
    0 24px 50px rgba(0, 0, 0, 0.78),
    inset 0 1px 0 rgba(255, 255, 255, 0.035) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body.galaxy-bg:not(.map-page) .roa-account-dropdown :is(
  .roa-settings-utility-trigger,
  .roa-music-trigger,
  .roa-help-trigger,
  .roa-menu-action
) {
  color: #e8e1d5 !important;
  border: 1px solid #2a3541 !important;
  border-radius: 9px !important;
  background: linear-gradient(180deg, #151e28, #0c1219) !important;
  box-shadow: none !important;
  filter: none !important;
}

body.galaxy-bg:not(.map-page) .roa-account-dropdown :is(
  .roa-settings-utility-trigger,
  .roa-music-trigger,
  .roa-help-trigger,
  .roa-menu-action
):hover,
body.galaxy-bg:not(.map-page) .roa-account-dropdown :is(
  .roa-settings-utility-trigger,
  .roa-music-trigger,
  .roa-help-trigger,
  .roa-menu-action
):focus-visible {
  color: #fff !important;
  border-color: #4a5865 !important;
  background: linear-gradient(180deg, #1d2834, #101720) !important;
}

body.galaxy-bg:not(.map-page) .roa-music-trigger::after,
body.galaxy-bg:not(.map-page) .roa-music-trigger.is-playing::after {
  border-color: #56616c !important;
  background: #66737f !important;
  box-shadow: none !important;
}

body.galaxy-bg:not(.map-page) :is(.roa-music-panel, .roa-help-panel) {
  opacity: 1 !important;
  color: var(--sleek-text) !important;
  border: 1px solid #293540 !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, #121922 0%, #0a1017 48%, #070b10 100%) !important;
  box-shadow:
    0 30px 70px rgba(0, 0, 0, 0.82),
    inset 0 1px 0 rgba(255, 255, 255, 0.035) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  filter: none !important;
}

body.galaxy-bg:not(.map-page) .roa-account-dropdown :is(
  button.roa-help-topic,
  button.roa-help-close,
  button.roa-music-control
) {
  color: #d8dfe4 !important;
  border: 1px solid #303b46 !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, #18212b, #0d131a) !important;
  box-shadow: none !important;
  filter: none !important;
}

body.galaxy-bg:not(.map-page) .roa-account-dropdown button.roa-help-topic.is-active {
  color: #fff !important;
  border-color: #65727e !important;
  background: linear-gradient(180deg, #26323e, #151d26) !important;
  box-shadow: inset 3px 0 0 #a8b2bb !important;
}

/* ==========================================================================
   Universal control language
   ========================================================================== */

body.galaxy-bg:not(.map-page) :is(
  button,
  .button,
  a.button,
  [class*="theme-button"],
  [class*="family-button"],
  [class*="storybook-"][class*="action"],
  [class*="storybook-"][class*="button"]
) {
  text-shadow: none !important;
}

body.galaxy-bg:not(.map-page) :is(
  button:not(.roa-account-trigger):not(.roa-icon-button),
  .button,
  a.button,
  [class*="theme-button"],
  [class*="family-button"]
) {
  color: #e7e0d5 !important;
  border-color: #34414d !important;
  background-color: #111821 !important;
  background-image: linear-gradient(180deg, #18212b 0%, #0d131a 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.025),
    0 4px 10px rgba(0, 0, 0, 0.24) !important;
  filter: none !important;
}

body.galaxy-bg:not(.map-page) :is(
  button:not(.roa-account-trigger):not(.roa-icon-button),
  .button,
  a.button,
  [class*="theme-button"],
  [class*="family-button"]
):hover,
body.galaxy-bg:not(.map-page) :is(
  button:not(.roa-account-trigger):not(.roa-icon-button),
  .button,
  a.button,
  [class*="theme-button"],
  [class*="family-button"]
):focus-visible {
  color: #fff !important;
  border-color: #5a6875 !important;
  background-color: #1a242f !important;
  background-image: linear-gradient(180deg, #202c38 0%, #121922 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 6px 14px rgba(0, 0, 0, 0.30) !important;
  outline: none !important;
  filter: none !important;
}

body.galaxy-bg:not(.map-page) button:disabled,
body.galaxy-bg:not(.map-page) .button[aria-disabled="true"] {
  opacity: 0.42 !important;
  filter: grayscale(0.5) !important;
}

body.galaxy-bg:not(.map-page) :is(input, select, textarea) {
  color: #e6e0d6 !important;
  border-color: #303b46 !important;
  background: #090f15 !important;
  box-shadow: none !important;
  accent-color: #82919d !important;
}

body.galaxy-bg:not(.map-page) :is(input, select, textarea):focus,
body.galaxy-bg:not(.map-page) :is(input, select, textarea):focus-visible {
  border-color: #61707c !important;
  outline: 1px solid rgba(129, 145, 157, 0.32) !important;
  box-shadow: 0 0 0 2px rgba(129, 145, 157, 0.08) !important;
}

body.galaxy-bg:not(.map-page) ::placeholder {
  color: #77838e !important;
}

body.galaxy-bg:not(.map-page) :is(table, thead, tbody, tr, th, td) {
  border-color: rgba(136, 150, 163, 0.15) !important;
}

body.galaxy-bg:not(.map-page) thead th {
  color: #dce3e8 !important;
  background: #0d141c !important;
}

body.galaxy-bg:not(.map-page) tbody tr:hover :is(th, td) {
  background: rgba(111, 126, 139, 0.07) !important;
}

/* ==========================================================================
   Shared panel treatment
   ========================================================================== */

body.galaxy-bg:not(.map-page) :where(
  [class*="command-header"],
  [class*="command-toolbar"],
  [class*="-panel"],
  [class*="-card"],
  [class*="-ribbon"],
  [class*="-ledger"],
  [class*="-inspector"],
  [class*="-tile"],
  [class*="-summary"],
  [class*="-quickview"],
  [class*="-status-row"],
  [class*="-metric"]
):not(.special-story-art):not(.roa-season-boss-scene):not(.adventurer-portrait) {
  border-color: rgba(132, 145, 157, 0.18) !important;
  background-color: var(--sleek-panel) !important;
  box-shadow: none !important;
}

body.galaxy-bg:not(.map-page) :where(
  [class*="command-header"],
  [class*="-panel"],
  [class*="-card"],
  [class*="-ledger"],
  [class*="-inspector"]
):not(.special-story-art):not(.roa-season-boss-scene):not(.adventurer-portrait) {
  background-image: linear-gradient(180deg, rgba(17, 24, 33, 0.98), rgba(8, 13, 19, 0.99)) !important;
}

body.galaxy-bg:not(.map-page) :where(
  h1, h2, h3,
  [class*="-title"] strong,
  [class*="-heading"] strong
) {
  text-shadow: none !important;
}

body.galaxy-bg:not(.map-page) .eyebrow,
body.galaxy-bg:not(.map-page) [class*="-kicker"],
body.galaxy-bg:not(.map-page) [class*="-eyebrow"] {
  color: #aeb7bf !important;
}

body.galaxy-bg:not(.map-page) :where(
  [class*="command-title"] h1,
  [class*="-panel"] h2,
  [class*="-panel"] h3,
  [class*="-card"] h2,
  [class*="-card"] h3,
  .storybook-page h1,
  .storybook-page h2,
  .storybook-page h3
) {
  color: #eee6d9 !important;
}

/* ==========================================================================
   Adventurer / Profile
   ========================================================================== */

body.profile-page :is(
  .adventurer-command-header,
  .adventurer-identity-card,
  .adventurer-readiness-panel,
  .adventurer-activity-panel,
  .adventurer-detail-panel,
  .adventurer-overview-card,
  .adventurer-progression-card,
  .adventurer-title-control,
  .adventurer-title-card,
  .adventurer-achievement-card,
  .adventurer-journal-list > article
) {
  border-color: #293540 !important;
  background: linear-gradient(180deg, #111821, #080d13) !important;
  box-shadow: none !important;
}

body.profile-page .adventurer-portrait::after {
  border: 1px solid #34414d !important;
  border-radius: 14px !important;
  background: transparent !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.02) !important;
}

body.profile-page .adventurer-command-title > img,
body.profile-page .adventurer-panel-heading > img {
  filter: grayscale(0.15) saturate(0.68) brightness(1.02) !important;
}

body.profile-page :is(
  .adventurer-tab.is-active,
  .adventurer-tab[aria-selected="true"]
) {
  color: #fff !important;
  border-color: #65727e !important;
  background: linear-gradient(180deg, #26323e, #151d26) !important;
  box-shadow: inset 0 -2px 0 #9ca7b0 !important;
}

/* ==========================================================================
   Loadout
   ========================================================================== */

body.roa-loadout-page :is(
  .roa-loadout-command-header,
  .roa-loadout-slot-panel,
  .roa-loadout-inventory-panel,
  .roa-loadout-detail-panel,
  .roa-loadout-readiness-panel,
  .roa-loadout-slot,
  .roa-loadout-inventory-card,
  .roa-loadout-selected-card
) {
  border-color: #293540 !important;
  background: linear-gradient(180deg, #111821, #080d13) !important;
  box-shadow: none !important;
}

body.roa-loadout-page :is(
  .roa-loadout-tab.is-active,
  .roa-loadout-tab[aria-selected="true"],
  .roa-loadout-activity-tab.is-active,
  .roa-loadout-activity-tab[aria-selected="true"]
) {
  border-color: #65727e !important;
  background: linear-gradient(180deg, #26323e, #151d26) !important;
  box-shadow: inset 0 -2px 0 #9ca7b0 !important;
  filter: none !important;
}

/* ==========================================================================
   Game Vault / Custody
   ========================================================================== */

body.roa-custody-page :is(
  .roa-custody-hero,
  .roa-custody-panel,
  .roa-custody-card,
  .roa-custody-toolbar,
  .roa-custody-summary,
  .roa-custody-asset-card,
  .roa-custody-wallet-card
) {
  border-color: #293540 !important;
  background: linear-gradient(180deg, #111821, #080d13) !important;
  box-shadow: none !important;
}

body.roa-custody-page [class*="roa-custody-"][class*="active"],
body.roa-custody-page [class*="roa-custody-"].is-selected {
  border-color: #65727e !important;
  box-shadow: inset 0 0 0 1px rgba(145, 157, 169, 0.18) !important;
}

/* ==========================================================================
   Crafting
   ========================================================================== */

body.roa-crafting-page :is(
  .roa-crafting-command-header,
  .roa-crafting-material-pouch,
  .roa-crafting-codex,
  .roa-crafting-detail-panel,
  .roa-crafting-material-tile,
  .roa-crafting-recipe-card,
  .roa-crafting-requirement-card
) {
  border-color: #293540 !important;
  background: linear-gradient(180deg, #111821, #080d13) !important;
  box-shadow: none !important;
}

body.roa-crafting-page .roa-crafting-command-title > img,
body.roa-crafting-page [class*="roa-crafting-"] img {
  filter: grayscale(0.12) saturate(0.72) brightness(1.02) !important;
}

body.roa-crafting-page :is(
  .roa-crafting-filter-tabs button.is-active,
  .roa-crafting-filter-tabs button[aria-pressed="true"],
  .roa-crafting-recipe-card.is-active,
  .roa-crafting-recipe-card.is-selected
) {
  color: #fff !important;
  border-color: #65727e !important;
  background: linear-gradient(180deg, #26323e, #151d26) !important;
  box-shadow: inset 0 0 0 1px rgba(168, 178, 187, 0.12) !important;
  filter: none !important;
}

/* ==========================================================================
   Marketplace / Buy / Sell / Orders / Intel
   ========================================================================== */

body.roa-marketplace-family-page :is(
  .roa-marketplace-command-header,
  .roa-marketplace-subpage-header,
  .roa-marketplace-command-toolbar,
  .roa-marketplace-trade-desk,
  .roa-marketplace-resource-panel,
  .roa-marketplace-selected-summary,
  .roa-orders-command-toolbar,
  .roa-orders-ledger,
  .roa-order-inspector,
  .roa-order-ledger-row,
  .roa-order-inspector-summary,
  .roa-intel-watch-panel,
  .roa-intel-analytics-panel,
  .roa-intel-signals-panel,
  .roa-intel-watch-button,
  .roa-intel-balance-chart,
  .roa-intel-overview-cards article,
  .roa-marketplace-trade-shell section,
  .roa-marketplace-trade-shell article
) {
  border-color: #293540 !important;
  background: linear-gradient(180deg, #111821, #080d13) !important;
  box-shadow: none !important;
}

body.roa-marketplace-family-page :is(
  .roa-marketplace-family-tabs button[aria-selected="true"],
  .roa-marketplace-family-tabs button.is-active,
  .roa-order-ledger-row.is-selected,
  .roa-intel-watch-button.is-active
) {
  color: #fff !important;
  border-color: #65727e !important;
  background: linear-gradient(180deg, #26323e, #151d26) !important;
  box-shadow: inset 3px 0 0 #a8b2bb !important;
  filter: none !important;
}

body.roa-marketplace-family-page :is(
  .roa-marketplace-subpage-title > img,
  .roa-marketplace-command-title > img,
  .roa-marketplace-family-panel-heading > img
) {
  filter: grayscale(0.12) saturate(0.72) brightness(1.02) !important;
}

body.roa-marketplace-family-page .roa-intel-bar-row i {
  background: linear-gradient(90deg, #697784, #9aa5ae) !important;
  box-shadow: none !important;
}

/* ==========================================================================
   Account
   ========================================================================== */

body.roa-account-command-page :is(
  .roa-account-command-header,
  .roa-account-portfolio-ribbon,
  .roa-account-identity-panel,
  .roa-account-vault-panel,
  .roa-account-wallet-card,
  .roa-account-status-row,
  .roa-account-holding-card,
  .roa-account-dev-form,
  .roa-account-filter-empty
) {
  border-color: #293540 !important;
  background: linear-gradient(180deg, #111821, #080d13) !important;
  box-shadow: none !important;
}

body.roa-account-command-page .roa-account-avatar {
  border-color: #34414d !important;
  box-shadow: 0 8px 18px rgba(0,0,0,0.38) !important;
}

body.roa-account-command-page :is(
  button.roa-account-tab.is-active,
  button.roa-account-tab[aria-selected="true"]
) {
  color: #fff !important;
  border-color: #65727e !important;
  background: linear-gradient(180deg, #26323e, #151d26) !important;
  box-shadow: inset 0 -2px 0 #a8b2bb !important;
  filter: none !important;
}

/* ==========================================================================
   Season / Rankings / analytics
   ========================================================================== */

body.season-page :is(
  .roa-season-command-header,
  .roa-season-metric-ribbon,
  .roa-season-boss-theatre,
  .roa-season-player-record,
  .roa-season-community-leaders,
  .roa-season-campaign-pulse,
  .roa-season-event-track article,
  .season-analytics-status,
  .analytics-section,
  .analytics-debug-panel
),
body.leaderboards-page :is(
  [class*="roa-rankings-"][class*="panel"],
  [class*="roa-rankings-"][class*="card"],
  [class*="roa-rankings-"][class*="header"],
  [class*="roa-rankings-"][class*="row"]
) {
  border-color: #293540 !important;
  background: linear-gradient(180deg, #111821, #080d13) !important;
  box-shadow: none !important;
}

body.season-page :is(
  .roa-season-tabs button.is-active,
  .roa-season-tabs button[aria-selected="true"]
),
body.leaderboards-page :is(
  button.is-active,
  button[aria-selected="true"]
) {
  color: #fff !important;
  border-color: #65727e !important;
  background: linear-gradient(180deg, #26323e, #151d26) !important;
  box-shadow: inset 0 -2px 0 #a8b2bb !important;
  filter: none !important;
}

body.season-page .roa-season-command-title > img,
body.season-page .roa-season-event-track img {
  filter: grayscale(0.10) saturate(0.72) brightness(1.02) !important;
}

body.season-page .analytics-table-wrap {
  border-color: #293540 !important;
  background: #090f15 !important;
}

body.season-page .analytics-table thead th {
  background: #0d141c !important;
}

/* ==========================================================================
   Story Journal / Dungeon Detail / Reader / Archive
   ========================================================================== */

body.storybook-page {
  background:
    radial-gradient(circle at 18% 8%, rgba(111, 132, 148, 0.08), transparent 30rem),
    radial-gradient(circle at 82% 4%, rgba(184, 159, 99, 0.05), transparent 28rem),
    linear-gradient(180deg, #060a0f 0%, #04070b 52%, #030508 100%) !important;
}

body.storybook-page :is(
  .storybook-hero,
  .storybook-panel,
  .storybook-detail-card,
  .storybook-reader-card,
  .storybook-resume-card,
  .storybook-unavailable,
  .storybook-summary-grid article,
  .storybook-dungeon-card,
  .saga-entry,
  [class*="roa-story-"][class*="panel"],
  [class*="roa-story-"][class*="card"],
  [class*="roa-story-"][class*="header"],
  [class*="roa-story-"][class*="section"]
) {
  border-color: #293540 !important;
  background: linear-gradient(180deg, #111821, #080d13) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body.storybook-page :is(.saga-entry.active, .saga-entry.unlocked) {
  border-color: #65727e !important;
  background: linear-gradient(180deg, #202b36, #101720) !important;
  box-shadow: inset 3px 0 0 #9ca7b0 !important;
}

body.storybook-page .saga-entry.completed {
  border-color: rgba(216, 191, 124, 0.48) !important;
  background: linear-gradient(180deg, #1b1b19, #0c1013) !important;
  box-shadow: inset 3px 0 0 #b8a36d !important;
}

body.storybook-page :is(
  .storybook-primary-action,
  .storybook-secondary-action,
  .storybook-back-link
) {
  color: #e7e0d5 !important;
  border: 1px solid #34414d !important;
  border-radius: 9px !important;
  background: linear-gradient(180deg, #18212b, #0d131a) !important;
  box-shadow: none !important;
  filter: none !important;
}

body.storybook-page :is(
  .storybook-primary-action,
  .storybook-secondary-action,
  .storybook-back-link
):hover,
body.storybook-page :is(
  .storybook-primary-action,
  .storybook-secondary-action,
  .storybook-back-link
):focus-visible {
  color: #fff !important;
  border-color: #5a6875 !important;
  background: linear-gradient(180deg, #202c38, #121922) !important;
}

body.storybook-page :is(
  .storybook-meta-row span,
  .storybook-meta-list span,
  .saga-status-label,
  [class*="story-status"],
  [class*="story-badge"]
) {
  color: #d7dee3 !important;
  border-color: #34414d !important;
  background: #101720 !important;
}

/* ==========================================================================
   Epilogue family
   ========================================================================== */

body.epilogue-page :is(
  [class*="epilogue-"][class*="panel"],
  [class*="epilogue-"][class*="card"],
  [class*="epilogue-"][class*="header"],
  [class*="epilogue-"][class*="row"],
  [class*="roa-epilogue-"][class*="panel"],
  [class*="roa-epilogue-"][class*="card"],
  [class*="roa-epilogue-"][class*="header"],
  [class*="roa-victory-"][class*="panel"],
  [class*="roa-victory-"][class*="card"],
  [class*="roa-personal-"][class*="panel"],
  [class*="roa-personal-"][class*="card"]
) {
  border-color: #293540 !important;
  background: linear-gradient(180deg, #111821, #080d13) !important;
  box-shadow: none !important;
}

body.epilogue-page :is(
  button,
  .button,
  a[class*="button"],
  a[class*="action"]
) {
  text-shadow: none !important;
  filter: none !important;
}

/* ==========================================================================
   Migration + admin analytics
   ========================================================================== */

body.galaxy-bg:not(.map-page) :is(
  .hero,
  .analytics-section,
  .season-analytics-status,
  .analytics-debug-panel,
  .analytics-table-wrap
) {
  border-color: #293540 !important;
  background: linear-gradient(180deg, #111821, #080d13) !important;
  box-shadow: none !important;
}

/* ==========================================================================
   Standalone Special Dungeon story renderer
   ========================================================================== */

body.special-dungeon-story-page {
  background:
    radial-gradient(circle at 50% 0%, rgba(103, 126, 112, 0.12), transparent 30rem),
    radial-gradient(circle at 16% 26%, rgba(184, 159, 99, 0.07), transparent 24rem),
    linear-gradient(180deg, #060a0f 0%, #04070b 52%, #030508 100%) !important;
}

body.special-dungeon-story-page .special-story-shell {
  max-width: 1180px !important;
}

body.special-dungeon-story-page .special-story-card {
  border: 1px solid #293540 !important;
  border-radius: 20px !important;
  background: linear-gradient(180deg, #111821 0%, #080d13 100%) !important;
  box-shadow: 0 26px 64px rgba(0,0,0,0.58) !important;
}

body.special-dungeon-story-page .special-story-card::before {
  opacity: 0.14 !important;
  filter: grayscale(1) !important;
}

body.special-dungeon-story-page .special-story-art {
  border: 1px solid #34414d !important;
  border-radius: 16px !important;
  background:
    radial-gradient(circle at 50% 45%, rgba(106, 130, 113, 0.14), transparent 34%),
    linear-gradient(135deg, #111b18, #0a1017) !important;
  box-shadow: inset 0 0 50px rgba(117, 139, 124, 0.07) !important;
}

body.special-dungeon-story-page .special-story-art.boss-art {
  background:
    radial-gradient(circle at 50% 30%, rgba(196, 171, 108, 0.12), transparent 28%),
    radial-gradient(circle at 50% 62%, rgba(106, 130, 113, 0.12), transparent 36%),
    linear-gradient(135deg, #171914, #0a1017) !important;
}

body.special-dungeon-story-page .special-story-art-glow {
  background: radial-gradient(circle, rgba(139, 158, 144, 0.18), transparent 64%) !important;
}

body.special-dungeon-story-page .special-story-art-frame {
  border: 1px solid #3a4651 !important;
  border-radius: 14px !important;
  background: #090f15 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body.special-dungeon-story-page :is(
  .special-story-art-label,
  .special-story-kicker,
  .special-lore-summary span,
  .special-final-revelation span,
  .special-rewards-placeholder span
) {
  color: var(--sleek-gold) !important;
}

body.special-dungeon-story-page :is(
  .special-story-copy h1,
  .special-story-copy h2,
  .special-story-text,
  .special-story-art-frame strong
) {
  color: #eee8dd !important;
  text-shadow: none !important;
}

body.special-dungeon-story-page :is(
  .special-story-art-frame small,
  .special-choice-button small,
  .special-story-footer
) {
  color: #9da8b1 !important;
}

body.special-dungeon-story-page .special-room-progress {
  color: #e6d9ad !important;
  border-color: #554c36 !important;
  background: #17160f !important;
}

body.special-dungeon-story-page .special-choice-button,
body.special-dungeon-story-page .special-continue-button {
  color: #e9e3d9 !important;
  border: 1px solid #34414d !important;
  border-radius: 10px !important;
  background: linear-gradient(180deg, #18212b, #0d131a) !important;
  box-shadow: none !important;
  cursor: pointer !important;
}

body.special-dungeon-story-page .special-choice-button:hover,
body.special-dungeon-story-page .special-choice-button:focus-visible,
body.special-dungeon-story-page .special-continue-button:hover,
body.special-dungeon-story-page .special-continue-button:focus-visible {
  color: #fff !important;
  border-color: #5a6875 !important;
  background: linear-gradient(180deg, #202c38, #121922) !important;
}

body.special-dungeon-story-page .special-choice-button.final-choice {
  border-color: #5b543e !important;
  background: linear-gradient(180deg, #1c1b16, #10130f) !important;
}

body.special-dungeon-story-page :is(
  .special-lore-summary,
  .special-final-revelation,
  .special-rewards-placeholder
) {
  border: 1px solid #303b46 !important;
  border-radius: 10px !important;
  background: #0b1118 !important;
}

body.special-dungeon-story-page .special-rewards-placeholder {
  border-color: #514a37 !important;
  background: #15140f !important;
}

body.special-dungeon-story-page .special-story-footer {
  border-top-color: #293540 !important;
}

/* ==========================================================================
   Scrollbars — dark steel only
   ========================================================================== */

body.galaxy-bg:not(.map-page),
body.galaxy-bg:not(.map-page) * {
  scrollbar-width: thin !important;
  scrollbar-color: #596673 #090d12 !important;
}

body.galaxy-bg:not(.map-page)::-webkit-scrollbar,
body.galaxy-bg:not(.map-page) *::-webkit-scrollbar {
  width: 9px !important;
  height: 9px !important;
}

body.galaxy-bg:not(.map-page)::-webkit-scrollbar-track,
body.galaxy-bg:not(.map-page) *::-webkit-scrollbar-track {
  background: #090d12 !important;
  border-radius: 8px !important;
}

body.galaxy-bg:not(.map-page)::-webkit-scrollbar-thumb,
body.galaxy-bg:not(.map-page) *::-webkit-scrollbar-thumb {
  border: 2px solid #090d12 !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, #677583, #4a5662) !important;
  box-shadow: none !important;
}

body.galaxy-bg:not(.map-page)::-webkit-scrollbar-thumb:hover,
body.galaxy-bg:not(.map-page) *::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #85929d, #606e7a) !important;
}

/* ==========================================================================
   Responsive containment
   ========================================================================== */

@media (max-width: 1120px) {
  body.galaxy-bg:not(.map-page) {
    overflow-y: auto !important;
  }

  body.galaxy-bg:not(.map-page) main.container,
  body.galaxy-bg:not(.map-page) main[class*="shell"] {
    overflow: visible !important;
  }
}

@media (max-width: 760px) {
  body.galaxy-bg:not(.map-page) .roa-account-dropdown .roa-help-panel,
  body.galaxy-bg:not(.map-page) .roa-account-dropdown .roa-music-panel {
    width: calc(100vw - 20px) !important;
    max-width: calc(100vw - 20px) !important;
  }

  body.special-dungeon-story-page .special-story-card {
    border-radius: 14px !important;
  }
}

/* End ROA-MARKETPLACE-GLOBAL-UI-SLEEK-002 */


/* ==========================================================================
   GLOBAL SLEEK V2 — PROFESSIONAL LAYOUT CORRECTION
   Goals:
   - true black shell behind every HUD window
   - eliminate fixed-height clipping on legacy command-center pages
   - allow labels and descriptive copy to wrap naturally
   - reduce visual density and nested-box noise
   - keep the accepted Map page isolated
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. TRUE BLACK APPLICATION SHELL
   -------------------------------------------------------------------------- */

body.galaxy-bg:not(.map-page),
body.galaxy-bg:not(.map-page).storybook-page,
body.galaxy-bg:not(.map-page).special-dungeon-story-page,
body.galaxy-bg:not(.map-page).epilogue-page,
body.galaxy-bg:not(.map-page).season-page,
body.galaxy-bg:not(.map-page).leaderboards-page,
body.galaxy-bg:not(.map-page).profile-page,
body.galaxy-bg:not(.map-page).roa-loadout-page,
body.galaxy-bg:not(.map-page).roa-crafting-page,
body.galaxy-bg:not(.map-page).roa-custody-page,
body.galaxy-bg:not(.map-page).roa-marketplace-family-page,
body.galaxy-bg:not(.map-page).roa-account-command-page {
  background: #020304 !important;
  background-color: #020304 !important;
  background-image: none !important;
  background-attachment: scroll !important;
}

body.galaxy-bg:not(.map-page)::before,
body.galaxy-bg:not(.map-page)::after {
  display: none !important;
  content: none !important;
  background: none !important;
  background-image: none !important;
}

/* Any old scene applied to the principal page shell is neutralized here. */
body.galaxy-bg:not(.map-page) > main,
body.galaxy-bg:not(.map-page) main.container,
body.galaxy-bg:not(.map-page) main[class*="shell"],
body.galaxy-bg:not(.map-page) .storybook-container,
body.galaxy-bg:not(.map-page) .special-story-shell {
  background: transparent !important;
  background-image: none !important;
}

/* --------------------------------------------------------------------------
   2. CONTENT-FIRST DOCUMENT FLOW
   Old pages were designed around fixed 100dvh grids. That is the primary
   cause of cropped text and compressed panels. V2 lets the document scroll
   and keeps internal scrolling only where it is genuinely useful.
   -------------------------------------------------------------------------- */

body.galaxy-bg:not(.map-page) {
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

body.galaxy-bg:not(.map-page) > main,
body.galaxy-bg:not(.map-page) main.container,
body.galaxy-bg:not(.map-page) main[class*="shell"] {
  width: 100% !important;
  max-width: 1920px !important;
  min-height: 100dvh !important;
  height: auto !important;
  margin-inline: auto !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

/* Preserve the fixed shared HUD while giving page content breathing room. */
body.galaxy-bg:not(.map-page) main.container,
body.galaxy-bg:not(.map-page) main[class*="shell"]:not(.special-story-shell) {
  padding-top: calc(var(--roa-header-h, 88px) + 18px) !important;
  padding-bottom: calc(var(--roa-dock-h, 64px) + 24px) !important;
}

/* Legacy command shells frequently declare fixed grid rows. Allow content
   rows to grow naturally instead of forcing copy into clipped tracks. */
body.galaxy-bg:not(.map-page) :is(
  .adventurer-page-shell,
  .roa-loadout-command-shell,
  .roa-crafting-command-shell,
  .roa-season-war-room-shell,
  .roa-account-command-shell,
  .roa-marketplace-command-shell,
  .roa-marketplace-subpage-shell,
  .roa-marketplace-trade-shell,
  .roa-rankings-command-shell,
  .roa-story-journal-shell,
  .roa-story-dungeon-detail-shell,
  .roa-story-reader-shell,
  .roa-story-archive-shell,
  .roa-epilogue-shell,
  .roa-epilogue-party-browser-shell,
  .roa-personal-history-shell,
  .roa-victory-hall-shell
) {
  height: auto !important;
  min-height: 100dvh !important;
  max-height: none !important;
  overflow: visible !important;
  align-content: start !important;
  grid-auto-rows: max-content !important;
}

/* Principal workspaces should expand with their contents instead of being
   forced into minmax(0,1fr) traps inherited from the original HUD. */
body.galaxy-bg:not(.map-page) :is(
  [class*="command-workspace"],
  .adventurer-command-center,
  .adventurer-primary-grid,
  .roa-loadout-command-workspace,
  .roa-crafting-workspace,
  .roa-season-war-room-workspace,
  .roa-orders-command-workspace,
  .roa-intel-command-workspace,
  .roa-marketplace-command-workspace,
  .roa-rankings-command-workspace,
  .roa-story-journal-stage,
  .roa-story-dungeon-detail-stage,
  .roa-story-reader-stage,
  .roa-story-archive-stage
) {
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

/* Keep deliberate data ledgers and catalogs scrollable, but give them a
   usable viewport instead of a tiny compressed slot. */
body.galaxy-bg:not(.map-page) :is(
  [class*="ledger-scroll"],
  [class*="catalog-scroll"],
  [class*="holdings-grid"],
  [class*="inventory-scroll"],
  [class*="codex-scroll"],
  [class*="leader-list"],
  [class*="table-wrap"],
  [class*="event-track"]
) {
  max-height: min(62vh, 720px) !important;
  min-height: 120px !important;
}

/* --------------------------------------------------------------------------
   3. UNIVERSAL SIZING / CLIP PREVENTION
   -------------------------------------------------------------------------- */

body.galaxy-bg:not(.map-page) *,
body.galaxy-bg:not(.map-page) *::before,
body.galaxy-bg:not(.map-page) *::after {
  box-sizing: border-box !important;
}

body.galaxy-bg:not(.map-page) :is(
  section,
  article,
  aside,
  header,
  footer,
  nav,
  form,
  div
) {
  min-width: 0;
}

body.galaxy-bg:not(.map-page) :is(
  h1,
  h2,
  h3,
  h4,
  p,
  li,
  label,
  dt,
  dd
) {
  max-width: 100% !important;
  overflow-wrap: anywhere;
}

/* Headings and explanatory copy must never be ellipsized. */
body.galaxy-bg:not(.map-page) :is(
  [class*="command-title"] h1,
  [class*="command-title"] p,
  [class*="panel-heading"] h2,
  [class*="panel-heading"] h3,
  [class*="panel-heading"] p,
  [class*="section-heading"] h2,
  [class*="section-heading"] h3,
  [class*="section-heading"] p,
  [class*="heading-copy"] h1,
  [class*="heading-copy"] h2,
  [class*="heading-copy"] p,
  .storybook-page h1,
  .storybook-page h2,
  .storybook-page h3,
  .storybook-page p,
  .special-story-copy h1,
  .special-story-copy h2,
  .special-story-copy p
) {
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: normal !important;
  -webkit-line-clamp: unset !important;
}

/* Buttons may become two lines rather than cutting off labels. */
body.galaxy-bg:not(.map-page) :is(
  button,
  .button,
  a.button,
  [class*="theme-button"],
  [class*="family-button"],
  [class*="storybook-"][class*="action"],
  [class*="storybook-"][class*="button"]
) {
  min-height: 42px !important;
  height: auto !important;
  line-height: 1.25 !important;
  white-space: normal !important;
  overflow-wrap: anywhere;
  text-overflow: clip !important;
}

/* Tabs stay compact but can wrap if the label is genuinely long. */
body.galaxy-bg:not(.map-page) :is(
  [role="tab"],
  [class*="-tab"],
  [class*="-filter"]
) {
  min-width: 0 !important;
  white-space: normal !important;
  line-height: 1.18 !important;
}

/* --------------------------------------------------------------------------
   4. CLEANER PANEL LANGUAGE
   Fewer gradients, softer borders, consistent radius, more internal space.
   -------------------------------------------------------------------------- */

body.galaxy-bg:not(.map-page) :where(
  [class*="command-header"],
  [class*="command-toolbar"],
  [class*="-panel"],
  [class*="-card"],
  [class*="-ledger"],
  [class*="-inspector"],
  [class*="-summary"],
  [class*="-ribbon"],
  [class*="-tile"]
):not(.special-story-art):not(.adventurer-portrait):not(.roa-season-boss-scene) {
  border: 1px solid #232c35 !important;
  border-radius: 12px !important;
  background-color: #080d12 !important;
  background-image: none !important;
  box-shadow:
    0 10px 24px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255,255,255,0.018) !important;
}

body.galaxy-bg:not(.map-page) :where(
  [class*="command-header"],
  [class*="command-toolbar"]
) {
  padding: 14px 16px !important;
}

body.galaxy-bg:not(.map-page) :where(
  [class*="-panel"],
  [class*="-card"],
  [class*="-inspector"]
):not(.special-story-art):not(.adventurer-portrait):not(.roa-season-boss-scene) {
  padding-top: max(10px, env(safe-area-inset-top, 0px));
}

/* Reduce nested-box overload. Secondary metrics become flatter sections. */
body.galaxy-bg:not(.map-page) :is(
  [class*="-metrics"] > article,
  [class*="-metric"] > article,
  [class*="-ribbon"] > article,
  [class*="-details"] > article,
  [class*="-stats"] > article
) {
  border-color: rgba(131, 144, 156, 0.11) !important;
  border-radius: 9px !important;
  background: #0b1016 !important;
  box-shadow: none !important;
}

/* --------------------------------------------------------------------------
   5. PAGE FAMILY SPACING / FIT
   -------------------------------------------------------------------------- */

body.profile-page :is(
  .adventurer-command-center,
  .adventurer-primary-grid
),
body.roa-loadout-page .roa-loadout-command-workspace,
body.roa-crafting-page .roa-crafting-workspace,
body.roa-account-command-page .roa-account-command-workspace,
body.roa-marketplace-family-page :is(
  .roa-marketplace-command-workspace,
  .roa-orders-command-workspace,
  .roa-intel-command-workspace
),
body.season-page .roa-season-war-room-workspace,
body.leaderboards-page .roa-rankings-command-workspace,
body.storybook-page :is(
  .roa-story-journal-stage,
  .roa-story-dungeon-detail-stage,
  .roa-story-reader-stage,
  .roa-story-archive-stage
),
body.epilogue-page main > :is(section, article, div) {
  gap: 14px !important;
}

/* Marketplace/Orders/Intel right rails were especially compressed. */
@media (min-width: 1200px) {
  body.roa-marketplace-page .roa-marketplace-command-workspace,
  body.roa-marketplace-family-page .roa-orders-command-workspace,
  body.roa-marketplace-family-page .roa-intel-command-workspace {
    grid-template-columns:
      minmax(0, 1.55fr)
      minmax(360px, 0.78fr) !important;
  }

  body.roa-account-command-page .roa-account-command-workspace {
    grid-template-columns:
      minmax(310px, 0.72fr)
      minmax(0, 1.55fr) !important;
  }

  body.roa-crafting-page .roa-crafting-workspace {
    grid-template-columns:
      minmax(0, 1.42fr)
      minmax(380px, 0.82fr) !important;
  }

  body.roa-loadout-page .roa-loadout-command-workspace {
    grid-template-columns:
      minmax(360px, 0.86fr)
      minmax(0, 1.34fr)
      minmax(330px, 0.78fr) !important;
  }
}

/* Story surfaces get editorial reading widths instead of edge-to-edge cards. */
body.storybook-page :is(
  .roa-story-journal-header,
  .roa-story-dungeon-detail-stage,
  .roa-story-reader-stage,
  .roa-story-archive-stage
) {
  width: min(100%, 1540px) !important;
  margin-inline: auto !important;
}

body.storybook-page :is(
  .storybook-premise,
  .storybook-reader-copy,
  .roa-story-reader-copy,
  .roa-story-archive-content
) {
  line-height: 1.6 !important;
}

/* Standalone Special Dungeon should feel like a premium story screen. */
body.special-dungeon-story-page .special-story-shell {
  width: min(100%, 1280px) !important;
  padding: 28px 22px 40px !important;
}

body.special-dungeon-story-page .special-story-card {
  min-height: auto !important;
  padding: clamp(22px, 3vw, 38px) !important;
  gap: 22px !important;
  border-radius: 16px !important;
  background: #080d12 !important;
}

body.special-dungeon-story-page .special-story-art {
  min-height: clamp(260px, 38vh, 440px) !important;
  border-radius: 12px !important;
  background-color: #0a1015 !important;
}

body.special-dungeon-story-page .special-story-art-frame {
  width: min(86%, 620px) !important;
  padding: clamp(20px, 4vw, 42px) !important;
}

body.special-dungeon-story-page .special-story-copy h1 {
  font-size: clamp(2rem, 5vw, 4.2rem) !important;
  line-height: 1.02 !important;
}

body.special-dungeon-story-page .special-story-text {
  font-size: clamp(1rem, 1.8vw, 1.28rem) !important;
  line-height: 1.68 !important;
}

/* --------------------------------------------------------------------------
   6. TABLET / MOBILE: STACK EARLIER INSTEAD OF SQUEEZING
   -------------------------------------------------------------------------- */

@media (max-width: 1199px) {
  body.galaxy-bg:not(.map-page) :is(
    .roa-account-command-workspace,
    .roa-crafting-workspace,
    .roa-orders-command-workspace,
    .roa-intel-command-workspace,
    .roa-marketplace-command-workspace,
    .roa-loadout-command-workspace,
    .roa-season-war-room-workspace,
    .roa-rankings-command-workspace
  ) {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto !important;
  }

  body.galaxy-bg:not(.map-page) :is(
    .roa-season-right-rail,
    .roa-marketplace-right-rail
  ) {
    grid-template-rows: auto !important;
  }
}

@media (max-width: 900px) {
  body.galaxy-bg:not(.map-page) main.container,
  body.galaxy-bg:not(.map-page) main[class*="shell"]:not(.special-story-shell) {
    padding-inline: 10px !important;
  }

  body.galaxy-bg:not(.map-page) :is(
    [class*="command-header"],
    [class*="command-toolbar"]
  ) {
    padding: 12px !important;
  }

  body.galaxy-bg:not(.map-page) :is(
    [class*="-metrics"],
    [class*="-metric-grid"],
    [class*="-stat-ribbon"],
    [class*="-details"]
  ) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 620px) {
  body.galaxy-bg:not(.map-page) :is(
    [class*="-metrics"],
    [class*="-metric-grid"],
    [class*="-stat-ribbon"],
    [class*="-details"]
  ) {
    grid-template-columns: 1fr !important;
  }

  body.special-dungeon-story-page .special-story-shell {
    padding: 14px 10px 26px !important;
  }

  body.special-dungeon-story-page .special-story-card {
    padding: 16px !important;
    gap: 16px !important;
  }
}

/* End GLOBAL SLEEK V2 — PROFESSIONAL LAYOUT CORRECTION */


/* ==========================================================================
   GLOBAL SLEEK V3 — LOADOUT LEGACY CONTROL PURGE
   Explicitly outranks roa-loadout-command.css and
   roa-loadout-theme-correction.css. No fantasy frame artwork remains.
   ========================================================================== */

/* Top command actions + bottom save/clear actions */
body.galaxy-bg.roa-loadout-page
:is(
  .roa-loadout-theme-button,
  button.roa-loadout-theme-button,
  a.roa-loadout-theme-button,
  .roa-loadout-save-button
) {
  min-width: 108px !important;
  min-height: 42px !important;
  height: auto !important;
  padding: 9px 14px !important;

  color: #e8e1d6 !important;

  border: 1px solid #303b46 !important;
  border-image: none !important;
  border-radius: 9px !important;

  background-color: #111821 !important;
  background-image:
    linear-gradient(
      180deg,
      #18212b 0%,
      #0d131a 100%
    ) !important;
  background-position: initial !important;
  background-repeat: no-repeat !important;
  background-size: auto !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.028),
    0 4px 10px rgba(0,0,0,0.26) !important;

  filter: none !important;
  text-shadow: none !important;
  transform: none !important;

  font-family: inherit !important;
  font-size: 0.73rem !important;
  line-height: 1.22 !important;
  letter-spacing: 0.015em !important;
  white-space: normal !important;
}

body.galaxy-bg.roa-loadout-page
:is(
  .roa-loadout-theme-button,
  button.roa-loadout-theme-button,
  a.roa-loadout-theme-button,
  .roa-loadout-save-button
):hover,
body.galaxy-bg.roa-loadout-page
:is(
  .roa-loadout-theme-button,
  button.roa-loadout-theme-button,
  a.roa-loadout-theme-button,
  .roa-loadout-save-button
):focus-visible {
  color: #fff !important;
  border-color: #596875 !important;
  background-color: #1a242f !important;
  background-image:
    linear-gradient(
      180deg,
      #202c38 0%,
      #121922 100%
    ) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.04),
    0 6px 14px rgba(0,0,0,0.30) !important;
  filter: none !important;
  outline: none !important;
}

body.galaxy-bg.roa-loadout-page
:is(
  .roa-loadout-theme-button.is-active,
  button.roa-loadout-theme-button.is-active,
  a.roa-loadout-theme-button.is-active
) {
  color: #fff !important;
  border-color: #65727e !important;
  background-color: #202b36 !important;
  background-image:
    linear-gradient(
      180deg,
      #26323e 0%,
      #151d26 100%
    ) !important;
  box-shadow:
    inset 0 -2px 0 #a8b2bb !important;
  filter: none !important;
}

/* Activity selectors — Explore / Crawl / Dungeon / Special Dungeon */
body.galaxy-bg.roa-loadout-page
.roa-loadout-activity-tabs {
  min-height: 72px !important;
  gap: 8px !important;
}

body.galaxy-bg.roa-loadout-page
.roa-loadout-activity-tab {
  position: relative !important;

  display: grid !important;
  grid-template-columns:
    38px minmax(0, 1fr) minmax(58px, auto) !important;
  grid-template-rows: auto auto !important;
  align-items: center !important;

  height: auto !important;
  min-height: 72px !important;
  min-width: 0 !important;

  gap: 2px 10px !important;
  padding: 10px 12px !important;

  overflow: hidden !important;
  isolation: isolate !important;

  color: #d6dde2 !important;

  border: 1px solid #293540 !important;
  border-image: none !important;
  border-radius: 10px !important;

  background-color: #0b1118 !important;
  background-image:
    linear-gradient(
      180deg,
      #111821 0%,
      #090e14 100%
    ) !important;
  background-position: initial !important;
  background-repeat: no-repeat !important;
  background-size: auto !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.022),
    0 5px 12px rgba(0,0,0,0.24) !important;

  filter: none !important;
  text-shadow: none !important;
  transform: none !important;
}

body.galaxy-bg.roa-loadout-page
.roa-loadout-activity-tab:hover,
body.galaxy-bg.roa-loadout-page
.roa-loadout-activity-tab:focus-visible {
  color: #fff !important;

  border-color: #4e5c68 !important;

  background-color: #151e28 !important;
  background-image:
    linear-gradient(
      180deg,
      #1b2631 0%,
      #0f161e 100%
    ) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.035),
    0 7px 16px rgba(0,0,0,0.28) !important;

  filter: none !important;
  outline: none !important;
}

body.galaxy-bg.roa-loadout-page
.roa-loadout-activity-tab.is-active,
body.galaxy-bg.roa-loadout-page
.roa-loadout-activity-tab[aria-pressed="true"] {
  color: #fff !important;

  border-color: #65727e !important;

  background-color: #202b36 !important;
  background-image:
    linear-gradient(
      180deg,
      #26323e 0%,
      #151d26 100%
    ) !important;

  box-shadow:
    inset 3px 0 0 #a8b2bb,
    inset 0 1px 0 rgba(255,255,255,0.035) !important;

  filter: none !important;
}

/* Undo the old absolutely-positioned card composition. */
body.galaxy-bg.roa-loadout-page
.roa-loadout-activity-tab > img {
  position: static !important;
  grid-column: 1 !important;
  grid-row: 1 / 3 !important;

  width: 34px !important;
  height: 34px !important;

  margin: 0 !important;
  transform: none !important;

  filter:
    grayscale(0.14)
    saturate(0.72)
    brightness(1.02) !important;
}

body.galaxy-bg.roa-loadout-page
.roa-loadout-activity-tab > span {
  position: static !important;
  grid-column: 2 !important;
  grid-row: 1 / 3 !important;

  display: grid !important;

  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;

  gap: 3px !important;

  overflow: visible !important;
  transform: none !important;
}

body.galaxy-bg.roa-loadout-page
.roa-loadout-activity-tab > span strong {
  overflow: visible !important;

  color: #ece5da !important;

  font-family: inherit !important;
  font-size: 0.84rem !important;
  font-weight: 750 !important;
  line-height: 1.15 !important;

  text-overflow: clip !important;
  white-space: normal !important;
}

body.galaxy-bg.roa-loadout-page
.roa-loadout-activity-tab > span small {
  overflow: visible !important;

  color: #909ba5 !important;

  font-size: 0.60rem !important;
  line-height: 1.15 !important;

  text-overflow: clip !important;
  white-space: normal !important;
}

body.galaxy-bg.roa-loadout-page
.roa-loadout-activity-tab > i {
  position: static !important;
  grid-column: 3 !important;
  grid-row: 1 / 3 !important;

  display: grid !important;
  align-content: center !important;
  justify-items: end !important;

  width: auto !important;
  min-width: 54px !important;

  overflow: visible !important;

  transform: none !important;
}

body.galaxy-bg.roa-loadout-page
.roa-loadout-activity-tab > i b {
  color: #e5d29b !important;
  font-family: inherit !important;
  font-size: 1rem !important;
  line-height: 1 !important;
}

body.galaxy-bg.roa-loadout-page
.roa-loadout-activity-tab > i small {
  color: #89949e !important;
  font-size: 0.52rem !important;
}

body.galaxy-bg.roa-loadout-page
.roa-loadout-activity-tab > em {
  position: static !important;
  display: none !important;
}

/* Inventory slot category tabs */
body.galaxy-bg.roa-loadout-page
.roa-loadout-slot-tabs button {
  min-width: 76px !important;
  min-height: 38px !important;
  height: auto !important;
  padding: 8px 10px !important;

  color: #cfd6dc !important;

  border: 1px solid #2d3843 !important;
  border-image: none !important;
  border-radius: 8px !important;

  background-color: #0f161e !important;
  background-image:
    linear-gradient(
      180deg,
      #151e28 0%,
      #0b1118 100%
    ) !important;
  background-position: initial !important;
  background-repeat: no-repeat !important;
  background-size: auto !important;

  box-shadow: none !important;
  filter: none !important;
  text-shadow: none !important;
  transform: none !important;
}

body.galaxy-bg.roa-loadout-page
.roa-loadout-slot-tabs button:hover,
body.galaxy-bg.roa-loadout-page
.roa-loadout-slot-tabs button:focus-visible {
  color: #fff !important;
  border-color: #4e5c68 !important;
  background-color: #19232d !important;
  background-image:
    linear-gradient(
      180deg,
      #202b37 0%,
      #111820 100%
    ) !important;
  box-shadow: none !important;
  filter: none !important;
}

body.galaxy-bg.roa-loadout-page
.roa-loadout-slot-tabs button.is-active,
body.galaxy-bg.roa-loadout-page
.roa-loadout-slot-tabs button[aria-selected="true"] {
  color: #fff !important;
  border-color: #65727e !important;
  background-color: #202b36 !important;
  background-image:
    linear-gradient(
      180deg,
      #26323e 0%,
      #151d26 100%
    ) !important;
  box-shadow:
    inset 0 -2px 0 #a8b2bb !important;
  filter: none !important;
}

/* Equipment and inventory cards — remove square fantasy frames too. */
body.galaxy-bg.roa-loadout-page
button.roa-loadout-slot-card,
body.galaxy-bg.roa-loadout-page
button.roa-loadout-inventory-card,
body.galaxy-bg.roa-loadout-page
article.roa-loadout-inventory-card {
  border: 1px solid #293540 !important;
  border-image: none !important;
  border-radius: 10px !important;

  background-color: #0a1016 !important;
  background-image:
    linear-gradient(
      180deg,
      #111821 0%,
      #080d13 100%
    ) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.018),
    0 5px 12px rgba(0,0,0,0.24) !important;

  filter: none !important;
  text-shadow: none !important;
  transform: none !important;
}

body.galaxy-bg.roa-loadout-page
button.roa-loadout-slot-card:hover,
body.galaxy-bg.roa-loadout-page
button.roa-loadout-slot-card:focus-visible,
body.galaxy-bg.roa-loadout-page
button.roa-loadout-slot-card.is-active,
body.galaxy-bg.roa-loadout-page
button.roa-loadout-inventory-card:hover,
body.galaxy-bg.roa-loadout-page
button.roa-loadout-inventory-card:focus-visible,
body.galaxy-bg.roa-loadout-page
button.roa-loadout-inventory-card.is-selected,
body.galaxy-bg.roa-loadout-page
button.roa-loadout-inventory-card.is-equipped {
  border-color: #566572 !important;

  background-color: #121a23 !important;
  background-image:
    linear-gradient(
      180deg,
      #1b2530 0%,
      #0e151d 100%
    ) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.03),
    0 7px 15px rgba(0,0,0,0.28) !important;

  filter: none !important;
}

body.galaxy-bg.roa-loadout-page
button.roa-loadout-inventory-card.is-locked {
  opacity: 0.52 !important;
  border-color: #252d35 !important;
  background: #090d12 !important;
  filter: grayscale(0.42) !important;
}

/* Compact desktop: keep four selectors in one clean row. */
@media (min-width: 1121px) {
  body.galaxy-bg.roa-loadout-page
  .roa-loadout-activity-tabs {
    grid-template-columns:
      repeat(4, minmax(0, 1fr)) !important;
  }
}

/* Tablet and phone: stack without bringing back legacy geometry. */
@media (max-width: 1120px) {
  body.galaxy-bg.roa-loadout-page
  .roa-loadout-activity-tabs {
    grid-template-columns:
      repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 620px) {
  body.galaxy-bg.roa-loadout-page
  .roa-loadout-activity-tabs {
    grid-template-columns: 1fr !important;
  }
}

/* End GLOBAL SLEEK V3 — LOADOUT LEGACY CONTROL PURGE */
