:root {
  --bg: #050706;
  --bg-soft: #080d0b;
  --panel: #0a100d;
  --panel-strong: #0d1511;
  --line: #193027;
  --line-bright: #315b48;
  --green: #bdf650;
  --cyan: #75d9bd;
  --text: #acc5bc;
  --muted: #6f8c82;
  --dim: #40594f;
  --mono: "Cascadia Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;
}

* { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: 82px;
  background: var(--bg);
}

body {
  margin: 0;
  overflow-x: hidden;
  color: var(--text);
  background:
    radial-gradient(circle at 76% 14%, rgba(116, 217, 189, .035), transparent 25rem),
    radial-gradient(circle at 18% 67%, rgba(189, 246, 80, .022), transparent 34rem),
    linear-gradient(var(--bg), var(--bg));
  font: 15px/1.7 var(--mono);
  -webkit-font-smoothing: antialiased;
}

body::before,
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}

body::before {
  opacity: .2;
  background-image:
    linear-gradient(rgba(116, 217, 189, .06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(116, 217, 189, .05) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, .58), transparent 82%);
}

body::after {
  background: radial-gradient(circle at center, transparent 42%, rgba(0, 0, 0, .56) 125%);
}

button,
a { font: inherit; }

button { border-radius: 0; }

a { color: inherit; }

::selection {
  color: var(--bg);
  background: var(--green);
}

button:focus-visible,
a:focus-visible {
  outline: 1px solid var(--green);
  outline-offset: 4px;
}

.cursor-glow {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 80;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  pointer-events: none;
  opacity: 0;
  background: rgba(189, 246, 80, .7);
  box-shadow: 0 0 15px rgba(189, 246, 80, .36);
  transform: translate3d(-30px, -30px, 0);
  transition: opacity .18s ease, box-shadow .18s ease;
}

body:has(a:hover, button:hover) .cursor-glow {
  box-shadow: 0 0 24px rgba(189, 246, 80, .58);
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 60;
  height: 68px;
  padding: 0 max(22px, calc((100vw - 1180px) / 2));
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  background: rgba(5, 7, 6, .72);
  border-bottom: 1px solid rgba(49, 91, 72, .5);
  backdrop-filter: blur(12px);
  transition: background .24s ease, border-color .24s ease;
}

.site-header[data-scrolled="true"] {
  background: rgba(5, 7, 6, .94);
  border-color: rgba(189, 246, 80, .22);
}

.prompt {
  flex: 0 0 auto;
  color: var(--green);
  text-decoration: none;
  font-size: 13px;
  font-weight: 700;
}

.prompt i {
  display: inline-block;
  width: 6px;
  height: 14px;
  margin-left: 4px;
  vertical-align: -2px;
  background: var(--cyan);
  animation: blink 1.1s steps(2) infinite;
}

.nav-scroll { min-width: 0; }

nav {
  display: flex;
  align-items: center;
  gap: 23px;
  white-space: nowrap;
}

nav a,
nav button {
  position: relative;
  color: var(--dim);
  background: transparent;
  border: 0;
  text-decoration: none;
  font-size: 10px;
  letter-spacing: .055em;
  cursor: pointer;
  transition: color .18s ease, border-color .18s ease, background .18s ease;
}

nav a[data-nav]::before {
  content: "";
  position: absolute;
  left: -10px;
  top: 50%;
  width: 3px;
  height: 3px;
  opacity: 0;
  border-radius: 50%;
  background: var(--green);
  transform: translateY(-50%);
}

nav a:hover,
nav button:hover,
nav a.is-active { color: var(--green); }

nav a.is-active::before { opacity: 1; }

nav .nav-code,
nav .x-link {
  min-height: 34px;
  padding: 7px 12px;
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--line);
}

nav .x-link {
  min-width: 38px;
  justify-content: center;
  color: var(--green);
  border-color: var(--line-bright);
}

main {
  width: min(1180px, 100%);
  margin: 0 auto;
}

.hero {
  min-height: calc(100vh - 68px);
  padding: clamp(72px, 10vw, 124px) 32px 100px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.hero-mark {
  padding: 30px 18px 26px;
  overflow: hidden;
  text-align: center;
  border: 1px solid rgba(189, 246, 80, .55);
  outline: 1px solid rgba(49, 91, 72, .45);
  outline-offset: 5px;
  background: rgba(5, 9, 7, .38);
}

.wordmark {
  margin: 0;
  overflow: hidden;
  color: var(--green);
  font: clamp(6px, 1.2vw, 14px)/1.08 var(--mono);
  white-space: pre;
  text-shadow: 0 0 20px rgba(189, 246, 80, .09);
}

.hero-grid {
  margin-top: clamp(68px, 8vw, 104px);
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr);
  gap: clamp(48px, 9vw, 118px);
  align-items: end;
}

.eyebrow,
.section-label,
.hero-state,
.section-footnote { letter-spacing: .08em; }

.eyebrow {
  color: var(--green);
  font-size: 10px;
}

.hero h1 {
  max-width: 760px;
  margin: 22px 0 24px;
  color: #c3d5ce;
  font-size: clamp(38px, 5.4vw, 64px);
  font-weight: 500;
  line-height: 1.06;
  letter-spacing: -.065em;
}

.hero-secondary {
  margin: 0;
  color: var(--cyan);
  font-size: 15px;
}

.hero-note {
  margin: 6px 0 36px;
  color: var(--muted);
  font-size: 12px;
}

.bracket-link,
.bracket-button,
.concept-actions button,
.room-toolbar button,
.root-value button {
  color: var(--green);
  background: transparent;
  border: 0;
  text-decoration: none;
  font-size: 11px;
  letter-spacing: .06em;
  cursor: pointer;
}

