/*
  CONTRAST CONTRACT — loaded last and validated by scripts/validate-contrast.mjs.
  Normal text must meet WCAG AAA (7:1). Text never relies on transparency alone.
*/
:root {
  --contrast-bg: #03070c;
  --contrast-surface: #08121c;
  --contrast-surface-raised: #0d1b28;
  --contrast-text: #ffffff;
  --contrast-text-secondary: #e3edf2;
  --contrast-accent: #d8ff6a;
  --contrast-accent-text: #03070c;
  --contrast-cyan: #8eefff;
  --minimum-readable-size: 14px;
}

body { background: var(--contrast-bg) !important; color: var(--contrast-text) !important; }

p, li, dd, small { color: var(--contrast-text-secondary); font-weight: 600; }
h1, h2, h3, h4, strong, b { color: var(--contrast-text); }

.section::before, .architecture::before, .network::before,
.section:nth-of-type(even)::before, .deep-dives::before {
  background: var(--contrast-bg) !important;
  opacity: .96 !important;
}

.city-map, .cutaway, .route, .build-sequence,
.city-stories article, .system-card, .arch-copy,
.dossier-list, .dossier-list article, .deep-dive-topic,
.deep-dive-facts div, .day-timeline article, .stat-row,
.stat-row > div {
  background: var(--contrast-surface) !important;
  color: var(--contrast-text) !important;
}

.city-stories article:hover, .system-card:hover,
.dossier-list article:hover, .deep-dive-topic:hover {
  background: var(--contrast-surface-raised) !important;
}

.map-label, .map-legend, .cut-label, .service span,
.route-note, .earth b, .orbital b, .lunar b,
.build-stage span, .build-stage b, .system-card small,
.day-timeline small, .deep-dive-kicker, .deep-dive-facts dt,
.deep-dive-facts dd, .dossier-kicker, .dossier-list aside,
.stat-row span {
  color: var(--contrast-text) !important;
  font-size: max(var(--minimum-readable-size), .75rem) !important;
  opacity: 1 !important;
  text-shadow: 0 2px 3px #000 !important;
}

.map-label, .cut-label, .route-note,
.earth b, .orbital b, .lunar b {
  padding: 7px 10px !important;
  background: #03070c !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,.42) !important;
}

.title-row > p, .life-head > p, .network-top > p,
.build-head > p, .dossier-head > p, .deep-dives-head > p,
.arch-copy > p, .city-stories p, .deep-dive-copy p,
.dossier-list article > div > p {
  color: #aeb8c0 !important;
  opacity: 1 !important;
}

.section-id, .kicker, .chapter-index-head p,
.deep-dive-number, .stat-row strong {
  color: var(--contrast-accent) !important;
  opacity: 1 !important;
}

.deep-dive-topic h3, .dossier-list h3,
.city-stories h3, .system-card h3 { color: var(--contrast-text) !important; }

a:focus-visible, button:focus-visible {
  outline: 3px solid var(--contrast-accent) !important;
  outline-offset: 4px;
}

.closing {
  background: var(--contrast-bg) !important;
  color: var(--contrast-text) !important;
}

.closing h2, .closing h2 em { color: var(--contrast-text) !important; }

@media (forced-colors: active) {
  * { forced-color-adjust: auto; }
}


/* Text-bearing reveal groups stay fully readable throughout scroll animation. */
.title-row, .life-head, .arch-copy, .network-top, .build-head,
.dossier-head, .deep-dives-head {
  opacity: 1 !important;
}
.title-row h2, .life-head h2, .arch-copy h2, .network-top h2,
.build-head h2, .dossier-head h2, .deep-dives-head h2 {
  color: var(--contrast-text) !important;
  text-shadow: 0 2px 4px #000 !important;
}
.title-row h2 em, .life-head h2 em, .arch-copy h2 em,
.network-top h2 em, .build-head h2 em, .dossier-head h2 em,
.deep-dives-head h2 em {
  color: var(--contrast-accent) !important;
  text-shadow: 0 2px 4px #000 !important;
}


