:root {
  --bg: #11120f; --panel: rgba(255,255,255,0.055); --line: rgba(255,255,255,0.11); --text: #f7f6ee;
  --muted: rgba(247,246,238,0.68); --soft: rgba(247,246,238,0.44); --amber: #f2ddb0; --black: #11120f;
  --shadow: 0 24px 80px rgba(0,0,0,0.42); font-synthesis: none;
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: var(--bg); color: var(--text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
body { background: radial-gradient(circle at 15% 0%, rgba(177,145,82,0.13), transparent 30rem), radial-gradient(circle at 85% 20%, rgba(110,136,106,0.10), transparent 34rem), var(--bg); }
a { color: inherit; text-decoration: none; }
strong { font-weight: 700; }
.site-header { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: 1.5rem; justify-content: space-between; padding: 1.15rem clamp(1rem, 4vw, 3rem); border-bottom: 1px solid var(--line); background: rgba(8,9,7,0.82); backdrop-filter: blur(16px); }
.brand { display: grid; gap: 0.18rem; } .brand-main { font-size: 0.92rem; font-weight: 800; letter-spacing: 0.34em; } .brand-sub { font-size: 0.76rem; color: var(--muted); letter-spacing: 0.04em; }
.site-nav { display: flex; align-items: center; gap: 1.25rem; color: var(--muted); font-size: 0.95rem; } .site-nav a.active, .site-nav a:hover { color: var(--text); } .nav-muted { color: var(--soft); }
.lang-toggle { display: flex; padding: 0.25rem; border: 1px solid var(--line); border-radius: 999px; background: rgba(0,0,0,0.24); } .lang { border: 0; background: transparent; color: var(--muted); padding: 0.45rem 0.7rem; border-radius: 999px; cursor: pointer; font-weight: 700; font-size: 0.8rem; } .lang.active { background: var(--amber); color: var(--black); }
.home-shell, .map-shell { width: min(1240px, calc(100% - 2rem)); margin: 0 auto; padding: clamp(1.5rem, 5vw, 4rem) 0 4rem; }
.hero-card { max-width: 900px; padding: clamp(1.5rem, 5vw, 4rem); border: 1px solid var(--line); border-radius: 2.2rem; background: linear-gradient(135deg, rgba(255,255,255,0.07), rgba(255,255,255,0.025)); box-shadow: var(--shadow); }
.eyebrow { margin: 0 0 0.85rem; color: rgba(242,221,176,0.88); text-transform: uppercase; letter-spacing: 0.26em; font-size: 0.73rem; font-weight: 800; }
h1 { margin: 0; font-size: clamp(2.5rem, 7vw, 5.4rem); line-height: 0.98; letter-spacing: -0.045em; } h2 { margin: 0; font-size: clamp(1.6rem, 4vw, 2.5rem); line-height: 1.1; letter-spacing: -0.03em; }
.hero-copy, .map-intro p, .feature-card p, .signal-drawer p, .drawer-teaser { color: var(--muted); line-height: 1.75; }
.hero-copy { max-width: 760px; font-size: clamp(1rem, 2vw, 1.28rem); } .hero-actions, .drawer-actions { display: flex; flex-wrap: wrap; gap: 0.9rem; margin-top: 1.55rem; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 3.15rem; padding: 0 1.3rem; border-radius: 999px; border: 1px solid var(--line); font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; font-size: 0.78rem; }
.button.primary { background: var(--amber); color: var(--black); border-color: transparent; } .button.secondary { color: var(--text); background: rgba(0,0,0,0.22); } .button.compact { min-width: 8.5rem; } .button.disabled, .button[aria-disabled="true"] { opacity: 0.62; cursor: default; }
.feature-card { margin-top: 1.5rem; padding: clamp(1.25rem, 4vw, 2rem); border: 1px solid var(--line); border-radius: 2rem; background: var(--panel); display: flex; gap: 2rem; align-items: center; justify-content: space-between; }
.feature-card p { max-width: 760px; margin-bottom: 0; }
.map-intro { max-width: 900px; margin-bottom: 1.4rem; } .map-intro h1 { font-size: clamp(2.2rem, 6vw, 4.8rem); } .map-intro p { font-size: 1.08rem; max-width: 830px; }
.control-deck { display: grid; grid-template-columns: 230px 1fr 270px; gap: 1rem; align-items: end; padding: 1rem; margin: 1.6rem 0; border: 1px solid var(--line); border-radius: 1.8rem; background: var(--panel); box-shadow: var(--shadow); }
.control { display: grid; gap: 0.6rem; color: var(--soft); text-transform: uppercase; letter-spacing: 0.2em; font-size: 0.72rem; font-weight: 800; }
select { appearance: none; width: 100%; min-height: 3.15rem; padding: 0 1rem; border-radius: 1.15rem; border: 1px solid var(--line); color: var(--text); background: rgba(0,0,0,0.34); font: inherit; text-transform: none; letter-spacing: normal; font-size: 0.95rem; font-weight: 600; }
.pill-row { display: flex; flex-wrap: wrap; gap: 0.55rem; } .pill { border: 1px solid var(--line); background: rgba(0,0,0,0.24); color: var(--muted); min-height: 2.8rem; padding: 0 1rem; border-radius: 999px; cursor: pointer; font-weight: 700; } .pill.active { background: var(--amber); color: var(--black); border-color: transparent; }
.map-layout { display: grid; grid-template-columns: minmax(0, 1fr) 390px; gap: 1.35rem; align-items: start; } .board-column { min-width: 0; }
.map-board { position: relative; width: 100%; border-radius: 2rem; border: 1px solid var(--line); background-color: #171816; background-repeat: no-repeat; background-position: center; background-size: contain; box-shadow: var(--shadow); overflow: hidden; }
.map-board.appalachia { aspect-ratio: 1 / 1; } .map-board.mojave { aspect-ratio: 1000 / 1000; } .map-board.capital { aspect-ratio: 1161 / 1134; }
.map-board.mexican-wasteland { aspect-ratio: 2200 / 1500; }


.map-board::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(0,0,0,0.08), rgba(0,0,0,0.16)); }
.board-title { position: absolute; z-index: 5; left: 1rem; top: 1rem; max-width: calc(100% - 2rem); padding: 0.75rem 1rem; border: 1px solid var(--line); border-radius: 999px; color: rgba(255,250,235,0.92); background: rgba(6,7,6,0.62); backdrop-filter: blur(10px); font-size: 0.73rem; font-weight: 900; letter-spacing: 0.28em; }
.pin-layer { position: absolute; z-index: 6; inset: 0; }
.pin {
  position: absolute;
  transform: translate(-50%, -50%);
  width: 2.75rem;
  height: 2.75rem;
  border: 0;
  background: transparent;
  color: var(--pin-color, var(--amber));
  display: grid;
  place-items: center;
  cursor: pointer;
  filter: drop-shadow(0 0 12px rgba(0,0,0,0.64));
  animation: signalPulse 3.2s infinite ease-in-out;
}
.pin::before {
  content: "";
  position: absolute;
  inset: -0.34rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.16);
  opacity: 0.65;
}
.pin.cluster::after {
  content: "";
  position: absolute;
  inset: -0.74rem;
  border-radius: 999px;
  border: 1.5px solid var(--pin-color, var(--amber));
  opacity: 0.72;
}
.pin.active {
  transform: translate(-50%, -50%) scale(1.12);
  animation: none;
}
.pin.music { --pin-color: #f0d48d; }
.pin.programs { --pin-color: #afe1bf; }
.pin.stories { --pin-color: #bfd7ef; }
.pin.field-reels { --pin-color: #ebb093; }

.marker-glyph {
  position: relative;
  display: block;
  width: 2.15rem;
  height: 2.15rem;
  border-radius: 999px;
  background: rgba(12,14,12,0.80);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.10),
    0 0 0 1px rgba(0,0,0,0.36);
}
.marker-center,
.marker-detail {
  position: absolute;
  display: block;
}
.marker-center {
  left: 50%;
  top: 50%;
  width: 0.48rem;
  height: 0.48rem;
  margin-left: -0.24rem;
  margin-top: -0.24rem;
  border-radius: 999px;
  background: var(--pin-color);
  box-shadow: 0 0 10px rgba(242,221,176,0.45);
}

/* Music — broadcast rings */
.pin.music .marker-detail.detail-a,
.pin.music .marker-detail.detail-b {
  left: 50%;
  top: 50%;
  border-radius: 999px;
  border: 1.4px solid var(--pin-color);
  transform: translate(-50%, -50%);
}
.pin.music .marker-detail.detail-a {
  width: 1.12rem;
  height: 1.12rem;
  opacity: 0.92;
}
.pin.music .marker-detail.detail-b {
  width: 1.58rem;
  height: 1.58rem;
  opacity: 0.48;
  border-style: dashed;
}

/* Stories — intercept diamond */
.pin.stories .marker-glyph {
  border-radius: 0.52rem;
  transform: rotate(45deg);
}
.pin.stories .marker-center {
  transform: rotate(-45deg);
}
.pin.stories .marker-detail.detail-a {
  inset: 0.33rem;
  border: 1.4px solid var(--pin-color);
  border-radius: 0.34rem;
}
.pin.stories .marker-detail.detail-b {
  left: 50%;
  top: -0.20rem;
  width: 0.74rem;
  height: 0.74rem;
  border-top: 1.4px solid var(--pin-color);
  border-left: 1.4px solid var(--pin-color);
  transform: translateX(-50%) rotate(45deg);
  opacity: 0.58;
}

/* Programs — stable archive node */
.pin.programs .marker-glyph {
  border-radius: 0.50rem;
}
.pin.programs .marker-detail.detail-a {
  inset: 0.34rem;
  border: 1.4px solid var(--pin-color);
  border-radius: 0.28rem;
}
.pin.programs .marker-detail.detail-b {
  left: 0.22rem;
  right: 0.22rem;
  top: 50%;
  height: 0;
  border-top: 1.4px solid var(--pin-color);
  transform: translateY(-50%);
  opacity: 0.54;
}

/* Field Reels — capture brackets */
.pin.field-reels .marker-glyph {
  border-radius: 0.72rem;
}
.pin.field-reels .marker-detail.detail-a,
.pin.field-reels .marker-detail.detail-b {
  inset: 0.26rem;
  border-color: var(--pin-color);
  opacity: 0.95;
}
.pin.field-reels .marker-detail.detail-a {
  border-top: 1.4px solid var(--pin-color);
  border-left: 1.4px solid var(--pin-color);
  border-radius: 0.28rem 0 0 0;
}
.pin.field-reels .marker-detail.detail-b {
  border-right: 1.4px solid var(--pin-color);
  border-bottom: 1.4px solid var(--pin-color);
  border-radius: 0 0 0.28rem 0;
}

.tooltip { position: absolute; left: 50%; top: 3rem; transform: translateX(-50%); width: max-content; max-width: 16rem; padding: 0.75rem 0.85rem; border-radius: 1rem; border: 1px solid var(--line); background: rgba(6,7,6,0.92); color: var(--text); box-shadow: var(--shadow); text-align: left; opacity: 0; pointer-events: none; transition: opacity 140ms ease; }
.pin:hover .tooltip, .pin:focus-visible .tooltip { opacity: 1; } .tooltip strong { display: block; font-size: 0.86rem; line-height: 1.25; } .tooltip small { display: block; margin-top: 0.35rem; color: rgba(242,221,176,0.86); text-transform: uppercase; letter-spacing: 0.16em; }
@keyframes signalPulse {
  0%,100% { transform: translate(-50%, -50%) scale(1); opacity: 0.96; }
  50% { transform: translate(-50%, -50%) scale(1.045); opacity: 1; }
}
.signal-drawer { position: sticky; top: 6.5rem; min-height: 21rem; padding: 1.25rem; border: 1px solid var(--line); border-radius: 2rem; background: rgba(255,255,255,0.065); box-shadow: var(--shadow); backdrop-filter: blur(16px); }
.signal-drawer h2, .mobile-sheet h2 { font-size: clamp(1.4rem, 3vw, 2rem); margin: 0.35rem 0 0.8rem; }
.drawer-meta { display: grid; gap: 0.55rem; margin: 1rem 0; color: var(--muted); font-size: 0.96rem; } .drawer-meta b { color: var(--soft); font-weight: 700; }
.source-card, .hub-item { margin-top: 1rem; padding: 0.95rem; border: 1px solid var(--line); border-radius: 1.25rem; background: rgba(0,0,0,0.24); }
.source-card b { color: var(--soft); } .hub-list { display: grid; gap: 0.8rem; margin-top: 1rem; } .hub-item strong { display: block; margin-bottom: 0.25rem; } .hub-item small { display: block; color: rgba(242,221,176,0.85); text-transform: uppercase; letter-spacing: 0.16em; font-size: 0.68rem; }
.tiny-note { color: var(--soft); font-size: 0.78rem; text-align: center; margin-top: 0.7rem; } .empty-state { margin-top: 1rem; display: grid; gap: 0.35rem; padding: 1.25rem; text-align: center; border: 1px solid var(--line); border-radius: 1.5rem; background: var(--panel); color: var(--muted); } .empty-state strong { color: var(--text); } .hidden { display: none !important; }
.mobile-sheet { display: none; position: fixed; z-index: 50; inset: auto 0 0 0; max-height: 78vh; overflow-y: auto; padding: 1rem; border-top: 1px solid var(--line); border-radius: 2rem 2rem 0 0; background: rgba(16,18,15,0.97); box-shadow: 0 -24px 80px rgba(0,0,0,0.52); } .mobile-sheet .signal-drawer { position: static; min-height: unset; border: 0; padding: 0.2rem 0 0; box-shadow: none; background: transparent; }
.close-button { float: right; border: 1px solid var(--line); border-radius: 999px; background: rgba(0,0,0,0.26); color: var(--text); width: 2.5rem; height: 2.5rem; cursor: pointer; font-size: 1rem; }
@media (max-width: 980px) { .site-header { flex-wrap: wrap; } .control-deck, .map-layout { grid-template-columns: 1fr; } .signal-drawer { display: none; } .mobile-sheet { display: block; } }
@media (max-width: 720px) {
  .signal-key-panel { align-items: flex-start; }
  .signal-key-row { gap: 0.75rem 1rem; } .home-shell, .map-shell { width: min(100% - 1rem, 1240px); } .site-nav { width: 100%; justify-content: flex-start; overflow-x: auto; } .feature-card { display: grid; gap: 1rem; } .board-title { font-size: 0.61rem; letter-spacing: 0.18em; } .pin { width: 2.55rem; height: 2.55rem; } .marker-glyph { width: 2rem; height: 2rem; } .tooltip { display: none; } }


.signal-key-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.2rem;
  flex-wrap: wrap;
  margin: -0.35rem 0 1.25rem;
  padding: 0.85rem 1rem;
  border: 1px solid var(--line);
  border-radius: 1.55rem;
  background: rgba(255,255,255,0.038);
}
.key-eyebrow { margin: 0; white-space: nowrap; }
.signal-key-row { display: flex; align-items: center; flex-wrap: wrap; gap: 0.85rem 1.2rem; }
.signal-key-item { display: inline-flex; align-items: center; gap: 0.62rem; color: var(--muted); font-size: 0.9rem; font-weight: 700; }
.legend-marker { position: relative; display: inline-grid; place-items: center; width: 2.1rem; height: 2.1rem; color: var(--pin-color, var(--amber)); flex: 0 0 auto; }
.legend-marker.music { --pin-color: #f0d48d; }
.legend-marker.programs { --pin-color: #afe1bf; }
.legend-marker.stories { --pin-color: #bfd7ef; }
.legend-marker.field-reels { --pin-color: #ebb093; }
.legend-marker .marker-glyph { width: 1.78rem; height: 1.78rem; }
.legend-marker .marker-center { width: 0.40rem; height: 0.40rem; margin-left: -0.20rem; margin-top: -0.20rem; }
.legend-marker.music .marker-detail.detail-a { width: 0.96rem; height: 0.96rem; }
.legend-marker.music .marker-detail.detail-b { width: 1.34rem; height: 1.34rem; }
.legend-marker.stories .marker-glyph { border-radius: 0.45rem; transform: rotate(45deg); }
.legend-marker.stories .marker-center { transform: rotate(-45deg); }
.legend-marker.stories .marker-detail.detail-a { inset: 0.28rem; border: 1.25px solid var(--pin-color); border-radius: 0.28rem; }
.legend-marker.stories .marker-detail.detail-b { left: 50%; top: -0.16rem; width: 0.62rem; height: 0.62rem; border-top: 1.25px solid var(--pin-color); border-left: 1.25px solid var(--pin-color); transform: translateX(-50%) rotate(45deg); opacity: 0.58; }
.legend-marker.programs .marker-glyph { border-radius: 0.42rem; }
.legend-marker.programs .marker-detail.detail-a { inset: 0.28rem; border: 1.25px solid var(--pin-color); border-radius: 0.23rem; }
.legend-marker.programs .marker-detail.detail-b { left: 0.18rem; right: 0.18rem; top: 50%; height: 0; border-top: 1.25px solid var(--pin-color); transform: translateY(-50%); opacity: 0.54; }
.legend-marker.field-reels .marker-glyph { border-radius: 0.60rem; }
.legend-marker.field-reels .marker-detail.detail-a, .legend-marker.field-reels .marker-detail.detail-b { inset: 0.22rem; opacity: 0.95; }
.legend-marker.field-reels .marker-detail.detail-a { border-top: 1.25px solid var(--pin-color); border-left: 1.25px solid var(--pin-color); border-radius: 0.23rem 0 0 0; }
.legend-marker.field-reels .marker-detail.detail-b { border-right: 1.25px solid var(--pin-color); border-bottom: 1.25px solid var(--pin-color); border-radius: 0 0 0.23rem 0; }



/* Programs taxonomy page */
.programs-shell {
  width: min(1240px, calc(100% - 2rem));
  margin: 0 auto;
  padding: clamp(1.5rem, 5vw, 4rem) 0 4rem;
}

.taxonomy-intro {
  max-width: 1040px;
  margin-bottom: 2.1rem;
}

.taxonomy-intro h1 {
  max-width: 1120px;
  font-size: clamp(2.55rem, 6.2vw, 5.25rem);
}

.taxonomy-intro p,
.taxonomy-heading p,
.taxonomy-card p {
  color: var(--muted);
  line-height: 1.75;
}

.taxonomy-intro p {
  max-width: 960px;
  font-size: 1.12rem;
}

.taxonomy-section {
  margin-top: 2rem;
  padding: clamp(1.2rem, 3vw, 1.65rem);
  border: 1px solid var(--line);
  border-radius: 2.3rem;
  background:
    radial-gradient(circle at 95% 8%, rgba(242,221,176,0.05), transparent 25rem),
    rgba(255,255,255,0.028);
}

.taxonomy-heading {
  max-width: 950px;
  margin-bottom: 1.35rem;
}

.taxonomy-heading h2 {
  font-size: clamp(1.9rem, 4vw, 3.1rem);
}

.taxonomy-heading p {
  max-width: 820px;
  margin-bottom: 0;
  font-size: 1.02rem;
}

.taxonomy-grid {
  display: grid;
  gap: 1rem;
}

.worlds-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.series-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.shelves-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.taxonomy-card {
  min-height: 18rem;
  padding: clamp(1.2rem, 2.8vw, 1.75rem);
  border: 1px solid var(--line);
  border-radius: 1.85rem;
  background:
    radial-gradient(circle at 88% 12%, rgba(242,221,176,0.07), transparent 18rem),
    linear-gradient(145deg, rgba(255,255,255,0.062), rgba(255,255,255,0.022));
  box-shadow: 0 18px 48px rgba(0,0,0,0.22);
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}

.world-card:nth-child(1),
.series-card.flagship-series {
  background:
    radial-gradient(circle at 88% 12%, rgba(242,221,176,0.12), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.078), rgba(255,255,255,0.026));
}

.shelf-card {
  background:
    radial-gradient(circle at 88% 12%, rgba(110,136,106,0.10), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.052), rgba(255,255,255,0.020));
}

.taxonomy-card h3 {
  margin: 0;
  font-size: clamp(1.4rem, 2.8vw, 2rem);
  line-height: 1.12;
  letter-spacing: -0.025em;
}

.card-kicker {
  margin: 0;
  color: rgba(242,221,176,0.84) !important;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  font-size: 0.68rem;
  font-weight: 900;
}

.taxonomy-card p:not(.card-kicker) {
  margin: 0;
  max-width: 96%;
}

.program-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin-top: auto;
  padding-top: 0.45rem;
}

.program-meta span {
  min-height: 2.15rem;
  display: inline-flex;
  align-items: center;
  padding: 0 0.82rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(0,0,0,0.23);
  color: rgba(247,246,238,0.78);
  font-size: 0.71rem;
  font-weight: 850;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

@media (max-width: 960px) {
  .worlds-grid,
  .series-grid,
  .shelves-grid {
    grid-template-columns: 1fr;
  }

  .taxonomy-card {
    min-height: 0;
  }
}


/* Programs v26 polish */
.series-card.frontier-wide {
  grid-column: 1 / -1;
  min-height: 15.5rem;
}

.series-card.frontier-wide p:not(.card-kicker) {
  max-width: 860px;
}

@media (max-width: 960px) {
  .series-card.frontier-wide {
    grid-column: auto;
  }
}


/* Programs-to-map wiring */
.card-link-row {
  margin-top: 0.25rem;
  padding-top: 0.35rem;
}

.taxonomy-link {
  min-height: 2.85rem;
  padding: 0 1rem;
  font-size: 0.70rem;
  letter-spacing: 0.08em;
}


/* Nuka Nights series page */
.series-shell {
  width: min(1240px, calc(100% - 2rem));
  margin: 0 auto;
  padding: clamp(1.5rem, 5vw, 4rem) 0 4rem;
}

.series-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, 0.55fr);
  gap: 1.35rem;
  align-items: stretch;
}

.series-hero-copy,
.series-stat-panel,
.series-summary,
.volume-section {
  border: 1px solid var(--line);
  border-radius: 2.2rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(242,221,176,0.07), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.062), rgba(255,255,255,0.022));
  box-shadow: var(--shadow);
}

.series-hero-copy {
  padding: clamp(1.5rem, 4vw, 3rem);
}

.series-hero-copy h1 {
  margin-bottom: 0.9rem;
}

.series-hero-copy p,
.series-summary p,
.volume-heading p,
.volume-card p {
  color: var(--muted);
  line-height: 1.75;
}

.series-hero-copy p {
  max-width: 820px;
  font-size: 1.08rem;
}

.series-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.9rem;
  margin-top: 1.5rem;
}

.series-stat-panel {
  padding: 1.15rem;
  display: grid;
  align-content: center;
  gap: 0.85rem;
}

.series-stat {
  min-height: 6.2rem;
  border-radius: 1.45rem;
  border: 1px solid var(--line);
  background: rgba(0,0,0,0.22);
  padding: 1rem 1.05rem;
  display: grid;
  gap: 0.45rem;
  align-content: center;
}

.series-stat span {
  color: var(--soft);
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-size: 0.68rem;
  font-weight: 900;
}

.series-stat b {
  font-size: clamp(1.2rem, 2vw, 1.75rem);
  line-height: 1.1;
}

.series-summary {
  margin-top: 1.4rem;
  padding: clamp(1.25rem, 3vw, 2rem);
}

.series-summary h2,
.volume-heading h2 {
  font-size: clamp(1.8rem, 4vw, 3rem);
}

.series-summary p {
  max-width: 940px;
  margin-bottom: 0;
}

.volume-section {
  margin-top: 1.4rem;
  padding: clamp(1.25rem, 3vw, 1.8rem);
}

.volume-heading {
  max-width: 980px;
  margin-bottom: 1.25rem;
}

.volume-heading p {
  max-width: 860px;
}

.volume-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.volume-card {
  min-height: 15rem;
  padding: 1.35rem;
  border: 1px solid var(--line);
  border-radius: 1.75rem;
  background:
    radial-gradient(circle at 92% 10%, rgba(242,221,176,0.07), transparent 18rem),
    rgba(255,255,255,0.036);
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}

.volume-card-wide {
  grid-column: 1 / -1;
  min-height: 13.8rem;
}

.volume-number {
  color: rgba(242,221,176,0.88);
  text-transform: uppercase;
  letter-spacing: 0.28em;
  font-size: 0.74rem;
  font-weight: 900;
}

.volume-card h3 {
  margin: 0;
  font-size: clamp(1.35rem, 2.7vw, 1.95rem);
  line-height: 1.14;
  letter-spacing: -0.02em;
}

.volume-card p {
  margin: 0;
  max-width: 92%;
}

.volume-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin-top: auto;
}

.volume-tags span {
  min-height: 2.05rem;
  display: inline-flex;
  align-items: center;
  padding: 0 0.8rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(0,0,0,0.22);
  color: rgba(247,246,238,0.78);
  font-size: 0.70rem;
  font-weight: 850;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.card-link-row.dual-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
}

.secondary-link {
  background: rgba(0,0,0,0.22);
  color: var(--text);
}

@media (max-width: 960px) {
  .series-hero,
  .volume-grid {
    grid-template-columns: 1fr;
  }

  .volume-card-wide {
    grid-column: auto;
  }
}


/* Enclave Broadcasts page */
.enclave-volume-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.enclave-volume-card {
  min-height: 18rem;
}

@media (max-width: 960px) {
  .enclave-volume-grid {
    grid-template-columns: 1fr;
  }
}


/* Please Hold page */
.hold-index-section {
  margin-top: 1.4rem;
  padding: clamp(1.25rem, 3vw, 1.8rem);
  border: 1px solid var(--line);
  border-radius: 2.2rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(242,221,176,0.07), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.052), rgba(255,255,255,0.020));
  box-shadow: var(--shadow);
}

.hold-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.hold-card {
  min-height: 18rem;
  padding: 1.35rem;
  border: 1px solid var(--line);
  border-radius: 1.75rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.08), transparent 18rem),
    rgba(255,255,255,0.036);
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.featured-hold {
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.12), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.hold-card h3 {
  margin: 0;
  font-size: clamp(1.35rem, 2.7vw, 1.95rem);
  line-height: 1.14;
  letter-spacing: -0.02em;
}

