:root {
  --ink: #f6f7fb;
  --muted: #b8c0cf;
  --quiet: #818b9e;
  --ground: #07090e;
  --panel: #11151e;
  --panel-2: #171d29;
  --line: #303849;
  --cyan: #5ce7e7;
  --cyan-dark: #123f47;
  --gold: #f6c75b;
  --rose: #ff7f9f;
  --green: #7ce8ad;
  --red: #ff8d8d;
  --violet: #b8a0ff;
  --max: 1220px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--ground);
  color-scheme: dark;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: auto;
}

body {
  margin: 0;
  background:
    radial-gradient(circle at 78% 8%, rgba(64, 210, 215, .12), transparent 31rem),
    radial-gradient(circle at 15% 28%, rgba(142, 99, 255, .09), transparent 30rem),
    var(--ground);
  color: var(--ink);
  line-height: 1.55;
}

a {
  color: var(--cyan);
}

a:hover {
  color: #a8ffff;
}

button,
input,
select,
textarea {
  font: inherit;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

:focus-visible {
  outline: 3px solid var(--gold);
  outline-offset: 4px;
}

.skip-link {
  position: fixed;
  z-index: 99;
  top: .75rem;
  left: .75rem;
  padding: .7rem 1rem;
  border-radius: .4rem;
  background: var(--gold);
  color: #111;
  transform: translateY(-180%);
}

.skip-link:focus {
  transform: translateY(0);
}

.site-header {
  position: relative;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  width: min(var(--max), calc(100% - 2rem));
  margin: 0 auto;
  padding: 1.1rem 0;
  border-bottom: 1px solid rgba(255,255,255,.12);
}

.brand {
  display: inline-flex;
  gap: .8rem;
  align-items: center;
  color: var(--ink);
  text-decoration: none;
}

.brand-mark {
  display: grid;
  width: 2.6rem;
  aspect-ratio: 1;
  place-items: center;
  border: 1px solid var(--cyan);
  border-radius: 50%;
  color: var(--cyan);
  font-family: Georgia, serif;
  font-size: 1.4rem;
  box-shadow: 0 0 2rem rgba(92,231,231,.2);
}

.brand strong,
.brand small {
  display: block;
}

.brand small {
  color: var(--muted);
  font-size: .7rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}

nav {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

nav a {
  color: var(--muted);
  font-size: .88rem;
  text-decoration: none;
}

main {
  width: min(var(--max), calc(100% - 2rem));
  margin: 0 auto;
}

.loading {
  min-height: 60vh;
  display: grid;
  place-items: center;
  color: var(--muted);
}

.hero {
  position: relative;
  overflow-x: clip;
  padding: clamp(4rem, 9vw, 8rem) 0;
}

.hub-hero::after,
.epoch9-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 8% 0 auto auto;
  width: min(46vw, 34rem);
  aspect-ratio: 1;
  border: 1px solid rgba(92,231,231,.22);
  border-radius: 50%;
  background:
    repeating-radial-gradient(circle, transparent 0 1.55rem, rgba(92,231,231,.08) 1.6rem 1.65rem),
    conic-gradient(from 45deg, transparent, rgba(184,160,255,.16), transparent, rgba(92,231,231,.16), transparent);
  filter: blur(.2px);
  transform: rotate(-14deg);
}

.eyebrow {
  margin: 0 0 .75rem;
  color: var(--cyan);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .73rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
}

h1,
h2,
h3,
p {
  max-width: 70ch;
}

h1,
h2,
h3 {
  line-height: 1.08;
}

h1 {
  max-width: 12ch;
  margin: 0;
  font-size: clamp(3rem, 8vw, 7.6rem);
  letter-spacing: -.065em;
  overflow-wrap: anywhere;
}

h2 {
  margin: 0;
  font-size: clamp(1.8rem, 4vw, 3.4rem);
  letter-spacing: -.04em;
}

h3 {
  margin: 0;
  font-size: 1.1rem;
}

.lede {
  max-width: 54rem;
  margin: 1.7rem 0;
  color: #d5dae4;
  font-size: clamp(1.05rem, 2.2vw, 1.45rem);
}

.hero-actions,
.control-row {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: 1.5rem;
}

.button {
  display: inline-flex;
  min-height: 2.8rem;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--line);
  border-radius: .45rem;
  padding: .7rem 1rem;
  background: var(--panel);
  color: var(--ink);
  cursor: pointer;
  font-weight: 750;
  text-decoration: none;
}

.button:hover:not(:disabled) {
  border-color: var(--cyan);
  color: #fff;
  transform: translateY(-1px);
}

