/* Main-menu design packs. These declarations are intentionally isolated from battle screens. */
#menu-screen.main-menu--premium[data-design-pack] {
  --pack-bg: #050b16;
  --pack-shell: #0b1b34;
  --pack-panel: #0d2443;
  --pack-panel-hi: #102b4b;
  --pack-line: #5cbbe3;
  --pack-text: #dbeef4;
  --pack-muted: #7ca9bb;
  --pack-accent: #d5a94e;
  --pack-glow: rgba(82, 195, 224, .2);
}

#menu-screen.main-menu--premium[data-design-pack="full_default"] { --pack-bg:#08152b; --pack-shell:#0d3154; --pack-panel:#0c2748; --pack-panel-hi:#123b64; --pack-line:#76d9ff; --pack-text:#e6f8ff; --pack-muted:#8bc3dc; --pack-accent:#e8c579; --pack-glow:rgba(63,177,255,.26); }
#menu-screen.main-menu--premium[data-design-pack="full_a0b"] { --pack-bg:#151a25; --pack-shell:#382614; --pack-panel:#263242; --pack-panel-hi:#404d5f; --pack-line:#e6bd67; --pack-text:#f6ead4; --pack-muted:#c8ad82; --pack-accent:#ff805c; --pack-glow:rgba(255,151,69,.24); }
#menu-screen.main-menu--premium[data-design-pack="full_graziline"],
#menu-screen.main-menu--premium[data-design-pack="full_nocturne_ark"] { --pack-bg:#110d1d; --pack-shell:#1d1533; --pack-panel:#201630; --pack-panel-hi:#302147; --pack-line:#b493ff; --pack-text:#eee9ff; --pack-muted:#b1a1d4; --pack-accent:#e0b6ff; --pack-glow:rgba(161,103,255,.25); }
#menu-screen.main-menu--premium[data-design-pack="full_sakuratake"] { --pack-bg:#10221d; --pack-shell:#163c32; --pack-panel:#18372e; --pack-panel-hi:#265643; --pack-line:#8ce4bb; --pack-text:#effff5; --pack-muted:#a4d3bc; --pack-accent:#ffb6d7; --pack-glow:rgba(113,224,166,.24); }
#menu-screen.main-menu--premium[data-design-pack="full_valkyrie9"] { --pack-bg:#121923; --pack-shell:#263546; --pack-panel:#1c2b3d; --pack-panel-hi:#314762; --pack-line:#d4edff; --pack-text:#f1f8ff; --pack-muted:#b9cad8; --pack-accent:#98caff; --pack-glow:rgba(183,220,255,.22); }
#menu-screen.main-menu--premium[data-design-pack="full_solflare"],
#menu-screen.main-menu--premium[data-design-pack="shop_amber_foundry"] { --pack-bg:#25180c; --pack-shell:#4b2e11; --pack-panel:#392716; --pack-panel-hi:#5a3d1d; --pack-line:#f0b75d; --pack-text:#fff1d3; --pack-muted:#e0ba83; --pack-accent:#ff7d46; --pack-glow:rgba(255,167,70,.28); }
#menu-screen.main-menu--premium[data-design-pack="full_mistral_viper"] { --pack-bg:#0b211d; --pack-shell:#123d35; --pack-panel:#12342e; --pack-panel-hi:#1d5548; --pack-line:#7bf0bf; --pack-text:#e7fff4; --pack-muted:#9ad9bd; --pack-accent:#c9ff83; --pack-glow:rgba(87,233,165,.24); }
#menu-screen.main-menu--premium[data-design-pack="shop_neon_lilac"] { --pack-bg:#190d2d; --pack-shell:#31204f; --pack-panel:#261844; --pack-panel-hi:#422762; --pack-line:#d191ff; --pack-text:#faedff; --pack-muted:#cda8e0; --pack-accent:#7ceeff; --pack-glow:rgba(207,102,255,.27); }

#menu-screen.main-menu--premium[data-design-pack]:not([data-design-pack="standard"]) {
  background:
    radial-gradient(120% 75% at 50% 0%, var(--pack-glow), transparent 54%),
    linear-gradient(180deg, var(--pack-shell), var(--pack-bg) 68%) !important;
}

#menu-screen.main-menu--premium[data-design-pack]:not([data-design-pack="standard"]) .rem-menu {
  border-color: color-mix(in srgb, var(--pack-line) 58%, transparent) !important;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--pack-shell) 92%, #fff 8%), var(--pack-bg) 88%) !important;
  box-shadow: 0 18px 38px rgba(0, 0, 0, .46), inset 0 0 0 1px color-mix(in srgb, var(--pack-line) 16%, transparent) !important;
}