.hold-card p {
  color: var(--muted);
  line-height: 1.75;
  margin: 0;
  max-width: 95%;
}

@media (max-width: 960px) {
  .hold-grid {
    grid-template-columns: 1fr;
  }
}


/* Brotherhood Transmissions page */
.brotherhood-index-section {
  margin-top: 1.4rem;
  padding: clamp(1.25rem, 3vw, 1.8rem);
  border: 1px solid var(--line);
  border-radius: 2.2rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(242,221,176,0.07), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.052), rgba(255,255,255,0.020));
  box-shadow: var(--shadow);
}

.brotherhood-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.brotherhood-card {
  min-height: 18rem;
  padding: 1.35rem;
  border: 1px solid var(--line);
  border-radius: 1.75rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.08), transparent 18rem),
    rgba(255,255,255,0.036);
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.featured-brotherhood {
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.12), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.future-brotherhood {
  background:
    radial-gradient(circle at 90% 10%, rgba(110,136,106,0.09), transparent 20rem),
    rgba(255,255,255,0.034);
}

.brotherhood-card h3 {
  margin: 0;
  font-size: clamp(1.35rem, 2.7vw, 1.95rem);
  line-height: 1.14;
  letter-spacing: -0.02em;
}

.brotherhood-card p {
  color: var(--muted);
  line-height: 1.75;
  margin: 0;
  max-width: 95%;
}

@media (max-width: 960px) {
  .brotherhood-grid {
    grid-template-columns: 1fr;
  }
}


/* Midnight in the Wasteland page */
.midnight-index-section,
.midnight-bridge-section {
  margin-top: 1.4rem;
  padding: clamp(1.25rem, 3vw, 1.8rem);
  border: 1px solid var(--line);
  border-radius: 2.2rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(191,215,239,0.08), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.052), rgba(255,255,255,0.020));
  box-shadow: var(--shadow);
}

.midnight-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.midnight-card {
  min-height: 18rem;
  padding: 1.35rem;
  border: 1px solid var(--line);
  border-radius: 1.75rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(191,215,239,0.10), transparent 18rem),
    rgba(255,255,255,0.036);
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.featured-midnight {
  background:
    radial-gradient(circle at 90% 10%, rgba(191,215,239,0.14), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.midnight-card h3,
.bridge-card h3 {
  margin: 0;
  font-size: clamp(1.35rem, 2.7vw, 1.95rem);
  line-height: 1.14;
  letter-spacing: -0.02em;
}

.midnight-card p,
.bridge-card p {
  color: var(--muted);
  line-height: 1.75;
  margin: 0;
  max-width: 95%;
}

.bridge-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1.2rem;
  padding: 1.35rem;
  border: 1px solid var(--line);
  border-radius: 1.75rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(191,215,239,0.08), transparent 18rem),
    rgba(255,255,255,0.036);
}

.bridge-actions {
  flex: 0 0 auto;
}

@media (max-width: 960px) {
  .midnight-grid {
    grid-template-columns: 1fr;
  }

  .bridge-card {
    flex-direction: column;
    align-items: flex-start;
  }
}


/* Life Inside page */
.life-album-section,
.behavioral-section {
  margin-top: 1.4rem;
  padding: clamp(1.25rem, 3vw, 1.8rem);
  border: 1px solid var(--line);
  border-radius: 2.2rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(175,225,191,0.07), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.052), rgba(255,255,255,0.020));
  box-shadow: var(--shadow);
}

.life-grid,
.behavior-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.life-card,
.behavior-card {
  min-height: 18rem;
  padding: 1.35rem;
  border: 1px solid var(--line);
  border-radius: 1.75rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(175,225,191,0.08), transparent 18rem),
    rgba(255,255,255,0.036);
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.featured-life,
.featured-behavior {
  background:
    radial-gradient(circle at 90% 10%, rgba(175,225,191,0.12), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.life-card h3,
.behavior-card h3 {
  margin: 0;
  font-size: clamp(1.35rem, 2.7vw, 1.95rem);
  line-height: 1.14;
  letter-spacing: -0.02em;
}

.life-card p,
.behavior-card p {
  color: var(--muted);
  line-height: 1.75;
  margin: 0;
  max-width: 95%;
}

@media (max-width: 960px) {
  .life-grid,
  .behavior-grid {
    grid-template-columns: 1fr;
  }
}


/* Teotlalli Signals page */
.teotlalli-story-section,
.teotlalli-language-section,
.teotlalli-music-section {
  margin-top: 1.4rem;
  padding: clamp(1.25rem, 3vw, 1.8rem);
  border: 1px solid var(--line);
  border-radius: 2.2rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(242,221,176,0.08), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.052), rgba(255,255,255,0.020));
  box-shadow: var(--shadow);
}

.teotlalli-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.teotlalli-card {
  min-height: 18rem;
  padding: 1.35rem;
  border: 1px solid var(--line);
  border-radius: 1.75rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.09), transparent 18rem),
    rgba(255,255,255,0.036);
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.featured-teotlalli {
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.13), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.teotlalli-wide {
  grid-column: 1 / -1;
  min-height: 15.5rem;
}

.teotlalli-card h3,
.language-card h3,
.music-bridge-card h3 {
  margin: 0;
  font-size: clamp(1.35rem, 2.7vw, 1.95rem);
  line-height: 1.14;
  letter-spacing: -0.02em;
}

.teotlalli-card p,
.language-card p,
.music-bridge-card p {
  color: var(--muted);
  line-height: 1.75;
  margin: 0;
  max-width: 95%;
}

.language-card,
.music-bridge-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1.2rem;
  padding: 1.35rem;
  border: 1px solid var(--line);
  border-radius: 1.75rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.08), transparent 18rem),
    rgba(255,255,255,0.036);
}

.language-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  flex: 0 0 auto;
}

.language-tags span {
  min-height: 2.05rem;
  display: inline-flex;
  align-items: center;
  padding: 0 0.8rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(0,0,0,0.22);
  color: rgba(247,246,238,0.78);
  font-size: 0.70rem;
  font-weight: 850;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

@media (max-width: 960px) {
  .teotlalli-grid {
    grid-template-columns: 1fr;
  }

  .teotlalli-wide {
    grid-column: auto;
  }

  .language-card,
  .music-bridge-card {
    flex-direction: column;
    align-items: flex-start;
  }
}


/* Father Elijah Cycle page */
.elijah-volume-section,
.elijah-bridge-section {
  margin-top: 1.4rem;
  padding: clamp(1.25rem, 3vw, 1.8rem);
  border: 1px solid var(--line);
  border-radius: 2.2rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(242,221,176,0.08), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.052), rgba(255,255,255,0.020));
  box-shadow: var(--shadow);
}

.elijah-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.elijah-card {
  min-height: 18rem;
  padding: 1.35rem;
  border: 1px solid var(--line);
  border-radius: 1.75rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.09), transparent 18rem),
    rgba(255,255,255,0.036);
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.featured-elijah {
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.13), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.elijah-card h3 {
  margin: 0;
  font-size: clamp(1.35rem, 2.7vw, 1.95rem);
  line-height: 1.14;
  letter-spacing: -0.02em;
}

.elijah-card p,
.elijah-bridge-card p {
  color: var(--muted);
  line-height: 1.75;
  margin: 0;
  max-width: 95%;
}

.elijah-bridge-card {
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.08), transparent 18rem),
    rgba(255,255,255,0.036);
}

@media (max-width: 960px) {
  .elijah-grid {
    grid-template-columns: 1fr;
  }
}


/* Mutations Under the Moon page */
.mutations-index-section,
.mutations-note-section {
  margin-top: 1.4rem;
  padding: clamp(1.25rem, 3vw, 1.8rem);
  border: 1px solid var(--line);
  border-radius: 2.2rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(242,221,176,0.08), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.052), rgba(255,255,255,0.020));
  box-shadow: var(--shadow);
}

.mutations-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.mutations-card {
  min-height: 18rem;
  padding: 1.35rem;
  border: 1px solid var(--line);
  border-radius: 1.75rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.09), transparent 18rem),
    rgba(255,255,255,0.036);
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.featured-mutations {
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.13), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.mutations-card h3 {
  margin: 0;
  font-size: clamp(1.35rem, 2.7vw, 1.95rem);
  line-height: 1.14;
  letter-spacing: -0.02em;
}

.mutations-card p {
  color: var(--muted);
  line-height: 1.75;
  margin: 0;
  max-width: 95%;
}

@media (max-width: 960px) {
  .mutations-grid {
    grid-template-columns: 1fr;
  }
}


/* Dottie Confidential page */
.dottie-index-section,
.dottie-note-section {
  margin-top: 1.4rem;
  padding: clamp(1.25rem, 3vw, 1.8rem);
  border: 1px solid var(--line);
  border-radius: 2.2rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(235,176,147,0.10), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.052), rgba(255,255,255,0.020));
  box-shadow: var(--shadow);
}

.dottie-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.dottie-card {
  min-height: 18rem;
  padding: 1.35rem;
  border: 1px solid var(--line);
  border-radius: 1.75rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(235,176,147,0.10), transparent 18rem),
    rgba(255,255,255,0.036);
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.featured-dottie {
  background:
    radial-gradient(circle at 90% 10%, rgba(235,176,147,0.15), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.dottie-card h3 {
  margin: 0;
  font-size: clamp(1.35rem, 2.7vw, 1.95rem);
  line-height: 1.14;
  letter-spacing: -0.02em;
}

.dottie-card p {
  color: var(--muted);
  line-height: 1.75;
  margin: 0;
  max-width: 95%;
}

@media (max-width: 960px) {
  .dottie-grid {
    grid-template-columns: 1fr;
  }
}


/* Atomic Glamour page */
.glamour-index-section,
.glamour-note-section {
  margin-top: 1.4rem;
  padding: clamp(1.25rem, 3vw, 1.8rem);
  border: 1px solid var(--line);
  border-radius: 2.2rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(191,215,239,0.10), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.052), rgba(255,255,255,0.020));
  box-shadow: var(--shadow);
}

.glamour-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.glamour-card {
  min-height: 18rem;
  padding: 1.35rem;
  border: 1px solid var(--line);
  border-radius: 1.75rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(191,215,239,0.10), transparent 18rem),
    rgba(255,255,255,0.036);
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.featured-glamour {
  background:
    radial-gradient(circle at 90% 10%, rgba(191,215,239,0.15), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.glamour-card h3 {
  margin: 0;
  font-size: clamp(1.35rem, 2.7vw, 1.95rem);
  line-height: 1.14;
  letter-spacing: -0.02em;
}

.glamour-card p {
  color: var(--muted);
  line-height: 1.75;
  margin: 0;
  max-width: 95%;
}

@media (max-width: 960px) {
  .glamour-grid {
    grid-template-columns: 1fr;
  }
}


/* Chem Swing Syndrome page */
.chem-branches-section,
.chem-spectrum-section,
.chem-note-section {
  margin-top: 1.4rem;
  padding: clamp(1.25rem, 3vw, 1.8rem);
  border: 1px solid var(--line);
  border-radius: 2.2rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(242,221,176,0.09), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.052), rgba(255,255,255,0.020));
  box-shadow: var(--shadow);
}

.chem-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.chem-card {
  min-height: 19rem;
  padding: 1.35rem;
  border: 1px solid var(--line);
  border-radius: 1.75rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.10), transparent 18rem),
    rgba(255,255,255,0.036);
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.featured-chem {
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.15), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.chem-card h3,
.chem-mini-card h3 {
  margin: 0;
  font-size: clamp(1.35rem, 2.7vw, 1.95rem);
  line-height: 1.14;
  letter-spacing: -0.02em;
}

.chem-card p,
.chem-mini-card p {
  color: var(--muted);
  line-height: 1.75;
  margin: 0;
  max-width: 95%;
}

.chem-mini-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.chem-mini-card {
  min-height: 14rem;
  padding: 1.2rem;
  border: 1px solid var(--line);
  border-radius: 1.55rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.08), transparent 16rem),
    rgba(255,255,255,0.034);
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}

@media (max-width: 1080px) {
  .chem-mini-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 960px) {
  .chem-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .chem-mini-grid {
    grid-template-columns: 1fr;
  }
}


/* Frontier 76 page */
.frontier-index-section,
.frontier-note-section {
  margin-top: 1.4rem;
  padding: clamp(1.25rem, 3vw, 1.8rem);
  border: 1px solid var(--line);
  border-radius: 2.2rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(221,187,123,0.10), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.052), rgba(255,255,255,0.020));
  box-shadow: var(--shadow);
}

.frontier-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.frontier-card {
  min-height: 18rem;
  padding: 1.35rem;
  border: 1px solid var(--line);
  border-radius: 1.75rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(221,187,123,0.10), transparent 18rem),
    rgba(255,255,255,0.036);
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.featured-frontier {
  background:
    radial-gradient(circle at 90% 10%, rgba(221,187,123,0.15), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.frontier-card h3 {
  margin: 0;
  font-size: clamp(1.35rem, 2.7vw, 1.95rem);
  line-height: 1.14;
  letter-spacing: -0.02em;
}

.frontier-card p {
  color: var(--muted);
  line-height: 1.75;
  margin: 0;
  max-width: 95%;
}

@media (max-width: 960px) {
  .frontier-grid {
    grid-template-columns: 1fr;
  }
}


/* The Discount Bin page */
.discount-index-section,
.discount-note-section {
  margin-top: 1.4rem;
  padding: clamp(1.25rem, 3vw, 1.8rem);
  border: 1px solid var(--line);
  border-radius: 2.2rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(188,211,172,0.09), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.052), rgba(255,255,255,0.020));
  box-shadow: var(--shadow);
}

.discount-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.discount-card {
  min-height: 18rem;
  padding: 1.35rem;
  border: 1px solid var(--line);
  border-radius: 1.75rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(188,211,172,0.10), transparent 18rem),
    rgba(255,255,255,0.036);
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.featured-discount {
  background:
    radial-gradient(circle at 90% 10%, rgba(188,211,172,0.15), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.discount-card h3 {
  margin: 0;
  font-size: clamp(1.35rem, 2.7vw, 1.95rem);
  line-height: 1.14;
  letter-spacing: -0.02em;
}

.discount-card p {
  color: var(--muted);
  line-height: 1.75;
  margin: 0;
  max-width: 95%;
}

@media (max-width: 960px) {
  .discount-grid {
    grid-template-columns: 1fr;
  }
}


/* B-Sides page */
.bsides-index-section,
.bsides-note-section {
  margin-top: 1.4rem;
  padding: clamp(1.25rem, 3vw, 1.8rem);
  border: 1px solid var(--line);
  border-radius: 2.2rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(191,215,239,0.09), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.052), rgba(255,255,255,0.020));
  box-shadow: var(--shadow);
}

.bsides-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.bsides-card {
  min-height: 18rem;
  padding: 1.35rem;
  border: 1px solid var(--line);
  border-radius: 1.75rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(191,215,239,0.10), transparent 18rem),
    rgba(255,255,255,0.036);
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.featured-bsides {
  background:
    radial-gradient(circle at 90% 10%, rgba(191,215,239,0.15), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.bsides-card h3 {
  margin: 0;
  font-size: clamp(1.35rem, 2.7vw, 1.95rem);
  line-height: 1.14;
  letter-spacing: -0.02em;
}

.bsides-card p {
  color: var(--muted);
  line-height: 1.75;
  margin: 0;
  max-width: 95%;
}

@media (max-width: 960px) {
  .bsides-grid {
    grid-template-columns: 1fr;
  }
}


/* v45 Programs taxonomy summary bar */
.taxonomy-status-bar {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.9rem;
  margin: 0 0 1.45rem;
}

.taxonomy-status-item {
  min-height: 5.3rem;
  padding: 1rem 1.1rem;
  border: 1px solid var(--line);
  border-radius: 1.55rem;
  background:
    radial-gradient(circle at 88% 12%, rgba(242,221,176,0.08), transparent 12rem),
    rgba(255,255,255,0.034);
  box-shadow: 0 14px 32px rgba(0,0,0,0.18);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.9rem;
}

.taxonomy-status-item span {
  color: var(--soft);
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-size: 0.70rem;
  font-weight: 900;
  line-height: 1.35;
}

.taxonomy-status-item b {
  color: rgba(242,221,176,0.96);
  font-size: clamp(1.8rem, 3vw, 2.45rem);
  line-height: 1;
}

@media (max-width: 840px) {
  .taxonomy-status-bar {
    grid-template-columns: 1fr;
  }
}


/* v47 — corrected homepage relay meter placement + subtle live needle */
.home-hero-field {
  display: grid;
  grid-template-columns: minmax(0, 900px) minmax(255px, 340px);
  gap: clamp(1.25rem, 3vw, 2.6rem);
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1.5rem;
}

.home-hero-copy-card {
  max-width: none;
  width: 100%;
}

.home-relay-stage {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 24rem;
  padding: 0.35rem 0;
}

.home-relay-meter-wrap {
  position: relative;
  width: min(100%, 300px);
  aspect-ratio: 1122 / 1402;
  filter: drop-shadow(0 22px 34px rgba(0, 0, 0, 0.34));
}

.home-relay-meter-image {
  display: block;
  width: 100%;
  height: auto;
  opacity: 0.995;
}

/* v48: the source image is now needleless. This is the visible live needle. */
.home-relay-live-needle {
  position: absolute;
  left: 50.05%;
  top: 33.35%;
  width: 3.0%;
  height: 16.35%;
  border-radius: 999px;
  transform-origin: 50% 96%;
  transform: translateX(-50%) rotate(43deg);
  background: linear-gradient(
    180deg,
    rgba(177, 75, 52, 0.98) 0%,
    rgba(150, 58, 38, 0.98) 52%,
    rgba(106, 36, 24, 0.98) 100%
  );
  box-shadow:
    0 1px 0 rgba(255, 231, 196, 0.18) inset,
    0 2px 3px rgba(34, 18, 10, 0.44);
  pointer-events: none;
  z-index: 3;
  animation: homeRelayNeedleDrift 3.6s cubic-bezier(0.35, 0, 0.2, 1) infinite;
}

.home-relay-live-cap {
  position: absolute;
  left: 50.05%;
  top: 49.20%;
  width: 8.25%;
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  border-radius: 999px;
  background:
    radial-gradient(circle at 46% 42%, rgba(192, 151, 77, 0.34), rgba(61, 42, 25, 0.12) 48%, rgba(0, 0, 0, 0.00) 72%);
  pointer-events: none;
  z-index: 4;
  animation: homeRelayCapPulse 3.6s ease-in-out infinite;
}

@keyframes homeRelayNeedleDrift {
  0%   { transform: translateX(-50%) rotate(43deg); }
  16%  { transform: translateX(-50%) rotate(46deg); }
  34%  { transform: translateX(-50%) rotate(40deg); }
  52%  { transform: translateX(-50%) rotate(45deg); }
  71%  { transform: translateX(-50%) rotate(41.5deg); }
  86%  { transform: translateX(-50%) rotate(44deg); }
  100% { transform: translateX(-50%) rotate(43deg); }
}

@keyframes homeRelayCapPulse {
  0%, 100% { opacity: 0.40; }
  40%      { opacity: 0.58; }
  68%      { opacity: 0.46; }
}

@media (max-width: 1120px) {
  .home-hero-field {
    grid-template-columns: minmax(0, 1fr) 240px;
    gap: 1.25rem;
  }

  .home-relay-stage {
    min-height: 20rem;
  }

  .home-relay-meter-wrap {
    width: 232px;
  }
}

@media (max-width: 900px) {
  .home-hero-field {
    grid-template-columns: 1fr;
  }

  .home-relay-stage {
    display: none;
  }
}

@keyframes pulse-orbit {
  0% {
    transform: rotate(0deg) translateX(1.18rem) rotate(0deg);
    opacity: 0.78;
    filter: brightness(0.96);
  }
  50% {
    transform: rotate(180deg) translateX(1.34rem) rotate(-180deg);
    opacity: 1;
    filter: brightness(1.12);
  }
  100% {
    transform: rotate(360deg) translateX(1.18rem) rotate(-360deg);
    opacity: 0.78;
    filter: brightness(0.96);
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-relay-live-needle,
  .home-relay-live-cap {
    animation: none;
  }
}


/* v49 — homepage alignment pass */
.home-front-doors {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.2rem;
  margin-top: 1.5rem;
}

.home-door-card {
  margin-top: 0;
  min-height: 13.5rem;
}

.archive-door-card {
  background:
    radial-gradient(circle at 92% 12%, rgba(242,221,176,0.08), transparent 18rem),
    var(--panel);
}

.home-featured-shelves {
  margin-top: 1.5rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  border: 1px solid var(--line);
  border-radius: 2rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(242,221,176,0.07), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.048), rgba(255,255,255,0.018));
  box-shadow: var(--shadow);
}

.home-featured-header {
  max-width: 60rem;
  margin-bottom: 1.2rem;
}

.home-featured-header h2 {
  margin: 0.25rem 0 0.7rem;
  font-size: clamp(2rem, 4vw, 3.2rem);
  line-height: 1.05;
  letter-spacing: -0.035em;
}

.home-featured-header p:last-child {
  color: var(--muted);
  line-height: 1.75;
  margin: 0;
  max-width: 54rem;
}

.home-shelf-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.home-shelf-card {
  min-height: 18.5rem;
  padding: 1.25rem;
  border: 1px solid var(--line);
  border-radius: 1.65rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.08), transparent 16rem),
    rgba(255,255,255,0.034);
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.home-shelf-card h3 {
  margin: 0;
  font-size: clamp(1.45rem, 2.4vw, 1.95rem);
  line-height: 1.12;
  letter-spacing: -0.025em;
}

.home-shelf-card p:not(.card-kicker) {
  color: var(--muted);
  line-height: 1.72;
  margin: 0;
  flex: 1 1 auto;
}

.home-shelf-card .taxonomy-link {
  align-self: flex-start;
  margin-top: 0.45rem;
}

.nuka-feature {
  background:
    radial-gradient(circle at 92% 10%, rgba(242,221,176,0.15), transparent 18rem),
    rgba(255,255,255,0.040);
}

.midnight-feature {
  background:
    radial-gradient(circle at 92% 10%, rgba(191,215,239,0.12), transparent 18rem),
    rgba(255,255,255,0.036);
}

.hold-feature {
  background:
    radial-gradient(circle at 92% 10%, rgba(188,211,172,0.11), transparent 18rem),
    rgba(255,255,255,0.036);
}

@media (max-width: 1080px) {
  .home-front-doors {
    grid-template-columns: 1fr;
  }

  .home-shelf-grid {
    grid-template-columns: 1fr;
  }

  .home-shelf-card {
    min-height: auto;
  }
}


/* v50 — Signal Map taxonomy alignment */
.drawer-archive-link {
  margin: 0.95rem 0 0.3rem;
}

.drawer-archive-link .button {
  min-height: 2.8rem;
}

#programSelect optgroup {
  font-style: normal;
  font-weight: 800;
}


/* v51 — Appalachia roaming signals */
.roaming-layer {
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
}

.roaming-dot {
  --roamer-duration: 12s;
  position: absolute;
  width: 0.86rem;
  height: 0.86rem;
  transform: translate(-50%, -50%);
  transition:
    left var(--roamer-duration) cubic-bezier(0.36, 0.02, 0.18, 1),
    top var(--roamer-duration) cubic-bezier(0.36, 0.02, 0.18, 1),
    opacity 1.8s ease,
    filter 1.8s ease;
  opacity: 0.92;
  filter: drop-shadow(0 0 8px rgba(0,0,0,0.55));
}

.roaming-dot::before {
  content: "";
  position: absolute;
  inset: -0.42rem;
  border-radius: 999px;
  opacity: 0.18;
  background: currentColor;
  animation: roamingHalo 6.8s ease-in-out infinite;
}

.roaming-core {
  position: absolute;
  inset: 0;
  display: block;
  border-radius: 999px;
  background: currentColor;
  border: 1px solid rgba(247,246,238,0.56);
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.48),
    0 0 10px color-mix(in srgb, currentColor 82%, transparent);
}

.roaming-dot.grahm { color: #7fc36d; }
.roaming-dot.dottie { color: #d46c62; }
.roaming-dot.fuzzy { color: #75b8e8; }
.roaming-dot.insult { color: #d2b66c; width: 0.78rem; height: 0.78rem; opacity: 0.84; }
.roaming-dot.prize { color: #9bd7d0; width: 0.78rem; height: 0.78rem; opacity: 0.84; }

.roaming-dot.intermittent::before {
  opacity: 0.12;
}

.roaming-dot.hidden-sighting {
  opacity: 0;
  filter: blur(1px);
}

.roaming-tooltip {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 0.55rem);
  transform: translateX(-50%);
  white-space: nowrap;
  padding: 0.28rem 0.48rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.16);
  background: rgba(10, 11, 9, 0.86);
  color: rgba(247,246,238,0.92);
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0;
  transition: opacity 0.7s ease;
}

.roaming-dot:not(.hidden-sighting):hover .roaming-tooltip {
  opacity: 1;
}

@keyframes roamingHalo {
  0%, 100% { transform: scale(0.86); opacity: 0.12; }
  45% { transform: scale(1.16); opacity: 0.24; }
  72% { transform: scale(0.96); opacity: 0.16; }
}

.roaming-legend {
  margin-top: 0.85rem;
  padding: 0.9rem 1rem;
  border: 1px solid var(--line);
  border-radius: 1.35rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(242,221,176,0.06), transparent 15rem),
    rgba(255,255,255,0.032);
  display: grid;
  gap: 0.7rem;
}

.roaming-legend-head {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.7rem 1rem;
}

.roaming-eyebrow {
  margin: 0;
}

.roaming-legend-head span {
  color: var(--soft);
  font-size: 0.84rem;
  line-height: 1.45;
}

.roaming-legend-groups {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem 1.35rem;
}

.roaming-legend-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem 0.85rem;
}

.roaming-group-label {
  color: var(--soft);
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 0.66rem;
  font-weight: 900;
}

.roaming-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  color: rgba(247,246,238,0.78);
  font-size: 0.78rem;
  font-weight: 750;
}