.button:disabled {
  cursor: not-allowed;
  opacity: .45;
}

.button.primary {
  border-color: var(--cyan);
  background: var(--cyan);
  color: #071114;
}

.button.secondary {
  border-color: var(--violet);
  background: rgba(184,160,255,.13);
}

.button.verify {
  width: 100%;
  border-color: var(--green);
  background: var(--green);
  color: #07140d;
}

.button.ghost {
  background: rgba(10,13,19,.55);
}

.hero-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  max-width: 64rem;
  margin: 4rem 0 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.hero-metrics div {
  padding: 1.1rem;
  border-right: 1px solid var(--line);
}

.hero-metrics div:last-child {
  border-right: 0;
}

.hero-metrics dt,
.metric-strip dt,
.probability-results dt {
  color: var(--quiet);
  font-size: .72rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.hero-metrics dd,
.metric-strip dd,
.probability-results dd {
  margin: .25rem 0 0;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-weight: 750;
}

.integrity-note {
  display: flex;
  gap: 1.2rem;
  align-items: flex-start;
  margin: 1rem 0 7rem;
  padding: 1.5rem;
  border: 1px solid #594d28;
  border-radius: .7rem;
  background: rgba(246,199,91,.07);
}

.integrity-note h2 {
  font-size: 1.25rem;
}

.integrity-note p {
  margin: .35rem 0 0;
  color: var(--muted);
}

.archive-column {
  display: grid;
  gap: 1rem;
  min-width: 0;
}

.compact-replay {
  min-height: 14rem;
}

.compact-replay iframe {
  min-height: 18rem;
}

.signal-dot {
  flex: 0 0 auto;
  width: .8rem;
  height: .8rem;
  margin-top: .25rem;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 1.2rem var(--gold);
}

.section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 2rem;
  margin: 0 0 2rem;
}

.section-heading > p {
  color: var(--muted);
}

.section-heading.compact {
  margin-bottom: 1.2rem;
}

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

.epoch-card {
  position: relative;
  display: flex;
  min-height: 22rem;
  flex-direction: column;
  border: 1px solid var(--line);
  border-radius: .65rem;
  padding: 1.25rem;
  background: linear-gradient(145deg, rgba(23,29,41,.95), rgba(10,13,19,.95));
}

.epoch-card.featured {
  border-color: var(--cyan);
  box-shadow: 0 0 2.5rem rgba(92,231,231,.1);
}

.epoch-number {
  color: var(--quiet);
  font-family: Georgia, serif;
  font-size: 3.3rem;
  line-height: 1;
}

.epoch-card h3 {
  margin: 1.2rem 0 .7rem;
  font-size: 1.45rem;
}

.epoch-card p {
  color: var(--muted);
}

.epoch-card .button {
  align-self: flex-start;
  margin-top: auto;
}

.badge-row {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
}

.badge {
  display: inline-flex;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: .28rem .62rem;
  background: var(--panel);
  color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.badge.verified {
  border-color: var(--green);
  color: var(--green);
}

.badge.partial {
  border-color: var(--gold);
  color: var(--gold);
}

.badge.rejected {
  border-color: var(--red);
  color: var(--red);
}

.badge.candidate,
.badge.unaudited {
  border-color: var(--violet);
  color: #d6caff;
}

.badge.hold {
  border-color: var(--gold);
  color: var(--gold);
}

.badge.pass {
  border-color: var(--green);
  color: var(--green);
}

.badge.fail {
  border-color: var(--red);
  color: var(--red);
}

.badge.not-applicable {
  border-color: var(--quiet);
  color: var(--quiet);
}

.comparison,
.probability-lab,
.math-wall,
.limits-panel,
.ooda-detail {
  margin: 7rem 0;
}

.table-scroll {
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: .65rem;
}

table {
  width: 100%;
  min-width: 920px;
  border-collapse: collapse;
  background: rgba(17,21,30,.82);
}

th,
td {
  padding: 1rem;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}

th {
  color: var(--cyan);
  font-size: .72rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}

td {
  color: var(--muted);
  font-size: .88rem;
}

.exhibit-hero h1 {
  max-width: 17ch;
  font-size: clamp(2.8rem, 7vw, 6.5rem);
}

.credit-line {
  margin-top: 2rem;
  color: var(--muted);
}

.wall-grid,
.evidence-columns,
.use-grid,
.layer-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  margin: 0 0 5rem;
}

.wall-grid article,
.evidence-columns article,
.use-grid article,
.layer-grid article {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: .65rem;
  padding: 1.35rem;
  background: rgba(17,21,30,.82);
  overflow-wrap: anywhere;
}