#menu-screen.main-menu--premium[data-design-pack]:not([data-design-pack="standard"]) .rem-menu-header,
#menu-screen.main-menu--premium[data-design-pack]:not([data-design-pack="standard"]) .menu-home-resource,
#menu-screen.main-menu--premium[data-design-pack]:not([data-design-pack="standard"]) .menu-home-rank,
#menu-screen.main-menu--premium[data-design-pack]:not([data-design-pack="standard"]) .rem-menu-hangar,
#menu-screen.main-menu--premium[data-design-pack]:not([data-design-pack="standard"]) .menu-hero-card,
#menu-screen.main-menu--premium[data-design-pack]:not([data-design-pack="standard"]) .menu-btn,
#menu-screen.main-menu--premium[data-design-pack]:not([data-design-pack="standard"]) .rem-bottom-nav {
  border-color: color-mix(in srgb, var(--pack-line) 44%, transparent) !important;
  background: linear-gradient(145deg, var(--pack-panel-hi), var(--pack-panel) 74%) !important;
}

#menu-screen.main-menu--premium[data-design-pack]:not([data-design-pack="standard"]) .rem-menu-hangar {
  background:
    radial-gradient(ellipse at 50% 78%, var(--pack-glow), transparent 42%),
    linear-gradient(180deg, var(--pack-panel-hi), var(--pack-panel)) !important;
}