/* Detail pages: keep the WebGL world visible through the first large heading. */
.detail-page .detail-intro {
  min-height: clamp(180px, 22svh, 260px) !important;
  background: linear-gradient(90deg, rgba(3,7,12,.96), rgba(3,7,12,.72) 48%, rgba(3,7,12,.38)) !important;
}
.detail-page main > .detail-intro + :is(.section, .architecture, .network) {
  background: transparent !important;
}
.detail-page main > .detail-intro + :is(.section, .architecture, .network)::before {
  background: linear-gradient(180deg, rgba(3,7,12,.70) 0, rgba(3,7,12,.80) 300px, var(--contrast-bg) 560px) !important;
  opacity: 1 !important;
}
.detail-page main > .detail-intro + .architecture > .arch-copy {
  background: transparent !important;
}
@media (max-width: 650px) {
  .detail-page .detail-intro { min-height: 160px !important; }
  .detail-page main > .detail-intro + :is(.section, .architecture, .network)::before {
    background: linear-gradient(180deg, rgba(3,7,12,.74) 0, rgba(3,7,12,.84) 300px, var(--contrast-bg) 500px) !important;
  }
}


/* Locale-safe CTA: never collapse Japanese or other labels into vertical glyphs. */
.home-page .circle-link {
  display: inline-flex !important;
  width: auto !important;
  min-width: 190px;
  height: 56px !important;
  padding: 0 22px !important;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  white-space: nowrap !important;
  word-break: keep-all;
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
  overflow: visible;
  font-size: 10px !important;
}
.home-page .circle-link b { position: static !important; flex: 0 0 auto; }

/* Dossier metrics are operational data, not decorative low-contrast captions. */
.dossier-list aside {
  padding: 15px 16px !important;
  border-inline-start: 3px solid var(--contrast-accent) !important;
  background: var(--contrast-surface) !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,.28) !important;
}
.dossier-list aside b {
  color: var(--contrast-text) !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
  opacity: 1 !important;
  text-shadow: 0 2px 3px #000 !important;
}
.dossier-list aside span {
  color: var(--contrast-cyan) !important;
  font-size: 12px !important;
  line-height: 1.6 !important;
  opacity: 1 !important;
  text-shadow: 0 2px 3px #000 !important;
}


/* Access signal: restored as a readable, localized hero status panel. */
.home-page .resident-signal {
  display: grid !important;
  position: absolute;
  z-index: 4;
  right: 5vw;
  bottom: 36px;
  width: min(210px, 25vw);
  gap: 3px;
  padding: 0;
  border-inline-start: 0;
  background: transparent;
  box-shadow: none;
}
.home-page .resident-signal span,
.home-page .resident-signal small {
  color: var(--contrast-text-secondary) !important;
  font-size: 12px !important;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: .09em;
  opacity: 1 !important;
  text-shadow: 0 2px 3px #000;
}
.home-page .resident-signal strong {
  color: var(--contrast-text) !important;
  font-size: clamp(25px, 2.6vw, 34px) !important;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -.04em;
  text-shadow: 0 2px 5px rgba(0, 0, 0, .92);
}
@media (max-width: 650px) {
  .home-page .resident-signal { right: 7vw; bottom: 24px; width: min(210px, 62vw); }
}


/* Japanese hero copy has two deliberate lines; never rebalance individual glyphs. */
html:lang(ja) .home-page .hero-copy {
  width: min(1100px, 86vw) !important;
}
html:lang(ja) .home-page .hero h1 {
  max-width: none;
  font-size: clamp(50px, 7.2vw, 128px);
  line-height: .86;
  text-wrap: nowrap;
  white-space: nowrap;
}
@media (max-width: 650px) {
  html:lang(ja) .home-page .hero h1 {
    font-size: clamp(46px, 14vw, 76px);
    line-height: .88;
  }
}