.wall-grid h2,
.evidence-columns h2 {
  font-size: 1.35rem;
}

.wall-grid ul,
.evidence-columns ul,
.limits-panel ul {
  padding-left: 1.2rem;
  color: var(--muted);
}

li + li {
  margin-top: .65rem;
}

.panel-index {
  color: var(--cyan);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.legacy-replay {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: 2rem;
  align-items: center;
  margin: 5rem 0;
  padding: clamp(1.2rem, 3vw, 2rem);
  border: 1px solid var(--line);
  border-radius: .8rem;
  background: var(--panel);
}

.legacy-replay p,
.evidence-columns p {
  color: var(--muted);
}

.replay-slot {
  display: grid;
  min-height: 25rem;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: .55rem;
  background: #050608;
  color: var(--quiet);
}

.replay-slot iframe {
  width: 100%;
  min-height: 31rem;
  border: 0;
  background: #fff;
}

.fact-list,
.ooda-grid {
  margin: 1rem 0 0;
}

.fact-list div,
.ooda-grid div {
  padding: .7rem 0;
  border-bottom: 1px solid var(--line);
}

.fact-list dt,
.ooda-grid dt {
  color: var(--cyan);
  font-size: .73rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.fact-list dd,
.ooda-grid dd {
  margin: .2rem 0 0;
  color: var(--muted);
  overflow-wrap: anywhere;
}

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

.ooda-grid div {
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: .55rem;
  background: var(--panel);
}

.layer-key {
  margin: -1.5rem 0 5rem;
}

.layer-key > h2 {
  margin-bottom: 1.5rem;
  font-size: 1.4rem;
}

.layer-grid article {
  position: relative;
  overflow: hidden;
}

.layer-grid article > span {
  position: absolute;
  right: .8rem;
  top: .25rem;
  color: rgba(255,255,255,.07);
  font-family: Georgia, serif;
  font-size: 5rem;
}

.layer-grid p,
.use-grid p {
  color: var(--muted);
}

.instrument {
  margin: 0 0 7rem;
  padding: clamp(1rem, 3vw, 2rem);
  border: 1px solid var(--line);
  border-radius: .8rem;
  background: linear-gradient(145deg, rgba(17,21,30,.96), rgba(8,11,16,.98));
}

.instrument-grid {
  display: grid;
  grid-template-columns: minmax(18rem, .78fr) minmax(0, 1.22fr);
  gap: 1.2rem;
}

.control-panel {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 1.2rem;
  border: 1px solid var(--line);
  border-radius: .65rem;
  background: rgba(7,9,14,.72);
}

.field {
  display: grid;
  gap: .45rem;
  min-width: 0;
}

.field label,
legend {
  color: #e9ecf3;
  font-size: .83rem;
  font-weight: 750;
}

.field label span,
.field output {
  float: right;
  color: var(--cyan);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .74rem;
}

textarea,
input[type="number"],
select {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  border: 1px solid var(--line);
  border-radius: .4rem;
  padding: .7rem;
  background: #090c12;
  color: var(--ink);
}

textarea {
  resize: vertical;
}

input[type="range"] {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  accent-color: var(--cyan);
}

.hint {
  margin: 0;
  color: var(--quiet);
  font-size: .76rem;
}

fieldset {
  margin: 0;
  border: 1px solid var(--line);
  border-radius: .5rem;
  padding: 1rem;
}

legend {
  padding: 0 .35rem;
}

.split-fields {
  display: grid;
  grid-template-columns: 1fr .72fr .72fr;
  gap: .75rem;
  margin-bottom: .8rem;
}

.visual-panel {
  position: relative;
  min-height: 31rem;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: .65rem;
  background:
    radial-gradient(circle at center, rgba(18,63,71,.7), rgba(5,7,11,.98) 65%),
    #05070b;
}

#constellation {
  display: block;
  width: 100%;
  height: 31rem;
}

.canvas-overlay {
  position: absolute;
  top: .8rem;
  left: .8rem;
  right: .8rem;
  display: flex;
  justify-content: space-between;
  color: #cbd7e4;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .68rem;
  letter-spacing: .07em;
  text-transform: uppercase;
  pointer-events: none;
}

.motion-button {
  position: absolute;
  right: .8rem;
  bottom: .8rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: .55rem .8rem;
  background: rgba(7,9,14,.88);
  color: var(--ink);
  cursor: pointer;
}

.status-panel {
  display: flex;
  gap: .9rem;
  align-items: center;
  margin: 1rem 0;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: .55rem;
  background: var(--panel-2);
}

.status-panel p {
  margin: .15rem 0 0;
  color: var(--muted);
  font-size: .86rem;
}

.status-panel.success {
  border-color: var(--green);
  background: rgba(54,148,94,.11);
}

.status-panel.failure {
  border-color: var(--red);
  background: rgba(180,54,54,.11);
}

.status-panel.working {
  border-color: var(--cyan);
}

.status-icon {
  font-size: 1.5rem;
}

.metric-strip,
.probability-results {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin: 1rem 0;
  border: 1px solid var(--line);
  border-radius: .55rem;
  background: rgba(7,9,14,.72);
}

.metric-strip div,
.probability-results div {
  padding: .8rem;
  border-right: 1px solid var(--line);
}

.metric-strip div:last-child,
.probability-results div:last-child {
  border-right: 0;
}

.receiver {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  align-items: center;
  margin: 1rem 0 2rem;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: .55rem;
}

.receiver h3 {
  font-size: 1rem;
}

.receiver pre {
  min-height: 4.5rem;
  margin: 0;
  padding: 1rem;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
  border-radius: .4rem;
  background: #05070b;
  color: var(--green);
}

.bit-strip {
  display: grid;
  grid-template-columns: repeat(24, minmax(.8rem, 1fr));
  gap: .25rem;
  padding: 0;
  list-style: none;
}

.bit-strip li {
  display: grid;
  min-height: 2.2rem;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: .25rem;
  color: var(--quiet);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .7rem;
}

.bit-strip li.one {
  border-color: var(--cyan);
  background: rgba(92,231,231,.14);
  color: #dfffff;
}

.bit-strip li.flipped {
  border-color: var(--rose);
  box-shadow: inset 0 0 0 1px var(--rose);
}

.math-wall,
.probability-lab,
.limits-panel {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: clamp(2rem, 6vw, 6rem);
  align-items: start;
  padding: clamp(1.25rem, 4vw, 3rem);
  border: 1px solid var(--line);
  border-radius: .8rem;
  background: rgba(17,21,30,.78);
}

.formula-stack {
  display: grid;
  gap: .75rem;
}

.formula-stack p {
  margin: 0;
  padding: 1rem;
  border-left: 2px solid var(--cyan);
  background: #090c12;
}

.formula-stack span,
.formula-stack small {
  display: block;
}

.formula-stack span {
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.15rem, 2.4vw, 1.8rem);
}