.roaming-swatch {
  width: 0.64rem;
  height: 0.64rem;
  border-radius: 999px;
  display: inline-block;
  border: 1px solid rgba(247,246,238,0.42);
  box-shadow: 0 0 8px rgba(0,0,0,0.34);
}

.roaming-swatch.grahm { background: #7fc36d; }
.roaming-swatch.dottie { background: #d46c62; }
.roaming-swatch.fuzzy { background: #75b8e8; }
.roaming-swatch.insult { background: #d2b66c; }
.roaming-swatch.prize { background: #9bd7d0; }

@media (max-width: 760px) {
  .roaming-legend-groups,
  .roaming-legend-group {
    display: grid;
    justify-items: start;
    gap: 0.5rem;
  }

  .roaming-dot {
    width: 0.76rem;
    height: 0.76rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .roaming-dot {
    transition: opacity 1.2s ease;
  }

  .roaming-dot::before {
    animation: none;
  }
}


/* v52 — Nuka Nights volume population pass */
.populated-volume-grid .volume-card {
  min-height: 25rem;
}

.populated-volume {
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.volume-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
}

.volume-count {
  display: inline-flex;
  align-items: center;
  min-height: 1.95rem;
  padding: 0.28rem 0.64rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: rgba(242,221,176,0.94);
  background: rgba(0,0,0,0.22);
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.2;
  text-align: center;
}

.populated-volume > p {
  margin-bottom: 0.05rem;
}

.volume-samples {
  margin: 0.25rem 0 0.28rem;
  padding-left: 1.15rem;
  color: rgba(247,246,238,0.80);
  line-height: 1.62;
  font-size: 0.92rem;
}

.volume-samples li + li {
  margin-top: 0.18rem;
}

.populated-volume .volume-tags {
  margin-top: auto;
}

.featured-volume {
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.14), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.chemistry-volume {
  background:
    radial-gradient(circle at 90% 10%, rgba(214,157,118,0.14), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.route-volume {
  background:
    radial-gradient(circle at 90% 10%, rgba(188,211,172,0.12), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.068), rgba(255,255,255,0.024));
}

.night-volume {
  background:
    radial-gradient(circle at 90% 10%, rgba(191,215,239,0.13), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

@media (max-width: 960px) {
  .populated-volume-grid .volume-card {
    min-height: auto;
  }

  .volume-card-top {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* v53 — Please Hold archive population pass */
.populated-hold-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.released-hold-card {
  min-height: 27rem;
}

.hold-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
}

.hold-runtime {
  display: inline-flex;
  align-items: center;
  min-height: 1.95rem;
  padding: 0.28rem 0.64rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: rgba(242,221,176,0.94);
  background: rgba(0,0,0,0.22);
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.2;
}

.hold-official-title {
  color: rgba(247,246,238,0.58) !important;
  font-size: 0.84rem;
  line-height: 1.65 !important;
  margin-top: -0.1rem !important;
}

.hold-official-title span {
  color: rgba(242,221,176,0.78);
  font-weight: 800;
}

.wide-hold-card {
  grid-column: 1 / -1;
}

.asylum-hold {
  background:
    radial-gradient(circle at 90% 10%, rgba(191,215,239,0.10), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

@media (max-width: 960px) {
  .populated-hold-grid {
    grid-template-columns: 1fr;
  }

  .wide-hold-card {
    grid-column: auto;
  }

  .released-hold-card {
    min-height: auto;
  }

  .hold-card-top {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* v54 — Brotherhood Transmissions population pass */
.released-brotherhood-card {
  min-height: 26rem;
}

.brotherhood-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
}

.brotherhood-runtime {
  display: inline-flex;
  align-items: center;
  min-height: 1.95rem;
  padding: 0.28rem 0.64rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: rgba(242,221,176,0.94);
  background: rgba(0,0,0,0.22);
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.2;
}

.brotherhood-official-title {
  color: rgba(247,246,238,0.58) !important;
  font-size: 0.84rem;
  line-height: 1.65 !important;
  margin-top: -0.1rem !important;
}

.brotherhood-official-title span {
  color: rgba(242,221,176,0.78);
  font-weight: 800;
}

@media (max-width: 960px) {
  .released-brotherhood-card {
    min-height: auto;
  }

  .brotherhood-card-top {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* v55 — Enclave Broadcasts population pass */
.populated-enclave-grid .volume-card {
  min-height: 25.5rem;
}

.populated-enclave-card {
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.enclave-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
}

.enclave-status {
  display: inline-flex;
  align-items: center;
  min-height: 1.95rem;
  padding: 0.28rem 0.64rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: rgba(242,221,176,0.94);
  background: rgba(0,0,0,0.22);
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.2;
}

.enclave-samples {
  margin: 0.25rem 0 0.28rem;
  padding-left: 1.15rem;
  color: rgba(247,246,238,0.80);
  line-height: 1.62;
  font-size: 0.92rem;
}

.enclave-samples li + li {
  margin-top: 0.18rem;
}

.populated-enclave-card .volume-tags {
  margin-top: auto;
}

.featured-enclave-volume {
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.14), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.sea-volume {
  background:
    radial-gradient(circle at 90% 10%, rgba(191,215,239,0.12), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

@media (max-width: 960px) {
  .populated-enclave-grid .volume-card {
    min-height: auto;
  }

  .enclave-card-top {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* v56 — Midnight in the Wasteland full-story archive population */
.populated-midnight-section {
  display: grid;
  gap: 1.35rem;
}

.midnight-shelf-block {
  padding: 1.2rem;
  border: 1px solid var(--line);
  border-radius: 1.8rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(191,215,239,0.08), transparent 22rem),
    rgba(255,255,255,0.028);
}

.midnight-shelf-heading {
  margin-bottom: 1rem;
}

.midnight-shelf-heading h3 {
  margin: 0.22rem 0 0;
  font-size: clamp(1.7rem, 3.3vw, 2.45rem);
  line-height: 1.08;
  letter-spacing: -0.03em;
}

.midnight-shelf-heading p:not(.card-kicker) {
  color: var(--muted);
  line-height: 1.7;
  max-width: 62rem;
}

.midnight-episode-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.95rem;
}

.compact-midnight-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.two-card-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.midnight-episode-card {
  min-height: 15.6rem;
  padding: 1.05rem;
  border: 1px solid var(--line);
  border-radius: 1.45rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.06), transparent 16rem),
    rgba(255,255,255,0.034);
  display: flex;
  flex-direction: column;
  gap: 0.62rem;
}

.featured-midnight-episode {
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.13), transparent 18rem),
    linear-gradient(145deg, rgba(255,255,255,0.068), rgba(255,255,255,0.024));
}

.seasonal-card {
  background:
    radial-gradient(circle at 90% 10%, rgba(214,157,118,0.14), transparent 18rem),
    rgba(255,255,255,0.036);
}

.mexico-card {
  background:
    radial-gradient(circle at 90% 10%, rgba(188,211,172,0.11), transparent 18rem),
    rgba(255,255,255,0.036);
}

.episode-status {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  min-height: 1.85rem;
  padding: 0.25rem 0.58rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: rgba(242,221,176,0.92);
  background: rgba(0,0,0,0.20);
  font-size: 0.64rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.midnight-episode-card h4 {
  margin: 0;
  font-size: 1.12rem;
  line-height: 1.3;
  letter-spacing: -0.015em;
}

.midnight-episode-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.72;
  font-size: 0.92rem;
}

.midnight-bridge-actions {
  margin-top: 1rem;
}

@media (max-width: 1080px) {
  .midnight-episode-grid,
  .compact-midnight-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 740px) {
  .midnight-episode-grid,
  .compact-midnight-grid,
  .two-card-grid {
    grid-template-columns: 1fr;
  }

  .midnight-episode-card {
    min-height: auto;
  }
}


/* v57 — Teotlalli spoken Spanish episode population pass */
.populated-spanish-section {
  display: grid;
  gap: 1.1rem;
}

.spanish-episode-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.spanish-episode-card {
  min-height: 27rem;
  padding: 1.25rem;
  border: 1px solid var(--line);
  border-radius: 1.8rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.08), transparent 18rem),
    rgba(255,255,255,0.036);
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.featured-spanish-episode {
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.15), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.tunnel-episode {
  background:
    radial-gradient(circle at 90% 10%, rgba(191,215,239,0.12), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.wide-spanish-episode {
  grid-column: 1 / -1;
}

.spanish-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
}

.spanish-status {
  display: inline-flex;
  align-items: center;
  min-height: 1.95rem;
  padding: 0.28rem 0.64rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: rgba(242,221,176,0.94);
  background: rgba(0,0,0,0.22);
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.2;
  text-align: center;
}

.spanish-episode-card h3 {
  margin: 0;
  font-size: clamp(1.45rem, 2.4vw, 2rem);
  line-height: 1.14;
  letter-spacing: -0.025em;
}

.teotlalli-official-title {
  color: rgba(247,246,238,0.58) !important;
  font-size: 0.84rem;
  line-height: 1.65 !important;
  margin-top: -0.1rem !important;
}

.teotlalli-official-title span {
  color: rgba(242,221,176,0.78);
  font-weight: 800;
}

.spanish-episode-card > p:not(.teotlalli-official-title) {
  color: var(--muted);
  line-height: 1.72;
  margin: 0;
}

.spanish-episode-card .volume-tags {
  margin-top: auto;
}

@media (max-width: 960px) {
  .spanish-episode-grid {
    grid-template-columns: 1fr;
  }

  .wide-spanish-episode {
    grid-column: auto;
  }

  .spanish-episode-card {
    min-height: auto;
  }

  .spanish-card-top {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* v58 — Life Inside album cycle population pass */
.populated-life-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.populated-life-card {
  min-height: 29rem;
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.life-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
}

.life-status {
  display: inline-flex;
  align-items: center;
  min-height: 1.95rem;
  padding: 0.28rem 0.64rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: rgba(242,221,176,0.94);
  background: rgba(0,0,0,0.22);
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.2;
  text-align: center;
}

.life-samples {
  margin: 0.25rem 0 0.28rem;
  padding-left: 1.15rem;
  color: rgba(247,246,238,0.80);
  line-height: 1.62;
  font-size: 0.92rem;
}

.life-samples li + li {
  margin-top: 0.18rem;
}

.populated-life-card .volume-tags {
  margin-top: auto;
}

.house-gary-card {
  background:
    radial-gradient(circle at 90% 10%, rgba(191,215,239,0.13), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

@media (max-width: 960px) {
  .populated-life-grid {
    grid-template-columns: 1fr;
  }

  .populated-life-card {
    min-height: auto;
  }

  .life-card-top {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* v59 — Mutations Under the Moon songbook population pass */
.populated-mutations-section {
  display: grid;
  gap: 1.1rem;
}

.mutation-songbook-panel {
  padding: clamp(1.15rem, 2.8vw, 1.55rem);
  border: 1px solid var(--line);
  border-radius: 1.9rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(188,211,172,0.12), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.066), rgba(255,255,255,0.024));
  box-shadow: var(--shadow);
}

.mutation-songbook-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.85rem 1rem;
  margin-bottom: 1rem;
}

.mutation-count {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  padding: 0.3rem 0.68rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: rgba(242,221,176,0.94);
  background: rgba(0,0,0,0.22);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.2;
}

.mutation-songbook-head p {
  margin: 0;
  color: var(--muted);
  line-height: 1.7;
  max-width: 54rem;
}

.mutation-track-grid {
  margin: 0;
  padding: 0;
  list-style-position: inside;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.72rem;
  counter-reset: none;
}

.mutation-track-grid li {
  min-height: 3.75rem;
  padding: 0.82rem 0.95rem;
  border: 1px solid var(--line);
  border-radius: 1.25rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(242,221,176,0.055), transparent 12rem),
    rgba(255,255,255,0.032);
  color: rgba(247,246,238,0.90);
  font-weight: 760;
  line-height: 1.42;
}

@media (max-width: 820px) {
  .mutation-track-grid {
    grid-template-columns: 1fr;
  }
}


/* v60 — Chem Swing Syndrome songbook population pass */
.chem-songbook-section {
  display: grid;
  gap: 1.1rem;
}

.chem-songbook-panel {
  padding: clamp(1.15rem, 2.8vw, 1.55rem);
  border: 1px solid var(--line);
  border-radius: 1.9rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(214,157,118,0.14), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.066), rgba(255,255,255,0.024));
  box-shadow: var(--shadow);
}

.chem-songbook-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.85rem 1rem;
  margin-bottom: 1rem;
}

.chem-count {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  padding: 0.3rem 0.68rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: rgba(242,221,176,0.94);
  background: rgba(0,0,0,0.22);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.2;
}

.chem-songbook-head p {
  margin: 0;
  color: var(--muted);
  line-height: 1.7;
  max-width: 58rem;
}

.chem-track-grid {
  margin: 0;
  padding: 0;
  list-style-position: inside;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.72rem;
}

.chem-track-grid li {
  min-height: 3.75rem;
  padding: 0.82rem 0.95rem;
  border: 1px solid var(--line);
  border-radius: 1.25rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(242,221,176,0.055), transparent 12rem),
    rgba(255,255,255,0.032);
  color: rgba(247,246,238,0.90);
  font-weight: 760;
  line-height: 1.42;
}

@media (max-width: 820px) {
  .chem-track-grid {
    grid-template-columns: 1fr;
  }
}


/* v61 — Chemboat Review internal subcollection */
.chemboat-collection-section {
  display: grid;
  gap: 1.1rem;
}

.chemboat-volume-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.chemboat-volume-card {
  min-height: 42rem;
  padding: 1.25rem;
  border: 1px solid var(--line);
  border-radius: 1.9rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(188,211,172,0.10), transparent 22rem),
    rgba(255,255,255,0.036);
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.featured-chemboat-volume {
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.14), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.chemboat-volume-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
}

.chemboat-count {
  display: inline-flex;
  align-items: center;
  min-height: 1.95rem;
  padding: 0.28rem 0.64rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: rgba(242,221,176,0.94);
  background: rgba(0,0,0,0.22);
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.2;
}

.chemboat-volume-card h3 {
  margin: 0;
  font-size: clamp(1.45rem, 2.4vw, 2rem);
  line-height: 1.14;
  letter-spacing: -0.025em;
}

.chemboat-volume-card > p {
  margin: 0;
  color: var(--muted);
  line-height: 1.72;
}

.chemboat-track-list {
  margin: 0.25rem 0 0;
  padding-left: 1.25rem;
  color: rgba(247,246,238,0.88);
  line-height: 1.62;
  font-size: 0.92rem;
}

.chemboat-track-list li + li {
  margin-top: 0.18rem;
}

@media (max-width: 960px) {
  .chemboat-volume-grid {
    grid-template-columns: 1fr;
  }

  .chemboat-volume-card {
    min-height: auto;
  }

  .chemboat-volume-top {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* v62 — Dottie Confidential songbook population pass */
.populated-dottie-section {
  display: grid;
  gap: 1.1rem;
}

.dottie-songbook-panel {
  padding: clamp(1.15rem, 2.8vw, 1.55rem);
  border: 1px solid var(--line);
  border-radius: 1.9rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(242,221,176,0.14), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.066), rgba(255,255,255,0.024));
  box-shadow: var(--shadow);
}

.dottie-songbook-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.85rem 1rem;
  margin-bottom: 1rem;
}

.dottie-count {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  padding: 0.3rem 0.68rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: rgba(242,221,176,0.94);
  background: rgba(0,0,0,0.22);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.2;
}

.dottie-songbook-head p {
  margin: 0;
  color: var(--muted);
  line-height: 1.7;
  max-width: 60rem;
}

.dottie-track-list {
  margin: 0;
  padding: 0;
  list-style-position: inside;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.72rem;
}

.dottie-track-list li {
  min-height: 4rem;
  padding: 0.82rem 0.95rem;
  border: 1px solid var(--line);
  border-radius: 1.25rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(242,221,176,0.055), transparent 12rem),
    rgba(255,255,255,0.032);
  color: rgba(247,246,238,0.90);
  font-weight: 760;
  line-height: 1.42;
}

.dottie-parenthetical {
  color: rgba(242,221,176,0.84);
  font-weight: 840;
}

@media (max-width: 820px) {
  .dottie-track-list {
    grid-template-columns: 1fr;
  }
}


/* v63 — Atomic Glamour collection population pass */
.populated-glamour-section {
  display: grid;
  gap: 1.1rem;
}

.glamour-collection-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.glamour-collection-card {
  min-height: 46rem;
  padding: 1.25rem;
  border: 1px solid var(--line);
  border-radius: 1.9rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.08), transparent 22rem),
    rgba(255,255,255,0.036);
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.featured-glamour-collection {
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.15), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.gamma-glamour-collection {
  background:
    radial-gradient(circle at 90% 10%, rgba(191,215,239,0.14), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.glamour-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
}

.glamour-count {
  display: inline-flex;
  align-items: center;
  min-height: 1.95rem;
  padding: 0.28rem 0.64rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: rgba(242,221,176,0.94);
  background: rgba(0,0,0,0.22);
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.2;
}

.glamour-collection-card h3 {
  margin: 0;
  font-size: clamp(1.45rem, 2.4vw, 2rem);
  line-height: 1.14;
  letter-spacing: -0.025em;
}

.glamour-collection-card > p {
  margin: 0;
  color: var(--muted);
  line-height: 1.72;
}

.glamour-track-list {
  margin: 0.25rem 0 0;
  padding-left: 1.25rem;
  color: rgba(247,246,238,0.88);
  line-height: 1.62;
  font-size: 0.92rem;
}

.glamour-track-list li + li {
  margin-top: 0.18rem;
}

.glamour-collection-card .volume-tags {
  margin-top: auto;
}

@media (max-width: 960px) {
  .glamour-collection-grid {
    grid-template-columns: 1fr;
  }

  .glamour-collection-card {
    min-height: auto;
  }

  .glamour-card-top {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* v64 — Father Elijah Cycle full 32-song arc */
.populated-elijah-section {
  display: grid;
  gap: 1.15rem;
}

.elijah-part-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.elijah-part-card {
  min-height: 46rem;
  padding: 1.25rem;
  border: 1px solid var(--line);
  border-radius: 1.9rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(214,157,118,0.10), transparent 22rem),
    rgba(255,255,255,0.036);
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.featured-elijah-part {
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.14), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.final-elijah-part {
  background:
    radial-gradient(circle at 90% 10%, rgba(191,215,239,0.12), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.elijah-part-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
}

.elijah-range {
  display: inline-flex;
  align-items: center;
  min-height: 1.95rem;
  padding: 0.28rem 0.64rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: rgba(242,221,176,0.94);
  background: rgba(0,0,0,0.22);
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.2;
}

.elijah-part-card h3 {
  margin: 0;
  font-size: clamp(1.45rem, 2.4vw, 2rem);
  line-height: 1.14;
  letter-spacing: -0.025em;
}

.elijah-part-card > p {
  margin: 0;
  color: var(--muted);
  line-height: 1.72;
}

.elijah-track-list {
  margin: 0.25rem 0 0;
  padding-left: 1.45rem;
  color: rgba(247,246,238,0.88);
  line-height: 1.62;
  font-size: 0.92rem;
}

.elijah-track-list li + li {
  margin-top: 0.18rem;
}

@media (max-width: 960px) {
  .elijah-part-grid {
    grid-template-columns: 1fr;
  }

  .elijah-part-card {
    min-height: auto;
  }

  .elijah-part-top {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* v65 — Frontier 76 completed bounty board pass */
.populated-frontier-section {
  display: grid;
  gap: 1.1rem;
}

.bounty-board-panel {
  padding: clamp(1.15rem, 2.8vw, 1.55rem);
  border: 1px solid var(--line);
  border-radius: 1.9rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(214,157,118,0.14), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.066), rgba(255,255,255,0.024));
  box-shadow: var(--shadow);
}

.bounty-board-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.85rem 1rem;
  margin-bottom: 1rem;
}

.bounty-count {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  padding: 0.3rem 0.68rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: rgba(242,221,176,0.94);
  background: rgba(0,0,0,0.22);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.2;
}

.bounty-board-head p {
  margin: 0;
  color: var(--muted);
  line-height: 1.7;
  max-width: 60rem;
}

.bounty-track-grid {
  margin: 0;
  padding: 0;
  list-style-position: inside;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.72rem;
}

.bounty-track-grid li {
  min-height: 3.85rem;
  padding: 0.82rem 0.95rem;
  border: 1px solid var(--line);
  border-radius: 1.25rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(242,221,176,0.055), transparent 12rem),
    rgba(255,255,255,0.032);
  color: rgba(247,246,238,0.90);
  font-weight: 760;
  line-height: 1.42;
}

@media (max-width: 820px) {
  .bounty-track-grid {
    grid-template-columns: 1fr;
  }
}


/* v66 — cleanup pass: Life Inside album-title formatting */
.life-album-line {
  margin: -0.18rem 0 0;
  color: rgba(247,246,238,0.70);
  font-size: 0.92rem;
  line-height: 1.55;
}

.life-album-line span {
  color: rgba(242,221,176,0.84);
  font-weight: 850;
  letter-spacing: 0.045em;
  text-transform: uppercase;
  font-size: 0.68rem;
}

.life-album-line em {
  color: rgba(247,246,238,0.94);
  font-style: italic;
  font-weight: 760;
}


/* v67 — B-Sides archive cuts population pass */
.populated-bsides-section {
  display: grid;
  gap: 1.1rem;
}

.bsides-collection-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.bsides-collection-card {
  min-height: 50rem;
  padding: 1.25rem;
  border: 1px solid var(--line);
  border-radius: 1.9rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.08), transparent 22rem),
    rgba(255,255,255,0.036);
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.featured-bsides-collection {
  background:
    radial-gradient(circle at 90% 10%, rgba(214,157,118,0.14), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.mutation-bsides-collection {
  background:
    radial-gradient(circle at 90% 10%, rgba(188,211,172,0.12), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.bsides-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
}

.bsides-count {
  display: inline-flex;
  align-items: center;
  min-height: 1.95rem;
  padding: 0.28rem 0.64rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: rgba(242,221,176,0.94);
  background: rgba(0,0,0,0.22);
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.2;
}

.bsides-collection-card h3 {
  margin: 0;
  font-size: clamp(1.45rem, 2.4vw, 2rem);
  line-height: 1.14;
  letter-spacing: -0.025em;
}

.bsides-collection-card > p {
  margin: 0;
  color: var(--muted);
  line-height: 1.72;
}

.bsides-track-list {
  margin: 0.25rem 0 0;
  padding-left: 1.35rem;
  color: rgba(247,246,238,0.88);
  line-height: 1.62;
  font-size: 0.92rem;
}

.bsides-track-list li + li {
  margin-top: 0.18rem;
}

@media (max-width: 960px) {
  .bsides-collection-grid {
    grid-template-columns: 1fr;
  }

  .bsides-collection-card {
    min-height: auto;
  }

  .bsides-card-top {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* v68 — Discount Bin current-record pass */
.populated-discount-section {
  display: grid;
  gap: 1.1rem;
}

.discount-record-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.discount-record-card {
  min-height: 21rem;
  padding: 1.25rem;
  border: 1px solid var(--line);
  border-radius: 1.9rem;
  background:
    radial-gradient(circle at 90% 10%, rgba(242,221,176,0.08), transparent 20rem),
    rgba(255,255,255,0.036);
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.featured-discount-record {
  background:
    radial-gradient(circle at 90% 10%, rgba(214,157,118,0.14), transparent 20rem),
    linear-gradient(145deg, rgba(255,255,255,0.072), rgba(255,255,255,0.026));
}

.discount-record-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
}

.discount-status {
  display: inline-flex;
  align-items: center;
  min-height: 1.95rem;
  padding: 0.28rem 0.64rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: rgba(242,221,176,0.94);
  background: rgba(0,0,0,0.22);
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.2;
}

.discount-record-card h3 {
  margin: 0;
  font-size: clamp(1.45rem, 2.4vw, 2rem);
  line-height: 1.14;
  letter-spacing: -0.025em;
}

.discount-record-card > p {
  margin: 0;
  color: var(--muted);
  line-height: 1.72;
}

.discount-record-card .volume-tags {
  margin-top: auto;
}

@media (max-width: 960px) {
  .discount-record-grid {
    grid-template-columns: 1fr;
  }

  .discount-record-card {
    min-height: auto;
  }

  .discount-record-top {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* v56 — regional encounter markers: roamers stay free-range, danger clusters stay local */
.encounter-layer {
  position: absolute;
  inset: 0;
  z-index: 7;
  pointer-events: none;
}

.encounter-marker {
  position: absolute;
  transform: translate(-50%, -50%);
  color: #e4b268;
  filter: drop-shadow(0 0 9px rgba(0,0,0,0.70));
  --mill-x: 0rem;
  --mill-y: 0rem;
  --mill-duration: 6.5s;
  --mill-delay: 0s;
}

.encounter-marker.danger-cluster {
  animation: dangerMill var(--mill-duration) ease-in-out var(--mill-delay) infinite alternate;
}

.encounter-core {
  display: block;
  width: 0.7rem;
  height: 0.7rem;
  border-radius: 999px;
  background: currentColor;
  border: 1px solid rgba(247,246,238,0.48);
  box-shadow: 0 0 0 1px rgba(0,0,0,0.55), 0 0 10px currentColor;
}

.encounter-marker.danger-cluster .encounter-core {
  width: 0.52rem;
  height: 0.52rem;
  opacity: 0.92;
  border-radius: 0.16rem;
  transform: rotate(45deg);
  animation: dangerFlicker 4.8s ease-in-out infinite;
}

.encounter-marker.deathclaw {
  color: #ff704a;
}

.encounter-marker.deathclaw.region-mojave {
  color: #ff2424;
}

.encounter-marker.deathclaw.region-capital {
  color: #ff6b4a;
}

.encounter-marker.deathclaw .encounter-core {
  border-color: rgba(255,255,238,0.90);
  box-shadow:
    0 0 0 1px rgba(8,7,5,0.88),
    0 0 0 3px rgba(255,40,20,0.22),
    0 0 13px currentColor;
}

.encounter-marker.deathclaw::before {
  content: "";
  position: absolute;
  inset: -0.42rem;
  border: 1px solid rgba(255,245,206,0.42);
  background: radial-gradient(circle, rgba(255,68,35,0.16), transparent 62%);
  border-radius: 999px;
}

.encounter-marker.deathclaw.region-mojave::before {
  border-color: rgba(255,245,206,0.55);
  background: radial-gradient(circle, rgba(255,70,35,0.22), transparent 64%);
}

.encounter-marker.hunter-marker .encounter-core,
.encounter-marker.fixed-flavor .encounter-core {
  width: 0.78rem;
  height: 0.78rem;
  border-radius: 0.2rem;
  transform: rotate(45deg);
}

.encounter-marker.hunter-marker .encounter-core::after,
.encounter-marker.fixed-flavor .encounter-core::after {
  content: "";
  position: absolute;
  inset: 0.18rem;
  border-radius: 999px;
  background: rgba(6,7,6,0.78);
}

.encounter-marker.talon { color: #dd6b62; }
.encounter-marker.regulator { color: #d8c27a; }
.encounter-marker.tenpenny { color: #b7e1d4; }

.encounter-tooltip {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 0.52rem);
  transform: translateX(-50%);
  white-space: nowrap;
  padding: 0.28rem 0.5rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.16);
  background: rgba(10, 11, 9, 0.88);
  color: rgba(247,246,238,0.94);
  font-size: 0.62rem;
  font-weight: 850;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0;
  transition: opacity 0.35s ease;
}

.encounter-marker:hover .encounter-tooltip { opacity: 1; }


@keyframes dangerMill {
  0% { transform: translate(-50%, -50%); }
  38% { transform: translate(calc(-50% + var(--mill-x)), calc(-50% + var(--mill-y))); }
  72% { transform: translate(calc(-50% - (var(--mill-x) * 0.45)), calc(-50% + (var(--mill-y) * 0.35))); }
  100% { transform: translate(calc(-50% + (var(--mill-x) * 0.25)), calc(-50% - (var(--mill-y) * 0.55))); }
}

@keyframes dangerFlicker {
  0%, 100% { opacity: 0.78; transform: rotate(45deg) scale(0.92); }
  45% { opacity: 1; transform: rotate(45deg) scale(1.12); }
  70% { opacity: 0.86; transform: rotate(45deg) scale(0.98); }
}

/* v58 — regional map legend + Mojave character roamers */
.roaming-dot.wrong-region { display: none !important; }
.roaming-dot.victor { color: #67c6d7; }
.roaming-dot.benny { color: #ff4fa8; }
.roaming-dot.yesman { color: #4dff9f; }
.roaming-dot.region-mojave { width: 0.82rem; height: 0.82rem; }
.roaming-swatch.roamer.victor { background: #67c6d7; }
.roaming-swatch.roamer.benny { background: #ff4fa8; }
.roaming-swatch.roamer.yesman { background: #4dff9f; }
.roaming-swatch.encounter.deathclaw { background: #ff2424; border-radius: 0.16rem; transform: rotate(45deg); box-shadow: 0 0 0 1px rgba(20,0,0,0.9), 0 0 8px rgba(255,36,36,0.75); }
.roaming-swatch.encounter.talon { background: #dd6b62; border-radius: 0.18rem; transform: rotate(45deg); }
.roaming-swatch.encounter.regulator { background: #d8c27a; border-radius: 0.18rem; transform: rotate(45deg); }
.roaming-swatch.encounter.tenpenny { background: #b7e1d4; border-radius: 0.18rem; transform: rotate(45deg); }


/* v59 — Mojave contrast pass + Dead Wind Cavern deathclaw den */
.roaming-dot.region-mojave {
  filter: drop-shadow(0 0 2px rgba(0,0,0,0.95)) drop-shadow(0 0 7px currentColor);
}
.roaming-dot.benny { color: #ff4fa8; }
.roaming-dot.yesman { color: #4dff9f; }
.roaming-dot.victor { color: #67d7ff; }
.roaming-dot.region-mojave .roaming-core,
.roaming-dot.region-mojave::before {
  box-shadow: 0 0 0 1px rgba(0,0,0,0.92), 0 0 10px currentColor;
}
.encounter-marker.deathclaw.region-mojave { color: #ff2424; }
.encounter-marker.deathclaw.region-mojave .encounter-core {
  border-color: rgba(255,235,210,0.95);
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.98),
    0 0 0 3px rgba(65,0,0,0.52),
    0 0 14px rgba(255,36,36,0.95);
}
.encounter-marker.deathclaw.alpha .encounter-core {
  width: 0.62rem;
  height: 0.62rem;
  background: #ff1717;
}
.encounter-marker.deathclaw.alpha::before {
  border-color: rgba(255,18,18,0.82);
  background: radial-gradient(circle, rgba(255,18,18,0.30), transparent 66%);
}
.roaming-swatch.roamer.benny { background: #ff4fa8; box-shadow: 0 0 0 1px rgba(0,0,0,0.8), 0 0 7px rgba(255,79,168,0.8); }
.roaming-swatch.roamer.yesman { background: #4dff9f; box-shadow: 0 0 0 1px rgba(0,0,0,0.8), 0 0 7px rgba(77,255,159,0.8); }
.roaming-swatch.roamer.victor { background: #67d7ff; box-shadow: 0 0 0 1px rgba(0,0,0,0.8), 0 0 7px rgba(103,215,255,0.8); }


/* Visual Archive page */
.visual-shell {
  width: min(1240px, calc(100% - 2rem));
  margin: 0 auto;
  padding: clamp(1.5rem, 5vw, 4rem) 0 4rem;
}

.visual-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr);
  gap: 1.35rem;
  align-items: stretch;
}

.visual-hero-copy,
.visual-hero-card,
.visual-section {
  border: 1px solid var(--line);
  border-radius: 2.2rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(242,221,176,0.07), transparent 22rem),
    linear-gradient(145deg, rgba(255,255,255,0.062), rgba(255,255,255,0.022));
  box-shadow: var(--shadow);
}

.visual-hero-copy {
  padding: clamp(1.5rem, 4vw, 3rem);
}

.visual-hero-copy h1 {
  margin-bottom: 0.9rem;
  font-size: clamp(2.3rem, 5.8vw, 4.9rem);
}

.visual-hero-copy p,
.visual-section-heading p,
.visual-card p {
  color: var(--muted);
  line-height: 1.75;
}

.visual-hero-copy p {
  max-width: 790px;
  font-size: 1.08rem;
}

.visual-hero-card {
  overflow: hidden;
  min-height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.7rem, 1.5vw, 1rem);
}

.visual-hero-card img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: contain;
  border-radius: 1.35rem;
  background: rgba(0,0,0,0.22);
}

.visual-section {
  margin-top: 1.4rem;
  padding: clamp(1.2rem, 3vw, 1.65rem);
}

.visual-section-heading {
  max-width: 960px;
  margin-bottom: 1.35rem;
}

.visual-section-heading h2 {
  font-size: clamp(1.9rem, 4vw, 3.1rem);
}

.visual-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.visual-card {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 1.85rem;
  background:
    radial-gradient(circle at 88% 12%, rgba(242,221,176,0.07), transparent 18rem),
    linear-gradient(145deg, rgba(255,255,255,0.062), rgba(255,255,255,0.022));
  box-shadow: 0 18px 48px rgba(0,0,0,0.22);
  display: flex;
  flex-direction: column;
}

.visual-card-featured {
  grid-column: 1 / -1;
}

.visual-image-button {
  display: block;
  width: 100%;
  border: 0;
  padding: 0;
  background: rgba(0,0,0,0.24);
  cursor: zoom-in;
}

.visual-image-button img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: contain;
  background: rgba(0,0,0,0.32);
  transition: transform 220ms ease, filter 220ms ease;
}

.visual-image-button:hover img {
  transform: scale(1.018);
  filter: brightness(1.06);
}

.visual-card-copy {
  padding: clamp(1rem, 2.5vw, 1.35rem);
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  flex: 1;
}

.visual-card-copy h3 {
  margin: 0;
  font-size: clamp(1.22rem, 2.4vw, 1.8rem);
  line-height: 1.14;
  letter-spacing: -0.02em;
}

.visual-card-copy p {
  margin: 0;
}

.visual-lightbox {
  position: fixed;
  z-index: 100;
  inset: 0;
  display: none;
  place-items: center;
  padding: 1.25rem;
  background: rgba(0,0,0,0.78);
  backdrop-filter: blur(10px);
}

.visual-lightbox.open {
  display: grid;
}

.visual-lightbox-panel {
  position: relative;
  width: min(1180px, 96vw);
  max-height: 92vh;
  border: 1px solid var(--line);
  border-radius: 1.4rem;
  overflow: hidden;
  background: #0c0d0b;
  box-shadow: var(--shadow);
  display: flex;
  flex-direction: column;
}

.visual-lightbox-panel img {
  display: block;
  width: 100%;
  max-height: 74vh;
  object-fit: contain;
  background: #050605;
}

.visual-lightbox-caption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.9rem 1rem 1rem;
  border-top: 1px solid var(--line);
  background: rgba(0,0,0,0.42);
}

.visual-lightbox-panel h3 {
  margin: 0;
  font-size: 1rem;
  color: var(--muted);
}

.visual-lightbox-back {
  min-height: 2.35rem;
  padding: 0 0.9rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(242,221,176,0.12);
  color: var(--text);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  white-space: nowrap;
}

.visual-lightbox-close {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 2;
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(0,0,0,0.72);
  color: var(--text);
  font-size: 1.8rem;
  line-height: 1;
  cursor: pointer;
}

@media (max-width: 960px) {
  .visual-hero,
  .visual-grid {
    grid-template-columns: 1fr;
  }

  .visual-card-featured {
    grid-column: auto;
  }
}

@media (max-width: 640px) {
  .visual-lightbox-caption {
    align-items: flex-start;
    flex-direction: column;
  }

  .visual-lightbox-back {
    width: 100%;
  }
}


.visual-jump-nav {
  margin: 1.2rem 0 1.4rem;
  padding: 1rem 1.2rem;
  border: 1px solid var(--line);
  border-radius: 1.5rem;
  background:
    radial-gradient(circle at 88% 12%, rgba(242,221,176,0.05), transparent 18rem),
    linear-gradient(145deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02));
  box-shadow: 0 12px 36px rgba(0,0,0,0.18);
}

.visual-jump-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.visual-jump-links a {
  display: inline-flex;
  align-items: center;
  min-height: 2.7rem;
  padding: 0 1rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(0,0,0,0.24);
  color: var(--muted);
  font-size: 0.84rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  transition: background 180ms ease, color 180ms ease, transform 180ms ease;
}

.visual-jump-links a:hover {
  background: rgba(242,221,176,0.14);
  color: var(--text);
  transform: translateY(-1px);
}



.home-broadcast-road-sign {
  margin: 0.7rem 0 0;
  color: rgba(242,221,176,0.92);
  font-size: clamp(1rem, 2vw, 1.35rem);
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.home-youtube-road-signs {
  align-items: stretch;
}

.youtube-road {
  min-height: 3.55rem;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.16rem;
  padding: 0.68rem 1.1rem;
  text-align: left;
  letter-spacing: 0.06em;
  opacity: 0.92;
}

.youtube-road span {
  font-size: 0.76rem;
}

.youtube-road small {
  color: var(--soft);
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: none;
}

.youtube-road.primary-road {
  border-color: rgba(242,221,176,0.34);
  background: rgba(242,221,176,0.09);
}

.youtube-road.network-road {
  border-color: rgba(255,255,255,0.12);
  background: rgba(0,0,0,0.18);
}

.youtube-road[aria-disabled="true"] {
  cursor: default;
}

@media (max-width: 720px) {
  .youtube-road {
    width: 100%;
  }
}


.home-youtube-panel {
  margin-top: 1.15rem;
  width: min(560px, 100%);
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: 1.35rem;
  background:
    radial-gradient(circle at 92% 12%, rgba(242,221,176,0.07), transparent 16rem),
    rgba(0,0,0,0.18);
}

.home-youtube-panel .eyebrow {
  margin-bottom: 0.7rem;
  font-size: 0.66rem;
}

.home-youtube-panel .home-youtube-road-signs {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.65rem;
}

.home-youtube-panel .youtube-road {
  width: 100%;
  min-height: 3.75rem;
  justify-content: center;
  align-items: flex-start;
  padding: 0.76rem 1rem;
}

.home-youtube-panel .youtube-road span {
  font-size: 0.78rem;
}

.home-youtube-panel .youtube-road small {
  font-size: 0.68rem;
}

.home-youtube-panel .youtube-road.primary-road {
  border-color: rgba(242,221,176,0.42);
  background: rgba(242,221,176,0.12);
}

.home-youtube-panel .youtube-road.network-road {
  background: rgba(0,0,0,0.23);
}

.home-youtube-panel .youtube-road:hover {
  transform: translateY(-1px);
  background: rgba(242,221,176,0.16);
  color: var(--text);
}

.youtube-playlist-cta {
  border-color: rgba(242,221,176,0.34);
  background: rgba(242,221,176,0.10);
}

.playlist-link-section {
  width: min(1240px, calc(100% - 2rem));
  margin: 1rem auto 3rem;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: 1.5rem;
  background: rgba(0,0,0,0.18);
}


.triangulated-focus {
  outline: 2px solid rgba(242,221,176,0.95);
  outline-offset: 4px;
  filter: drop-shadow(0 0 12px rgba(242,221,176,0.45));
  animation: triangulatePulse 1.8s ease-in-out infinite;
  z-index: 9;
}

.active-region {
  border-color: rgba(242,221,176,0.85) !important;
  box-shadow: 0 0 12px rgba(242,221,176,0.22);
}

@keyframes triangulatePulse {
  0% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.08);
  }

  100% {
    transform: scale(1);
  }
}


.roaming-dot.imposter .roaming-core {
  background: #f7f0df;
  border-color: rgba(255,255,255,0.95);
  box-shadow:
    0 0 0 2px rgba(130,20,20,0.35),
    0 0 12px rgba(255,255,255,0.7),
    0 0 20px rgba(180,32,28,0.35);
}

.roaming-dot.imposter::after {
  border-color: rgba(180,32,28,0.34);
  animation-duration: 2.2s;
}

.roaming-dot.imposter .roaming-tooltip {
  border-color: rgba(255,255,255,0.25);
  background: rgba(15,11,10,0.92);
  color: #f7f0df;
}

.program-track-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1rem;
}

.program-track-card {
  border: 1px solid var(--line);
  border-radius: 1.25rem;
  padding: 1rem;
  background: rgba(0,0,0,0.18);
}

.program-track-card h3 {
  margin: 0.35rem 0 0.85rem;
  line-height: 1.2;
}


.linked-transmissions-section {
  margin-top: 2rem;
}

.linked-transmissions-section .program-track-grid {
  margin-top: 1.25rem;
}


/* =========================================================
   Programs Page — Operator-Checked Broadcast Console Skin
   Retro-future 1940s station equipment; manufactured,
   slightly worn, glass-front, not steampunk.
   ========================================================= */

body.programs-console-page {
  background:
    radial-gradient(circle at 15% 8%, rgba(201, 171, 110, 0.09), transparent 30rem),
    radial-gradient(circle at 86% 13%, rgba(191, 157, 96, 0.055), transparent 28rem),
    radial-gradient(circle at 50% 110%, rgba(94, 75, 42, 0.10), transparent 40rem),
    linear-gradient(180deg, #090b0b 0%, #0b0d0d 26%, #080a0a 100%);
}

body.programs-console-page .site-header {
  position: relative;
  z-index: 5;
}

.programs-console-stage {
  position: relative;
  width: min(1440px, calc(100% - 2rem));
  margin: 2rem auto 4rem;
  padding: 0;
}

.programs-console-housing {
  position: relative;
  padding: clamp(0.95rem, 1.7vw, 1.55rem);
  border-radius: clamp(1.7rem, 2.2vw, 2.5rem);
  background:
    linear-gradient(145deg, rgba(255,255,255,0.08), rgba(255,255,255,0) 16%),
    linear-gradient(180deg, #232624 0%, #161918 4%, #111312 50%, #171917 96%, #272a27 100%);
  border: 1px solid rgba(231, 205, 146, 0.22);
  box-shadow:
    0 26px 80px rgba(0,0,0,0.62),
    inset 0 1px 0 rgba(255,255,255,0.10),
    inset 0 -1px 0 rgba(0,0,0,0.78),
    inset 0 0 0 1px rgba(255,255,255,0.025);
}

.programs-console-housing::before {
  content: "";
  position: absolute;
  inset: 0.4rem;
  border-radius: inherit;
  pointer-events: none;
  background:
    radial-gradient(circle at 11% 12%, rgba(255,255,255,0.08), transparent 14rem),
    radial-gradient(circle at 91% 88%, rgba(0,0,0,0.30), transparent 18rem),
    repeating-linear-gradient(
      96deg,
      rgba(255,255,255,0.020) 0px,
      rgba(255,255,255,0.020) 1px,
      transparent 1px,
      transparent 7px
    );
  mix-blend-mode: soft-light;
  opacity: 0.58;
}

.programs-console-housing::after {
  content: "";
  position: absolute;
  inset: 0.24rem;
  border-radius: inherit;
  pointer-events: none;
  border: 1px solid rgba(0,0,0,0.68);
  box-shadow:
    inset 0 0 0 1px rgba(240, 213, 154, 0.06),
    inset 0 0 28px rgba(0,0,0,0.42);
}

.programs-console-glass {
  position: relative;
  border-radius: clamp(1.25rem, 1.8vw, 2rem);
  padding: clamp(0.65rem, 1vw, 0.95rem);
  background:
    linear-gradient(180deg, rgba(245, 232, 195, 0.10), rgba(255,255,255,0.015) 16%, rgba(0,0,0,0.045) 100%),
    rgba(7, 9, 9, 0.64);
  border: 1px solid rgba(232, 209, 158, 0.20);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.16),
    inset 0 0 0 1px rgba(255,255,255,0.03),
    inset 0 -18px 40px rgba(0,0,0,0.16),
    0 0 0 1px rgba(0,0,0,0.55);
  overflow: hidden;
}

.programs-console-glass::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(115deg, rgba(255,255,255,0.12) 0%, rgba(255,255,255,0.04) 10%, transparent 22%, transparent 74%, rgba(255,255,255,0.035) 100%),
    radial-gradient(circle at 18% 10%, rgba(255,255,255,0.045), transparent 19rem);
  opacity: 0.72;
}

.programs-console-glass::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(circle at 12% 18%, rgba(255,255,255,0.15) 0 0.45px, transparent 0.6px),
    radial-gradient(circle at 61% 42%, rgba(255,255,255,0.10) 0 0.45px, transparent 0.6px),
    radial-gradient(circle at 80% 76%, rgba(0,0,0,0.22) 0 0.55px, transparent 0.7px);
  background-size: 6px 6px, 8px 8px, 10px 10px;
  mix-blend-mode: soft-light;
  opacity: 0.13;
}

.programs-console-face {
  position: relative;
  z-index: 2;
  padding: clamp(1rem, 1.8vw, 1.8rem);
  border-radius: clamp(0.95rem, 1.4vw, 1.45rem);
  background:
    radial-gradient(circle at 20% 8%, rgba(212, 183, 120, 0.055), transparent 22rem),
    linear-gradient(180deg, rgba(17,20,19,0.96), rgba(11,13,13,0.98));
  border: 1px solid rgba(224, 198, 140, 0.12);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.04),
    inset 0 -1px 0 rgba(0,0,0,0.36);
}

body.programs-console-page .program-card,
body.programs-console-page .taxonomy-card,
body.programs-console-page .archive-card,
body.programs-console-page .shelf-card,
body.programs-console-page .world-card,
body.programs-console-page .series-card {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(160deg, rgba(255,255,255,0.07), rgba(255,255,255,0.012) 20%, rgba(0,0,0,0.12) 100%),
    radial-gradient(circle at 18% 8%, rgba(232,205,146,0.075), transparent 15rem),
    rgba(16, 18, 18, 0.84);
  border-color: rgba(226, 198, 137, 0.20);
  box-shadow:
    0 14px 30px rgba(0,0,0,0.28),
    inset 0 1px 0 rgba(255,255,255,0.09),
    inset 0 0 0 1px rgba(255,255,255,0.028),
    inset 0 -14px 28px rgba(0,0,0,0.16);
}

body.programs-console-page .program-card::before,
body.programs-console-page .taxonomy-card::before,
body.programs-console-page .archive-card::before,
body.programs-console-page .shelf-card::before,
body.programs-console-page .world-card::before,
body.programs-console-page .series-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  background:
    linear-gradient(118deg, rgba(255,255,255,0.12), rgba(255,255,255,0.028) 12%, transparent 28%, transparent 76%, rgba(255,255,255,0.04)),
    radial-gradient(circle at 88% 14%, rgba(255,255,255,0.045), transparent 10rem);
  opacity: 0.68;
}

body.programs-console-page .program-card::after,
body.programs-console-page .taxonomy-card::after,
body.programs-console-page .archive-card::after,
body.programs-console-page .shelf-card::after,
body.programs-console-page .world-card::after,
body.programs-console-page .series-card::after {
  content: "";
  position: absolute;
  inset: 0.45rem;
  pointer-events: none;
  z-index: 1;
  border-radius: inherit;
  border: 1px solid rgba(255,255,255,0.035);
}

body.programs-console-page .program-card > *,
body.programs-console-page .taxonomy-card > *,
body.programs-console-page .archive-card > *,
body.programs-console-page .shelf-card > *,
body.programs-console-page .world-card > *,
body.programs-console-page .series-card > * {
  position: relative;
  z-index: 2;
}

body.programs-console-page .taxonomy-stat,
body.programs-console-page .stat-card,
body.programs-console-page .archive-stat {
  background:
    linear-gradient(180deg, rgba(255,255,255,0.055), rgba(255,255,255,0.01)),
    rgba(18, 20, 19, 0.86);
  border-color: rgba(226, 198, 137, 0.18);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    inset 0 -1px 0 rgba(0,0,0,0.35);
}

body.programs-console-page .programs-console-face > *:first-child {
  margin-top: 0;
}

@media (max-width: 840px) {
  .programs-console-stage {
    width: min(100% - 1rem, 1440px);
    margin-top: 1rem;
  }

  .programs-console-housing {
    padding: 0.7rem;
    border-radius: 1.35rem;
  }

  .programs-console-glass {
    padding: 0.45rem;
    border-radius: 1.05rem;
  }

  .programs-console-face {
    padding: 0.8rem;
    border-radius: 0.85rem;
  }
}


/* =========================================================
   V31 — Programs Page / Manufactured Archive Console Pass
   Goal: make the Programs page read clearly as a serious,
   glass-front retro-future broadcast archive housing, while
   preserving the real taxonomy layout and clickability.
   ========================================================= */

body.programs-console-page {
  background:
    radial-gradient(circle at 50% -6%, rgba(214, 177, 98, 0.14), transparent 35rem),
    radial-gradient(circle at 8% 18%, rgba(140, 112, 59, 0.12), transparent 30rem),
    radial-gradient(circle at 92% 24%, rgba(105, 122, 90, 0.08), transparent 32rem),
    linear-gradient(180deg, #080a09 0%, #0a0c0b 28%, #060807 100%);
}

/* Header becomes a restrained top instrument rail on this page only. */
body.programs-console-page .site-header {
  position: sticky;
  top: 0;
  z-index: 30;
  width: min(1480px, calc(100% - 2rem));
  margin: 0.85rem auto 0;
  padding: 1rem clamp(1rem, 2.2vw, 1.65rem);
  border: 1px solid rgba(226, 197, 132, 0.24);
  border-radius: 1.45rem;
  background:
    linear-gradient(145deg, rgba(255,255,255,0.075), rgba(255,255,255,0.012) 18%, rgba(0,0,0,0.20) 100%),
    linear-gradient(180deg, rgba(33, 35, 31, 0.96), rgba(13, 15, 14, 0.98));
  box-shadow:
    0 18px 44px rgba(0,0,0,0.44),
    inset 0 1px 0 rgba(255,255,255,0.11),
    inset 0 -1px 0 rgba(0,0,0,0.72),
    inset 0 0 0 1px rgba(255,255,255,0.025);
  backdrop-filter: blur(18px);
}

body.programs-console-page .site-header::before {
  content: "";
  position: absolute;
  inset: 0.32rem;
  border-radius: 1.12rem;
  pointer-events: none;
  border: 1px solid rgba(0,0,0,0.62);
  box-shadow:
    inset 0 0 0 1px rgba(241, 213, 151, 0.06),
    inset 0 0 20px rgba(0,0,0,0.34);
}

body.programs-console-page .site-header > * {
  position: relative;
  z-index: 1;
}

body.programs-console-page .brand-main {
  color: rgba(246, 229, 188, 0.98);
  text-shadow: 0 0 18px rgba(226, 184, 96, 0.10);
}

body.programs-console-page .site-nav {
  gap: 0.55rem;
  padding: 0.38rem;
  border: 1px solid rgba(226, 197, 132, 0.14);
  border-radius: 999px;
  background: rgba(0,0,0,0.26);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.035),
    inset 0 -1px 0 rgba(0,0,0,0.48);
}

body.programs-console-page .site-nav a {
  min-height: 2.55rem;
  display: inline-flex;
  align-items: center;
  padding: 0 0.95rem;
  border-radius: 999px;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  font-size: 0.82rem;
  font-weight: 800;
}

body.programs-console-page .site-nav a.active {
  color: #17130b;
  background:
    linear-gradient(180deg, rgba(247,222,170,0.98), rgba(193,151,76,0.96));
  box-shadow:
    0 0 0 1px rgba(255,238,199,0.18),
    0 8px 20px rgba(0,0,0,0.24),
    inset 0 1px 0 rgba(255,255,255,0.40);
}

body.programs-console-page .lang-toggle {
  border-color: rgba(226, 197, 132, 0.20);
  background: rgba(0,0,0,0.34);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
}

/* Main chassis — stronger and more deliberate than V30. */
.programs-console-stage {
  width: min(1480px, calc(100% - 2rem));
  margin: 1rem auto 4.5rem;
}

.programs-console-housing {
  padding: clamp(0.92rem, 1.4vw, 1.25rem);
  border-radius: clamp(1.8rem, 2.4vw, 2.75rem);
  border: 1px solid rgba(236, 204, 135, 0.34);
  background:
    radial-gradient(circle at 8% 11%, rgba(255,255,255,0.09), transparent 17rem),
    radial-gradient(circle at 90% 86%, rgba(0,0,0,0.48), transparent 24rem),
    repeating-linear-gradient(
      98deg,
      rgba(255,255,255,0.018) 0px,
      rgba(255,255,255,0.018) 1px,
      transparent 1px,
      transparent 8px
    ),
    linear-gradient(150deg, #383830 0%, #20221f 6%, #121513 50%, #191b18 94%, #34342e 100%);
  box-shadow:
    0 36px 110px rgba(0,0,0,0.72),
    0 0 0 1px rgba(0,0,0,0.72),
    inset 0 1px 0 rgba(255,255,255,0.17),
    inset 0 0 0 1px rgba(255,255,255,0.035),
    inset 0 -2px 0 rgba(0,0,0,0.84);
}

.programs-console-housing::before {
  inset: 0.44rem;
  opacity: 0.82;
  background:
    linear-gradient(128deg, rgba(255,255,255,0.14), rgba(255,255,255,0.02) 16%, transparent 33%, transparent 78%, rgba(255,255,255,0.03)),
    radial-gradient(circle at 5% 9%, rgba(255,255,255,0.09), transparent 16rem),
    radial-gradient(circle at 96% 94%, rgba(0,0,0,0.34), transparent 22rem);
  mix-blend-mode: screen;
}

.programs-console-housing::after {
  inset: 0.30rem;
  border: 1px solid rgba(0,0,0,0.78);
  box-shadow:
    inset 0 0 0 1px rgba(244, 214, 149, 0.12),
    inset 0 0 0 4px rgba(0,0,0,0.20),
    inset 0 0 38px rgba(0,0,0,0.45);
}

.programs-console-glass {
  padding: clamp(0.55rem, 0.95vw, 0.82rem);
  border-radius: clamp(1.35rem, 2vw, 2.18rem);
  border: 1px solid rgba(239, 211, 151, 0.28);
  background:
    linear-gradient(180deg, rgba(255,244,216,0.14), rgba(255,255,255,0.03) 8%, rgba(0,0,0,0.04) 100%),
    rgba(6, 8, 7, 0.76);
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.72),
    inset 0 1px 0 rgba(255,255,255,0.22),
    inset 0 0 0 1px rgba(255,255,255,0.035),
    inset 0 -24px 42px rgba(0,0,0,0.22);
}

.programs-console-glass::before {
  background:
    linear-gradient(116deg, rgba(255,255,255,0.17) 0%, rgba(255,255,255,0.055) 10%, transparent 24%, transparent 72%, rgba(255,255,255,0.045) 100%),
    radial-gradient(circle at 18% 9%, rgba(255,255,255,0.07), transparent 22rem);
  opacity: 0.82;
}

.programs-console-face {
  padding: clamp(1rem, 2vw, 1.9rem);
  border-radius: clamp(1rem, 1.5vw, 1.55rem);
  border: 1px solid rgba(238, 207, 142, 0.20);
  background:
    radial-gradient(circle at 18% 4%, rgba(229, 192, 112, 0.09), transparent 24rem),
    radial-gradient(circle at 92% 84%, rgba(107, 127, 91, 0.055), transparent 24rem),
    linear-gradient(180deg, rgba(18,21,19,0.985), rgba(8,11,10,0.99));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.07),
    inset 0 0 0 1px rgba(255,255,255,0.02),
    inset 0 -1px 0 rgba(0,0,0,0.64);
}

/* Intro plate: clear station archive label. */
body.programs-console-page .taxonomy-intro {
  position: relative;
  max-width: none;
  margin: 0 0 1rem;
  padding: clamp(1.15rem, 2.4vw, 1.75rem);
  border: 1px solid rgba(232, 200, 134, 0.24);
  border-radius: 1.55rem;
  background:
    linear-gradient(146deg, rgba(255,255,255,0.075), rgba(255,255,255,0.012) 22%, rgba(0,0,0,0.16) 100%),
    rgba(16, 19, 17, 0.88);
  box-shadow:
    0 16px 34px rgba(0,0,0,0.28),
    inset 0 1px 0 rgba(255,255,255,0.10),
    inset 0 -1px 0 rgba(0,0,0,0.52);
  overflow: hidden;
}

body.programs-console-page .taxonomy-intro::before {
  content: "";
  position: absolute;
  inset: 0.42rem;
  border-radius: 1.18rem;
  pointer-events: none;
  border: 1px solid rgba(255,255,255,0.035);
}

body.programs-console-page .taxonomy-intro::after {
  content: "MASTER PROGRAM INDEX";
  position: absolute;
  top: 1.15rem;
  right: 1.45rem;
  color: rgba(242, 221, 176, 0.42);
  text-transform: uppercase;
  letter-spacing: 0.28em;
  font-size: 0.61rem;
  font-weight: 900;
}

body.programs-console-page .taxonomy-intro h1 {
  max-width: 1080px;
  font-size: clamp(2.45rem, 5.5vw, 4.8rem);
}

body.programs-console-page .taxonomy-intro p:not(.eyebrow) {
  max-width: 980px;
  margin-bottom: 0;
}

/* Readout bar becomes literal station instrumentation. */
body.programs-console-page .taxonomy-status-bar {
  gap: 0.75rem;
  margin: 0 0 1.1rem;
  padding: 0.62rem;
  border: 1px solid rgba(232, 200, 134, 0.20);
  border-radius: 1.45rem;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.045), rgba(0,0,0,0.15)),
    rgba(9, 12, 10, 0.70);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.05),
    inset 0 -1px 0 rgba(0,0,0,0.52);
}

body.programs-console-page .taxonomy-status-item {
  position: relative;
  min-height: 5rem;
  border-radius: 1.06rem;
  border-color: rgba(226, 197, 132, 0.22);
  background:
    radial-gradient(circle at 84% 16%, rgba(242,221,176,0.13), transparent 11rem),
    linear-gradient(155deg, rgba(255,255,255,0.070), rgba(255,255,255,0.012) 28%, rgba(0,0,0,0.15)),
    rgba(19, 22, 19, 0.86);
  box-shadow:
    0 10px 22px rgba(0,0,0,0.24),
    inset 0 1px 0 rgba(255,255,255,0.09),
    inset 0 0 0 1px rgba(255,255,255,0.024);
  overflow: hidden;
}

body.programs-console-page .taxonomy-status-item::after {
  content: "";
  width: 0.58rem;
  height: 0.58rem;
  flex: 0 0 auto;
  margin-left: 0.15rem;
  border-radius: 999px;
  border: 1px solid rgba(255,240,196,0.30);
  background: radial-gradient(circle at 35% 35%, #fff2b9 0 18%, #b9c77b 42%, #586332 100%);
  box-shadow: 0 0 14px rgba(206, 224, 124, 0.35);
}

body.programs-console-page .taxonomy-status-item b {
  text-shadow: 0 0 18px rgba(218, 179, 92, 0.17);
}

/* Each taxonomy section becomes a recessed archive bay. */
body.programs-console-page .taxonomy-section {
  position: relative;
  margin-top: 1rem;
  padding: clamp(1rem, 2vw, 1.42rem);
  border-radius: 1.72rem;
  border: 1px solid rgba(231, 199, 132, 0.26);
  background:
    radial-gradient(circle at 92% 9%, rgba(242,221,176,0.09), transparent 22rem),
    linear-gradient(180deg, rgba(255,255,255,0.042), rgba(0,0,0,0.14)),
    rgba(9, 12, 10, 0.84);
  box-shadow:
    0 18px 40px rgba(0,0,0,0.28),
    inset 0 1px 0 rgba(255,255,255,0.07),
    inset 0 0 0 1px rgba(255,255,255,0.018),
    inset 0 -18px 40px rgba(0,0,0,0.18);
  overflow: hidden;
}

body.programs-console-page .taxonomy-section::before {
  content: "";
  position: absolute;
  inset: 0.42rem;
  border-radius: 1.35rem;
  pointer-events: none;
  border: 1px solid rgba(255,255,255,0.035);
}

body.programs-console-page .taxonomy-section::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(117deg, rgba(255,255,255,0.095), rgba(255,255,255,0.018) 13%, transparent 29%, transparent 78%, rgba(255,255,255,0.024));
  opacity: 0.52;
}

body.programs-console-page .taxonomy-section > * {
  position: relative;
  z-index: 1;
}

/* Section heading becomes a labeled plate, while text remains comfortable. */
body.programs-console-page .taxonomy-heading {
  max-width: none;
  margin: 0 0 1rem;
  padding: 0.98rem 1.05rem 1.02rem;
  border: 1px solid rgba(231, 199, 132, 0.18);
  border-radius: 1.2rem;
  background:
    linear-gradient(145deg, rgba(255,255,255,0.055), rgba(255,255,255,0.008) 30%, rgba(0,0,0,0.12)),
    rgba(17, 19, 17, 0.72);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    inset 0 -1px 0 rgba(0,0,0,0.42);
}

body.programs-console-page .taxonomy-heading h2 {
  font-size: clamp(1.8rem, 3.5vw, 2.85rem);
}

body.programs-console-page .taxonomy-heading p:not(.eyebrow) {
  max-width: 980px;
}

/* Cards: more clearly equipment modules under glass, not generic web tiles. */
body.programs-console-page .taxonomy-card,
body.programs-console-page .world-card,
body.programs-console-page .series-card,
body.programs-console-page .shelf-card {
  min-height: 18.2rem;
  padding: clamp(1.15rem, 2.25vw, 1.6rem);
  border-radius: 1.38rem;
  border: 1px solid rgba(235, 203, 137, 0.30);
  background:
    radial-gradient(circle at 90% 10%, rgba(244,219,165,0.12), transparent 17rem),
    radial-gradient(circle at 15% 4%, rgba(255,255,255,0.045), transparent 14rem),
    linear-gradient(160deg, rgba(255,255,255,0.085), rgba(255,255,255,0.012) 21%, rgba(0,0,0,0.16) 100%),
    rgba(17, 20, 18, 0.94);
  box-shadow:
    0 18px 34px rgba(0,0,0,0.34),
    inset 0 1px 0 rgba(255,255,255,0.13),
    inset 0 0 0 1px rgba(255,255,255,0.030),
    inset 0 -18px 28px rgba(0,0,0,0.18);
}

body.programs-console-page .taxonomy-card::before,
body.programs-console-page .world-card::before,
body.programs-console-page .series-card::before,
body.programs-console-page .shelf-card::before {
  background:
    linear-gradient(120deg, rgba(255,255,255,0.16), rgba(255,255,255,0.03) 12%, transparent 28%, transparent 74%, rgba(255,255,255,0.05)),
    radial-gradient(circle at 88% 14%, rgba(255,255,255,0.055), transparent 10rem);
  opacity: 0.70;
}

body.programs-console-page .taxonomy-card::after,
body.programs-console-page .world-card::after,
body.programs-console-page .series-card::after,
body.programs-console-page .shelf-card::after {
  inset: 0.42rem;
  border-radius: 1.04rem;
  border: 1px solid rgba(255,255,255,0.046);
}

body.programs-console-page .taxonomy-card:hover,
body.programs-console-page .world-card:hover,
body.programs-console-page .series-card:hover,
body.programs-console-page .shelf-card:hover {
  transform: translateY(-2px);
  border-color: rgba(247, 216, 147, 0.45);
  box-shadow:
    0 22px 44px rgba(0,0,0,0.42),
    0 0 0 1px rgba(255,226,163,0.08),
    inset 0 1px 0 rgba(255,255,255,0.16),
    inset 0 0 0 1px rgba(255,255,255,0.032);
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

body.programs-console-page .card-kicker {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 1.65rem;
  padding: 0 0.62rem;
  border: 1px solid rgba(242,221,176,0.18);
  border-radius: 999px;
  background: rgba(0,0,0,0.26);
  letter-spacing: 0.20em;
}

body.programs-console-page .taxonomy-card h3 {
  color: rgba(247, 235, 207, 0.98);
  text-shadow: 0 0 18px rgba(225, 183, 94, 0.08);
}

body.programs-console-page .program-meta span {
  border-color: rgba(229, 199, 133, 0.20);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.045), rgba(0,0,0,0.08)),
    rgba(0,0,0,0.30);
}

body.programs-console-page .taxonomy-link {
  min-height: 2.72rem;
  border-radius: 0.92rem;
  border-color: rgba(235, 203, 137, 0.24);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.055), rgba(0,0,0,0.08)),
    rgba(0,0,0,0.28);
}

body.programs-console-page .taxonomy-link:not(.secondary-link) {
  background:
    linear-gradient(180deg, rgba(247,222,170,0.98), rgba(195,153,78,0.96));
  color: #17130b;
  border-color: transparent;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.40),
    0 8px 18px rgba(0,0,0,0.20);
}

body.programs-console-page .taxonomy-link:hover {
  transform: translateY(-1px);
}

/* Responsive corrections keep the machinery restrained, not cramped. */
@media (max-width: 980px) {
  body.programs-console-page .site-header {
    width: min(100% - 1rem, 1480px);
    margin-top: 0.5rem;
    border-radius: 1.15rem;
  }

  body.programs-console-page .site-nav {
    width: 100%;
    justify-content: flex-start;
    overflow-x: auto;
  }

  body.programs-console-page .taxonomy-intro::after {
    position: static;
    display: block;
    margin: 0.85rem 0 0;
  }
}

@media (max-width: 840px) {
  .programs-console-stage {
    width: min(100% - 1rem, 1480px);
    margin-top: 0.75rem;
  }

  .programs-console-housing {
    padding: 0.62rem;
    border-radius: 1.35rem;
  }

  .programs-console-glass {
    padding: 0.40rem;
    border-radius: 1.08rem;
  }

  .programs-console-face {
    padding: 0.72rem;
    border-radius: 0.88rem;
  }

  body.programs-console-page .taxonomy-intro,
  body.programs-console-page .taxonomy-section {
    border-radius: 1.18rem;
  }

  body.programs-console-page .taxonomy-heading {
    border-radius: 0.96rem;
  }

  body.programs-console-page .taxonomy-card,
  body.programs-console-page .world-card,
  body.programs-console-page .series-card,
  body.programs-console-page .shelf-card {
    min-height: 0;
    border-radius: 1.08rem;
  }
}



/* =========================================================
   Programs v33 — Function Ports
   Subtle circular console components with quiet per-program behavior.
   ========================================================= */

body.programs-console-page .taxonomy-card.has-medallion {
  min-height: 19rem;
  padding-right: clamp(7rem, 10.4vw, 8.25rem);
}

body.programs-console-page .taxonomy-card.has-medallion h3,
body.programs-console-page .taxonomy-card.has-medallion p:not(.card-kicker) {
  max-width: 100%;
}

body.programs-console-page .program-medallion {
  --port-rgb: 164, 193, 126;
  --port-accent: rgba(var(--port-rgb), 0.55);
  --port-accent-soft: rgba(var(--port-rgb), 0.24);
  --port-glass: rgba(240, 229, 196, 0.08);
  --port-angle: 210deg;
  position: absolute;
  top: clamp(1rem, 1.8vw, 1.35rem);
  right: clamp(1rem, 1.8vw, 1.35rem);
  z-index: 3;
  width: clamp(5.55rem, 8vw, 6.3rem);
  aspect-ratio: 1 / 1;
  border-radius: 999px;
  isolation: isolate;
  border: 1px solid rgba(235, 206, 140, 0.30);
  background:
    radial-gradient(circle at 33% 24%, rgba(255, 255, 255, 0.16), transparent 22%),
    linear-gradient(145deg, rgba(255,255,255,0.08), rgba(0,0,0,0.26)),
    radial-gradient(circle at 50% 55%, rgba(33, 37, 31, 0.98), rgba(14, 16, 14, 1) 72%);
  box-shadow:
    0 10px 26px rgba(0, 0, 0, 0.42),
    0 0 0 1px rgba(0, 0, 0, 0.62),
    0 0 0 0.34rem rgba(19, 21, 18, 0.98),
    0 0 0 0.44rem rgba(211, 181, 116, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.10),
    inset 0 -10px 16px rgba(0, 0, 0, 0.32);
  overflow: hidden;
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

body.programs-console-page .program-medallion::before {
  content: "";
  position: absolute;
  inset: 0.45rem;
  border-radius: inherit;
  border: 1px solid rgba(242, 221, 176, 0.14);
  background: repeating-conic-gradient(
    from 0deg,
    rgba(242, 221, 176, 0.22) 0deg 2deg,
    transparent 2deg 20deg
  );
  -webkit-mask: radial-gradient(circle, transparent 0 61%, #000 62%);
  mask: radial-gradient(circle, transparent 0 61%, #000 62%);
  opacity: 0.52;
}

body.programs-console-page .program-medallion::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    linear-gradient(130deg, rgba(255,255,255,0.22) 0%, rgba(255,255,255,0.06) 16%, transparent 36%),
    radial-gradient(circle at 50% 55%, transparent 0 48%, rgba(0,0,0,0.18) 72%, rgba(0,0,0,0.56) 100%);
  opacity: 0.94;
}

body.programs-console-page .program-medallion .port-core {
  position: absolute;
  inset: 0.82rem;
  border-radius: inherit;
  border: 1px solid rgba(221, 200, 153, 0.13);
  background:
    radial-gradient(circle at 36% 28%, rgba(255,255,255,0.12), transparent 16%),
    radial-gradient(circle at 50% 54%, rgba(var(--port-rgb), 0.18), rgba(9, 11, 10, 0.96) 70%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.05),
    inset 0 0 0 1px rgba(0,0,0,0.28),
    inset 0 -8px 14px rgba(0,0,0,0.24),
    0 0 16px rgba(var(--port-rgb), 0.16);
  overflow: hidden;
}

body.programs-console-page .program-medallion .port-core::before,
body.programs-console-page .program-medallion .port-core::after {
  content: "";
  position: absolute;
}

body.programs-console-page .program-medallion .port-caption {
  position: absolute;
  left: 50%;
  bottom: 0.46rem;
  transform: translateX(-50%);
  z-index: 2;
  min-width: 2.35rem;
  padding: 0.18rem 0.42rem 0.15rem;
  border-radius: 999px;
  border: 1px solid rgba(230, 205, 150, 0.14);
  background: rgba(14, 16, 14, 0.64);
  color: rgba(214, 205, 176, 0.68);
  font-size: clamp(0.42rem, 0.7vw, 0.52rem);
  font-weight: 800;
  letter-spacing: 0.16em;
  line-height: 1;
  text-transform: uppercase;
  text-align: center;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.74);
}

body.programs-console-page .world-card .program-medallion {
  --port-rgb: 164, 193, 126;
}

body.programs-console-page .series-card .program-medallion {
  --port-rgb: 204, 167, 100;
}

body.programs-console-page .shelf-card .program-medallion {
  --port-rgb: 147, 170, 143;
}

body.programs-console-page .pattern-sweep .port-core::before {
  inset: 0.1rem;
  border-radius: inherit;
  background: conic-gradient(
    from var(--port-angle),
    transparent 0deg 42deg,
    rgba(var(--port-rgb), 0.46) 54deg 74deg,
    rgba(var(--port-rgb), 0.10) 74deg 92deg,
    transparent 92deg 360deg
  );
  -webkit-mask: radial-gradient(circle, transparent 0 28%, #000 29% 67%, transparent 68%);
  mask: radial-gradient(circle, transparent 0 28%, #000 29% 67%, transparent 68%);
  opacity: 0.82;
}

body.programs-console-page .pattern-sweep .port-core::after {
  width: 0.38rem;
  height: 0.38rem;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: rgba(var(--port-rgb), 0.72);
  box-shadow:
    0 0 0 0.16rem rgba(var(--port-rgb), 0.12),
    0 0 8px rgba(var(--port-rgb), 0.24);
}

body.programs-console-page .pattern-grid .port-core::before {
  inset: 0.18rem;
  border-radius: inherit;
  background:
    repeating-linear-gradient(0deg, transparent 0 0.54rem, rgba(var(--port-rgb), 0.10) 0.54rem 0.61rem),
    repeating-linear-gradient(90deg, transparent 0 0.54rem, rgba(var(--port-rgb), 0.08) 0.54rem 0.61rem);
  opacity: 0.76;
}

body.programs-console-page .pattern-grid .port-core::after {
  inset: 0.12rem;
  border-radius: inherit;
  background:
    linear-gradient(90deg, transparent calc(50% - 0.5px), rgba(var(--port-rgb), 0.34) calc(50% - 0.5px) calc(50% + 0.5px), transparent calc(50% + 0.5px)),
    linear-gradient(0deg, transparent calc(50% - 0.5px), rgba(var(--port-rgb), 0.34) calc(50% - 0.5px) calc(50% + 0.5px), transparent calc(50% + 0.5px)),
    radial-gradient(circle at 50% 50%, rgba(var(--port-rgb),0.28) 0 4%, transparent 5%);
  opacity: 0.92;
}

body.programs-console-page .pattern-pulse .port-core::before {
  inset: 0.24rem;
  border-radius: inherit;
  background: radial-gradient(circle,
    transparent 0 21%,
    rgba(var(--port-rgb), 0.34) 22% 23%,
    transparent 24% 42%,
    rgba(var(--port-rgb), 0.24) 43% 44%,
    transparent 45% 61%,
    rgba(var(--port-rgb), 0.14) 62% 63%,
    transparent 64% 100%);
  opacity: 0.95;
}

body.programs-console-page .pattern-pulse .port-core::after {
  width: 0.58rem;
  height: 0.58rem;
  left: calc(50% - 0.29rem);
  top: calc(50% - 0.29rem);
  border-radius: 50%;
  background: rgba(var(--port-rgb), 0.76);
  box-shadow:
    1.22rem 0 0 -0.08rem rgba(var(--port-rgb), 0.54),
    -1.08rem 0.72rem 0 -0.18rem rgba(var(--port-rgb), 0.26),
    0 0 10px rgba(var(--port-rgb), 0.22);
}

body.programs-console-page .pattern-bars .port-core::before {
  left: 18%;
  right: 18%;
  bottom: 20%;
  height: 36%;
  background: repeating-linear-gradient(
    90deg,
    rgba(var(--port-rgb), 0.14) 0 0.32rem,
    transparent 0.32rem 0.62rem
  );
  border-radius: 0.2rem;
  opacity: 0.9;
}

body.programs-console-page .pattern-bars .port-core::after {
  left: 22%;
  right: 22%;
  top: 33%;
  height: 1px;
  background: rgba(var(--port-rgb), 0.36);
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.0),
    0 0 8px rgba(var(--port-rgb), 0.12),
    1.14rem 0.7rem 0 0 rgba(var(--port-rgb), 0.26),
    -0.74rem 1.06rem 0 0 rgba(var(--port-rgb), 0.18);
}

body.programs-console-page .is-relay { --port-angle: 226deg; }
body.programs-console-page .is-night { --port-angle: 144deg; }
body.programs-console-page .is-south { --port-angle: 288deg; }
body.programs-console-page .is-range { --port-angle: 328deg; }

body.programs-console-page .is-order { --port-rgb: 173, 184, 161; }
body.programs-console-page .is-vault { --port-rgb: 157, 180, 136; }
body.programs-console-page .is-field { --port-rgb: 172, 201, 136; }
body.programs-console-page .is-cryptid { --port-rgb: 152, 182, 140; }

body.programs-console-page .is-live { --port-rgb: 214, 175, 102; }
body.programs-console-page .is-rad { --port-rgb: 213, 166, 93; }
body.programs-console-page .is-voice { --port-rgb: 207, 162, 110; }
body.programs-console-page .is-style { --port-rgb: 201, 153, 108; }
body.programs-console-page .is-rhythm { --port-rgb: 214, 170, 86; }
body.programs-console-page .is-cycle { --port-rgb: 198, 160, 94; }

body.programs-console-page .is-odds { --port-rgb: 145, 168, 148; }
body.programs-console-page .is-cuts { --port-rgb: 150, 175, 155; }

body.programs-console-page .taxonomy-card.has-medallion:hover .program-medallion {
  transform: translateY(-1px);
  border-color: rgba(244, 219, 154, 0.44);
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.46),
    0 0 0 1px rgba(0, 0, 0, 0.62),
    0 0 0 0.34rem rgba(19, 21, 18, 0.98),
    0 0 0 0.44rem rgba(211, 181, 116, 0.22),
    0 0 22px rgba(var(--port-rgb), 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.12),
    inset 0 -10px 16px rgba(0, 0, 0, 0.32);
}


body.programs-console-page .program-medallion .port-core {
  animation: port-breathe 7.2s ease-in-out infinite;
}

body.programs-console-page .pattern-sweep .port-core::before {
  transform-origin: 50% 50%;
  animation: sweep-drift 8.8s ease-in-out infinite;
}

body.programs-console-page .pattern-grid .port-core::before,
body.programs-console-page .pattern-grid .port-core::after {
  animation: grid-fade 8.4s ease-in-out infinite;
}

body.programs-console-page .pattern-pulse .port-core::before {
  animation: pulse-fade 6.6s ease-in-out infinite;
}

body.programs-console-page .pattern-pulse .port-core::after {
  transform-origin: 50% 50%;
  animation: pulse-orbit 7.4s linear infinite;
}

body.programs-console-page .pattern-bars .port-core::before,
body.programs-console-page .pattern-bars .port-core::after {
  animation: bars-fade 5.8s ease-in-out infinite;
}

body.programs-console-page .is-relay .port-core { animation-duration: 7.8s; }
body.programs-console-page .is-night .port-core { animation-duration: 9.2s; }
body.programs-console-page .is-south .port-core { animation-duration: 8.7s; }
body.programs-console-page .is-live .port-core { animation-duration: 6.8s; }
body.programs-console-page .is-rhythm .port-core { animation-duration: 5.6s; }
body.programs-console-page .is-voice .port-core { animation-duration: 6.9s; }
body.programs-console-page .is-order .port-core,
body.programs-console-page .is-vault .port-core,
body.programs-console-page .is-odds .port-core,
body.programs-console-page .is-cuts .port-core { animation-duration: 8.8s; }

@keyframes port-breathe {
  0%, 100% {
    opacity: 0.88;
    filter: brightness(0.92);
  }
  50% {
    opacity: 1;
    filter: brightness(1.10);
  }
}

@keyframes sweep-drift {
  0%, 100% {
    transform: rotate(-9deg);
    opacity: 0.72;
  }
  50% {
    transform: rotate(9deg);
    opacity: 0.96;
  }
}

@keyframes grid-fade {
  0%, 100% {
    opacity: 0.64;
  }
  50% {
    opacity: 0.92;
  }
}

@keyframes pulse-fade {
  0%, 100% {
    opacity: 0.68;
    filter: brightness(0.90);
  }
  50% {
    opacity: 1;
    filter: brightness(1.14);
  }
}

@keyframes bars-fade {
  0%, 100% {
    opacity: 0.64;
    transform: translateY(0px);
  }
  50% {
    opacity: 0.98;
    transform: translateY(-1px);
  }
}

@media (prefers-reduced-motion: reduce) {
  body.programs-console-page .program-medallion .port-core,
  body.programs-console-page .program-medallion .port-core::before,
  body.programs-console-page .program-medallion .port-core::after {
    animation: none !important;
    filter: none !important;
    transform: none !important;
  }
}

@media (max-width: 700px) {
  body.programs-console-page .taxonomy-card.has-medallion {
    padding-right: clamp(1rem, 4.4vw, 1.3rem);
    padding-top: 1rem;
  }

  body.programs-console-page .program-medallion {
    position: relative;
    top: auto;
    right: auto;
    width: 5.4rem;
    margin: 0 0 0.2rem;
  }
}


/* =========================================================
   Visual Archive v38 — Station Display Unification Pass
   Lighter than Programs, but clearly from the same family.
   ========================================================= */

body.visual-page {
  background:
    radial-gradient(circle at 16% 7%, rgba(200, 171, 108, 0.07), transparent 31rem),
    radial-gradient(circle at 84% 10%, rgba(136, 112, 69, 0.055), transparent 26rem),
    linear-gradient(180deg, #090b0b 0%, #0a0c0c 32%, #080a0a 100%);
}

body.visual-page .visual-shell {
  width: min(1280px, calc(100% - 2rem));
}

body.visual-page .visual-hero-copy,
body.visual-page .visual-hero-card,
body.visual-page .visual-section,
body.visual-page .visual-jump-nav {
  position: relative;
  border-color: rgba(228, 201, 143, 0.16);
  background:
    radial-gradient(circle at 88% 10%, rgba(242,221,176,0.055), transparent 18rem),
    linear-gradient(145deg, rgba(255,255,255,0.064), rgba(255,255,255,0.018)),
    rgba(12, 14, 14, 0.46);
  box-shadow:
    0 16px 42px rgba(0,0,0,0.22),
    inset 0 1px 0 rgba(255,255,255,0.055),
    inset 0 -1px 0 rgba(0,0,0,0.24);
  overflow: hidden;
}

body.visual-page .visual-hero-copy::before,
body.visual-page .visual-hero-card::before,
body.visual-page .visual-section::before,
body.visual-page .visual-jump-nav::before {
  content: "";
  position: absolute;
  inset: 0.42rem;
  border-radius: inherit;
  border: 1px solid rgba(255,255,255,0.026);
  pointer-events: none;
}

body.visual-page .visual-hero-copy::after,
body.visual-page .visual-hero-card::after,
body.visual-page .visual-section::after,
body.visual-page .visual-jump-nav::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(118deg, rgba(255,255,255,0.07), rgba(255,255,255,0.016) 14%, transparent 34%);
  opacity: 0.8;
}

body.visual-page .visual-hero-copy > *,
body.visual-page .visual-hero-card > *,
body.visual-page .visual-section > *,
body.visual-page .visual-jump-nav > * {
  position: relative;
  z-index: 1;
}

body.visual-page .visual-hero-copy {
  padding: clamp(1.6rem, 4vw, 3rem);
}

body.visual-page .visual-hero-card {
  padding: clamp(0.78rem, 1.6vw, 1rem);
}

body.visual-page .visual-hero-card img {
  padding: 0.5rem;
  border: 1px solid rgba(228, 201, 143, 0.16);
  background: rgba(4,5,5,0.34);
  box-shadow: 0 14px 28px rgba(0,0,0,0.25);
}

body.visual-page .visual-hero-badge {
  position: absolute;
  top: 1rem;
  right: 1rem;
  min-height: 2rem;
  padding: 0 0.75rem;
  border-radius: 999px;
  border: 1px solid rgba(228, 201, 143, 0.18);
  background: rgba(9, 11, 10, 0.74);
  color: rgba(234, 223, 195, 0.72);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
}

body.visual-page .visual-station-readout,
body.visual-page .visual-section-readout {
  display: inline-flex;
  align-items: center;
  gap: 0.85rem;
  padding: 0.72rem 0.92rem;
  border-radius: 1.3rem;
  border: 1px solid rgba(228, 201, 143, 0.14);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.012)),
    rgba(10, 12, 11, 0.62);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04), 0 10px 18px rgba(0,0,0,0.16);
}

body.visual-page .visual-station-readout {
  margin-top: 1.15rem;
  max-width: 26rem;
}

body.visual-page .visual-readout-copy {
  display: grid;
  gap: 0.16rem;
}

body.visual-page .visual-readout-label {
  color: rgba(210, 199, 168, 0.58);
  font-size: 0.56rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

body.visual-page .visual-readout-copy strong {
  color: rgba(242, 235, 213, 0.92);
  font-size: 0.84rem;
  line-height: 1.15;
  letter-spacing: 0.02em;
}

body.visual-page .visual-readout-copy small {
  color: rgba(205, 194, 167, 0.68);
  font-size: 0.68rem;
  line-height: 1.2;
}

body.visual-page .visual-mini-dial {
  --needle: -22deg;
  position: relative;
  width: 3.2rem;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  border: 1px solid rgba(236, 209, 150, 0.26);
  background:
    radial-gradient(circle at 32% 24%, rgba(255,255,255,0.16), transparent 18%),
    radial-gradient(circle at 50% 58%, rgba(234, 210, 152, 0.14), rgba(13, 16, 15, 0.96) 72%),
    linear-gradient(145deg, rgba(255,255,255,0.05), rgba(0,0,0,0.20));
  box-shadow:
    0 8px 18px rgba(0,0,0,0.18),
    0 0 0 0.24rem rgba(17, 19, 18, 0.90),
    0 0 0 0.33rem rgba(214, 183, 119, 0.10),
    inset 0 1px 0 rgba(255,255,255,0.06),
    inset 0 -6px 12px rgba(0,0,0,0.28);
}

body.visual-page .visual-mini-dial::before {
  content: "";
  position: absolute;
  inset: 0.32rem;
  border-radius: inherit;
  border: 1px solid rgba(241, 220, 176, 0.18);
  background: repeating-conic-gradient(from 205deg, rgba(241, 220, 176, 0.38) 0deg 2deg, transparent 2deg 16deg);
  -webkit-mask: radial-gradient(circle, transparent 0 58%, #000 59%);
  mask: radial-gradient(circle, transparent 0 58%, #000 59%);
  opacity: 0.66;
}

body.visual-page .visual-mini-dial::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 1.1rem;
  height: 2px;
  transform-origin: 0 50%;
  transform: rotate(var(--needle));
  background: linear-gradient(90deg, rgba(236, 209, 150, 0.16) 0%, rgba(236, 209, 150, 0.94) 78%, rgba(255,255,255,0.88) 100%);
  border-radius: 999px;
  box-shadow: 0 0 8px rgba(215, 188, 128, 0.16);
}

body.visual-page .visual-mini-dial.dial-low { --needle: -44deg; }
body.visual-page .visual-mini-dial.dial-mid { --needle: -14deg; }
body.visual-page .visual-mini-dial.dial-mid-high { --needle: 10deg; }
body.visual-page .visual-mini-dial.dial-high { --needle: 24deg; }

body.visual-page .visual-jump-nav {
  margin-top: 1.28rem;
  padding: 1rem 1.2rem;
}

body.visual-page .visual-jump-links a {
  border-color: rgba(228, 201, 143, 0.14);
  background: rgba(8,10,10,0.48);
}

body.visual-page .visual-section {
  margin-top: 1.45rem;
  padding: clamp(1.2rem, 3vw, 1.65rem);
}

body.visual-page .visual-section-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: start;
  max-width: none;
  margin-bottom: 1.35rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid rgba(228, 201, 143, 0.10);
}

body.visual-page .visual-heading-copy {
  max-width: 940px;
}

body.visual-page .visual-card {
  position: relative;
  border-color: rgba(228, 201, 143, 0.16);
  background:
    radial-gradient(circle at 88% 12%, rgba(242,221,176,0.055), transparent 16rem),
    linear-gradient(145deg, rgba(255,255,255,0.058), rgba(255,255,255,0.016)),
    rgba(10, 12, 12, 0.54);
  box-shadow:
    0 16px 38px rgba(0,0,0,0.20),
    inset 0 1px 0 rgba(255,255,255,0.045);
}

body.visual-page .visual-card::before {
  content: "";
  position: absolute;
  inset: 0.36rem;
  border-radius: 1.45rem;
  border: 1px solid rgba(255,255,255,0.022);
  pointer-events: none;
}

body.visual-page .visual-image-button {
  padding: 0.55rem;
  background: rgba(5,6,6,0.24);
  border-bottom: 1px solid rgba(228, 201, 143, 0.08);
}

body.visual-page .visual-image-button img {
  border-radius: 1.25rem;
  border: 1px solid rgba(228, 201, 143, 0.14);
}

body.visual-page .visual-card-copy {
  padding: clamp(1rem, 2.5vw, 1.35rem);
}

@media (max-width: 900px) {
  body.visual-page .visual-section-heading {
    grid-template-columns: 1fr;
  }

  body.visual-page .visual-section-readout {
    justify-self: start;
  }
}


/* =========================================================
   Signal Map v39 — Station Panel Unification Pass
   Same family as the other pages; lighter than Programs.
   ========================================================= */

body.map-page {
  background:
    radial-gradient(circle at 14% 7%, rgba(194, 164, 102, 0.075), transparent 30rem),
    radial-gradient(circle at 86% 14%, rgba(126, 150, 116, 0.06), transparent 34rem),
    linear-gradient(180deg, #090b0b 0%, #0a0c0c 35%, #080a0a 100%);
}

body.map-page .map-shell {
  width: min(1280px, calc(100% - 2rem));
}

body.map-page .map-intro,
body.map-page .control-deck,
body.map-page .signal-key-panel,
body.map-page .map-board,
body.map-page .signal-drawer,
body.map-page .roaming-legend,
body.map-page .empty-state,
body.map-page .mobile-sheet {
  position: relative;
  overflow: hidden;
}

body.map-page .map-intro,
body.map-page .control-deck,
body.map-page .signal-key-panel,
body.map-page .signal-drawer,
body.map-page .roaming-legend,
body.map-page .empty-state {
  border-color: rgba(228, 201, 143, 0.15);
  background:
    radial-gradient(circle at 88% 12%, rgba(242,221,176,0.05), transparent 18rem),
    linear-gradient(145deg, rgba(255,255,255,0.06), rgba(255,255,255,0.016)),
    rgba(12, 14, 14, 0.46);
  box-shadow:
    0 16px 42px rgba(0,0,0,0.22),
    inset 0 1px 0 rgba(255,255,255,0.05),
    inset 0 -1px 0 rgba(0,0,0,0.24);
}

body.map-page .map-intro::before,
body.map-page .control-deck::before,
body.map-page .signal-key-panel::before,
body.map-page .map-board::before,
body.map-page .signal-drawer::before,
body.map-page .roaming-legend::before,
body.map-page .empty-state::before {
  content: "";
  position: absolute;
  inset: 0.4rem;
  border-radius: inherit;
  border: 1px solid rgba(255,255,255,0.025);
  pointer-events: none;
  z-index: 0;
}

body.map-page .map-intro::after,
body.map-page .control-deck::after,
body.map-page .signal-key-panel::after,
body.map-page .signal-drawer::after,
body.map-page .roaming-legend::after,
body.map-page .empty-state::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(118deg, rgba(255,255,255,0.07), rgba(255,255,255,0.016) 14%, transparent 34%);
  opacity: 0.8;
  z-index: 0;
}

body.map-page .map-intro > *,
body.map-page .control-deck > *,
body.map-page .signal-key-panel > *,
body.map-page .signal-drawer > *,
body.map-page .roaming-legend > *,
body.map-page .empty-state > * {
  position: relative;
  z-index: 1;
}

body.map-page .map-intro {
  max-width: 980px;
  margin-bottom: 1.5rem;
  padding: clamp(1.5rem, 4vw, 2.3rem);
  border: 1px solid var(--line);
  border-radius: 2rem;
}

body.map-page .control-deck {
  padding: 1.05rem;
  margin: 1.45rem 0 1.15rem;
  border-radius: 1.9rem;
}

body.map-page .signal-key-panel {
  margin: 0 0 1.3rem;
  padding: 0.95rem 1.05rem;
  border-radius: 1.65rem;
}

body.map-page .control,
body.map-page .signal-key-item,
body.map-page .roaming-legend-item,
body.map-page .roaming-group-label,
body.map-page .roaming-legend-head span {
  position: relative;
  z-index: 1;
}

body.map-page select,
body.map-page .pill,
body.map-page .board-title,
body.map-page .tooltip,
body.map-page .source-card,
body.map-page .hub-item,
body.map-page .close-button,
body.map-page .visual-readout-copy {
  background-color: rgba(8, 10, 10, 0.48);
}

body.map-page select,
body.map-page .pill,
body.map-page .source-card,
body.map-page .hub-item,
body.map-page .tooltip,
body.map-page .close-button {
  border-color: rgba(228, 201, 143, 0.14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
}

body.map-page .pill.active {
  box-shadow: 0 10px 18px rgba(0,0,0,0.16), inset 0 1px 0 rgba(255,255,255,0.10);
}

body.map-page .map-layout {
  gap: 1.45rem;
}

body.map-page .map-board {
  border-color: rgba(228, 201, 143, 0.16);
  background-color: #151715;
  box-shadow:
    0 20px 48px rgba(0,0,0,0.26),
    inset 0 1px 0 rgba(255,255,255,0.04),
    inset 0 -1px 0 rgba(0,0,0,0.26);
}

body.map-page .map-board::before {
  inset: 0.5rem;
  border-radius: 1.55rem;
}

body.map-page .map-board::after {
  background:
    linear-gradient(180deg, rgba(0,0,0,0.06), rgba(0,0,0,0.18)),
    linear-gradient(118deg, rgba(255,255,255,0.045), transparent 26%);
}

body.map-page .board-title {
  left: 1.1rem;
  top: 1.1rem;
  border-color: rgba(228, 201, 143, 0.18);
  background: rgba(7, 9, 8, 0.70);
  box-shadow:
    0 10px 18px rgba(0,0,0,0.18),
    inset 0 1px 0 rgba(255,255,255,0.05);
}

body.map-page .signal-drawer {
  border-color: rgba(228, 201, 143, 0.16);
  background:
    radial-gradient(circle at 88% 12%, rgba(242,221,176,0.055), transparent 18rem),
    linear-gradient(145deg, rgba(255,255,255,0.064), rgba(255,255,255,0.018)),
    rgba(12, 14, 14, 0.54);
  box-shadow:
    0 18px 44px rgba(0,0,0,0.24),
    inset 0 1px 0 rgba(255,255,255,0.05),
    inset 0 -1px 0 rgba(0,0,0,0.24);
}

body.map-page .roaming-legend {
  margin-top: 1rem;
  padding: 1rem 1.05rem;
  border: 1px solid rgba(228, 201, 143, 0.14);
  border-radius: 1.65rem;
}

body.map-page .empty-state {
  margin-top: 1rem;
  border-color: rgba(228, 201, 143, 0.14);
  border-radius: 1.55rem;
  background:
    radial-gradient(circle at 88% 12%, rgba(242,221,176,0.045), transparent 16rem),
    linear-gradient(145deg, rgba(255,255,255,0.05), rgba(255,255,255,0.014)),
    rgba(12, 14, 14, 0.42);
}

body.map-page .mobile-sheet {
  border-top-color: rgba(228, 201, 143, 0.16);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.025), rgba(255,255,255,0.008)),
    rgba(12, 14, 14, 0.97);
}

body.map-page .mobile-sheet .signal-drawer {
  border: 0;
  background: transparent;
  box-shadow: none;
}

@media (max-width: 980px) {
  body.map-page .map-intro {
    max-width: none;
  }
}


/* =========================================================
   v40 — Signal drawer alignment + sitewide sheen pass
   Fix nested drawer issue, add rectangular meter, and harmonize surfaces.
   ========================================================= */

/* Global sheen benchmarked to Programs */
.site-header {
  position: sticky;
  isolation: isolate;
  background:
    linear-gradient(180deg, rgba(18, 20, 18, 0.96), rgba(10, 12, 11, 0.90)),
    rgba(8,9,7,0.82);
  border-bottom-color: rgba(228, 201, 143, 0.13);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.05),
    inset 0 -1px 0 rgba(0,0,0,0.28),
    0 10px 26px rgba(0,0,0,0.22);
}

.site-header::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(115deg, rgba(255,255,255,0.06), rgba(255,255,255,0.01) 16%, transparent 34%);
  opacity: 0.75;
  z-index: 0;
}

.site-header > * {
  position: relative;
  z-index: 1;
}

.site-nav,
.lang-toggle {
  border: 1px solid rgba(228, 201, 143, 0.12);
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.012)),
    rgba(9, 11, 10, 0.48);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.04),
    0 8px 18px rgba(0,0,0,0.16);
}

.site-nav {
  padding: 0.38rem 0.8rem;
}

.lang-toggle {
  padding: 0.25rem;
}

body.home-page .hero-card,
body.home-page .feature-card,
body.home-page .home-featured-shelves,
body.home-page .home-shelf-card,
body.home-page .home-youtube-panel {
  position: relative;
  overflow: hidden;
  border-color: rgba(228, 201, 143, 0.15);
  background:
    radial-gradient(circle at 88% 12%, rgba(242,221,176,0.06), transparent 18rem),
    linear-gradient(145deg, rgba(255,255,255,0.062), rgba(255,255,255,0.018)),
    rgba(12, 14, 14, 0.46);
  box-shadow:
    0 18px 44px rgba(0,0,0,0.24),
    inset 0 1px 0 rgba(255,255,255,0.05),
    inset 0 -1px 0 rgba(0,0,0,0.24);
}

body.home-page .hero-card::before,
body.home-page .feature-card::before,
body.home-page .home-featured-shelves::before,
body.home-page .home-shelf-card::before,
body.home-page .home-youtube-panel::before {
  content: "";
  position: absolute;
  inset: 0.38rem;
  border-radius: inherit;
  border: 1px solid rgba(255,255,255,0.025);
  pointer-events: none;
}

body.home-page .hero-card::after,
body.home-page .feature-card::after,
body.home-page .home-featured-shelves::after,
body.home-page .home-shelf-card::after,
body.home-page .home-youtube-panel::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(118deg, rgba(255,255,255,0.07), rgba(255,255,255,0.016) 14%, transparent 34%);
  opacity: 0.78;
}

body.home-page .hero-card > *,
body.home-page .feature-card > *,
body.home-page .home-featured-shelves > *,
body.home-page .home-shelf-card > *,
body.home-page .home-youtube-panel > * {
  position: relative;
  z-index: 1;
}

/* Signal drawer realignment */
body.map-page .signal-drawer {
  display: grid;
  gap: 0.95rem;
  align-content: start;
  padding: 1rem;
}

body.map-page .signal-drawer.idle {
  min-height: 21rem;
}

body.map-page .signal-drawer.active {
  min-height: 21rem;
}

body.map-page .drawer-top-rail {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.38rem;
  padding: 0.15rem 0.05rem 0;
}

body.map-page .drawer-meter-state {
  color: rgba(188, 205, 178, 0.60);
  font-size: 0.56rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  justify-self: end;
  padding-right: 0.22rem;
}

body.map-page .drawer-meter {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.72rem;
  min-height: 3.5rem;
  padding: 0.56rem 0.62rem;
  border-radius: 1.08rem;
  border: 1px solid rgba(214, 183, 119, 0.17);
  background:
    radial-gradient(circle at 18% 14%, rgba(255,255,255,0.05), transparent 22%),
    linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.01)),
    rgba(8, 10, 10, 0.66);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.04),
    inset 0 -1px 0 rgba(0,0,0,0.28),
    0 12px 20px rgba(0,0,0,0.14);
}