.bracket-link:hover,
.bracket-button:hover,
.concept-actions button:hover,
.room-toolbar button:hover,
.root-value button:hover { color: #e1ff9f; }

.hero-state {
  padding: 18px 20px;
  color: var(--muted);
  border: 1px solid var(--line);
  background: rgba(8, 13, 11, .52);
  font-size: 9px;
}

.state-head,
.inspector-head,
.window-observation > div,
.terminal-time {
  display: flex;
  justify-content: space-between;
  gap: 16px;
}

.state-head {
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}

.state-head b,
.inspector-head b,
.window-observation b { color: var(--green); font-weight: 500; }

.hero-state dl { margin: 15px 0; }

.hero-state dl div {
  padding: 5px 0;
  display: grid;
  grid-template-columns: 100px 1fr;
}

.hero-state dt { color: var(--dim); }
.hero-state dd { margin: 0; color: var(--text); }

.system-pulse {
  margin: 18px 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  list-style: none;
}

.system-pulse li {
  padding: 7px;
  color: var(--dim);
  border-left: 1px solid var(--line);
}

.system-pulse li.is-active {
  color: var(--green);
  border-color: var(--green);
  background: rgba(189, 246, 80, .025);
}

.terminal-time {
  padding-top: 11px;
  color: var(--dim);
  border-top: 1px solid var(--line);
}

.terminal-time time { color: var(--cyan); }

.section {
  position: relative;
  padding: clamp(130px, 14vw, 180px) 32px;
}

.section::before,
.core-invite::before {
  content: "";
  position: absolute;
  top: 0;
  left: 32px;
  width: min(120px, 18vw);
  height: 1px;
  background: var(--line);
}

.section-label {
  margin-bottom: 64px;
  display: flex;
  align-items: baseline;
  gap: 18px;
  color: var(--cyan);
  font-size: 11px;
}

.section-label span { color: var(--green); }

.section-label h2 {
  margin: 0;
  font: inherit;
  font-weight: 600;
}

.information-grid {
  display: grid;
  grid-template-columns: minmax(0, 720px) minmax(180px, 1fr);
  gap: clamp(60px, 11vw, 140px);
}

.long-copy { max-width: 720px; }

.long-copy p {
  margin: 0 0 20px;
  color: #a8beb6;
  font-size: 16px;
  line-height: 1.9;
}

.long-copy p:nth-child(3),
.long-copy p:last-child { color: var(--cyan); }

.identity-chain {
  padding-top: 7px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  color: var(--dim);
  font-size: 10px;
  letter-spacing: .1em;
}

.identity-chain i {
  margin: 9px 0 9px 16px;
  color: var(--line-bright);
  font-style: normal;
}

.identity-chain strong { color: var(--green); font-weight: 600; }

.proof-statement {
  margin: 104px 0 0;
  padding: 0 0 0 24px;
  color: var(--green);
  border-left: 1px solid var(--green);
  font-size: clamp(20px, 2.7vw, 32px);
  line-height: 1.35;
  letter-spacing: -.025em;
}

.question { min-height: 84vh; }

.concept-title {
  margin: 0;
  color: #c0d2cb;
  font-size: clamp(34px, 5vw, 52px);
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: -.06em;
}

.concept-title em { color: var(--green); font-style: normal; }

.question-copy {
  max-width: 680px;
  margin: 54px 0 48px;
}

.question-copy p {
  margin: 0 0 18px;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.85;
}

.concept-actions { display: flex; flex-wrap: wrap; gap: 24px; }
.concept-actions button { padding: 5px 0; }

.system-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(350px, .82fr);
  gap: 32px;
  align-items: start;
}

.system-nodes { border-top: 1px solid var(--line); }

.system-node {
  width: 100%;
  min-height: 94px;
  padding: 18px 8px;
  display: grid;
  grid-template-columns: 48px 190px 1fr;
  gap: 18px;
  align-items: center;
  color: var(--text);
  text-align: left;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--line);
  cursor: pointer;
  transition: background .18s ease, padding-left .18s ease;
}

.system-node:hover,
.system-node.is-active {
  padding-left: 14px;
  background: linear-gradient(90deg, rgba(189, 246, 80, .045), transparent 74%);
}

.system-node span { color: var(--dim); font-size: 10px; }
.system-node b { color: var(--cyan); font-size: 12px; font-weight: 500; }
.system-node.is-active b { color: var(--green); }
.system-node small { color: var(--muted); font-size: 10px; line-height: 1.55; }

.system-inspector,
.room-inspector,
.habitation-index {
  position: sticky;
  top: 96px;
  padding: 22px;
  color: var(--muted);
  border: 1px solid var(--line-bright);
  background: rgba(8, 13, 11, .82);
}

.inspector-head {
  padding-bottom: 13px;
  color: var(--dim);
  border-bottom: 1px solid var(--line);
  font-size: 9px;
  letter-spacing: .08em;
}

.system-inspector h3,
.room-inspector h3 {
  margin: 34px 0 4px;
  color: var(--green);
  font-size: 20px;
  font-weight: 500;
}

.object-type {
  margin: 0 0 28px;
  color: var(--dim);
  font-size: 9px;
}

.inspector-data { margin: 25px 0 0; }

.inspector-data > div {
  padding: 11px 0;
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 12px;
  border-bottom: 1px dashed rgba(49, 91, 72, .55);
}

.inspector-data dt { color: var(--dim); font-size: 9px; }
.inspector-data dd { margin: 0; color: var(--text); font-size: 10px; }

.system-inspector > p {
  margin: 30px 0 0;
  padding-left: 13px;
  color: var(--cyan);
  border-left: 1px solid var(--green);
  font-size: 10px;
}

.room { padding-inline: 0; }
.room > *:not(.room-console) { margin-inline: 32px; }
.room .section-label { margin-inline: 32px; }

.room-label b {
  margin-left: auto;
  color: var(--green);
  font-size: 9px;
  font-weight: 500;
}

.room-toolbar {
  margin-bottom: 18px;
  display: flex;
  align-items: center;
  gap: 20px;
}

.room-toolbar button { color: var(--dim); }
.room-toolbar button.is-active { color: var(--green); }
.room-toolbar span { margin-left: auto; color: var(--dim); font-size: 9px; }

.room-console {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(330px, .75fr);
  border: 1px solid var(--line-bright);
  background: rgba(7, 11, 9, .76);
}

.room-stage {
  position: relative;
  min-height: 565px;
  overflow-x: auto;
  display: grid;
  place-items: center;
  border-right: 1px solid var(--line);
  transition: filter .35s ease, opacity .35s ease;
}

.room-stage[data-layer="memory"] {
  opacity: .72;
  filter: saturate(.55);
}