.formula-stack small {
  margin-top: .25rem;
  color: var(--quiet);
}

.probability-lab {
  grid-template-columns: 1fr 1fr;
}

.probability-results {
  grid-column: 1 / -1;
  grid-template-columns: repeat(3, 1fr);
}

.use-grid article > span {
  color: var(--cyan);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .7rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.use-grid h3 {
  margin-top: .8rem;
}

.limits-panel {
  border-color: #594d28;
}

.review-hero {
  padding-bottom: clamp(3rem, 7vw, 5rem);
}

.review-tabs {
  position: sticky;
  z-index: 4;
  top: 0;
  display: flex;
  gap: .35rem;
  margin: 0 0 3rem;
  padding: .65rem;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: .65rem;
  background: rgba(7, 9, 14, .96);
  scrollbar-width: thin;
}

.review-tabs button {
  flex: 0 0 auto;
  border: 1px solid transparent;
  border-radius: 999px;
  padding: .55rem .85rem;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font-size: .82rem;
  font-weight: 760;
}

.review-tabs button[aria-selected="true"] {
  border-color: var(--cyan);
  background: var(--cyan-dark);
  color: var(--ink);
}

.review-panel {
  min-height: 32rem;
  scroll-margin-top: 5rem;
}

.review-panel[hidden] {
  display: none;
}

.media-filters,
.visual-mode-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin: 0 0 1.25rem;
}

[data-media-category] {
  margin: 0 0 4rem;
}

[data-media-category][hidden] {
  display: none;
}

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

.category-card,
.media-card {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: .7rem;
  background: rgba(17, 21, 30, .9);
}

.category-card {
  min-height: 12rem;
  padding: 1.2rem;
}

.category-card p {
  color: var(--muted);
}

.category-count {
  display: block;
  margin-bottom: 1.5rem;
  color: var(--cyan);
  font-family: Georgia, serif;
  font-size: 2.8rem;
  line-height: 1;
}

.media-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

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

.review-media {
  display: block;
  width: 100%;
  max-width: 100%;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: #030407;
}