body.map-page .drawer-meter-face {
  min-width: 0;
  display: grid;
  gap: 0.32rem;
}

body.map-page .drawer-meter-label {
  color: rgba(220, 208, 176, 0.70);
  font-size: 0.52rem;
  font-weight: 800;
  letter-spacing: 0.17em;
  text-transform: uppercase;
  padding-left: 0.12rem;
}

body.map-page .drawer-meter-track {
  position: relative;
  display: block;
  height: 2.12rem;
  border-radius: 0.8rem;
  border: 1px solid rgba(214, 183, 119, 0.18);
  background:
    radial-gradient(circle at 30% 24%, rgba(255,255,255,0.05), transparent 16%),
    linear-gradient(180deg, rgba(37, 45, 39, 0.92), rgba(15, 18, 16, 0.96));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.04),
    inset 0 0 0 1px rgba(0,0,0,0.24),
    inset 0 -6px 12px rgba(0,0,0,0.28),
    0 0 0 1px rgba(0,0,0,0.28);
  overflow: hidden;
}

body.map-page .drawer-meter-track::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, transparent calc(50% - 0.5px), rgba(130, 161, 127, 0.22) calc(50% - 0.5px) calc(50% + 0.5px), transparent calc(50% + 0.5px)),
    linear-gradient(0deg, transparent calc(50% - 0.5px), rgba(130, 161, 127, 0.20) calc(50% - 0.5px) calc(50% + 0.5px), transparent calc(50% + 0.5px)),
    repeating-linear-gradient(90deg, transparent 0 1.2rem, rgba(130, 161, 127, 0.10) 1.2rem 1.26rem),
    repeating-linear-gradient(0deg, transparent 0 0.54rem, rgba(130, 161, 127, 0.08) 0.54rem 0.60rem);
  opacity: 0.72;
}