#menu-screen.main-menu--premium[data-design-pack]:not([data-design-pack="standard"]) .menu-hero-play {
  border-color: color-mix(in srgb, var(--pack-accent) 78%, transparent) !important;
  background: linear-gradient(180deg, color-mix(in srgb, var(--pack-accent) 65%, #38210a 35%), color-mix(in srgb, var(--pack-accent) 28%, #111 72%)) !important;
  color: #fffdf7 !important;
}

#menu-screen.main-menu--premium[data-design-pack]:not([data-design-pack="standard"]) .menu-header__label,
#menu-screen.main-menu--premium[data-design-pack]:not([data-design-pack="standard"]) .menu-home-resource-label,
#menu-screen.main-menu--premium[data-design-pack]:not([data-design-pack="standard"]) .menu-home-rank-label,
#menu-screen.main-menu--premium[data-design-pack]:not([data-design-pack="standard"]) .menu-btn span,
#menu-screen.main-menu--premium[data-design-pack]:not([data-design-pack="standard"]) .menu-hangar-info { color: var(--pack-muted) !important; }

#menu-screen.main-menu--premium[data-design-pack]:not([data-design-pack="standard"]) .menu-header__value,
#menu-screen.main-menu--premium[data-design-pack]:not([data-design-pack="standard"]) .menu-home-resource-value,
#menu-screen.main-menu--premium[data-design-pack]:not([data-design-pack="standard"]) .menu-btn strong,
#menu-screen.main-menu--premium[data-design-pack]:not([data-design-pack="standard"]) .menu-title,
#menu-screen.main-menu--premium[data-design-pack]:not([data-design-pack="standard"]) .rem-menu-section-title { color: var(--pack-text) !important; }

#menu-screen.main-menu--premium[data-design-pack="full_sakuratake"] .menu-premium-bg__grid,
#menu-screen.main-menu--premium[data-design-pack="full_mistral_viper"] .menu-premium-bg__grid { opacity: .16 !important; }

/* Profile selector and shop offers share the same compact, readable card language. */
.profile-design-pack-head {
  grid-column: 1 / -1;
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: baseline;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid rgba(105, 200, 225, .18);
  color: #9ce9ff;
  font: 700 9px/1.2 var(--reward-display);
  letter-spacing: .08em;
}
.profile-design-pack-head small { color: #7698a8; font: 600 8px/1.2 var(--reward-ui); letter-spacing: 0; }
.pilot-id-card #profile-design-pack-list { grid-column: 1 / -1; display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 6px !important; width: 100%; }
.profile-design-pack-btn { min-width: 0 !important; min-height: 70px !important; height: auto !important; padding: 8px !important; text-align: left; overflow: hidden; border-radius: 1px !important; color: #c5e1ec !important; background: linear-gradient(140deg, #0e2637, #071522) !important; border-color: rgba(104,190,213,.34) !important; }
.profile-design-pack-btn strong, .profile-design-pack-btn small, .profile-design-pack-btn em { display: block; min-width: 0; overflow-wrap: anywhere; }
.profile-design-pack-btn strong { color: inherit; font: 800 9px/1.25 var(--reward-display); }
.profile-design-pack-btn small { margin-top: 4px; color: #86a6b5; font: 600 8px/1.25 var(--reward-ui); }
.profile-design-pack-btn em { margin-top: 5px; color: #e5be6b; font: 700 7px/1 var(--reward-display); font-style: normal; letter-spacing: .06em; }
.profile-design-pack-btn.active { color: #07131b !important; background: linear-gradient(135deg, #92e9ff, #6ac3f0) !important; border-color: #effcff !important; }
.profile-design-pack-btn.active small, .profile-design-pack-btn.active em { color: #173b51; }
.shop-design-pack-intro { border-color: rgba(198, 144, 255, .38) !important; background: linear-gradient(135deg, rgba(100,52,145,.28), rgba(8,21,34,.92)) !important; }
.shop-design-pack-offer { border-color: rgba(148, 113, 233, .44) !important; background: linear-gradient(135deg, rgba(73,42,123,.34), rgba(8,19,34,.94)) !important; }
.shop-design-pack-offer.design-pack-shop_amber_foundry { border-color: rgba(238,183,93,.52) !important; background: linear-gradient(135deg, rgba(126,78,25,.36), rgba(24,17,10,.94)) !important; }
.shop-design-pack-offer em { color: #bda7ff; font-size: 8px; font-style: normal; }

@media (max-width: 380px) {
  .pilot-id-card #profile-design-pack-list { grid-template-columns: 1fr !important; }
  .profile-design-pack-head { align-items: flex-start; flex-direction: column; gap: 3px; }
}

/* Pack-specific command deck motifs. These are static layers, not particle effects. */
#menu-screen.main-menu--premium[data-design-pack="full_a0b"] .home-hangar-visual::after,
#menu-screen.main-menu--premium[data-design-pack="shop_amber_foundry"] .home-hangar-visual::after {
  content: ""; position: absolute; inset: 13% 7%; pointer-events: none; opacity: .42;
  background: repeating-linear-gradient(135deg, transparent 0 12px, rgba(255,205,105,.18) 12px 14px, transparent 14px 25px);
  border-top: 1px solid rgba(255,202,104,.48); border-bottom: 1px solid rgba(255,202,104,.3);
}
#menu-screen.main-menu--premium[data-design-pack="full_sakuratake"] .home-hangar-visual::after,
#menu-screen.main-menu--premium[data-design-pack="full_mistral_viper"] .home-hangar-visual::after {
  content: ""; position: absolute; inset: 11% 9%; pointer-events: none; opacity: .35;
  background: repeating-linear-gradient(90deg, transparent 0 16px, rgba(161,255,190,.22) 16px 18px, transparent 18px 31px);
  border-inline: 1px solid rgba(170,255,205,.38);
}
#menu-screen.main-menu--premium[data-design-pack="full_graziline"] .home-hangar-visual::after,
#menu-screen.main-menu--premium[data-design-pack="full_nocturne_ark"] .home-hangar-visual::after,
#menu-screen.main-menu--premium[data-design-pack="shop_neon_lilac"] .home-hangar-visual::after {
  content: ""; position: absolute; inset: 12% 16%; pointer-events: none; opacity: .36;
  border: 1px solid rgba(194,137,255,.4); border-radius: 50%; transform: scaleY(.45);
  box-shadow: 0 0 0 9px rgba(154,91,255,.06), 0 0 0 20px rgba(154,91,255,.04);
}
#menu-screen.main-menu--premium[data-design-pack="full_valkyrie9"] .home-hangar-visual::after {
  content: ""; position: absolute; inset: 12% 8%; pointer-events: none; opacity: .42;
  background: linear-gradient(90deg, transparent 0 46%, rgba(224,246,255,.3) 46% 54%, transparent 54% 100%);
  border-top: 1px solid rgba(218,242,255,.55); border-bottom: 1px solid rgba(218,242,255,.32);
}
#menu-screen.main-menu--premium[data-design-pack="full_solflare"] .home-hangar-visual::after {
  content: ""; position: absolute; inset: 9% 19%; pointer-events: none; opacity: .36;
  border: 1px solid rgba(255,194,88,.58); border-radius: 50%; transform: scaleY(.56);
  box-shadow: 0 0 0 9px rgba(255,151,49,.1), 0 0 0 22px rgba(255,151,49,.05);
}

/* Battle application: only the lower flight console and its immediate controls inherit a pack. */
#game-screen.rem-battle--phase4[data-design-pack]:not([data-design-pack="standard"]) {
  --dp-panel: #132c42;
  --dp-panel-hi: #1b4563;
  --dp-line: #78dcff;
  --dp-text: #e9fbff;
  --dp-muted: #9dcddd;
  --dp-accent: #ffd176;
  --dp-hp-a: #35bd89;
  --dp-hp-b: #91f0b9;
  --dp-trait-a: #75d8ff;
  --dp-trait-b: #99a8ff;
  --dp-shadow: rgba(57, 190, 243, .14);
}
#game-screen.rem-battle--phase4[data-design-pack="full_a0b"],
#game-screen.rem-battle--phase4[data-design-pack="shop_amber_foundry"] { --dp-panel:#392715; --dp-panel-hi:#62421f; --dp-line:#f1b95c; --dp-text:#fff0d1; --dp-muted:#e2bd87; --dp-accent:#ff7f55; --dp-hp-a:#f09a48; --dp-hp-b:#ffdb75; --dp-trait-a:#f15d58; --dp-trait-b:#ffd06b; --dp-shadow:rgba(255,163,61,.18); }
#game-screen.rem-battle--phase4[data-design-pack="full_graziline"],
#game-screen.rem-battle--phase4[data-design-pack="full_nocturne_ark"],
#game-screen.rem-battle--phase4[data-design-pack="shop_neon_lilac"] { --dp-panel:#26193d; --dp-panel-hi:#3d2860; --dp-line:#bf93ff; --dp-text:#f5eaff; --dp-muted:#d0afe7; --dp-accent:#f0b9ff; --dp-hp-a:#a76cf4; --dp-hp-b:#e3a8ff; --dp-trait-a:#6ddcff; --dp-trait-b:#c995ff; --dp-shadow:rgba(184,106,255,.18); }
#game-screen.rem-battle--phase4[data-design-pack="full_sakuratake"],
#game-screen.rem-battle--phase4[data-design-pack="full_mistral_viper"] { --dp-panel:#15392e; --dp-panel-hi:#286044; --dp-line:#83e6b4; --dp-text:#effff5; --dp-muted:#b3dcc4; --dp-accent:#ffb5d4; --dp-hp-a:#54c98b; --dp-hp-b:#d3ff99; --dp-trait-a:#f1a8d0; --dp-trait-b:#91edb5; --dp-shadow:rgba(92,231,166,.17); }
#game-screen.rem-battle--phase4[data-design-pack="full_valkyrie9"] { --dp-panel:#1c2d42; --dp-panel-hi:#3a526d; --dp-line:#d4efff; --dp-text:#f3faff; --dp-muted:#b8cbd9; --dp-accent:#99caff; --dp-hp-a:#77b5eb; --dp-hp-b:#d6f1ff; --dp-trait-a:#a8e7ff; --dp-trait-b:#f1fbff; --dp-shadow:rgba(174,217,255,.16); }
#game-screen.rem-battle--phase4[data-design-pack="full_solflare"] { --dp-panel:#412814; --dp-panel-hi:#70451e; --dp-line:#ffc566; --dp-text:#fff0cf; --dp-muted:#e7c18b; --dp-accent:#ff714c; --dp-hp-a:#ff9b46; --dp-hp-b:#ffe17b; --dp-trait-a:#ff734d; --dp-trait-b:#ffd36f; --dp-shadow:rgba(255,151,54,.2); }

#game-screen.rem-battle--phase4[data-design-pack]:not([data-design-pack="standard"]) .hud-bottom {
  border-color: var(--dp-line) !important;
  border-bottom-color: var(--dp-accent) !important;
  background:
    linear-gradient(100deg, color-mix(in srgb, var(--dp-panel-hi) 86%, transparent), transparent 48%),
    repeating-linear-gradient(90deg, rgba(255,255,255,.035) 0 1px, transparent 1px 13px),
    linear-gradient(180deg, var(--dp-panel-hi), var(--dp-panel) 72%) !important;
  box-shadow: inset 3px 0 0 var(--dp-accent), inset -1px 0 0 color-mix(in srgb, var(--dp-line) 45%, transparent), 0 0 16px var(--dp-shadow) !important;
}
#game-screen.rem-battle--phase4[data-design-pack]:not([data-design-pack="standard"]) .hud-bottom::before { content: "FRAME CONSOLE / SKIN LINK"; color: var(--dp-muted); }
#game-screen.rem-battle--phase4[data-design-pack]:not([data-design-pack="standard"]) :is(.dust-head, .hp-head) { color: var(--dp-text) !important; }
#game-screen.rem-battle--phase4[data-design-pack]:not([data-design-pack="standard"]) :is(.dust-head, .hp-head) .label,
#game-screen.rem-battle--phase4[data-design-pack]:not([data-design-pack="standard"]) .weapon-panel .label { color: var(--dp-muted) !important; }
#game-screen.rem-battle--phase4[data-design-pack]:not([data-design-pack="standard"]) :is(.dust-gauge, .hp-gauge),
#game-screen.rem-battle--phase4[data-design-pack]:not([data-design-pack="standard"]) .weapon-panel { border-color: color-mix(in srgb, var(--dp-line) 58%, transparent) !important; background: color-mix(in srgb, var(--dp-panel) 82%, #02070b 18%) !important; }
#game-screen.rem-battle--phase4[data-design-pack]:not([data-design-pack="standard"]) .dust-fill { background: linear-gradient(90deg, var(--dp-trait-a), var(--dp-trait-b)) !important; }
#game-screen.rem-battle--phase4[data-design-pack]:not([data-design-pack="standard"]) .hp-fill { background: linear-gradient(90deg, var(--dp-hp-a), var(--dp-hp-b)) !important; }
#game-screen.rem-battle--phase4[data-design-pack]:not([data-design-pack="standard"]) #weapon-value,
#game-screen.rem-battle--phase4[data-design-pack]:not([data-design-pack="standard"]) :is(#dust-text, #hp-text) { color: var(--dp-text) !important; }
#game-screen.rem-battle--phase4[data-design-pack]:not([data-design-pack="standard"]) .item-btn {
  border-color: color-mix(in srgb, var(--dp-line) 52%, transparent) !important;
  color: var(--dp-text) !important;
  background: linear-gradient(180deg, color-mix(in srgb, var(--dp-panel-hi) 86%, #fff 14%), var(--dp-panel)) !important;
  box-shadow: inset 0 2px color-mix(in srgb, var(--dp-line) 18%, transparent), inset 2px 0 var(--dp-accent) !important;
}
#game-screen.rem-battle--phase4[data-design-pack]:not([data-design-pack="standard"]) .item-btn::before { background: var(--dp-accent) !important; width: 3px; opacity: .8; }
#game-screen.rem-battle--phase4[data-design-pack]:not([data-design-pack="standard"]) .special-skill-btn { box-shadow: 0 0 0 3px rgba(2,8,11,.88), 0 0 0 5px color-mix(in srgb, var(--dp-accent) 72%, transparent), 0 0 18px var(--dp-shadow) !important; }

/* Pack signatures keep the same readable controls while changing the console silhouette. */
#game-screen.rem-battle--phase4[data-design-pack="full_sakuratake"] .hud-bottom,
#game-screen.rem-battle--phase4[data-design-pack="full_mistral_viper"] .hud-bottom { clip-path: polygon(0 0, 100% 0, 100% calc(100% - 12px), 14px 100%, 0 calc(100% - 22px)) !important; }
#game-screen.rem-battle--phase4[data-design-pack="full_a0b"] .hud-bottom,
#game-screen.rem-battle--phase4[data-design-pack="shop_amber_foundry"] .hud-bottom { background-image: repeating-linear-gradient(135deg, rgba(255,214,123,.055) 0 2px, transparent 2px 12px), linear-gradient(180deg, var(--dp-panel-hi), var(--dp-panel)) !important; }
#game-screen.rem-battle--phase4[data-design-pack="full_graziline"] .hud-bottom,
#game-screen.rem-battle--phase4[data-design-pack="full_nocturne_ark"] .hud-bottom,
#game-screen.rem-battle--phase4[data-design-pack="shop_neon_lilac"] .hud-bottom { clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 20px 100%, 0 calc(100% - 20px)) !important; }

@media (prefers-reduced-motion: reduce) {
  #game-screen.rem-battle--phase4[data-design-pack]:not([data-design-pack="standard"]) .hud-bottom { box-shadow: inset 3px 0 0 var(--dp-accent) !important; }
}