img.review-media,
video.review-media {
  aspect-ratio: 16 / 10;
  object-fit: contain;
}

audio.review-media {
  min-height: 4rem;
  padding: .75rem;
}

.media-card-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 1rem;
  min-width: 0;
  padding: 1.1rem;
}

.media-card-body .badge-row {
  gap: .4rem;
}

.badge.unreviewed {
  border-color: var(--gold);
  color: var(--gold);
}

.badge.artifact-only {
  border-color: var(--violet);
  color: #d6caff;
}

.badge.sample {
  border-color: var(--line);
  color: var(--muted);
}

.badge.transcript-not-retained {
  border-color: var(--red);
  color: var(--red);
}

.badge.visual-description-present,
.badge.silent-visual-description-present {
  border-color: var(--green);
  color: var(--green);
}

.media-description {
  margin: 0;
  color: var(--muted);
}

.media-accessibility {
  margin: 0;
  padding: .7rem;
  border-left: .2rem solid var(--line);
  color: var(--muted);
  font-size: .82rem;
}

.media-facts {
  margin: 0;
}

.media-facts div {
  display: grid;
  grid-template-columns: minmax(5rem, .35fr) minmax(0, 1fr);
  gap: .6rem;
  padding: .45rem 0;
  border-bottom: 1px solid var(--line);
}

.media-facts dt {
  color: var(--quiet);
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.media-facts dd {
  min-width: 0;
  margin: 0;
  color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .72rem;
  overflow-wrap: anywhere;
}

.hash-value,
code {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.media-card details {
  color: var(--muted);
  font-size: .8rem;
}

.media-card summary {
  cursor: pointer;
  color: var(--cyan);
}

.alias-list {
  padding-left: 1.1rem;
}

.download-link {
  align-self: flex-start;
  margin-top: auto;
}

.brand-chooser {
  display: block;
  margin: 0 0 3rem;
}

.chooser-controls {
  display: flex;
  min-width: 0;
  margin: 0;
  flex-direction: column;
  gap: .65rem;
  padding: 1.2rem;
  border: 1px solid var(--line);
  border-radius: .7rem;
  background: var(--panel);
}

.chooser-controls legend {
  padding: 0 .35rem;
  color: var(--ink);
  font-weight: 760;
}

.chooser-controls label {
  margin-top: .55rem;
  color: var(--cyan);
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.chooser-controls select {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: .4rem;
  padding: .7rem;
  background: #090c12;
  color: var(--ink);
}

.brand-preview {
  position: relative;
  display: grid;
  min-height: 28rem;
  margin: 0;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: .7rem;
  isolation: isolate;
  background: #050608;
}

.brand-preview::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  background: rgba(2, 5, 10, .48);
}

.brand-preview img {
  grid-area: 1 / 1;
}

#chooser-background {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#chooser-logo {
  z-index: 2;
  width: min(48%, 20rem);
  aspect-ratio: 1;
  border-radius: 1rem;
  object-fit: cover;
  box-shadow: 0 1rem 4rem rgba(0, 0, 0, .58);
}

.brand-preview figcaption {
  position: absolute;
  z-index: 3;
  inset: auto .8rem .8rem;
  padding: .55rem .75rem;
  border-radius: .35rem;
  background: rgba(2, 5, 10, .85);
  color: var(--ink);
  font-size: .75rem;
}

.lab-hero {
  padding-bottom: clamp(2.5rem, 6vw, 5rem);
}

.lab-hero h1 {
  max-width: 16ch;
  font-size: clamp(2.8rem, 7vw, 6.5rem);
}

.learning-shell {
  margin: 0 0 5rem;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: .85rem;
  background: linear-gradient(145deg, rgba(17, 21, 30, .96), rgba(8, 11, 16, .98));
}

.learning-intro {
  display: grid;
  grid-template-columns: minmax(12rem, .36fr) minmax(0, 1fr);
  gap: 1.5rem;
  padding: 1.25rem;
  border-bottom: 1px solid var(--line);
}

.learning-intro > div {
  color: var(--cyan);
  font-weight: 850;
  letter-spacing: -.02em;
}

.learning-intro p {
  margin: 0;
  color: var(--muted);
}

.lens-tabs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: .4rem;
  padding: .65rem;
  border-bottom: 1px solid var(--line);
}

.lens-tab {
  min-height: 3rem;
  border: 1px solid transparent;
  border-radius: .45rem;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font-weight: 800;
}

.lens-tab[aria-selected="true"] {
  border-color: var(--cyan);
  background: var(--cyan-dark);
  color: var(--ink);
}