/* CITY ATLAS detail page: neighbourhoods, circulation, and civic scale. */
.detail-city .city-detail {
  position: relative;
  z-index: 2;
  padding: clamp(72px, 9vw, 148px) 5vw;
  background: var(--contrast-bg);
}
.city-detail-intro {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, .65fr);
  gap: 28px clamp(38px, 8vw, 150px);
  align-items: end;
  max-width: 1320px;
  margin: 0 auto 62px;
}
.city-detail-intro > p:first-child {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--contrast-accent) !important;
  font: 700 12px/1.3 var(--mono, monospace);
  letter-spacing: .14em;
}
.city-detail-intro h2 {
  margin: 0;
  color: var(--contrast-text) !important;
  font: 400 clamp(42px, 5.4vw, 86px)/.95 var(--display-font);
  letter-spacing: -.06em;
  text-shadow: 0 2px 4px #000;
}
.city-detail-intro h2 em { color: var(--contrast-cyan) !important; font-style: normal; }
.city-detail-intro > p:last-child {
  margin: 0;
  color: var(--contrast-text-secondary) !important;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.9;
  text-shadow: 0 2px 3px #000;
}
.city-districts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  max-width: 1320px;
  margin: 0 auto;
  border: 1px solid rgba(142,239,255,.46);
  background: rgba(142,239,255,.25);
  gap: 1px;
}
.city-districts article {
  min-height: 280px;
  padding: 26px;
  background: linear-gradient(145deg, rgba(8,19,31,.98), rgba(3,7,12,.98));
}
.city-districts article > span,
.city-circulation header p {
  display: block;
  margin: 0 0 44px;
  color: var(--contrast-accent) !important;
  font: 700 12px/1 var(--mono, monospace);
  letter-spacing: .12em;
  text-shadow: 0 2px 3px #000;
}
.city-districts h3,
.city-circulation h3 {
  margin: 0 0 16px;
  color: var(--contrast-text) !important;
  font: 500 clamp(25px, 2.25vw, 37px)/1 var(--display-font);
  letter-spacing: -.04em;
}
.city-districts p,
.city-circulation article p {
  margin: 0;
  color: var(--contrast-text-secondary) !important;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.85;
  text-shadow: 0 2px 3px #000;
}
.city-circulation {
  max-width: 1320px;
  margin: 80px auto 0;
  border-top: 1px solid rgba(255,255,255,.5);
}
.city-circulation header {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 20px 0;
}
.city-circulation header p { margin: 0; }
.city-circulation header > span { flex: 1; height: 1px; background: rgba(142,239,255,.5); }
.city-circulation > div {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(24px, 4vw, 68px);
}
.city-circulation article > div { display: flex; align-items: center; gap: 12px; margin-bottom: 34px; }
.city-circulation article > div span {
  display: inline-grid;
  width: 42px;
  aspect-ratio: 1;
  place-items: center;
  border: 1px solid var(--contrast-accent);
  color: var(--contrast-accent) !important;
  font: 700 12px/1 var(--mono, monospace);
}
.city-circulation article > div b {
  color: var(--contrast-cyan) !important;
  font: 700 12px/1 var(--mono, monospace);
  letter-spacing: .12em;
}
@media (max-width: 820px) {
  .city-detail-intro { grid-template-columns: 1fr; }
  .city-districts, .city-circulation > div { grid-template-columns: 1fr; }
  .city-districts article { min-height: auto; }
  .city-districts article > span { margin-bottom: 24px; }
}