body.map-page .drawer-meter-track::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(115deg, rgba(255,255,255,0.12), rgba(255,255,255,0.00) 18%, transparent 32%),
    radial-gradient(circle at 50% 50%, rgba(133, 171, 126, 0.06), transparent 38%);
  opacity: 0.84;
}

body.map-page .drawer-meter-needle {
  position: absolute;
  left: -16%;
  top: 50%;
  width: 132%;
  height: 2px;
  transform: translateY(-50%);
  border-radius: 999px;
  background:
    linear-gradient(90deg,
      rgba(0,0,0,0) 0%,
      rgba(118, 151, 114, 0.08) 16%,
      rgba(184, 232, 167, 0.72) 36%,
      rgba(223, 255, 214, 0.95) 50%,
      rgba(184, 232, 167, 0.72) 64%,
      rgba(118, 151, 114, 0.08) 84%,
      rgba(0,0,0,0) 100%);
  box-shadow:
    0 0 10px rgba(178, 226, 165, 0.22),
    0 0 18px rgba(151, 209, 132, 0.12);
  animation: drawerScopeSweep 3.7s linear infinite;
}

body.map-page .drawer-meter-needle::before {
  content: "";
  position: absolute;
  left: 9%;
  top: -0.5rem;
  width: 82%;
  height: 1rem;
  background:
    linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(154, 216, 141, 0.12) 42%, rgba(0,0,0,0) 100%);
  filter: blur(2px);
}