.lens-panel {
  min-height: 21rem;
  padding: clamp(1.2rem, 4vw, 2.5rem);
}

.lens-panel[hidden] {
  display: none;
}

.lens-panel > p {
  color: var(--muted);
}

.coach-card {
  position: relative;
  margin-top: 1.5rem;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: .65rem;
  padding: 1.25rem;
  background: rgba(7, 9, 14, .74);
}

.coach-card h3 {
  font-size: clamp(1.35rem, 3vw, 2rem);
}

.coach-instruction {
  color: var(--muted);
}

.coach-progress {
  height: .35rem;
  margin: 1.4rem 0;
  overflow: hidden;
  border-radius: 999px;
  background: var(--line);
}

.coach-progress::before {
  display: block;
  width: var(--progress, 20%);
  height: 100%;
  background: linear-gradient(90deg, var(--cyan), var(--violet));
  content: "";
}

.coach-actions,
.studio-actions,
.receipt-links,
.toolbar-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
}

.mission-grid,
.learning-application-grid,
.audit-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 1.5rem;
}

.mission-card,
.application-card,
.audit-grid article {
  border: 1px solid var(--line);
  border-radius: .65rem;
  padding: 1.2rem;
  background: rgba(7, 9, 14, .72);
}

.mission-card.active {
  border-color: var(--violet);
}

.mission-card.complete {
  border-color: var(--green);
  background: rgba(54, 148, 94, .09);
}

.mission-card p,
.application-card p,
.audit-grid p {
  color: var(--muted);
}

.mission-status,
.application-card > span,
.audit-grid article > span {
  display: block;
  margin-bottom: .65rem;
  color: var(--cyan);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.revision-ledger,
.audit-limits {
  margin-top: 1.5rem;
  border-top: 1px solid var(--line);
  padding-top: 1.5rem;
}

.revision-ledger ol {
  display: grid;
  gap: .75rem;
  padding: 0;
  list-style: none;
}

.revision-ledger li {
  border-left: .2rem solid var(--line);
  padding: .8rem 1rem;
  background: rgba(7, 9, 14, .65);
}

.revision-ledger li.revision-rejected {
  border-color: var(--red);
}

.revision-ledger li.revision-current,
.revision-ledger li.revision-candidate {
  border-color: var(--cyan);
}

.revision-ledger p {
  margin: .25rem 0;
  color: var(--muted);
}

.lab-workbench {
  margin-bottom: 6rem;
  border: 1px solid var(--line);
  border-radius: .85rem;
  padding: clamp(1rem, 3vw, 2rem);
  background: linear-gradient(145deg, rgba(17, 21, 30, .96), rgba(8, 11, 16, .98));
}

.visual-mode-tabs {
  border-bottom: 1px solid var(--line);
  padding-bottom: .8rem;
}

.visual-mode-tabs button {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: .55rem .8rem;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
}

.visual-mode-tabs button[aria-selected="true"] {
  border-color: var(--cyan);
  background: var(--cyan-dark);
  color: var(--ink);
}

.structured-json {
  max-block-size: 28rem;
  overflow: auto;
  white-space: pre;
  font-size: .72rem;
  line-height: 1.45;
}

.state-export,
.epoch9-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  flex-wrap: wrap;
  margin-block: .85rem;
}

.proof-step-list li:target {
  outline: 2px solid var(--gold);
  outline-offset: .25rem;
}

.epoch-nine[data-visual-mode="math"] #constellation {
  filter: saturate(.72) contrast(1.12);
}

.epoch-nine[data-visual-mode="art"] #constellation {
  filter: saturate(1.35) hue-rotate(18deg);
}

.epoch-nine[data-visual-mode="state"] #constellation {
  filter: grayscale(.4) contrast(1.2);
}

.lab-toolbar {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 1.25rem;
}

.lab-grid {
  display: grid;
  grid-template-columns: minmax(16rem, .42fr) minmax(0, 1fr);
  gap: 1.1rem;
}

.lab-control-panel {
  min-width: 0;
  position: relative;
  z-index: 1;
}

.scene-column {
  min-width: 0;
  position: relative;
  z-index: 0;
}

.scene-frame {
  position: relative;
  min-height: 35rem;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: .65rem;
  background: #05070d;
}

#epoch-canvas {
  display: block;
  width: 100%;
  height: 35rem;
  touch-action: none;
  cursor: grab;
}

#epoch-canvas:active {
  cursor: grabbing;
}

.scene-overlay {
  position: absolute;
  inset: .75rem .75rem auto;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  color: rgba(237, 245, 255, .86);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .64rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  pointer-events: none;
}