.room-stage pre {
  min-width: 720px;
  margin: 0;
  padding: 44px 30px;
  color: #78a99a;
  font: 11px/1.72 var(--mono);
  white-space: pre;
}

.room-stage[data-layer="memory"] pre { color: #5f7c72; }

.room-hotspots {
  position: absolute;
  inset: 0 auto auto 50%;
  width: 720px;
  height: 100%;
  pointer-events: none;
  transform: translateX(-50%);
}

.room-hotspots button {
  position: absolute;
  pointer-events: auto;
  color: transparent;
  background: transparent;
  border: 1px solid transparent;
  cursor: crosshair;
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.room-hotspots button:hover,
.room-hotspots button:focus-visible,
.room-hotspots button.is-active {
  border-color: rgba(189, 246, 80, .55);
  background: rgba(189, 246, 80, .025);
  box-shadow: inset 0 0 18px rgba(189, 246, 80, .035);
}

[data-room-object="wall"] { left: 4%; top: 14%; width: 91%; height: 8%; }
[data-room-object="window"] { left: 63%; top: 20%; width: 29%; height: 31%; }
[data-room-object="terminal"] { left: 9%; top: 26%; width: 40%; height: 25%; }
[data-room-object="lamp"] { left: 60%; top: 50%; width: 18%; height: 19%; }
[data-room-object="desk"] { left: 8%; top: 55%; width: 44%; height: 28%; }
[data-room-object="reserve"] { left: 62%; top: 69%; width: 23%; height: 20%; }
[data-room-object="empty"] { left: 9%; top: 84%; width: 33%; height: 9%; }
[data-room-object="door"] { left: 87%; top: 77%; width: 9%; height: 18%; }

.room-inspector {
  position: static;
  min-height: 565px;
  padding: 28px;
  border: 0;
}

.room-metrics {
  margin-top: 18px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.room-metrics > div {
  min-height: 112px;
  padding: 17px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.room-metrics span { color: var(--dim); font-size: 8px; }
.room-metrics b { color: var(--cyan); font-size: 17px; font-weight: 500; overflow-wrap: anywhere; }

.window-observation {
  margin-top: 18px;
  padding: 18px 20px;
  border: 1px solid var(--line);
  background: rgba(8, 13, 11, .42);
}

.window-observation span { color: var(--cyan); font-size: 9px; }
.window-observation p { margin: 10px 0 0; color: var(--dim); font-size: 9px; }
.window-observation p:last-child { padding-top: 10px; border-top: 1px dashed var(--line); }

.memory-statement,
.archive-statement {
  margin-top: 108px !important;
  color: #b7cbc4;
  font-size: clamp(26px, 4vw, 46px);
  line-height: 1.22;
  letter-spacing: -.055em;
}

.habitation-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(330px, .65fr);
  gap: clamp(54px, 9vw, 110px);
}

.compact-copy { margin-top: 54px; }
.compact-copy p { font-size: 15px; }

.habitation-index { position: static; align-self: start; }

.room-root-panel {
  margin-top: 130px;
  padding: 42px 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 70px;
  border-top: 1px solid var(--line-bright);
  border-bottom: 1px solid var(--line);
}

.room-root-panel > div > span,
.root-value > span { color: var(--green); font-size: 9px; letter-spacing: .1em; }

.room-root-panel h3 {
  margin: 20px 0 14px;
  color: var(--text);
  font-size: 24px;
  font-weight: 500;
  line-height: 1.3;
}

.room-root-panel p { max-width: 460px; margin: 0; color: var(--muted); font-size: 11px; }

.root-value {
  padding-left: 30px;
  display: flex;
  flex-direction: column;
  border-left: 1px solid var(--line);
}

.root-value b {
  margin: 28px 0 10px;
  color: var(--cyan);
  font-size: 16px;
  font-weight: 500;
  overflow-wrap: anywhere;
}

.root-value em { color: var(--dim); font-size: 9px; font-style: normal; }
.root-value button { align-self: flex-start; margin-top: auto; padding-top: 34px; }

.rules-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, .7fr);
  gap: 80px;
  align-items: end;
  margin-bottom: 84px;
}

.rules-intro p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.9; }

.policy-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }

.policy-list button {
  width: 100%;
  min-height: 90px;
  padding: 18px 6px;
  display: grid;
  grid-template-columns: 60px 1fr 150px 70px;
  gap: 18px;
  align-items: center;
  color: var(--text);
  text-align: left;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--line);
  cursor: pointer;
  transition: padding-left .18s ease, background .18s ease;
}

.policy-list button:hover {
  padding-left: 14px;
  background: linear-gradient(90deg, rgba(189, 246, 80, .04), transparent 72%);
}

.policy-list span,
.policy-list em { color: var(--dim); font-size: 9px; font-style: normal; }
.policy-list b { color: var(--cyan); font-size: 12px; font-weight: 500; }
.policy-list strong { color: var(--green); font-size: 8px; font-weight: 500; text-align: right; }

.section-footnote { margin: 25px 0 0; color: var(--dim); font-size: 9px; }

.door-section { min-height: 92vh; text-align: center; }
.door-section .section-label { text-align: left; }

.ascii-door {
  width: 184px;
  height: 166px;
  margin: 10px auto 36px;
  padding: 0;
  display: block;
  background: transparent;
  border: 0;
  cursor: pointer;
  overflow: hidden;
}

.door-glyph-crop {
  position: relative;
  width: 100%;
  height: 100%;
  display: block;
  overflow: hidden;
}

.door-glyph-crop img {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 650px;
  height: 650px;
  max-width: none;
  transform: translate(-50%, -50%);
  image-rendering: pixelated;
  mix-blend-mode: screen;
  transition: filter .25s ease, opacity .25s ease;
}

.ascii-door:hover .door-glyph-crop img,
.ascii-door:focus-visible .door-glyph-crop img {
  filter: brightness(1.08);
  opacity: .94;
}

.door-section > h2 {
  margin: 0;
  color: #bccfc7;
  font-size: clamp(25px, 4vw, 44px);
  font-weight: 500;
  line-height: 1.24;
  letter-spacing: -.05em;
}

.door-section > p { margin: 26px 0 34px; color: var(--muted); font-size: 12px; }
.bracket-button { padding: 8px 0; }