body.map-page .drawer-meter-needle::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -50%;
  bottom: -50%;
  background:
    linear-gradient(90deg,
      rgba(0,0,0,0) 0%,
      rgba(162, 219, 149, 0.00) 26%,
      rgba(162, 219, 149, 0.24) 39%,
      rgba(213, 255, 201, 0.40) 50%,
      rgba(162, 219, 149, 0.24) 61%,
      rgba(162, 219, 149, 0.00) 74%,
      rgba(0,0,0,0) 100%);
  animation: drawerScopePulse 2.8s ease-in-out infinite;
}

body.map-page .drawer-meter-light {
  width: 0.68rem;
  height: 0.68rem;
  border-radius: 50%;
  background: radial-gradient(circle at 38% 36%, rgba(225, 255, 213, 0.98), rgba(140, 198, 116, 0.96) 45%, rgba(40, 65, 38, 0.95) 100%);
  box-shadow: 0 0 0 1px rgba(255,255,255,0.08), 0 0 10px rgba(156, 214, 131, 0.30);
  animation: drawerLightBreathe 3.8s ease-in-out infinite;
}

body.map-page .drawer-meter.is-idle .drawer-meter-light {
  background: radial-gradient(circle at 38% 36%, rgba(244, 231, 180, 0.95), rgba(185, 157, 89, 0.93) 45%, rgba(74, 56, 28, 0.92) 100%);
  box-shadow: 0 0 0 1px rgba(255,255,255,0.06), 0 0 8px rgba(204, 172, 101, 0.18);
}

body.map-page .drawer-meter.is-idle .drawer-meter-needle {
  animation-duration: 5.4s;
  opacity: 0.68;
}