.scene-description {
  margin: .7rem 0 0;
  color: var(--muted);
}

.structured-data {
  margin-top: 1rem;
  color: var(--muted);
}

.structured-data summary {
  cursor: pointer;
  color: var(--cyan);
  font-weight: 750;
}

.structured-data .table-scroll {
  margin-top: .75rem;
}

.structured-data table {
  min-width: 34rem;
}

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

.proof-benchmark-grid article {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: .7rem;
  padding: 1.25rem;
  background: rgba(17, 21, 30, .86);
}

.proof-benchmark-grid pre {
  max-height: 26rem;
  overflow: auto;
  border-radius: .45rem;
  padding: 1rem;
  background: #05070b;
  color: var(--muted);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.benchmark-card,
.history-card {
  min-height: 18rem;
}

.scorecard th,
.scorecard td {
  padding: .75rem;
}

.special-controls {
  display: grid;
  gap: .75rem;
  border-top: 1px solid var(--line);
  padding-top: 1rem;
}

.special-readout,
.benchmark-receipt,
.ephemeris-results {
  min-width: 0;
  max-width: 100%;
  margin: 0;
  border-left: .2rem solid var(--cyan);
  padding: .8rem;
  background: rgba(7, 9, 14, .86);
  color: var(--muted);
  overflow: auto;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.reflection-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .45rem;
}

.mode-chip {
  border: 1px solid var(--line);
  border-radius: .35rem;
  padding: .55rem;
  background: #090c12;
  color: var(--ink);
  cursor: pointer;
}

.mode-chip.active {
  border-color: var(--cyan);
  color: var(--cyan);
}

#lab-special-media video {
  display: block;
  width: 100%;
  max-height: 32rem;
  margin-top: 1rem;
  border: 1px solid var(--line);
  border-radius: .55rem;
  background: #030407;
}

.application-section {
  margin: 0 0 6rem;
}

.ephemeris-gate {
  border: 1px solid var(--gold);
  border-radius: .55rem;
  padding: .85rem;
  background: rgba(246, 199, 91, .08);
}

.ephemeris-gate p {
  margin: .25rem 0 0;
  color: var(--muted);
}

.ephemeris-results {
  overflow: hidden;
  border-left-color: var(--violet);
}

.ephemeris-results .table-scroll {
  margin: 0 0 .7rem;
}

.ephemeris-results table {
  min-width: 1050px;
}

.receipt-row {
  margin: .35rem 0;
}

.receipt-links {
  align-items: center;
  margin: 1rem 0;
}

.receipt-links a:not(.button) {
  padding: .25rem;
  font-size: .75rem;
}

.pass-value {
  color: var(--green);
  font-weight: 800;
}

.hold-value {
  color: var(--gold);
  font-weight: 800;
}

.body-residuals {
  margin-top: .8rem;
  border-top: 1px solid var(--line);
  padding-top: .8rem;
}

.body-residuals h4 {
  margin: 0;
  color: var(--cyan);
}

.studio-layout {
  display: grid;
  grid-template-columns: minmax(16rem, .36fr) minmax(0, 1fr);
  gap: 1rem;
}

.studio-controls {
  display: flex;
  flex-direction: column;
  gap: .8rem;
  border: 1px solid var(--line);
  border-radius: .7rem;
  padding: 1.1rem;
  background: var(--panel);
}

.studio-controls .field {
  overflow-x: hidden;
}

.checkbox-field {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
}

.checkbox-field input {
  width: 1.1rem;
  height: 1.1rem;
  accent-color: var(--cyan);
}

.studio-canvas-frame {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: .7rem;
  background: #050608;
}

#brand-canvas {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  touch-action: none;
  cursor: move;
}

.derivative-label {
  position: absolute;
  top: .7rem;
  right: .7rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: .35rem .55rem;
  background: rgba(5, 7, 12, .88);
  color: var(--muted);
  font-size: .65rem;
  font-weight: 800;
  text-transform: uppercase;
  pointer-events: none;
}

.derivative-label.active {
  border-color: var(--gold);
  color: var(--gold);
}

.studio-status {
  min-height: 2.5rem;
  margin: .65rem 0;
  color: var(--muted);
  font-size: .82rem;
}

.studio-comparison {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
  margin-top: 1rem;
}

.studio-comparison[hidden] {
  display: none;
}

.studio-comparison figure {
  min-width: 0;
  margin: 0;
}

.studio-comparison canvas {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid var(--line);
  border-radius: .45rem;
}