.archive-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .55fr);
  gap: 100px;
}

.archive-intro p { max-width: 590px; margin: 38px 0 0; color: var(--muted); font-size: 14px; line-height: 1.9; }

.archive-intro ul {
  margin: 0;
  padding: 0;
  align-self: end;
  list-style: none;
  border-top: 1px solid var(--line);
}

.archive-intro li { padding: 8px 0; color: var(--dim); border-bottom: 1px solid var(--line); font-size: 9px; }

.archive-timeline { max-width: 780px; margin-top: 110px; }

.timeline-entry,
.timeline-awaiting {
  min-height: 150px;
  display: grid;
  grid-template-columns: 70px 1px 1fr;
  gap: 28px;
  color: var(--muted);
}

.timeline-entry > span,
.timeline-awaiting > span { color: var(--green); font-size: 10px; }

.timeline-entry > i,
.timeline-awaiting > i { position: relative; display: block; width: 1px; height: 100%; background: var(--line); }
.timeline-entry > i::before { content: ""; position: absolute; top: 3px; left: -3px; width: 7px; height: 7px; background: var(--green); }

.timeline-entry b,
.timeline-awaiting b { color: var(--cyan); font-size: 13px; font-weight: 500; }
.timeline-entry p,
.timeline-awaiting p { margin: 10px 0 5px; font-size: 11px; }
.timeline-entry em { color: var(--dim); font-size: 8px; font-style: normal; }
.timeline-awaiting { opacity: .58; }

.archive-statement { margin-left: 0 !important; }

.notes-heading {
  margin-bottom: 74px;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 40px;
}

.notes-heading h2 {
  margin: 0;
  color: #bbcfc7;
  font-size: clamp(27px, 4vw, 42px);
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -.05em;
}

.notes-heading p { max-width: 250px; margin: 0; color: var(--dim); font-size: 10px; }

.note-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.note-grid button {
  position: relative;
  min-height: 260px;
  padding: 26px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  color: var(--text);
  text-align: left;
  background: transparent;
  border: 0;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  cursor: pointer;
  transition: background .2s ease;
}

.note-grid button:hover { background: rgba(189, 246, 80, .027); }
.note-grid span { color: var(--dim); font-size: 8px; letter-spacing: .08em; }

.note-grid b {
  max-width: 460px;
  margin: 44px 0 14px;
  color: var(--cyan);
  font-size: 17px;
  font-weight: 500;
  transition: transform .2s ease, color .2s ease;
}

.note-grid button:hover b { color: var(--green); transform: translateX(5px); }
.note-grid p { max-width: 430px; margin: 0; color: var(--muted); font-size: 10px; line-height: 1.7; }
.note-grid em { margin-top: auto; padding-top: 25px; color: var(--dim); font-size: 8px; font-style: normal; }
.note-grid i { position: absolute; right: 24px; bottom: 22px; color: var(--green); font-size: 16px; font-style: normal; }

.core-invite {
  position: relative;
  padding: 150px 32px 180px;
}

.core-invite > span { color: var(--green); font-size: 9px; letter-spacing: .1em; }

.core-invite h2 {
  margin: 36px 0 48px;
  color: #b9ccc5;
  font-size: clamp(27px, 4.2vw, 48px);
  font-weight: 500;
  line-height: 1.18;
  letter-spacing: -.055em;
}

body > footer {
  min-height: 180px;
  padding: 36px max(22px, calc((100vw - 1116px) / 2));
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 40px;
  align-items: end;
  color: var(--dim);
  background: rgba(8, 13, 11, .8);
  border-top: 1px solid var(--line-bright);
  font-size: 9px;
}

body > footer > div:first-child { display: flex; flex-direction: column; }
body > footer b { color: var(--green); font-size: 12px; }
.footer-links { display: flex; gap: 18px; }
.footer-links a, .footer-links button { color: var(--muted); background: none; border: 0; text-decoration: none; cursor: pointer; font-size: 9px; }
body > footer > p { margin: 0; color: var(--cyan); text-align: right; line-height: 1.55; }

.research-window[hidden] { display: none; }

.research-window {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  place-items: center;
  padding: 24px;
}

.research-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(1, 3, 2, .84);
  backdrop-filter: blur(4px);
  animation: fade-in .24s ease both;
}

.research-shell {
  position: relative;
  width: min(860px, 100%);
  max-height: min(820px, calc(100vh - 48px));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  color: var(--text);
  background: #050706;
  border: 1px solid var(--line-bright);
  box-shadow: 0 0 0 5px rgba(49, 91, 72, .08);
  animation: window-in .34s ease both;
}

.research-window.is-expanded .research-shell { width: min(1180px, 100%); max-height: calc(100vh - 24px); }

.research-head {
  min-height: 54px;
  padding: 0 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: 0 0 auto;
  background: var(--panel-strong);
  border-bottom: 1px solid var(--line-bright);
}

.research-head > div { display: flex; gap: 20px; }
.research-head span { color: var(--cyan); font-size: 9px; letter-spacing: .08em; }
.research-head b { color: var(--green); font-size: 8px; font-weight: 500; }
.research-head button { padding: 7px 9px; color: var(--green); background: transparent; border: 1px solid var(--line); cursor: pointer; font-size: 10px; }

.research-content { padding: 34px; overflow: auto; overscroll-behavior: contain; }
.research-content > h2 { margin: 0 0 30px; color: var(--green); font-size: 26px; font-weight: 500; letter-spacing: -.03em; }

.research-body-copy { max-width: 680px; }
.research-body-copy p { margin: 0 0 18px; color: var(--text); font-size: 13px; line-height: 1.85; }
.research-body-copy p:first-child { color: var(--cyan); }
.research-body-copy ul { margin: 18px 0 26px; padding: 0; list-style: none; }
.research-body-copy li { padding: 5px 0; color: var(--muted); font-size: 11px; }

.research-grid {
  display: grid;
  grid-template-columns: 150px 1fr;
  border-top: 1px solid var(--line);
}

.research-grid > div { display: contents; }
.research-grid dt, .research-grid dd { margin: 0; padding: 12px 0; border-bottom: 1px dashed var(--line); }
.research-grid dt { color: var(--dim); font-size: 9px; }
.research-grid dd { color: var(--text); font-size: 11px; }