body.map-page .drawer-main-card {
  position: relative;
  padding: 1.1rem 1rem 1rem;
  border: 1px solid rgba(228, 201, 143, 0.14);
  border-radius: 1.65rem;
  background:
    radial-gradient(circle at 88% 10%, rgba(242,221,176,0.05), transparent 16rem),
    linear-gradient(145deg, rgba(255,255,255,0.05), rgba(255,255,255,0.014)),
    rgba(10, 12, 12, 0.44);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.04),
    0 12px 26px rgba(0,0,0,0.16);
}

body.map-page .drawer-main-card::before {
  content: "";
  position: absolute;
  inset: 0.34rem;
  border-radius: inherit;
  border: 1px solid rgba(255,255,255,0.022);
  pointer-events: none;
}

body.map-page .drawer-main-card.idle-card {
  min-height: 10rem;
}

body.map-page .mobile-sheet .mobile-drawer-panel {
  display: grid;
  gap: 0.95rem;
  padding: 0.2rem 0 0;
}

@keyframes drawerScopeSweep {
  0%   { transform: translateY(-50%) translateX(-9%); opacity: 0.76; }
  50%  { transform: translateY(-50%) translateX(9%); opacity: 1; }
  100% { transform: translateY(-50%) translateX(-9%); opacity: 0.76; }
}

@keyframes drawerScopePulse {
  0%, 100% { opacity: 0.52; }
  50% { opacity: 0.9; }
}

@keyframes drawerLightBreathe {
  0%, 100% { opacity: 0.84; }
  50% { opacity: 1; }
}

@media (max-width: 980px) {
  body.map-page .drawer-top-rail {
    grid-template-columns: 1fr;
    justify-items: stretch;
  }

  body.map-page .drawer-meter-state {
    justify-self: start;
    padding-left: 0.1rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.map-page .drawer-meter-needle,
  body.map-page .drawer-meter-needle::after,
  body.map-page .drawer-meter-light {
    animation: none;
  }
}


/* =========================================================
   v42 — Encased station housing + proper scope module
   Bring the non-Programs pages into the same molded family.
   ========================================================= */

/* Whole-page molded housings */
body.home-page .home-shell,
body.map-page .map-shell,
body.visual-page .visual-shell {
  position: relative;
  width: min(1360px, calc(100% - 1.25rem));
  margin: clamp(0.85rem, 1.4vw, 1.1rem) auto 2rem;
  padding: clamp(1.2rem, 2vw, 1.55rem) clamp(1rem, 1.8vw, 1.35rem) 3rem;
  border: 1px solid rgba(205, 176, 114, 0.20);
  border-radius: 2.45rem;
  background:
    radial-gradient(circle at 50% 0%, rgba(207,176,106,0.08), transparent 28rem),
    linear-gradient(180deg, rgba(36, 39, 35, 0.88), rgba(17, 19, 18, 0.96));
  box-shadow:
    0 28px 78px rgba(0,0,0,0.36),
    inset 0 1px 0 rgba(255,255,255,0.08),
    inset 0 -1px 0 rgba(0,0,0,0.42),
    0 0 0 1px rgba(0,0,0,0.52);
  overflow: hidden;
}

body.home-page .home-shell::before,
body.map-page .map-shell::before,
body.visual-page .visual-shell::before {
  content: "";
  position: absolute;
  inset: 1rem;
  border-radius: 2rem;
  border: 1px solid rgba(211, 182, 118, 0.18);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.04),
    0 0 0 1px rgba(0,0,0,0.24);
  pointer-events: none;
}

body.home-page .home-shell::after,
body.map-page .map-shell::after,
body.visual-page .visual-shell::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(116deg, rgba(255,255,255,0.10), rgba(255,255,255,0.014) 14%, transparent 28%, transparent 72%, rgba(255,255,255,0.03)),
    radial-gradient(circle at 50% 10%, rgba(255,255,255,0.03), transparent 28rem);
  opacity: 0.92;
}

body.home-page .home-shell > *,
body.map-page .map-shell > *,
body.visual-page .visual-shell > * {
  position: relative;
  z-index: 1;
}

/* Inner section casings */
body.home-page .home-hero-field,
body.home-page .home-front-doors,
body.home-page .home-featured-shelves,
body.map-page .map-intro,
body.map-page .control-deck,
body.map-page .signal-key-panel,
body.map-page .map-layout,
body.visual-page .visual-hero,
body.visual-page .visual-jump-nav,
body.visual-page .visual-section {
  position: relative;
}

body.home-page .home-hero-field::before,
body.home-page .home-front-doors::before,
body.home-page .home-featured-shelves::before,
body.map-page .map-intro::before,
body.map-page .control-deck::before,
body.map-page .signal-key-panel::before,
body.map-page .map-layout::before,
body.visual-page .visual-hero::before,
body.visual-page .visual-jump-nav::before,
body.visual-page .visual-section::before {
  content: "";
  position: absolute;
  inset: -0.7rem;
  border-radius: 2rem;
  border: 1px solid rgba(203, 174, 109, 0.12);
  pointer-events: none;
  opacity: 0.65;
}

/* Make panels share the Programs skin tone more directly */
body.home-page .hero-card,
body.home-page .feature-card,
body.home-page .home-featured-shelves,
body.home-page .home-shelf-card,
body.home-page .home-youtube-panel,
body.map-page .map-intro,
body.map-page .control-deck,
body.map-page .signal-key-panel,
body.map-page .signal-drawer,
body.map-page .roaming-legend,
body.map-page .empty-state,
body.visual-page .visual-hero-copy,
body.visual-page .visual-hero-card,
body.visual-page .visual-jump-nav,
body.visual-page .visual-section,
body.visual-page .visual-card {
  border-color: rgba(214, 183, 119, 0.16) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(207,176,106,0.08), transparent 22rem),
    linear-gradient(180deg, rgba(31,34,31,0.64), rgba(10,12,12,0.74)) !important;
  box-shadow:
    0 18px 44px rgba(0,0,0,0.24),
    inset 0 1px 0 rgba(255,255,255,0.06),
    inset 0 -1px 0 rgba(0,0,0,0.34),
    0 0 0 1px rgba(0,0,0,0.18) !important;
}

/* Signal drawer top module: rectangular version of the Programs port */
body.map-page .signal-drawer {
  padding: 1rem;
}

body.map-page .drawer-top-rail {
  gap: 0.48rem;
}

body.map-page .drawer-meter {
  padding: 0.44rem 0.52rem;
  border-radius: 1.12rem;
  border: 1px solid rgba(214, 183, 119, 0.18);
  background:
    linear-gradient(180deg, rgba(33,35,33,0.84), rgba(12,14,14,0.96));
  box-shadow:
    0 10px 20px rgba(0,0,0,0.18),
    0 0 0 1px rgba(0,0,0,0.34),
    0 0 0 0.18rem rgba(18,20,18,0.96),
    0 0 0 0.26rem rgba(214, 183, 119, 0.09),
    inset 0 1px 0 rgba(255,255,255,0.05),
    inset 0 -6px 12px rgba(0,0,0,0.26);
}

body.map-page .drawer-meter-face {
  gap: 0.24rem;
}

body.map-page .drawer-meter-label {
  padding-left: 0.14rem;
  color: rgba(217, 206, 175, 0.7);
  font-size: 0.5rem;
  letter-spacing: 0.18em;
}

body.map-page .drawer-meter-track {
  position: relative;
  height: 2.35rem;
  border-radius: 0.95rem;
  border: 1px solid rgba(214,183,119,0.14);
  background:
    radial-gradient(circle at 40% 50%, rgba(148, 171, 128, 0.07), transparent 30%),
    linear-gradient(180deg, rgba(31,37,33,0.96), rgba(13,16,15,0.98));
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.40),
    inset 0 1px 0 rgba(255,255,255,0.03),
    inset 0 -8px 14px rgba(0,0,0,0.26);
  overflow: hidden;
}

body.map-page .drawer-meter-track::before {
  content: "";
  position: absolute;
  inset: 0.15rem;
  border-radius: inherit;
  background:
    linear-gradient(90deg, transparent calc(50% - 0.5px), rgba(121, 148, 116, 0.24) calc(50% - 0.5px) calc(50% + 0.5px), transparent calc(50% + 0.5px)),
    linear-gradient(0deg, transparent calc(50% - 0.5px), rgba(121, 148, 116, 0.22) calc(50% - 0.5px) calc(50% + 0.5px), transparent calc(50% + 0.5px)),
    repeating-linear-gradient(90deg, transparent 0 1.15rem, rgba(121, 148, 116, 0.09) 1.15rem 1.22rem),
    repeating-linear-gradient(0deg, transparent 0 0.55rem, rgba(121, 148, 116, 0.07) 0.55rem 0.61rem);
  opacity: 0.78;
}

body.map-page .drawer-meter-track::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(120deg, rgba(255,255,255,0.10), rgba(255,255,255,0.02) 14%, transparent 34%),
    radial-gradient(circle at 50% 50%, rgba(122, 152, 116, 0.06), transparent 36%);
}

body.map-page .drawer-meter-trace,
body.map-page .drawer-meter-needle {
  position: absolute;
}

body.map-page .drawer-meter-trace {
  left: 6%;
  right: 6%;
  top: 50%;
  height: 0.95rem;
  transform: translateY(-50%);
  opacity: 0.7;
  background:
    linear-gradient(135deg, transparent 0 11%, rgba(176, 226, 164, 0.82) 11.5% 12.5%, transparent 13% 26%, rgba(176, 226, 164, 0.76) 26.5% 27.5%, transparent 28% 44%, rgba(176, 226, 164, 0.78) 44.5% 45.5%, transparent 46% 62%, rgba(176, 226, 164, 0.72) 62.5% 63.5%, transparent 64% 78%, rgba(176, 226, 164, 0.74) 78.5% 79.5%, transparent 80% 100%);
  clip-path: polygon(0% 65%, 9% 65%, 12% 48%, 18% 66%, 27% 66%, 32% 38%, 38% 62%, 46% 62%, 50% 46%, 59% 60%, 69% 60%, 73% 35%, 80% 68%, 89% 68%, 93% 53%, 100% 53%, 100% 73%, 0% 73%);
  filter: drop-shadow(0 0 4px rgba(179, 228, 166, 0.22));
  animation: drawerTraceHum 4.6s ease-in-out infinite;
}

body.map-page .drawer-meter-needle {
  left: -18%;
  top: 50%;
  width: 136%;
  height: 2px;
  transform: translateY(-50%);
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(150,210,136,0.06) 18%, rgba(213,255,201,0.95) 50%, rgba(150,210,136,0.06) 82%, rgba(0,0,0,0) 100%);
  box-shadow: 0 0 12px rgba(164, 224, 148, 0.22), 0 0 22px rgba(164, 224, 148, 0.10);
  animation: drawerScopeSweep 3.8s linear infinite;
}

body.map-page .drawer-meter-needle::before {
  content: "";
  position: absolute;
  left: 10%;
  width: 80%;
  top: -0.44rem;
  height: 0.88rem;
  background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(160, 223, 146, 0.14) 44%, rgba(0,0,0,0) 100%);
  filter: blur(2px);
}

body.map-page .drawer-meter-needle::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -55%;
  bottom: -55%;
  background: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(160,223,146,0) 28%, rgba(160,223,146,0.18) 42%, rgba(219,255,209,0.36) 50%, rgba(160,223,146,0.18) 58%, rgba(160,223,146,0) 72%, rgba(0,0,0,0) 100%);
  animation: drawerScopePulse 2.8s ease-in-out infinite;
}

body.map-page .drawer-meter-light {
  width: 0.72rem;
  height: 0.72rem;
  box-shadow: 0 0 0 1px rgba(255,255,255,0.08), 0 0 10px rgba(156,214,131,0.28);
}

body.map-page .drawer-meter-state {
  justify-self: start;
  padding-left: 0.1rem;
  color: rgba(188,205,178,0.60);
}

body.map-page .drawer-meter.is-idle .drawer-meter-trace,
body.map-page .drawer-meter.is-idle .drawer-meter-needle {
  opacity: 0.64;
  animation-duration: 5.2s;
}

/* Stronger molded map board and drawer relation */
body.map-page .map-layout {
  padding: 0.8rem;
  border: 1px solid rgba(203, 174, 109, 0.14);
  border-radius: 2.2rem;
  background: linear-gradient(180deg, rgba(23,25,23,0.54), rgba(10,12,12,0.30));
}

body.map-page .map-board,
body.map-page .signal-drawer {
  border-radius: 2rem;
}

@keyframes drawerScopeSweep {
  0%   { transform: translateY(-50%) translateX(-10%); opacity: 0.76; }
  50%  { transform: translateY(-50%) translateX(10%); opacity: 1; }
  100% { transform: translateY(-50%) translateX(-10%); opacity: 0.76; }
}

@keyframes drawerScopePulse {
  0%, 100% { opacity: 0.44; }
  50% { opacity: 0.92; }
}

@keyframes drawerTraceHum {
  0%,100% { opacity: 0.60; transform: translateY(-50%) scaleY(1); }
  50% { opacity: 0.86; transform: translateY(-50%) scaleY(1.05); }
}

@media (max-width: 980px) {
  body.home-page .home-shell,
  body.map-page .map-shell,
  body.visual-page .visual-shell {
    width: min(100% - 0.75rem, 1360px);
    padding: 0.9rem 0.8rem 2rem;
    border-radius: 1.7rem;
  }

  body.home-page .home-shell::before,
  body.map-page .map-shell::before,
  body.visual-page .visual-shell::before {
    inset: 0.58rem;
    border-radius: 1.35rem;
  }

  body.map-page .map-layout {
    padding: 0.5rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.map-page .drawer-meter-trace,
  body.map-page .drawer-meter-needle,
  body.map-page .drawer-meter-needle::after,
  body.map-page .drawer-meter-light {
    animation: none !important;
  }
}


/* =========================================================
   v43 — Signal drawer upper-bay placement
   Put the scope module into the upper rectangular bay instead of sitting on the card.
   ========================================================= */

body.map-page .signal-drawer {
  gap: 0.95rem;
}

body.map-page .drawer-top-rail {
  min-height: 7.7rem;
  padding: 1rem 1rem 0.9rem;
  border: 1px solid rgba(214, 183, 119, 0.15);
  border-radius: 1.85rem;
  background:
    radial-gradient(circle at 50% 0%, rgba(207,176,106,0.06), transparent 18rem),
    linear-gradient(180deg, rgba(30,33,31,0.60), rgba(10,12,12,0.66));
  box-shadow:
    0 14px 28px rgba(0,0,0,0.18),
    inset 0 1px 0 rgba(255,255,255,0.05),
    inset 0 -1px 0 rgba(0,0,0,0.28);
  align-content: center;
}

body.map-page .drawer-top-rail::before {
  content: "";
  position: absolute;
  inset: 0.38rem;
  border-radius: inherit;
  border: 1px solid rgba(255,255,255,0.024);
  pointer-events: none;
}

body.map-page .drawer-meter {
  width: 100%;
  min-height: 4.25rem;
  padding: 0.62rem 0.68rem;
  border-radius: 1.22rem;
}

body.map-page .drawer-meter-face {
  gap: 0.32rem;
}

body.map-page .drawer-meter-label {
  font-size: 0.54rem;
  letter-spacing: 0.19em;
}

body.map-page .drawer-meter-track {
  height: 2.8rem;
  border-radius: 1rem;
}

body.map-page .drawer-meter-light {
  width: 0.8rem;
  height: 0.8rem;
}

body.map-page .drawer-meter-state {
  padding-left: 0.18rem;
  justify-self: start;
  align-self: end;
  color: rgba(194, 208, 181, 0.62);
  font-size: 0.55rem;
  letter-spacing: 0.17em;
}

body.map-page .drawer-main-card {
  margin-top: 0;
}

@media (max-width: 980px) {
  body.map-page .drawer-top-rail {
    min-height: 6.9rem;
    padding: 0.8rem 0.8rem 0.75rem;
  }

  body.map-page .drawer-meter {
    min-height: 3.8rem;
  }

  body.map-page .drawer-meter-track {
    height: 2.45rem;
  }
}


/* =========================================================
   v44 — Actual two-bay signal drawer layout
   Upper bay flexes to fill the unused space; scope lives there.
   ========================================================= */

body.map-page .map-layout {
  align-items: stretch;
}

body.map-page .signal-drawer {
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-rows: minmax(11rem, 1fr) auto;
  gap: 1rem;
  align-content: stretch;
}

body.map-page .drawer-top-rail {
  min-height: 0;
  height: 100%;
  display: grid;
  grid-template-rows: auto auto;
  align-content: center;
  justify-items: stretch;
  gap: 0.55rem;
  padding: 1.1rem 1rem;
}

body.map-page .drawer-meter {
  width: 100%;
  max-width: none;
  margin: 0;
}

body.map-page .drawer-meter-state {
  justify-self: start;
  align-self: start;
  padding-left: 0.16rem;
}

body.map-page .drawer-main-card {
  align-self: end;
}

@media (max-width: 980px) {
  body.map-page .signal-drawer {
    grid-template-rows: auto auto;
    height: auto;
  }

  body.map-page .drawer-top-rail {
    height: auto;
    min-height: 7rem;
    align-content: center;
  }
}


/* =========================================================
   v45 — Correct right-column scope placement
   Standalone scope bay above the drawer; no giant stretched empty chamber.
   ========================================================= */

body.map-page .map-layout {
  align-items: start !important;
}

body.map-page .drawer-column {
  position: sticky;
  top: 6.5rem;
  display: grid;
  gap: 1rem;
  align-content: start;
  min-width: 0;
}

body.map-page .map-scope-bay {
  position: relative;
  overflow: hidden;
  min-height: 7.6rem;
  padding: 0.95rem 1rem 0.85rem;
  border: 1px solid rgba(214, 183, 119, 0.16);
  border-radius: 2rem;
  background:
    radial-gradient(circle at 50% 0%, rgba(207,176,106,0.06), transparent 18rem),
    linear-gradient(180deg, rgba(31,34,31,0.64), rgba(10,12,12,0.74));
  box-shadow:
    0 18px 44px rgba(0,0,0,0.24),
    inset 0 1px 0 rgba(255,255,255,0.06),
    inset 0 -1px 0 rgba(0,0,0,0.34),
    0 0 0 1px rgba(0,0,0,0.18);
}

body.map-page .map-scope-bay::before {
  content: "";
  position: absolute;
  inset: 0.38rem;
  border-radius: inherit;
  border: 1px solid rgba(255,255,255,0.024);
  pointer-events: none;
}

body.map-page .map-scope-bay::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(118deg, rgba(255,255,255,0.06), rgba(255,255,255,0.012) 14%, transparent 34%);
  opacity: 0.78;
}

body.map-page .map-scope-bay > * {
  position: relative;
  z-index: 1;
}

body.map-page .map-scope-module {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.72rem;
  padding: 0.62rem 0.68rem;
  border-radius: 1.22rem;
  border: 1px solid rgba(214, 183, 119, 0.18);
  background:
    linear-gradient(180deg, rgba(33,35,33,0.84), rgba(12,14,14,0.96));
  box-shadow:
    0 10px 20px rgba(0,0,0,0.18),
    0 0 0 1px rgba(0,0,0,0.34),
    0 0 0 0.18rem rgba(18,20,18,0.96),
    0 0 0 0.26rem rgba(214, 183, 119, 0.09),
    inset 0 1px 0 rgba(255,255,255,0.05),
    inset 0 -6px 12px rgba(0,0,0,0.26);
}

body.map-page .map-scope-face {
  min-width: 0;
  display: grid;
  gap: 0.32rem;
}

body.map-page .map-scope-label {
  padding-left: 0.14rem;
  color: rgba(217, 206, 175, 0.70);
  font-size: 0.54rem;
  font-weight: 800;
  letter-spacing: 0.19em;
  text-transform: uppercase;
}

body.map-page .map-scope-screen {
  position: relative;
  display: block;
  height: 2.8rem;
  border-radius: 1rem;
  border: 1px solid rgba(214,183,119,0.14);
  background:
    radial-gradient(circle at 40% 50%, rgba(148, 171, 128, 0.07), transparent 30%),
    linear-gradient(180deg, rgba(31,37,33,0.96), rgba(13,16,15,0.98));
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.40),
    inset 0 1px 0 rgba(255,255,255,0.03),
    inset 0 -8px 14px rgba(0,0,0,0.26);
  overflow: hidden;
}

body.map-page .map-scope-screen::before {
  content: "";
  position: absolute;
  inset: 0.15rem;
  border-radius: inherit;
  background:
    linear-gradient(90deg, transparent calc(50% - 0.5px), rgba(121, 148, 116, 0.24) calc(50% - 0.5px) calc(50% + 0.5px), transparent calc(50% + 0.5px)),
    linear-gradient(0deg, transparent calc(50% - 0.5px), rgba(121, 148, 116, 0.22) calc(50% - 0.5px) calc(50% + 0.5px), transparent calc(50% + 0.5px)),
    repeating-linear-gradient(90deg, transparent 0 1.15rem, rgba(121, 148, 116, 0.09) 1.15rem 1.22rem),
    repeating-linear-gradient(0deg, transparent 0 0.55rem, rgba(121, 148, 116, 0.07) 0.55rem 0.61rem);
  opacity: 0.78;
}

body.map-page .map-scope-screen::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(120deg, rgba(255,255,255,0.10), rgba(255,255,255,0.02) 14%, transparent 34%),
    radial-gradient(circle at 50% 50%, rgba(122, 152, 116, 0.06), transparent 36%);
}

body.map-page .map-scope-wave,
body.map-page .map-scope-sweep {
  position: absolute;
}

body.map-page .map-scope-wave {
  left: 6%;
  right: 6%;
  top: 50%;
  height: 0.95rem;
  transform: translateY(-50%);
  opacity: 0.72;
  background:
    linear-gradient(135deg, transparent 0 11%, rgba(176, 226, 164, 0.82) 11.5% 12.5%, transparent 13% 26%, rgba(176, 226, 164, 0.76) 26.5% 27.5%, transparent 28% 44%, rgba(176, 226, 164, 0.78) 44.5% 45.5%, transparent 46% 62%, rgba(176, 226, 164, 0.72) 62.5% 63.5%, transparent 64% 78%, rgba(176, 226, 164, 0.74) 78.5% 79.5%, transparent 80% 100%);
  clip-path: polygon(0% 65%, 9% 65%, 12% 48%, 18% 66%, 27% 66%, 32% 38%, 38% 62%, 46% 62%, 50% 46%, 59% 60%, 69% 60%, 73% 35%, 80% 68%, 89% 68%, 93% 53%, 100% 53%, 100% 73%, 0% 73%);
  filter: drop-shadow(0 0 4px rgba(179, 228, 166, 0.22));
  animation: mapScopeTraceHum 4.6s ease-in-out infinite;
}

body.map-page .map-scope-sweep {
  left: -18%;
  top: 50%;
  width: 136%;
  height: 2px;
  transform: translateY(-50%);
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(150,210,136,0.06) 18%, rgba(213,255,201,0.95) 50%, rgba(150,210,136,0.06) 82%, rgba(0,0,0,0) 100%);
  box-shadow: 0 0 12px rgba(164, 224, 148, 0.22), 0 0 22px rgba(164, 224, 148, 0.10);
  animation: mapScopeSweep 3.8s linear infinite;
}

body.map-page .map-scope-sweep::before {
  content: "";
  position: absolute;
  left: 10%;
  width: 80%;
  top: -0.44rem;
  height: 0.88rem;
  background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(160, 223, 146, 0.14) 44%, rgba(0,0,0,0) 100%);
  filter: blur(2px);
}

body.map-page .map-scope-sweep::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -55%;
  bottom: -55%;
  background: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(160,223,146,0) 28%, rgba(160,223,146,0.18) 42%, rgba(219,255,209,0.36) 50%, rgba(160,223,146,0.18) 58%, rgba(160,223,146,0) 72%, rgba(0,0,0,0) 100%);
  animation: mapScopePulse 2.8s ease-in-out infinite;
}

body.map-page .map-scope-light {
  width: 0.8rem;
  height: 0.8rem;
  border-radius: 50%;
  background: radial-gradient(circle at 38% 36%, rgba(225, 255, 213, 0.98), rgba(140, 198, 116, 0.96) 45%, rgba(40, 65, 38, 0.95) 100%);
  box-shadow: 0 0 0 1px rgba(255,255,255,0.08), 0 0 10px rgba(156,214,131,0.30);
  animation: drawerLightBreathe 3.8s ease-in-out infinite;
}

body.map-page .map-scope-status {
  display: block;
  margin-top: 0.48rem;
  padding-left: 0.18rem;
  color: rgba(194, 208, 181, 0.62);
  font-size: 0.55rem;
  font-weight: 800;
  letter-spacing: 0.17em;
  text-transform: uppercase;
}

body.map-page .signal-drawer {
  position: relative !important;
  top: auto !important;
  height: auto !important;
  min-height: 0 !important;
  display: block !important;
  gap: 0 !important;
}

body.map-page .signal-drawer .drawer-main-card {
  margin-top: 0;
}

body.map-page .signal-drawer.idle,
body.map-page .signal-drawer.active {
  min-height: 0 !important;
}

@keyframes mapScopeSweep {
  0%   { transform: translateY(-50%) translateX(-10%); opacity: 0.76; }
  50%  { transform: translateY(-50%) translateX(10%); opacity: 1; }
  100% { transform: translateY(-50%) translateX(-10%); opacity: 0.76; }
}

@keyframes mapScopePulse {
  0%, 100% { opacity: 0.44; }
  50% { opacity: 0.92; }
}

@keyframes mapScopeTraceHum {
  0%,100% { opacity: 0.60; transform: translateY(-50%) scaleY(1); }
  50% { opacity: 0.86; transform: translateY(-50%) scaleY(1.05); }
}