.studio-comparison figcaption {
  padding: .35rem 0;
  color: var(--muted);
  font-size: .75rem;
}

.archive-note {
  min-width: 0;
  border-left: .2rem solid var(--cyan);
  padding: 1rem;
  background: rgba(7, 9, 14, .72);
}

.archive-note p {
  overflow-wrap: anywhere;
}

.provenance-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .6rem 1.2rem;
  margin-bottom: 2rem;
}

.provenance-table {
  min-width: 1100px;
}

.site-footer {
  width: min(var(--max), calc(100% - 2rem));
  margin: 6rem auto 0;
  padding: 2rem 0 4rem;
  border-top: 1px solid var(--line);
  color: var(--quiet);
  font-size: .8rem;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 900px) {
  .epoch-grid,
  .wall-grid,
  .evidence-columns,
  .use-grid,
  .layer-grid {
    grid-template-columns: 1fr 1fr;
  }

  .instrument-grid,
  .legacy-replay,
  .lab-grid,
  .studio-layout,
  .math-wall,
  .probability-lab,
  .proof-benchmark-grid,
  .limits-panel {
    grid-template-columns: 1fr;
  }

  .probability-results {
    grid-column: auto;
  }

  .hero-metrics,
  .metric-strip {
    grid-template-columns: 1fr 1fr;
  }

  .hero-metrics div:nth-child(2),
  .metric-strip div:nth-child(2),
  .metric-strip div:nth-child(4) {
    border-right: 0;
  }

  .ooda-grid {
    grid-template-columns: 1fr 1fr;
  }

  .category-summary,
  .media-grid,
  .media-grid-wide {
    grid-template-columns: 1fr 1fr;
  }

  .scene-frame,
  #epoch-canvas {
    min-height: 29rem;
    height: 29rem;
  }
}

@media (max-width: 600px) {
  .site-header,
  .section-heading,
  .lab-toolbar,
  .receiver {
    align-items: flex-start;
    flex-direction: column;
  }

  .site-header {
    display: flex;
  }

  nav {
    width: 100%;
    justify-content: space-between;
  }

  h1 {
    font-size: clamp(2.7rem, 16vw, 4.4rem);
  }

  .epoch-grid,
  .wall-grid,
  .evidence-columns,
  .use-grid,
  .layer-grid,
  .ooda-grid,
  .split-fields,
  .receiver,
  .probability-results {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .learning-intro,
  .mission-grid,
  .learning-application-grid,
  .audit-grid,
  .studio-comparison {
    grid-template-columns: minmax(0, 1fr);
  }

  .lens-tabs {
    grid-template-columns: 1fr 1fr;
  }

  .category-summary,
  .media-grid,
  .media-grid-wide,
  .brand-chooser,
  .provenance-summary {
    grid-template-columns: minmax(0, 1fr);
  }

  .brand-preview {
    min-height: 18rem;
  }

  .review-tabs {
    margin-right: -1rem;
    margin-left: -1rem;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
  }

  .hero-metrics,
  .metric-strip {
    grid-template-columns: 1fr;
  }

  .hero-metrics div,
  .metric-strip div,
  .probability-results div {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .hero-metrics div:last-child,
  .metric-strip div:last-child,
  .probability-results div:last-child {
    border-bottom: 0;
  }

  .bit-strip {
    grid-template-columns: repeat(12, minmax(.8rem, 1fr));
  }

  .canvas-overlay {
    flex-direction: column;
    gap: .25rem;
  }

  .scene-frame,
  #epoch-canvas {
    min-height: 22rem;
    height: 22rem;
  }

  .scene-overlay {
    flex-direction: column;
  }

  .reflection-grid {
    grid-template-columns: 1fr 1fr;
  }

  .coach-actions .button,
  .studio-actions .button,
  .toolbar-actions .button {
    flex: 1 1 9rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

@media (forced-colors: active) {
  .badge,
  .button,
  .review-tabs,
  .review-tabs button,
  .visual-mode-tabs button,
  .epoch-card,
  .media-card,
  .proof-benchmark-grid article {
    forced-color-adjust: auto;
  }

  .signal-dot,
  .coach-progress::before {
    background: Highlight;
  }
}

/* Fullscreen mode overrides */
.lab-workbench.fullscreen-mode {
  padding: 1rem;
  background: var(--bg-canvas);
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}
.lab-workbench.fullscreen-mode .scene-frame {
  flex: 1;
  min-height: 70vh;
}
.lab-workbench.fullscreen-mode #epoch-canvas {
  width: 100% !important;
  height: 100% !important;
}