.research-warning { margin-top: 28px; padding: 14px; color: var(--cyan); border-left: 1px solid var(--green); font-size: 10px; }

.research-footer {
  min-height: 48px;
  padding: 10px 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: 0 0 auto;
  color: var(--dim);
  background: var(--panel);
  border-top: 1px solid var(--line);
  font-size: 8px;
}

.research-footer button,
.research-footer a { padding: 5px 0; color: var(--green); background: none; border: 0; text-decoration: none; cursor: pointer; font-size: 9px; }

.modal-open { overflow: hidden; }

.knock-window p { color: var(--muted); font-size: 12px; line-height: 1.75; }
.knock-window .boundary-copy { color: var(--cyan); }
.modal-signals { margin-top: 30px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.modal-signals button { min-height: 42px; color: var(--cyan); background: transparent; border: 1px solid var(--line); cursor: pointer; font-size: 9px; }
.modal-signals button:hover, .modal-signals button.is-active { color: var(--green); border-color: var(--green); }
.interaction-state { margin-top: 20px; padding: 13px; display: grid; gap: 4px; border: 1px solid var(--line); }
.interaction-state b { color: var(--green); font-size: 9px; }
.interaction-state span { color: var(--dim); font-size: 9px; }

.reading-meta { margin: -18px 0 36px; color: var(--dim); font-size: 9px; }
.reading-article { max-width: 680px; margin: 0 auto; }
.reading-article h2 { margin: 42px 0 15px; color: var(--cyan); font-size: 18px; font-weight: 500; }
.reading-article p { margin: 0 0 22px; color: #afc5bd; font-size: 15px; line-height: 1.9; }
.reading-article blockquote { margin: 34px 0; padding: 20px; color: var(--green); border: 1px solid var(--line); font-size: 16px; line-height: 1.65; }
.reading-article ul { padding-left: 20px; color: var(--muted); font-size: 12px; line-height: 1.85; }

.source-browser { display: grid; grid-template-columns: 220px minmax(0, 1fr); min-height: 480px; border: 1px solid var(--line); }
.source-tree { padding: 16px; border-right: 1px solid var(--line); }
.source-tree > span { display: block; margin: 10px 0 6px; color: var(--dim); font-size: 8px; }
.source-tree button { width: 100%; padding: 6px 8px; color: var(--muted); text-align: left; background: transparent; border: 0; cursor: pointer; font-size: 9px; }
.source-tree button:hover, .source-tree button.is-active { color: var(--green); background: rgba(189, 246, 80, .03); }
.source-view { min-width: 0; display: flex; flex-direction: column; }
.source-meta { padding: 11px 14px; display: flex; justify-content: space-between; color: var(--dim); border-bottom: 1px solid var(--line); font-size: 8px; }
.source-meta b { color: var(--cyan); font-weight: 500; }
.source-view pre { margin: 0; padding: 20px; overflow: auto; flex: 1; color: #a8c2b8; background: #050706; font: 10px/1.7 var(--mono); white-space: pre; }
.source-explanation { padding: 12px 15px; color: var(--muted); border-top: 1px solid var(--line); font-size: 9px; }

.reveal {
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .58s ease, transform .58s ease;
}

.reveal.is-visible { opacity: 1; transform: translateY(0); }

@keyframes blink { 50% { opacity: 0; } }
@keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes window-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 960px) {
  nav { gap: 14px; }
  .hero-grid, .information-grid, .system-layout, .habitation-grid { grid-template-columns: 1fr; }
  .hero-state { max-width: 520px; }
  .identity-chain { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 10px; }
  .identity-chain i { margin: 0; transform: rotate(-90deg); }
  .system-inspector { position: static; }
  .room-console { grid-template-columns: 1fr; }
  .room-stage { border-right: 0; border-bottom: 1px solid var(--line); }
  .room-inspector { min-height: 0; }
  .rules-intro, .archive-intro { grid-template-columns: 1fr; gap: 46px; }
}

@media (max-width: 720px) {
  html { scroll-padding-top: 64px; }
  .site-header { height: 58px; padding: 0 12px; gap: 12px; }
  .prompt { font-size: 11px; }
  .nav-scroll { overflow-x: auto; scrollbar-width: none; }
  .nav-scroll::-webkit-scrollbar { display: none; }
  nav { width: max-content; gap: 8px; }
  nav a, nav button { font-size: 8px; }
  nav .nav-code, nav .x-link { min-height: 30px; padding: 6px 9px; }
  main { width: 100%; }
  .hero { min-height: auto; padding: 52px 18px 90px; }
  .hero-mark { padding: 24px 7px; }
  .wordmark { font-size: clamp(4px, 1.78vw, 8px); }
  .hero-grid { margin-top: 62px; gap: 44px; }
  .hero h1 { font-size: clamp(34px, 11vw, 48px); }
  .section { padding: 112px 22px; }
  .section::before, .core-invite::before { left: 22px; }
  .section-label { margin-bottom: 48px; }
  .proof-statement { margin-top: 76px; font-size: 22px; }
  .concept-title { font-size: clamp(31px, 10vw, 43px); }
  .system-node { grid-template-columns: 34px 1fr; gap: 8px; }
  .system-node small { grid-column: 2; }
  .inspector-data > div { grid-template-columns: 116px 1fr; }
  .room { padding-inline: 0; }
  .room > *:not(.room-console), .room .section-label { margin-inline: 22px; }
  .room-toolbar { align-items: flex-start; flex-wrap: wrap; gap: 12px; }
  .room-toolbar span { width: 100%; margin-left: 0; }
  .room-stage { min-height: 470px; justify-content: start; place-items: center start; }
  .room-stage pre { padding-inline: 24px; font-size: 10px; }
  .room-hotspots { left: 24px; transform: none; }
  .room-metrics { grid-template-columns: 1fr 1fr; }
  .memory-statement, .archive-statement { margin-top: 82px !important; font-size: 29px; }
  .room-root-panel { margin-top: 90px; grid-template-columns: 1fr; gap: 40px; }
  .root-value { padding: 30px 0 0; border-left: 0; border-top: 1px solid var(--line); }
  .root-value button { margin-top: 25px; padding-top: 0; }
  .policy-list button { grid-template-columns: 38px 1fr 54px; }
  .policy-list em { display: none; }
  .archive-intro ul { max-width: 420px; }
  .timeline-entry, .timeline-awaiting { grid-template-columns: 48px 1px 1fr; gap: 17px; }
  .notes-heading { display: block; }
  .notes-heading p { margin-top: 22px; }
  .note-grid { grid-template-columns: 1fr; }
  .note-grid button { min-height: 230px; }
  .core-invite { padding: 120px 22px 140px; }
  body > footer { grid-template-columns: 1fr; gap: 24px; align-items: start; }
  body > footer > p { text-align: left; }
  .research-window { padding: 0; }
  .research-shell, .research-window.is-expanded .research-shell { width: 100%; height: 100%; max-height: none; border: 0; }
  .research-head { padding-inline: 13px; }
  .research-head > div { gap: 9px; }
  .research-head span { font-size: 8px; }
  .research-content { padding: 28px 20px; }
  .research-grid { grid-template-columns: 110px 1fr; }
  .modal-signals { grid-template-columns: 1fr; }
  .source-browser { grid-template-columns: 1fr; }
  .source-tree { max-height: 145px; overflow: auto; border-right: 0; border-bottom: 1px solid var(--line); }
  .source-view pre { min-height: 310px; font-size: 9px; }
}

@media (max-width: 430px) {
  .hero-secondary { font-size: 13px; }
  .hero-note { font-size: 10px; }
  .hero-state dl div { grid-template-columns: 86px 1fr; }
  .concept-actions { gap: 14px; }
  .ascii-door { width: 158px; height: 144px; }
  .door-glyph-crop img { width: 570px; height: 570px; }
  .concept-actions button { font-size: 10px; }
  .room-metrics { grid-template-columns: 1fr; }
  .room-inspector { padding: 22px; }
  .inspector-data > div { grid-template-columns: 1fr; gap: 4px; }
  .policy-list button { grid-template-columns: 34px 1fr 48px; gap: 8px; }
  .policy-list b { font-size: 10px; }
  .footer-links { flex-wrap: wrap; }
  .research-grid { grid-template-columns: 1fr; }
  .research-grid dt { padding-bottom: 0; border-bottom: 0; }
}

@media (pointer: coarse), (max-width: 720px) {
  .cursor-glow { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .reveal { opacity: 1; transform: none; }
  .cursor-glow { display: none; }
}

.verified-entry {
  width: 100%;
  color: inherit;
  background: transparent;
  border: 0;
  text-align: left;
  cursor: pointer;
  font: inherit;
}

.article-main {
  width: min(760px, calc(100% - 40px));
  margin: 0 auto;
  padding: 88px 0 120px;
}

.article-hero {
  padding-bottom: 48px;
  border-bottom: 1px solid var(--line);
}

.article-kicker,
.article-meta {
  color: var(--muted);
  font-size: .72rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.article-hero h1 {
  max-width: 680px;
  margin: 18px 0;
  font-size: clamp(2rem, 7vw, 4.8rem);
  font-weight: 400;
  line-height: .98;
  letter-spacing: -.055em;
}

.article-body {
  padding: 54px 0;
  color: var(--soft);
  font-family: var(--sans);
  font-size: 1rem;
  line-height: 1.9;
}

.article-body h2 {
  margin: 52px 0 14px;
  color: var(--text);
  font-family: var(--mono);
  font-size: .8rem;
  font-weight: 400;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.article-body p { margin: 0 0 24px; }

.article-body blockquote {
  margin: 38px 0;
  padding: 18px 0 18px 22px;
  border-left: 1px solid var(--green);
  color: var(--text);
  font-family: var(--mono);
}

.article-nav {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding-top: 28px;
  border-top: 1px solid var(--line);
  font-size: .72rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.article-main .policy-list a {
  min-height: 82px;
  padding: 18px 6px;
  display: grid;
  grid-template-columns: 48px 1fr 110px;
  gap: 18px;
  align-items: center;
  border-bottom: 1px solid var(--line);
  text-decoration: none;
  transition: padding-left .18s ease, background .18s ease;
}

.article-main .policy-list a:hover {
  padding-left: 14px;
  background: linear-gradient(90deg, rgba(189, 246, 80, .04), transparent 72%);
}

@media (max-width: 520px) {
  .article-main .policy-list a { grid-template-columns: 32px 1fr; gap: 10px; }
  .article-main .policy-list em { display: none; }
}

/* ELVRA-specific extensions on the NERAUM mother layout. */
body { background: var(--bg); }
body::before { opacity: .11; }
.terminal-information-grid { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr); gap:clamp(48px,9vw,118px); align-items:start; }
.terminal-record { margin:0; border-top:1px solid var(--line); }
.terminal-record > div { display:grid; grid-template-columns:145px 1fr; gap:28px; padding:15px 0; border-bottom:1px solid var(--line); }
.terminal-record dt { color:var(--dim); font-size:10px; letter-spacing:.08em; }
.terminal-record dd { margin:0; color:var(--text); font-size:12px; overflow-wrap:anywhere; }
.inline-bracket { margin-left:12px; padding:0; color:var(--green); background:none; border:0; cursor:pointer; }
.information-state { align-self:start; }
.what-is-block { margin-top:clamp(130px,14vw,180px); }
.sub-label { margin-bottom:64px; }
.question-detail { max-width:680px; min-height:70px; margin:0 0 28px; padding:16px 0; display:grid; gap:6px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); font-size:11px; }
.question-detail span { color:var(--cyan); }.question-detail b { color:var(--muted); font-weight:400; }
.vial-stage pre { min-width:720px; color:#78a99a; line-height:1.66; }
.stimulus-surface { padding:20px; }
.signal-grid { display:grid; grid-template-columns:1fr minmax(330px,.72fr); gap:50px; }
.signal-copy p:last-child { padding-top:10px; border-top:1px dashed var(--line); }
.signal-readout { padding-left:24px; border-left:1px solid var(--line); }
.signal-readout pre { margin:0 0 14px; color:var(--cyan); font:10px/1.5 var(--mono); }
.signal-readout dl { margin:0; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); }
.signal-readout dl div { padding:8px 8px 0 0; }.signal-readout dt { color:var(--dim); font-size:8px; }.signal-readout dd { margin:2px 0 0; color:var(--green); font-size:10px; }
.fly-plate { width:300px; height:230px; margin:0 auto 28px; display:block; color:#76998e; background:transparent; border:0; cursor:pointer; transition:transform .18s steps(2),color .18s ease; }
.fly-plate:hover { color:var(--cyan); }.fly-drawing { width:100%; height:100%; overflow:visible; filter:contrast(.92); }
.fly-plate.is-stimulated { animation:specimen-jitter .75s steps(3); }
.fly-plate.is-stimulated .wing-left { animation:wing-left .12s linear 6 alternate; transform-origin:202px 132px; }
.fly-plate.is-stimulated .wing-right { animation:wing-right .12s linear 6 alternate; transform-origin:218px 132px; }
.system-log { max-width:780px; margin:64px auto 0; text-align:left; border:1px solid var(--line); }
.system-log > div { padding:11px 14px; display:flex; justify-content:space-between; gap:18px; color:var(--dim); border-bottom:1px solid var(--line); font-size:9px; }
.system-log > div b { color:var(--green); font-weight:500; }.system-log ol { max-height:180px; margin:0; padding:0; overflow:auto; list-style:none; }
.system-log li { padding:9px 14px; display:grid; grid-template-columns:90px 1fr 120px; gap:18px; border-bottom:1px dashed var(--line); color:var(--muted); font-size:9px; }
.system-log li time { color:var(--dim); }.system-log li b { color:var(--cyan); font-weight:500; text-align:right; }
.timeline-entry.verified-entry { width:100%; padding:0; color:var(--muted); text-align:left; background:none; border:0; font-family:inherit; cursor:pointer; }
.timeline-entry.verified-entry:hover b { color:var(--green); }
.mechanism { margin:20px 0 36px; padding:28px; color:var(--green); border:1px solid var(--line); font:14px/1.65 var(--mono); }
.reading-meta { margin-bottom:34px; color:var(--green); font-size:9px; letter-spacing:.08em; }.reading-article { max-width:680px; }.reading-article p { color:var(--text); font-size:14px; line-height:1.9; }
@keyframes specimen-jitter { 0%{transform:translateX(0)}25%{transform:translateX(5px)}50%{transform:translate(-3px,2px)}75%{transform:translate(4px,-1px)}100%{transform:translateX(0)} }
@keyframes wing-left { to{transform:rotate(-7deg) translate(-2px,-2px)} } @keyframes wing-right { to{transform:rotate(7deg) translate(2px,-2px)} }
@media (max-width:820px){.terminal-information-grid,.signal-grid{grid-template-columns:1fr}.information-state{position:static}.signal-readout{padding:18px 0 0;border-left:0;border-top:1px solid var(--line)}.terminal-record>div{grid-template-columns:110px 1fr}.system-log li{grid-template-columns:70px 1fr 90px}}
@media (prefers-reduced-motion:reduce){.fly-plate.is-stimulated,.fly-plate.is-stimulated .wing-left,.fly-plate.is-stimulated .wing-right{animation:none!important}}

/* Measured against the live NERAUM layout at 1280px. */
main { width:100%; max-width:1120px; }
.hero { min-height:0; padding:54px 28px 62px; display:block; }
.hero-mark { min-height:194px; padding:20px 24px 16px; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.wordmark { font-size:clamp(6px,1.25vw,15px); }
.hero-grid { margin-top:0; display:block; text-align:center; }
.hero .hero-state { display:none; }
.hero .eyebrow { display:block; margin-top:14px; }
.hero h1 { max-width:none; margin:18px 0 0; color:var(--cyan); font-size:14px; line-height:1.4; letter-spacing:.04em; }
.hero-secondary { margin:4px 0 0; font-size:11px; }.hero-note { margin:0 0 8px; font-size:9px; }.hero .bracket-link { font-size:9px; }
.section { padding:56px; }.section::before,.core-invite::before { left:56px; width:120px; }
.section-label { margin-bottom:22px; gap:16px; }
.what-is-block { margin-top:74px; }.sub-label { margin-bottom:22px; }
.terminal-information-grid { grid-template-columns:minmax(0,1fr) 320px; gap:70px; }
.terminal-record > div { padding:9px 0; }.information-grid { grid-template-columns:minmax(0,720px) minmax(170px,1fr); gap:90px; }
.long-copy p { margin-bottom:15px; font-size:14px; line-height:1.72; }.proof-statement { margin-top:56px; font-size:24px; }
.question { min-height:0; }.concept-title { font-size:34px; }.question-copy { margin:28px 0 22px; }.question-copy p { margin-bottom:12px; font-size:13px; line-height:1.7; }
.system-layout { grid-template-columns:minmax(0,1.5fr) minmax(350px,1fr); gap:44px; }.system-node { min-height:58px; padding:13px 4px; grid-template-columns:38px 156px 1fr; gap:10px; }.system-node small { font-size:9px; }.system-inspector { top:82px; padding:18px; }.system-inspector h3,.room-inspector h3 { margin:20px 0 4px; font-size:16px; }.inspector-data { margin-top:16px; }.inspector-data>div { padding:7px 0; grid-template-columns:120px 1fr; }.system-inspector>p { margin-top:18px; }
.room { padding:56px; }.room>*:not(.room-console),.room .section-label { margin-inline:0; }.room-stage { min-height:368px; height:368px; display:block; padding:28px; }.room-stage pre { min-width:590px; padding:0; font-size:9px; line-height:1.6; }.room-inspector { min-height:368px; padding:22px; }.room-metrics>div { min-height:78px; }.window-observation { margin-top:14px; }.memory-statement,.archive-statement { margin-top:58px!important; font-size:34px; }
.habitation-grid { grid-template-columns:minmax(0,640px) 300px; gap:68px; }.compact-copy { margin-top:30px; }.compact-copy p { font-size:13px; }.room-root-panel { margin-top:64px; padding:30px 0; gap:54px; }
.rules-intro { grid-template-columns:380px 1fr; gap:56px; margin-bottom:32px; }.policy-list button { min-height:58px; padding:14px 4px; grid-template-columns:48px 230px 1fr auto; gap:10px; }
.door-section { min-height:0; }.fly-plate { width:190px; height:150px; margin-bottom:12px; }.door-section>h2 { font-size:30px; }.door-section>p { margin:14px 0 14px; }.system-log { margin-top:28px; }
.archive-intro { grid-template-columns:1fr 1fr; gap:60px; }.archive-intro p { margin-top:20px; font-size:12px; }.archive-timeline { margin-top:54px; }.timeline-entry,.timeline-awaiting { min-height:112px; }
.notes-heading { margin-bottom:34px; }.note-grid button { min-height:190px; padding:20px; }.core-invite { padding:82px 56px 90px; }
footer { min-height:82px; padding:23px max(22px,calc((100vw - 1008px)/2)); }
@media(max-width:820px){.hero{padding:34px 16px}.section{padding:42px 22px}.section::before,.core-invite::before{left:22px}.terminal-information-grid,.information-grid,.system-layout,.habitation-grid,.rules-intro{grid-template-columns:1fr;gap:32px}.system-inspector{position:static}.room{padding:42px 22px}.room-console{grid-template-columns:1fr}.room-stage{border-right:0;border-bottom:1px solid var(--line);overflow:auto}.room-stage pre{width:590px}.room-inspector{min-height:0}.policy-list button{grid-template-columns:32px 1fr auto}.policy-list em{grid-column:2/-1}.core-invite{padding:70px 22px}.hero-note{display:none}}

.hero .eyebrow { margin:0; font-size:9px; line-height:1.65; }
.hero-mark { gap:0; }
.hero-mark .wordmark { margin:0 auto; }
.hero-mark h1 { margin:18px 0 0; }
.hero-panel-meta { min-height:25px; display:flex; align-items:center; justify-content:center; gap:18px; color:var(--dim); font-size:8px; line-height:1.65; }
.hero-panel-meta .bracket-link { min-height:25px; padding:5px 8px; display:flex; align-items:center; font-size:10px; line-height:1; }

.hero-mark { position:relative; }
.hero .eyebrow { position:absolute; top:13px; left:24px; }

/* VIAL_01 connectome viewer — scoped to the replaced left observation surface. */
.connectome-stage{position:relative;height:540px;min-height:540px;padding:0!important;overflow:hidden;background:#070909;isolation:isolate;touch-action:pan-y}
.connectome-stage::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;border:1px solid rgba(117,217,189,.08);box-shadow:inset 0 0 46px rgba(0,0,0,.42)}
.connectome-canvas,.connectome-canvas canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.connectome-canvas canvas{cursor:grab}.connectome-canvas canvas:active{cursor:grabbing}
.connectome-head{position:absolute;z-index:4;top:16px;left:18px;right:18px;display:flex;align-items:flex-start;justify-content:space-between;gap:22px;pointer-events:none;font-size:8px;letter-spacing:.07em}
.connectome-head div{display:grid}.connectome-head b{color:var(--green);font-size:9px;font-weight:500}.connectome-head span{margin-top:3px;color:var(--cyan)}.connectome-head small{margin-top:1px;color:var(--dim);font:inherit}.connectome-head em{color:var(--dim);font-style:normal;text-align:right}
.connectome-layer-controls,.connectome-camera-controls{position:absolute;z-index:5;display:flex;gap:5px}.connectome-layer-controls{top:66px;left:16px}.connectome-camera-controls{top:66px;right:16px}
.connectome-stage button{padding:4px 6px;color:var(--dim);background:rgba(7,9,9,.82);border:1px solid #1b2b26;font:8px/1.2 var(--mono);letter-spacing:.04em;cursor:pointer}.connectome-stage button:hover,.connectome-stage button.is-active{color:var(--green);border-color:#3b584c}
.connectome-identity{position:absolute;z-index:4;left:18px;bottom:76px;display:grid;pointer-events:none}.connectome-identity b{color:var(--green);font-size:13px;font-weight:500}.connectome-identity span{color:var(--cyan);font-size:8px}.connectome-identity small{color:var(--dim);font-size:7px}
.connectome-stats{position:absolute;z-index:4;left:18px;right:18px;bottom:17px;display:grid;grid-template-columns:repeat(3,1fr);pointer-events:none;border-top:1px solid rgba(49,91,72,.55)}
.connectome-stats>div{padding:8px 10px 0 0;display:grid}.connectome-stats span{color:var(--dim);font-size:7px;letter-spacing:.06em}.connectome-stats b{color:#86aa9d;font-size:8px;font-weight:500}
.connectome-actions{position:absolute;z-index:5;right:16px;bottom:70px;display:flex;gap:6px}.connectome-actions button{color:#759084}
.connectome-loading,.connectome-error{position:absolute;inset:0;z-index:8;display:grid;place-content:center;justify-items:center;gap:7px;color:var(--dim);background:#070909;font-size:9px;letter-spacing:.08em}.connectome-loading b,.connectome-error b{color:var(--cyan);font-weight:500}.connectome-loading code{color:var(--green);font:10px var(--mono)}.connectome-loading[hidden],.connectome-error[hidden]{display:none}.connectome-error button{margin-top:10px}
.signal-tag{position:absolute;z-index:4;top:112px;right:18px;opacity:0;color:var(--green);font-size:8px;transition:opacity .18s ease}.signal-tag.is-visible{opacity:.72}
.room-console>.room-inspector{min-height:540px}
@media(max-width:820px){.connectome-stage{height:500px;min-height:500px}.room-console>.room-inspector{min-height:0}.connectome-camera-controls{top:96px;left:16px;right:auto}.connectome-head em{max-width:125px}.connectome-actions{bottom:76px}.connectome-stats{grid-template-columns:1fr 1fr}.connectome-stats>div:last-child{display:none}}
@media(max-width:480px){.connectome-stage{height:470px;min-height:470px}.connectome-head{left:12px;right:12px}.connectome-layer-controls,.connectome-camera-controls{left:10px}.connectome-actions{right:10px;bottom:78px}.connectome-actions button{font-size:7px}.connectome-identity{left:12px;bottom:82px}.connectome-stats{left:12px;right:12px}.connectome-head em{display:none}}
@media(prefers-reduced-motion:reduce){.signal-tag{transition:none}}