/* Interactive ARC–01—19 city map. */
.arc-map-section {
  max-width: 1320px;
  margin: 0 auto 88px;
  padding-top: 10px;
}
.arc-map-section > header {
  display: grid;
  grid-template-columns: 1fr minmax(280px, .7fr);
  gap: 36px 8vw;
  align-items: end;
  margin-bottom: 28px;
}
.arc-map-section > header p { margin: 0; color: var(--contrast-text-secondary) !important; font-size: 14px; font-weight: 600; line-height: 1.8; text-shadow: 0 2px 3px #000; }
.arc-map-section > header > div > p { margin-bottom: 13px; color: var(--contrast-accent) !important; font: 700 12px/1.3 var(--mono, monospace); letter-spacing: .14em; }
.arc-map-section > header h3 { margin: 0; color: var(--contrast-text) !important; font: 500 clamp(34px, 4.2vw, 66px)/1 var(--display-font); letter-spacing: -.05em; }
.arc-map-layout { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(280px, .72fr); min-height: 610px; border: 1px solid rgba(142,239,255,.48); background: #03070c; }
.arc-map-plane {
  position: relative;
  min-height: 610px;
  overflow: hidden;
  border-inline-end: 1px solid rgba(142,239,255,.42);
  background:
    radial-gradient(ellipse at 50% 52%, rgba(64,174,208,.23) 0 17%, transparent 18% 33%, rgba(142,239,255,.12) 34% 34.4%, transparent 35%),
    linear-gradient(rgba(142,239,255,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(142,239,255,.07) 1px, transparent 1px),
    linear-gradient(145deg, #07121e, #02060b 72%);
  background-size: auto, 36px 36px, 36px 36px, auto;
}
.arc-map-plane::before, .arc-map-plane::after { content: ""; position: absolute; border: 1px solid rgba(142,239,255,.28); border-radius: 50%; pointer-events: none; }
.arc-map-plane::before { inset: 16% 12% 10%; transform: rotate(-8deg); }
.arc-map-plane::after { inset: 26% 22% 21%; transform: rotate(12deg); border-color: rgba(201,255,106,.35); }
.arc-map-caption { position: absolute; inset: 18px auto auto 20px; z-index: 3; color: var(--contrast-text-secondary) !important; font: 700 10px/1 var(--mono, monospace); letter-spacing: .12em; }
.arc-map-orbit { position: absolute; z-index: 1; right: 3%; top: 46%; width: 12%; border-top: 1px dashed rgba(142,239,255,.62); }
.arc-map-routes { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.arc-map-routes i { position: absolute; left: 50%; top: 48%; width: 34%; border-top: 1px solid rgba(142,239,255,.22); transform-origin: left center; }
.arc-map-routes i:nth-child(1) { transform: rotate(-155deg); width: 39%; }
.arc-map-routes i:nth-child(2) { transform: rotate(-120deg); width: 31%; }
.arc-map-routes i:nth-child(3) { transform: rotate(-62deg); width: 31%; }
.arc-map-routes i:nth-child(4) { transform: rotate(-25deg); width: 38%; }
.arc-map-routes i:nth-child(5) { transform: rotate(25deg); width: 38%; }
.arc-map-routes i:nth-child(6) { transform: rotate(62deg); width: 37%; }
.arc-map-routes i:nth-child(7) { transform: rotate(120deg); width: 37%; }
.arc-map-routes i:nth-child(8) { transform: rotate(155deg); width: 39%; }
.arc-map-node {
  position: absolute;
  z-index: 4;
  left: var(--x);
  top: var(--y);
  display: grid;
  width: 38px;
  aspect-ratio: 1;
  padding: 0;
  place-items: center;
  transform: translate(-50%, -50%);
  border: 1px solid #8eefff;
  border-radius: 50%;
  background: #07101e;
  color: #ffffff;
  cursor: pointer;
  box-shadow: 0 0 0 3px rgba(3,7,12,.72);
  transition: background .18s ease, color .18s ease, box-shadow .18s ease;
}
.arc-map-node span { color: inherit !important; font: 700 11px/1 var(--mono, monospace); }
.arc-map-node:hover, .arc-map-node:focus-visible, .arc-map-node.is-active { border-color: #c9ff6a; background: #c9ff6a; color: #07101e; box-shadow: 0 0 0 4px rgba(3,7,12,.84), 0 0 22px rgba(201,255,106,.44); }
.arc-map-node[data-arc-code="ARC–19"] { border-radius: 3px; border-width: 2px; }
.arc-registry { display: grid; grid-template-rows: auto minmax(0, 1fr); min-width: 0; background: #06101a; }
.arc-registry h4 { margin: 0; padding: 18px; border-bottom: 1px solid rgba(255,255,255,.32); color: var(--contrast-accent) !important; font: 700 12px/1 var(--mono, monospace); letter-spacing: .14em; }
.arc-registry > div { overflow-y: auto; scrollbar-color: #8eefff #06101a; }
.arc-registry-item {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 5px 10px;
  width: 100%;
  min-height: 63px;
  padding: 12px 14px;
  border: 0;
  border-bottom: 1px solid rgba(255,255,255,.22);
  background: #06101a;
  color: #ffffff;
  text-align: start;
  cursor: pointer;
}
.arc-registry-item > span { grid-row: span 2; align-self: center; color: #c9ff6a !important; font: 700 12px/1 var(--mono, monospace); }
.arc-registry-item b { color: #ffffff !important; font-size: 13px; line-height: 1.25; }
.arc-registry-item small { color: #cbd7df !important; font: 700 10px/1.2 var(--mono, monospace); letter-spacing: .07em; }
.arc-registry-item:hover, .arc-registry-item:focus-visible, .arc-registry-item.is-active { background: #17314a; box-shadow: inset 3px 0 #c9ff6a; }
.arc-map-panel {
  display: grid;
  grid-template-columns: .65fr 1.1fr .65fr 1.5fr;
  gap: 24px;
  align-items: center;
  min-height: 142px;
  padding: 24px;
  border: 1px solid rgba(142,239,255,.48);
  border-top: 0;
  background: #0a1724;
}
.arc-map-panel > div { display: grid; gap: 9px; }
.arc-map-panel > div span { color: #c9ff6a !important; font: 700 13px/1 var(--mono, monospace); }
.arc-map-panel > div small { color: #cbd7df !important; font: 700 10px/1.3 var(--mono, monospace); letter-spacing: .08em; }
.arc-map-panel h4 { margin: 0; color: #ffffff !important; font: 500 clamp(24px, 2.4vw, 36px)/1 var(--display-font); letter-spacing: -.04em; }
.arc-map-panel strong { display: grid; gap: 8px; color: #ffffff !important; font: 500 clamp(23px, 2.2vw, 34px)/1 var(--display-font); }
.arc-map-panel strong small { color: #cbd7df !important; font: 700 10px/1 var(--mono, monospace); letter-spacing: .1em; }
.arc-map-panel p { margin: 0; color: var(--contrast-text-secondary) !important; font-size: 14px; font-weight: 600; line-height: 1.75; text-shadow: 0 2px 3px #000; }
@media (max-width: 980px) {
  .arc-map-section > header { grid-template-columns: 1fr; }
  .arc-map-layout { grid-template-columns: 1fr; }
  .arc-map-plane { min-height: 560px; border-inline-end: 0; border-bottom: 1px solid rgba(142,239,255,.42); }
  .arc-registry > div { max-height: 420px; }
  .arc-map-panel { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 620px) {
  .arc-map-plane { min-height: 500px; }
  .arc-map-node { width: 34px; }
  .arc-map-panel { grid-template-columns: 1fr; }
}

/* 3D lunar cutaway replaces the earlier flat ARC diagram. */
.arc-map-layout { min-height: 660px; }
.arc-map-viewport {
  position: relative;
  min-width: 0;
  min-height: 660px;
  overflow: hidden;
  border-inline-end: 1px solid rgba(142,239,255,.42);
  background:
    linear-gradient(rgba(142,239,255,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(142,239,255,.055) 1px, transparent 1px),
    radial-gradient(circle at 50% 45%, #10283a, #03070c 68%);
  background-size: 40px 40px, 40px 40px, auto;
}
.arc-map-viewport::after {
  content: "LUNAR SURFACE / SUBSURFACE CUTAWAY";
  position: absolute;
  inset: auto 18px 16px auto;
  color: #cbd7df;
  font: 700 9px/1 var(--mono, monospace);
  letter-spacing: .12em;
  pointer-events: none;
}
.arc-map-viewport canvas {
  display: block;
  width: 100%;
  height: 660px;
  cursor: grab;
  touch-action: manipulation;
}
.arc-map-viewport canvas:active { cursor: grabbing; }
.arc-map-viewport .arc-map-caption { z-index: 6; }
.arc-depth-legend {
  position: absolute;
  z-index: 6;
  inset: auto auto 18px 18px;
  display: grid;
  gap: 6px;
  width: min(275px, calc(100% - 36px));
  margin: 0;
  padding: 12px 14px;
  list-style: none;
  background: rgba(3,7,12,.88);
  border: 1px solid rgba(142,239,255,.34);
  pointer-events: none;
}
.arc-depth-legend li { display: grid; grid-template-columns: 11px 1fr auto; gap: 9px; align-items: center; }
.arc-depth-legend i { width: 9px; height: 9px; border-radius: 50%; background: #ffffff; box-shadow: 0 0 9px currentColor; }
.arc-depth-legend li[data-band="surface"] i { background: #ffa866; }
.arc-depth-legend li[data-band="service"] i { background: #8eefff; }
.arc-depth-legend li[data-band="habitat"] i { background: #c9ff6a; }
.arc-depth-legend li[data-band="deep"] i { background: #f4f8fb; }
.arc-depth-legend span { color: #ffffff !important; font: 700 10px/1.25 var(--mono, monospace); }
.arc-depth-legend b { color: #cbd7df !important; font: 700 9px/1 var(--mono, monospace); }
.arc-registry-item[data-arc-band="surface"] { border-inline-start: 3px solid #ffa866; }
.arc-registry-item[data-arc-band="service"] { border-inline-start: 3px solid #8eefff; }
.arc-registry-item[data-arc-band="habitat"] { border-inline-start: 3px solid #c9ff6a; }
.arc-registry-item[data-arc-band="deep"] { border-inline-start: 3px solid #f4f8fb; }
.arc-registry-item:hover, .arc-registry-item:focus-visible, .arc-registry-item.is-active { box-shadow: none; background: #17314a; }
.arc-map-panel { grid-template-columns: .55fr 1fr .6fr .85fr 1.45fr; }
.arc-map-depth { gap: 5px !important; }
.arc-map-depth > span { color: #8eefff !important; font: 700 11px/1.25 var(--mono, monospace); letter-spacing: .05em; }
.arc-map-depth > b { color: #ffffff !important; font: 500 clamp(19px, 1.6vw, 27px)/1.1 var(--display-font); }
.arc-map-webgl-unavailable .arc-map-viewport::before {
  content: "3D MAP / WEBGL UNAVAILABLE";
  position: absolute;
  z-index: 7;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
  color: #ffffff;
  font: 700 12px/1 var(--mono, monospace);
}
@media (max-width: 1120px) {
  .arc-map-panel { grid-template-columns: 1fr 1fr; }
  .arc-map-panel > p { grid-column: 1 / -1; }
}
@media (max-width: 980px) {
  .arc-map-viewport { min-height: 580px; border-inline-end: 0; border-bottom: 1px solid rgba(142,239,255,.42); }
  .arc-map-viewport canvas { height: 580px; }
}
@media (max-width: 620px) {
  .arc-map-viewport, .arc-map-viewport canvas { min-height: 520px; height: 520px; }
  .arc-depth-legend { inset-inline: 12px; bottom: 12px; width: auto; }
  .arc-map-panel { grid-template-columns: 1fr; }
  .arc-map-panel > p { grid-column: auto; }
}
/* ARC registry: compact two-column role index aligned to the 3D viewport. */
.arc-map-layout {
  grid-template-columns: minmax(0, 1.35fr) minmax(430px, 1fr);
  height: 660px;
  min-height: 660px;
  max-height: 660px;
}
.arc-map-viewport { height: 660px; min-height: 0; }
.arc-map-viewport canvas { height: 100%; touch-action: none; }
.arc-registry { min-height: 0; overflow: hidden; }
.arc-registry > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(10, minmax(0, 1fr));
  min-height: 0;
  overflow: hidden;
}
.arc-registry-item {
  grid-template-columns: 44px 56px minmax(0, 1fr);
  grid-template-rows: 1fr;
  gap: 8px;
  min-height: 0;
  padding: 7px 9px;
  border-inline-end: 1px solid rgba(255,255,255,.18);
}
.arc-role-icon {
  grid-column: 1;
  grid-row: 1;
  align-self: center;
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border: 1px solid #8eefff;
  border-radius: 4px;
  color: #ffffff;
  font: 700 22px/1 var(--mono, monospace);
}
.arc-registry-item > span { grid-column: 2; grid-row: 1; align-self: center; color: #c9ff6a !important; font: 700 11px/1 var(--mono, monospace); }
.arc-registry-item b { grid-column: 3; grid-row: 1; align-self: center; font-size: 14px; }
.arc-map-compass {
  position: absolute;
  z-index: 7;
  inset: 18px 18px auto auto;
  width: 70px;
  height: 70px;
  border: 1px solid rgba(142,239,255,.6);
  border-radius: 50%;
  background: rgba(3,7,12,.88);
  color: #ffffff;
  pointer-events: none;
}
.arc-map-compass::before, .arc-map-compass::after { content: ""; position: absolute; inset: 50% 9px auto; border-top: 1px solid rgba(142,239,255,.35); }
.arc-map-compass::after { transform: rotate(90deg); }
.arc-map-compass > i { position: absolute; inset: 5px; display: block; font-style: normal; transform-origin: center; }
.arc-map-compass :is(b, span, small, em) { position: absolute; color: #ffffff !important; font: 700 10px/1 var(--mono, monospace); font-style: normal; text-shadow: 0 2px 3px #000; }
.arc-map-compass b { inset: 0 auto auto 50%; color: #c9ff6a !important; transform: translateX(-50%); }
.arc-map-compass span { inset: 50% 0 auto auto; transform: translateY(-50%); }
.arc-map-compass small { inset: auto auto 0 50%; transform: translateX(-50%); }
.arc-map-compass em { inset: 50% auto auto 0; transform: translateY(-50%); }
.arc-registry-item[data-arc-metric-kind="resident"] .arc-role-icon { border-color: #c9ff6a; color: #c9ff6a; background: #14220e; }
.arc-registry-item[data-arc-metric-kind="worker"] .arc-role-icon { border-color: #8eefff; color: #8eefff; background: #071b24; }
.arc-registry-item[data-arc-metric-kind="resident"]:is(:hover, :focus-visible, .is-active) .arc-role-icon { border-color: #c9ff6a; background: #c9ff6a; color: #07101e; }
.arc-registry-item[data-arc-metric-kind="worker"]:is(:hover, :focus-visible, .is-active) .arc-role-icon { border-color: #8eefff; background: #8eefff; color: #07101e; }
.arc-role-civic::before { content: "◎"; }
.arc-role-home::before { content: "⌂"; }
.arc-role-school::before { content: "▤"; }
.arc-role-care::before { content: "+"; }
.arc-role-culture::before { content: "◇"; }
.arc-role-sport::before { content: "◉"; }
.arc-role-repair::before { content: "✦"; }
.arc-role-transit::before { content: "↔"; }
.arc-role-garden::before { content: "✤"; }
.arc-role-food::before { content: "◒"; }
.arc-role-air::before { content: "≈"; }
.arc-role-power::before { content: "ϟ"; }
.arc-role-recycle::before { content: "↻"; }
.arc-role-safety::before { content: "△"; }
.arc-role-build::before { content: "▰"; }
.arc-role-quiet::before { content: "○"; }
.arc-role-port::before { content: "↗"; }
@media (max-width: 980px) {
  .arc-map-layout { height: auto; min-height: 0; max-height: none; grid-template-columns: 1fr; }
  .arc-map-viewport { height: 580px; min-height: 580px; }
  .arc-registry { height: 480px; }
  .arc-registry > div { grid-template-rows: repeat(10, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .arc-map-viewport { height: 520px; min-height: 520px; }
  .arc-registry { height: 620px; }
  .arc-registry > div { grid-template-columns: 1fr; grid-template-rows: repeat(19, minmax(0, 1fr)); overflow-y: auto; }
}






/* Minimum type size: small interface text must remain legible on dense pages. */
body { font-weight: 500; }
.section-id, .kicker, footer,
.detail-intro a, .detail-intro p,
.language-switcher, .sector-menu-link,
.day-timeline time, .day-timeline small,
.life-story-time > span, .life-story-time > small,
.life-story-hero > div:nth-child(2) > p:first-child,
.life-story-facts > h2, .life-story-facts dt,
.life-story-pagination span {
  font-size: max(var(--minimum-readable-size), .875rem) !important;
  font-weight: 700 !important;
}
.day-timeline time { font-size: 16px !important; }
.day-timeline p {
  color: var(--contrast-text-secondary) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 2 !important;
}
.life-head > p { color: var(--contrast-text-secondary) !important; font-size: 16px !important; font-weight: 600 !important; }