:root {
  --v31-paper: #f3eee7;
  --v31-paper-2: #eee8e0;
  --v31-paper-3: #e7dfd6;
  --v31-graphite: #282329;
  --v31-secondary: #675d63;
  --v31-micro: #655159;
  --v31-dark: #1b171c;
  --v31-dark-2: #211b21;
  --v31-dark-3: #2a2228;
  --v31-dark-text: #e8e3e6;
  --v31-dark-muted: #aaa1a8;
  --v31-wine: #74243d;
}

body { background: var(--v31-dark); }
.entry, .systems, .field-note, .project { color: var(--v31-dark-text); }
.entry { background: radial-gradient(circle at 76% 24%, rgba(116,36,61,.22), transparent 34%), var(--v31-dark); }
.systems { background: linear-gradient(180deg, var(--v31-dark-2), var(--v31-dark)); }
.field-note { background: var(--v31-dark); }
.project { background: linear-gradient(180deg, var(--v31-dark), var(--v31-dark-3)); }

.chamber, .method {
  color: var(--v31-graphite);
  background: var(--v31-paper);
}
.chamber { box-shadow: 0 -1px var(--v31-paper), 0 1px var(--v31-paper); }
.method { background: linear-gradient(180deg, var(--v31-paper), var(--v31-paper-2)); }
.chamber .sector-head > p, .method .sector-head > p, .chamber .module p, .method li p { color: var(--v31-secondary); }
.chamber .sysline, .method .sysline { color: var(--v31-micro); border-color: rgba(40,35,41,.18); }
.chamber .sysline span:last-child, .method .sysline span:last-child, .chamber .kicker, .method .kicker { color: var(--v31-micro); }
.chamber .module { background: var(--v31-paper-2); border-color: rgba(40,35,41,.16); box-shadow: 0 14px 38px rgba(42,34,40,.07); }
.chamber .module-layer { background: var(--v31-paper-3); border-color: rgba(40,35,41,.16); }
.chamber .module-toggle { color: var(--v31-graphite); }
.method .engine li { border-color: rgba(40,35,41,.17); }
.method .engine li small { color: var(--v31-micro); }

.entry::after, .systems::after, .field-note::after, .method::after {
  content: "";
  position: absolute;
  z-index: 3;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 120px;
  pointer-events: none;
}
.entry::after { height: 220px; transform: translateY(100%); background: linear-gradient(180deg, var(--v31-dark), var(--v31-paper)); }
.systems::after { background: linear-gradient(180deg, transparent, var(--v31-dark)); }
.field-note::after { height: 220px; transform: translateY(100%); background: linear-gradient(180deg, var(--v31-dark), var(--v31-paper)); }
.method::after { transform: translateY(100%); background: linear-gradient(180deg, var(--v31-paper-2), var(--v31-dark)); }

.topline { transition: color .32s ease, background-color .32s ease, border-color .32s ease, box-shadow .32s ease; }
.topline.surface-light {
  color: var(--v31-graphite);
  background: rgba(243,238,231,.9);
  border-color: rgba(40,35,41,.15);
  box-shadow: 0 8px 28px rgba(42,34,40,.06);
}
.topline.surface-light .core-status { color: var(--v31-secondary); }
.topline.surface-light .nav-signal, .topline.surface-light .locale-switch a { border-color: rgba(40,35,41,.17); }

.systems .intro, .project p, .field-note blockquote, .systems-copy > p { color: var(--v31-dark-muted); }
.systems .system-item small, .systems .system-item em, .telemetry-readout, .project .sysline { color: var(--v31-dark-muted); }
.sysline, .kicker { font-size: max(10px, .625rem); }
.sector-head > p, .intro, .module p, .engine li p, .project-copy > p { font-size: clamp(15px, 1.25vw, 19px); }

@media (prefers-reduced-motion: reduce) {
  .topline { transition: none; }
}