@media (max-width: 980px) {
  body.map-page .drawer-column {
    position: static;
  }

  body.map-page .map-scope-bay {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.map-page .map-scope-wave,
  body.map-page .map-scope-sweep,
  body.map-page .map-scope-sweep::after,
  body.map-page .map-scope-light {
    animation: none !important;
  }
}


/* v47 — signal filter + visual archive front shelf cleanup */
body.map-page .pill.active {
  background: var(--amber) !important;
  background-color: var(--amber) !important;
  color: var(--black) !important;
  border-color: transparent !important;
}



/* =========================================================
   v51 — Top-shell normalization
   Bring Home, Signal Map, and Visual Archive up to the same
   manufactured cabinet language as Programs.
   ========================================================= */

/* Make the non-Programs headers read like the same top rail. */
body.home-page .site-header,
body.map-page .site-header,
body.visual-page .site-header {
  position: sticky;
  top: 0;
  z-index: 30;
  width: min(1480px, calc(100% - 2rem));
  margin: 0.85rem auto 0;
  padding: 1rem clamp(1rem, 2.2vw, 1.65rem);
  border: 1px solid rgba(226, 197, 132, 0.24);
  border-radius: 1.45rem;
  background:
    linear-gradient(145deg, rgba(255,255,255,0.075), rgba(255,255,255,0.012) 18%, rgba(0,0,0,0.20) 100%),
    linear-gradient(180deg, rgba(33, 35, 31, 0.96), rgba(13, 15, 14, 0.98));
  box-shadow:
    0 18px 44px rgba(0,0,0,0.44),
    inset 0 1px 0 rgba(255,255,255,0.11),
    inset 0 -1px 0 rgba(0,0,0,0.72),
    inset 0 0 0 1px rgba(255,255,255,0.025);
  backdrop-filter: blur(18px);
}

body.home-page .site-header::before,
body.map-page .site-header::before,
body.visual-page .site-header::before {
  content: "";
  position: absolute;
  inset: 0.32rem;
  border-radius: 1.12rem;
  pointer-events: none;
  border: 1px solid rgba(0,0,0,0.62);
  box-shadow:
    inset 0 0 0 1px rgba(241, 213, 151, 0.06),
    inset 0 0 20px rgba(0,0,0,0.34);
}

body.home-page .site-header > *,
body.map-page .site-header > *,
body.visual-page .site-header > * {
  position: relative;
  z-index: 1;
}

body.home-page .brand-main,
body.map-page .brand-main,
body.visual-page .brand-main {
  color: rgba(246, 229, 188, 0.98);
  text-shadow: 0 0 18px rgba(226, 184, 96, 0.10);
}

body.home-page .site-nav,
body.map-page .site-nav,
body.visual-page .site-nav {
  gap: 0.55rem;
  padding: 0.38rem;
  border: 1px solid rgba(226, 197, 132, 0.14);
  border-radius: 999px;
  background: rgba(0,0,0,0.26);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.035),
    inset 0 -1px 0 rgba(0,0,0,0.48);
}

body.home-page .site-nav a,
body.map-page .site-nav a,
body.visual-page .site-nav a {
  min-height: 2.55rem;
  display: inline-flex;
  align-items: center;
  padding: 0 0.95rem;
  border-radius: 999px;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  font-size: 0.82rem;
  font-weight: 800;
}

body.home-page .site-nav a.active,
body.map-page .site-nav a.active,
body.visual-page .site-nav a.active {
  color: #17130b;
  background:
    linear-gradient(180deg, rgba(247,222,170,0.98), rgba(193,151,76,0.96));
  box-shadow:
    0 0 0 1px rgba(255,238,199,0.18),
    0 8px 20px rgba(0,0,0,0.24),
    inset 0 1px 0 rgba(255,255,255,0.40);
}

body.home-page .lang-toggle,
body.map-page .lang-toggle,
body.visual-page .lang-toggle {
  border-color: rgba(226, 197, 132, 0.20);
  background: rgba(0,0,0,0.34);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
}

/* Strengthen the page housings so they read like real cabinet bodies. */
body.home-page .home-shell,
body.map-page .map-shell,
body.visual-page .visual-shell {
  width: min(1480px, calc(100% - 2rem));
  margin: 1rem auto 4rem;
  padding: clamp(0.92rem, 1.4vw, 1.25rem);
  border-radius: clamp(1.8rem, 2.4vw, 2.75rem);
  border: 1px solid rgba(236, 204, 135, 0.34);
  background:
    radial-gradient(circle at 8% 11%, rgba(255,255,255,0.09), transparent 17rem),
    radial-gradient(circle at 90% 86%, rgba(0,0,0,0.48), transparent 24rem),
    repeating-linear-gradient(98deg, rgba(255,255,255,0.018) 0px, rgba(255,255,255,0.018) 1px, transparent 1px, transparent 8px),
    linear-gradient(150deg, #383830 0%, #20221f 6%, #121513 50%, #191b18 94%, #34342e 100%);
  box-shadow:
    0 36px 110px rgba(0,0,0,0.72),
    0 0 0 1px rgba(0,0,0,0.72),
    inset 0 1px 0 rgba(255,255,255,0.17),
    inset 0 0 0 1px rgba(255,255,255,0.035),
    inset 0 -2px 0 rgba(0,0,0,0.84);
  overflow: hidden;
}

body.home-page .home-shell::before,
body.map-page .map-shell::before,
body.visual-page .visual-shell::before {
  content: "";
  position: absolute;
  inset: 0.44rem;
  border-radius: calc(clamp(1.8rem, 2.4vw, 2.75rem) - 0.44rem);
  pointer-events: none;
  background:
    linear-gradient(128deg, rgba(255,255,255,0.14), rgba(255,255,255,0.02) 16%, transparent 33%, transparent 78%, rgba(255,255,255,0.03)),
    radial-gradient(circle at 5% 9%, rgba(255,255,255,0.09), transparent 16rem),
    radial-gradient(circle at 96% 94%, rgba(0,0,0,0.34), transparent 22rem);
  mix-blend-mode: screen;
  opacity: 0.82;
}

body.home-page .home-shell::after,
body.map-page .map-shell::after,
body.visual-page .visual-shell::after {
  content: "";
  position: absolute;
  inset: 0.30rem;
  border-radius: calc(clamp(1.8rem, 2.4vw, 2.75rem) - 0.30rem);
  border: 1px solid rgba(0,0,0,0.78);
  box-shadow:
    inset 0 0 0 1px rgba(244, 214, 149, 0.12),
    inset 0 0 0 4px rgba(0,0,0,0.20),
    inset 0 0 38px rgba(0,0,0,0.45);
  pointer-events: none;
}

/* Create a darker faceplate zone before the content begins. */
body.home-page .home-shell > *,
body.map-page .map-shell > *,
body.visual-page .visual-shell > * {
  position: relative;
  z-index: 1;
}

body.home-page .home-hero-field,
body.map-page .map-intro,
body.visual-page .visual-hero {
  margin: 0 0 1rem;
  padding: clamp(1rem, 2vw, 1.9rem);
  border-radius: clamp(1rem, 1.5vw, 1.55rem);
  border: 1px solid rgba(238, 207, 142, 0.20);
  background:
    radial-gradient(circle at 18% 4%, rgba(229, 192, 112, 0.09), transparent 24rem),
    radial-gradient(circle at 92% 84%, rgba(107, 127, 91, 0.055), transparent 24rem),
    linear-gradient(180deg, rgba(18,21,19,0.985), rgba(8,11,10,0.99));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.07),
    inset 0 0 0 1px rgba(255,255,255,0.02),
    inset 0 -1px 0 rgba(0,0,0,0.64),
    0 18px 40px rgba(0,0,0,0.28);
  overflow: hidden;
}

body.home-page .home-hero-field::before,
body.map-page .map-intro::before,
body.visual-page .visual-hero::before {
  content: "";
  position: absolute;
  inset: 0.42rem;
  border-radius: calc(clamp(1rem, 1.5vw, 1.55rem) - 0.3rem);
  pointer-events: none;
  border: 1px solid rgba(255,255,255,0.035);
}

body.home-page .home-hero-field {
  align-items: stretch;
  grid-template-columns: minmax(0, 1fr) minmax(290px, 360px);
  gap: 1rem;
}

body.home-page .home-hero-copy-card,
body.home-page .home-relay-stage,
body.visual-page .visual-hero-copy,
body.visual-page .visual-hero-card {
  position: relative;
  min-height: 100%;
  border: 1px solid rgba(232, 200, 134, 0.24) !important;
  border-radius: 1.55rem;
  background:
    linear-gradient(146deg, rgba(255,255,255,0.075), rgba(255,255,255,0.012) 22%, rgba(0,0,0,0.16) 100%),
    rgba(16, 19, 17, 0.88) !important;
  box-shadow:
    0 16px 34px rgba(0,0,0,0.28),
    inset 0 1px 0 rgba(255,255,255,0.10),
    inset 0 -1px 0 rgba(0,0,0,0.52) !important;
  overflow: hidden;
}

body.home-page .home-hero-copy-card::before,
body.home-page .home-relay-stage::before,
body.visual-page .visual-hero-copy::before,
body.visual-page .visual-hero-card::before {
  content: "";
  position: absolute;
  inset: 0.42rem;
  border-radius: 1.18rem;
  pointer-events: none;
  border: 1px solid rgba(255,255,255,0.035);
}

body.home-page .home-hero-copy-card > *,
body.home-page .home-relay-stage > *,
body.visual-page .visual-hero-copy > *,
body.visual-page .visual-hero-card > * {
  position: relative;
  z-index: 1;
}

body.home-page .home-relay-stage {
  min-height: 100%;
  padding: clamp(1rem, 2vw, 1.6rem);
}

body.home-page .home-relay-meter-wrap {
  width: min(100%, 312px);
}

body.map-page .map-intro {
  max-width: none;
  margin-bottom: 1rem;
  padding: clamp(1.15rem, 2.4vw, 1.75rem);
}

body.map-page .map-intro h1 {
  max-width: 1080px;
  font-size: clamp(2.45rem, 5.5vw, 4.8rem);
}

body.map-page .map-intro p:not(.eyebrow) {
  max-width: 980px;
  margin-bottom: 0;
}

body.visual-page .visual-hero {
  padding: 0.9rem;
  gap: 0.9rem;
}

body.visual-page .visual-hero-copy h1 {
  font-size: clamp(2.45rem, 5.5vw, 4.95rem);
}

body.visual-page .visual-hero-copy p {
  max-width: 980px;
}

/* Make the next structural rows feel like instrument strips, not loose boxes. */
body.home-page .home-front-doors,
body.map-page .control-deck,
body.map-page .signal-key-panel,
body.visual-page .visual-jump-nav {
  margin-top: 0;
  padding: 0.62rem;
  border: 1px solid rgba(232, 200, 134, 0.20);
  border-radius: 1.45rem;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.045), rgba(0,0,0,0.15)),
    rgba(9, 12, 10, 0.70);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.05),
    inset 0 -1px 0 rgba(0,0,0,0.52),
    0 14px 28px rgba(0,0,0,0.22);
}

body.home-page .feature-card,
body.map-page .control,
body.visual-page .visual-jump-link {
  min-height: 5rem;
  border-color: rgba(226, 197, 132, 0.22) !important;
  border-radius: 1.06rem;
  background:
    radial-gradient(circle at 84% 16%, rgba(242,221,176,0.13), transparent 11rem),
    linear-gradient(155deg, rgba(255,255,255,0.070), rgba(255,255,255,0.012) 28%, rgba(0,0,0,0.15)),
    rgba(19, 22, 19, 0.86) !important;
  box-shadow:
    0 10px 22px rgba(0,0,0,0.24),
    inset 0 1px 0 rgba(255,255,255,0.09),
    inset 0 0 0 1px rgba(255,255,255,0.024) !important;
}

body.home-page .home-featured-shelves,
body.map-page .map-layout,
body.visual-page .visual-section {
  margin-top: 1rem;
  padding: clamp(1rem, 2vw, 1.42rem);
  border-radius: 1.72rem;
  border: 1px solid rgba(231, 199, 132, 0.26);
  background:
    radial-gradient(circle at 92% 9%, rgba(242,221,176,0.09), transparent 22rem),
    linear-gradient(180deg, rgba(255,255,255,0.042), rgba(0,0,0,0.14)),
    rgba(9, 12, 10, 0.84) !important;
  box-shadow:
    0 18px 40px rgba(0,0,0,0.28),
    inset 0 1px 0 rgba(255,255,255,0.07),
    inset 0 0 0 1px rgba(255,255,255,0.018),
    inset 0 -18px 40px rgba(0,0,0,0.18) !important;
  overflow: hidden;
}

body.home-page .home-featured-shelves::before,
body.map-page .map-layout::before,
body.visual-page .visual-section::before {
  inset: 0.42rem;
  border-radius: 1.36rem;
  border: 1px solid rgba(255,255,255,0.03);
  opacity: 1;
}

body.home-page .home-featured-header h2,
body.map-page .signal-drawer h2,
body.visual-page .visual-section-heading h2 {
  letter-spacing: -0.032em;
}

@media (max-width: 980px) {
  body.home-page .site-header,
  body.map-page .site-header,
  body.visual-page .site-header {
    width: min(100% - 1rem, 1480px);
  }

  body.home-page .site-nav,
  body.map-page .site-nav,
  body.visual-page .site-nav {
    width: 100%;
    justify-content: flex-start;
    overflow-x: auto;
  }
}

@media (max-width: 900px) {
  body.home-page .home-hero-field {
    grid-template-columns: 1fr;
  }
}


/* =========================================================
   v52 — Programs-shell parity pass
   Add the missing inner glass + faceplate wrappers so Home,
   Signal Map, and Visual Archive match Programs structurally.
   Also remove the stray Visual Archive hero artifact.
   ========================================================= */

body.home-page .home-shell,
body.map-page .map-shell,
body.visual-page .visual-shell {
  position: relative;
}

body.home-page .shell-glass,
body.map-page .shell-glass,
body.visual-page .shell-glass {
  position: relative;
  padding: clamp(0.55rem, 0.95vw, 0.82rem);
  border-radius: clamp(1.35rem, 2vw, 2.18rem);
  border: 1px solid rgba(239, 211, 151, 0.28);
  background:
    linear-gradient(180deg, rgba(255,244,216,0.14), rgba(255,255,255,0.03) 8%, rgba(0,0,0,0.04) 100%),
    rgba(6, 8, 7, 0.76);
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.72),
    inset 0 1px 0 rgba(255,255,255,0.22),
    inset 0 0 0 1px rgba(255,255,255,0.035),
    inset 0 -24px 42px rgba(0,0,0,0.22);
}

body.home-page .shell-glass::before,
body.map-page .shell-glass::before,
body.visual-page .shell-glass::before {
  content: "";
  position: absolute;
  inset: 0.34rem;
  border-radius: calc(clamp(1.35rem, 2vw, 2.18rem) - 0.18rem);
  pointer-events: none;
  background:
    linear-gradient(116deg, rgba(255,255,255,0.17) 0%, rgba(255,255,255,0.055) 10%, transparent 24%, transparent 72%, rgba(255,255,255,0.045) 100%),
    radial-gradient(circle at 18% 9%, rgba(255,255,255,0.07), transparent 22rem);
  opacity: 0.82;
}

body.home-page .shell-face,
body.map-page .shell-face,
body.visual-page .shell-face {
  position: relative;
  padding: clamp(1rem, 2vw, 1.9rem);
  border-radius: clamp(1rem, 1.5vw, 1.55rem);
  border: 1px solid rgba(238, 207, 142, 0.20);
  background:
    radial-gradient(circle at 18% 4%, rgba(229, 192, 112, 0.09), transparent 24rem),
    radial-gradient(circle at 92% 84%, rgba(107, 127, 91, 0.055), transparent 24rem),
    linear-gradient(180deg, rgba(18,21,19,0.985), rgba(8,11,10,0.99));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.07),
    inset 0 0 0 1px rgba(255,255,255,0.02),
    inset 0 -1px 0 rgba(0,0,0,0.64);
}

/* Make the first structural modules sit inside the faceplate exactly like Programs. */
body.home-page .home-hero-field,
body.map-page .map-intro,
body.visual-page .visual-hero {
  margin-top: 0;
}

body.home-page .home-front-doors,
body.map-page .control-deck,
body.map-page .signal-key-panel,
body.visual-page .visual-jump-nav,
body.home-page .home-featured-shelves,
body.map-page .map-layout,
body.visual-page .visual-section {
  margin-left: 0;
  margin-right: 0;
}

/* Remove stray artifacting on the Visual hero badge. */
body.visual-page .visual-hero-badge {
  display: none;
}

/* Keep the top hero image bay clean and fully contained. */
body.visual-page .visual-hero-card {
  align-items: center;
  justify-content: center;
}

body.visual-page .visual-hero-card img {
  max-width: 100%;
  height: auto;
}



/* Home archive trace — lower-left living instrument panel */
body.home-page .home-archive-load-card {
  display: block;
  padding: clamp(0.9rem, 1.8vw, 1.08rem);
  min-height: 13.5rem;
}

body.home-page .archive-load-console {
  position: relative;
  height: 100%;
  min-height: 11.25rem;
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 0.62rem;
}

body.home-page .archive-load-caption .eyebrow {
  margin-bottom: 0;
}

body.home-page .archive-trace-instrument {
  position: relative;
  display: grid;
  width: calc(100% - 0.24rem);
  margin-left: 0.24rem;
  margin-top: -0.18rem;
  grid-template-columns: minmax(0, 1.34fr) minmax(11rem, 0.96fr);
  gap: 0.85rem;
  align-items: stretch;
  padding: 0.82rem 0.95rem;
  border-radius: 1rem;
  border: 1px solid rgba(226, 197, 132, 0.24);
  background:
    radial-gradient(circle at 22% 12%, rgba(143, 183, 129, 0.08), transparent 14rem),
    linear-gradient(180deg, rgba(255,255,255,0.048), rgba(0,0,0,0.18)),
    rgba(12, 14, 13, 0.88);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.07),
    inset 0 -1px 0 rgba(0,0,0,0.58),
    0 12px 26px rgba(0,0,0,0.24);
}

body.home-page .archive-trace-screw {
  position: absolute;
  width: 0.58rem;
  height: 0.58rem;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.72);
  background:
    linear-gradient(135deg, rgba(243, 220, 168, 0.24), rgba(20, 18, 14, 0.95));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.14),
    0 1px 2px rgba(0,0,0,0.72);
  z-index: 2;
}

body.home-page .archive-trace-screw::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 0.34rem;
  height: 1px;
  background: rgba(17, 13, 8, 0.92);
  transform: translate(-50%, -50%) rotate(-22deg);
  border-radius: 999px;
}

body.home-page .archive-trace-screw.screw-top-left { left: 0.58rem; top: 0.54rem; }
body.home-page .archive-trace-screw.screw-top-right { right: 0.58rem; top: 0.54rem; }
body.home-page .archive-trace-screw.screw-bottom-left { left: 0.58rem; bottom: 0.54rem; }
body.home-page .archive-trace-screw.screw-bottom-right { right: 0.58rem; bottom: 0.54rem; }

body.home-page .archive-trace-face {
  position: relative;
  min-width: 0;
  min-height: 6.25rem;
  margin: 0.1rem 0 0.1rem 0.16rem;
  padding: 0.72rem 0.82rem 0.68rem;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 0.46rem;
  border-radius: 0.92rem;
  border: 1px solid rgba(214, 183, 119, 0.19);
  background:
    radial-gradient(circle at 28% 24%, rgba(255,255,255,0.05), transparent 18%),
    radial-gradient(circle at 72% 50%, rgba(128, 175, 122, 0.08), transparent 44%),
    linear-gradient(180deg, rgba(37, 45, 39, 0.92), rgba(15, 18, 16, 0.96));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.045),
    inset 0 0 0 1px rgba(0,0,0,0.24),
    inset 0 -10px 18px rgba(0,0,0,0.28),
    0 8px 16px rgba(0,0,0,0.32);
  overflow: hidden;
}

body.home-page .archive-trace-label,
body.home-page .archive-trace-state {
  position: relative;
  z-index: 2;
  color: rgba(220, 208, 176, 0.74);
  font-size: 0.54rem;
  line-height: 1;
  font-weight: 900;
  letter-spacing: 0.19em;
  text-transform: uppercase;
}

body.home-page .archive-trace-state {
  color: rgba(188, 205, 178, 0.66);
  align-self: end;
}

body.home-page .archive-trace-track {
  position: relative;
  display: block;
  min-height: 3.16rem;
  border-radius: 0.84rem;
  border: 1px solid rgba(214, 183, 119, 0.18);
  background:
    radial-gradient(circle at 30% 24%, rgba(255,255,255,0.05), transparent 16%),
    linear-gradient(180deg, rgba(31, 40, 34, 0.94), rgba(12, 16, 14, 0.97));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.04),
    inset 0 0 0 1px rgba(0,0,0,0.24),
    inset 0 -6px 12px rgba(0,0,0,0.28),
    0 0 0 1px rgba(0,0,0,0.28);
  overflow: hidden;
}

body.home-page .archive-trace-track::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, transparent calc(50% - 0.5px), rgba(130, 161, 127, 0.22) calc(50% - 0.5px) calc(50% + 0.5px), transparent calc(50% + 0.5px)),
    linear-gradient(0deg, transparent calc(50% - 0.5px), rgba(130, 161, 127, 0.20) calc(50% - 0.5px) calc(50% + 0.5px), transparent calc(50% + 0.5px)),
    repeating-linear-gradient(90deg, transparent 0 1.18rem, rgba(130, 161, 127, 0.10) 1.18rem 1.24rem),
    repeating-linear-gradient(0deg, transparent 0 0.54rem, rgba(130, 161, 127, 0.08) 0.54rem 0.60rem);
  opacity: 0.72;
}

body.home-page .archive-trace-track::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(115deg, rgba(255,255,255,0.11), rgba(255,255,255,0.00) 18%, transparent 32%),
    radial-gradient(circle at 50% 50%, rgba(133, 171, 126, 0.06), transparent 38%);
  opacity: 0.84;
}

body.home-page .archive-trace-line,
body.home-page .archive-trace-pulse {
  position: absolute;
  z-index: 1;
}

body.home-page .archive-trace-line {
  left: 5%;
  right: 5%;
  top: 50%;
  height: 0.96rem;
  transform: translateY(-50%);
  opacity: 0.78;
  background:
    linear-gradient(135deg, transparent 0 9%, rgba(176, 226, 164, 0.82) 9.5% 10.5%, transparent 11% 24%, rgba(176, 226, 164, 0.76) 24.5% 25.5%, transparent 26% 41%, rgba(176, 226, 164, 0.78) 41.5% 42.5%, transparent 43% 58%, rgba(176, 226, 164, 0.72) 58.5% 59.5%, transparent 60% 76%, rgba(176, 226, 164, 0.74) 76.5% 77.5%, transparent 78% 100%);
  clip-path: polygon(0% 66%, 8% 66%, 12% 48%, 18% 66%, 27% 66%, 32% 38%, 39% 62%, 47% 62%, 51% 45%, 59% 60%, 69% 60%, 74% 34%, 81% 68%, 90% 68%, 94% 52%, 100% 52%, 100% 73%, 0% 73%);
  filter: drop-shadow(0 0 5px rgba(179, 228, 166, 0.28));
  animation: drawerTraceHum 4.6s ease-in-out infinite;
}

body.home-page .archive-trace-pulse {
  right: 1.2rem;
  top: 50%;
  width: 0.62rem;
  height: 0.62rem;
  transform: translateY(-50%);
  border-radius: 999px;
  background: rgba(168, 211, 132, 0.98);
  box-shadow:
    0 0 0 1px rgba(21, 30, 16, 0.86),
    0 0 10px rgba(168, 211, 132, 0.58);
  animation: archivePulseGlow 3.8s ease-in-out infinite;
}

body.home-page .archive-load-readouts {
  display: grid;
  gap: 0.52rem;
  align-content: center;
  margin: 0.08rem 0.10rem 0.08rem 0;
}

body.home-page .archive-load-readout {
  display: grid;
  gap: 0.18rem;
  min-height: 2.2rem;
  padding: 0.46rem 0.58rem;
  border-radius: 0.62rem;
  border: 1px solid rgba(226,197,132,0.20);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.045), rgba(0,0,0,0.18)),
    rgba(8, 11, 9, 0.78);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);
}

body.home-page .archive-load-readout span {
  color: rgba(242,221,176,0.78);
  font-size: 0.50rem;
  line-height: 1.1;
  text-transform: uppercase;
  letter-spacing: 0.20em;
  font-weight: 900;
}

body.home-page .archive-load-readout strong {
  color: rgba(174, 214, 142, 0.96);
  font-size: 1.08rem;
  line-height: 1;
  letter-spacing: 0.10em;
  font-weight: 800;
}

body.home-page .archive-load-readout-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.52rem;
}

body.home-page .compact-readout strong {
  font-size: 0.94rem;
}

body.home-page .archive-load-status-readout strong {
  position: relative;
  padding-left: 0.92rem;
}

body.home-page .archive-load-status-readout strong::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 0.48rem;
  height: 0.48rem;
  transform: translateY(-50%);
  border-radius: 999px;
  background: rgba(168, 211, 132, 0.98);
  box-shadow: 0 0 0 1px rgba(21, 30, 16, 0.86), 0 0 10px rgba(168, 211, 132, 0.58);
}

@keyframes archivePulseGlow {
  0%,100% { opacity: 0.76; transform: translateY(-50%) scale(0.95); }
  50% { opacity: 1; transform: translateY(-50%) scale(1.08); }
}

@media (max-width: 1080px) {
  body.home-page .archive-trace-instrument {
    grid-template-columns: 1fr;
  }

  body.home-page .archive-trace-face {
    margin-right: 0.12rem;
  }
}

@media (max-width: 640px) {
  body.home-page .archive-load-readout-pair {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.home-page .archive-trace-line,
  body.home-page .archive-trace-pulse {
    animation: none !important;
  }
}


/* =========================================================
   v53 — Programs top-nav vertical micro-alignment
   Raise the Programs nav capsule slightly so it matches
   Home / Signal Map / Visual Archive.
   ========================================================= */

body.programs-console-page .site-nav {
  position: relative;
  top: -2px;
}
