:root {
  --exhibit-bg: #081118;
  --exhibit-surface: #0c1821;
  --exhibit-surface-raised: #10222d;
  --exhibit-line: #244454;
  --exhibit-grid: rgba(121, 175, 201, .08);
  --exhibit-ink: #edf5fa;
  --exhibit-muted: #9bb2c3;
  --exhibit-blue: #58b8de;
  --exhibit-red: #d85858;
  --exhibit-amber: #d2aa68;
  --exhibit-green: #82ae8f;
}

.exhibit-page {
  min-width: 0;
  padding-bottom: 48px;
}

.exhibit-intro {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(260px, .8fr);
  gap: 28px 48px;
  align-items: end;
  margin: 4px 0 26px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--exhibit-line);
}

.exhibit-kicker,
.exhibit-eyebrow,
.exhibit-layer-label,
.exhibit-status-label,
.bio-science-tag {
  font-family: ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.exhibit-kicker {
  margin: 0 0 8px;
  color: var(--exhibit-blue);
  font-size: .7rem;
  line-height: 1.5;
}

.exhibit-intro h1 {
  max-width: 720px;
  margin: 0;
  color: var(--exhibit-ink);
  font-size: clamp(2rem, 4vw, 3.45rem);
  line-height: 1.02;
  letter-spacing: -.045em;
}

.exhibit-intro-copy {
  margin: 0;
  color: var(--exhibit-muted);
  font-size: clamp(.96rem, 1.5vw, 1.08rem);
  line-height: 1.75;
}

.exhibit-shell {
  overflow: hidden;
  border: 1px solid var(--exhibit-line);
  border-radius: 8px;
  background: var(--exhibit-bg);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

.exhibit-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  padding: 15px 18px;
  border-bottom: 1px solid var(--exhibit-line);
  background: #0a151d;
}

.exhibit-toolbar-copy strong,
.exhibit-toolbar-copy span {
  display: block;
}

.exhibit-toolbar-copy strong {
  color: var(--exhibit-ink);
  font-size: .94rem;
}

.exhibit-toolbar-copy span {
  margin-top: 2px;
  color: var(--exhibit-muted);
  font-size: .76rem;
}

.exhibit-control-group {
  display: inline-grid;
  grid-auto-flow: column;
  gap: 3px;
  padding: 3px;
  border: 1px solid var(--exhibit-line);
  border-radius: 5px;
  background: #071017;
}

.exhibit-control,
.bio-step-button {
  appearance: none;
  border: 0;
  color: var(--exhibit-muted);
  font: 700 .72rem/1.2 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .04em;
  cursor: pointer;
  transition: color .28s cubic-bezier(.16,1,.3,1), background-color .28s cubic-bezier(.16,1,.3,1), transform .28s cubic-bezier(.16,1,.3,1);
}

.exhibit-control {
  min-height: 36px;
  padding: 8px 11px;
  border-radius: 3px;
  background: transparent;
}

.exhibit-control:hover,
.exhibit-control[aria-pressed="true"] {
  color: var(--exhibit-ink);
  background: #142733;
}

.exhibit-control--danger[aria-pressed="true"] {
  color: #ffe9e9;
  background: #482427;
}

.exhibit-control:active,
.bio-step-button:active {
  transform: translateY(1px);
}

.exhibit-control:focus-visible,
.bio-step-button:focus-visible,
.system-node:focus-visible {
  outline: 2px solid var(--exhibit-blue);
  outline-offset: 2px;
}

.system-exhibit[data-system-mode="compromised"] {
  --exhibit-active: var(--exhibit-red);
}

.system-exhibit[data-system-mode="normal"] {
  --exhibit-active: var(--exhibit-blue);
}

.system-stage-wrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 238px;
  min-height: 620px;
}

.system-stage {
  position: relative;
  min-width: 0;
  background-color: var(--exhibit-bg);
  background-image:
    linear-gradient(var(--exhibit-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--exhibit-grid) 1px, transparent 1px);
  background-size: 32px 32px;
}

.mobile-diagram-hint {
  display: none;
}

.system-stage svg {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 620px;
}

.system-plane,
.system-plane-edge,
.system-node,
.system-link-field,
.system-compromise,
.system-packet,
.system-callout {
  transform-box: fill-box;
  transform-origin: center;
  transition: transform .55s cubic-bezier(.16,1,.3,1), opacity .35s cubic-bezier(.16,1,.3,1), fill .35s cubic-bezier(.16,1,.3,1), stroke .35s cubic-bezier(.16,1,.3,1);
}

.system-plane {
  fill: #0d202a;
  stroke: #31596b;
  stroke-width: 1.5;
}

.system-plane-edge {
  fill: #071017;
  stroke: #1d3947;
  stroke-width: 1;
}

.system-layer--cloud .system-plane { fill: #14242c; }
.system-layer--site .system-plane { fill: #10232d; }
.system-layer--edge .system-plane { fill: #0d2630; }
.system-layer--physical .system-plane { fill: #12241d; stroke: #3c6350; }

.system-layer-label {
  fill: var(--exhibit-muted);
  font-size: 11px;
}

.system-layer-number {
  fill: var(--exhibit-blue);
  font: 700 10px/1 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .12em;
}

.system-node {
  cursor: pointer;
}

.system-node rect {
  fill: #10212b;
  stroke: #3f6879;
  stroke-width: 1.25;
  transition: fill .28s cubic-bezier(.16,1,.3,1), stroke .28s cubic-bezier(.16,1,.3,1);
}

.system-node:hover rect,
.system-node.is-active rect,
.system-node:focus rect {
  fill: #17313d;
  stroke: var(--exhibit-blue);
}

.system-node text {
  pointer-events: none;
  fill: var(--exhibit-ink);
  font: 700 11px/1.2 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .035em;
}

.system-node .node-detail {
  fill: var(--exhibit-muted);
  font-size: 8px;
  font-weight: 500;
  letter-spacing: 0;
}

.system-flow {
  fill: none;
  stroke: var(--exhibit-blue);
  stroke-width: 2.25;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 7 8;
  animation: exhibit-flow 1.8s linear infinite;
}

.system-flow--policy {
  stroke: var(--exhibit-amber);
  stroke-width: 1.5;
  stroke-dasharray: 3 7;
}

.system-flow-label {
  fill: var(--exhibit-muted);
  font: 700 9px/1 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.system-compromise {
  opacity: 0;
}

.system-compromise path {
  fill: none;
  stroke: var(--exhibit-red);
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 10 9;
  animation: exhibit-flow .95s linear infinite;
}

.system-callout rect {
  fill: #3b2024;
  stroke: var(--exhibit-red);
}

.system-callout text {
  fill: #ffe7e7;
  font: 700 9px/1 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .04em;
}

.system-exhibit[data-system-mode="compromised"] .system-link-field {
  opacity: .2;
}

.system-exhibit[data-system-mode="compromised"] .system-compromise {
  opacity: 1;
}

.system-exhibit.is-exploded .system-layer--cloud {
  transform: translateY(-28px);
}

.system-exhibit.is-exploded .system-layer--edge {
  transform: translateY(20px);
}

.system-exhibit.is-exploded .system-layer--physical {
  transform: translateY(38px);
}

.system-exhibit.is-exploded .system-link-field,
.system-exhibit.is-exploded .system-compromise {
  transform: scaleY(1.12);
}

.system-inspector {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 26px 22px;
  border-left: 1px solid var(--exhibit-line);
  background: #0a151d;
}

.exhibit-status-label {
  display: block;
  margin-bottom: 12px;
  color: var(--exhibit-active);
  font-size: .62rem;
}

.system-inspector h2 {
  margin: 0 0 10px;
  color: var(--exhibit-ink);
  font-size: 1.3rem;
  line-height: 1.15;
  letter-spacing: -.025em;
}

.system-inspector p {
  margin: 0;
  color: var(--exhibit-muted);
  font-size: .88rem;
  line-height: 1.65;
}

.system-inspector-foot {
  margin-top: 30px;
  padding-top: 16px;
  border-top: 1px solid var(--exhibit-line);
  color: var(--exhibit-muted);
  font: .68rem/1.6 ui-monospace, "SFMono-Regular", Consolas, monospace;
}

.system-key {
  display: grid;
  gap: 8px;
  margin-top: 18px;
}

.system-key span {
  display: flex;
  align-items: center;
  gap: 9px;
  color: var(--exhibit-muted);
  font-size: .72rem;
}

.system-key i {
  display: block;
  width: 24px;
  border-top: 2px solid var(--exhibit-blue);
}

.system-key span:nth-child(2) i {
  border-color: var(--exhibit-amber);
  border-top-style: dashed;
}

.system-key span:nth-child(3) i {
  border-color: var(--exhibit-red);
}

.bio-exhibit {
  --bio-state: var(--exhibit-green);
}

.bio-exhibit[data-bio-step="1"],
.bio-exhibit[data-bio-step="2"] {
  --bio-state: var(--exhibit-amber);
}

.bio-exhibit[data-bio-step="3"],
.bio-exhibit[data-bio-step="4"] {
  --bio-state: var(--exhibit-blue);
}

.bio-exhibit[data-bio-step="5"] {
  --bio-state: var(--exhibit-red);
}

.bio-stage-wrap {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(270px, .75fr);
  min-height: 590px;
}

.bio-visual {
  position: relative;
  overflow: hidden;
  min-width: 0;
  min-height: 590px;
  background-color: #08130f;
  background-image:
    linear-gradient(rgba(111,155,128,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(111,155,128,.06) 1px, transparent 1px);
  background-size: 30px 30px;
}

.bio-visual > svg {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 590px;
}

.bio-chamber-line {
  fill: none;
  stroke: #315344;
  stroke-width: 1.5;
}

.bio-lamp {
  fill: #1b3440;
  stroke: #4f7e91;
}

.bio-beam {
  opacity: .2;
  fill: none;
  stroke: var(--exhibit-blue);
  stroke-width: 9;
  stroke-linecap: round;
  transition: opacity .45s cubic-bezier(.16,1,.3,1), stroke .45s cubic-bezier(.16,1,.3,1), transform .45s cubic-bezier(.16,1,.3,1);
}

.bio-leaf {
  fill: #193629;
  stroke: #7dab8b;
  stroke-width: 2;
  transition: fill .6s cubic-bezier(.16,1,.3,1), stroke .6s cubic-bezier(.16,1,.3,1), transform .6s cubic-bezier(.16,1,.3,1);
  transform-origin: center;
}

.bio-vein {
  fill: none;
  stroke: #6f9578;
  stroke-width: 2;
  stroke-linecap: round;
  opacity: .72;
}

.bio-ros,
.bio-accumulation,
.bio-alert-ring {
  opacity: 0;
  transition: opacity .4s cubic-bezier(.16,1,.3,1), transform .4s cubic-bezier(.16,1,.3,1);
}

.bio-ros circle {
  fill: var(--exhibit-amber);
  transform-origin: center;
  animation: bio-pulse 1.45s ease-in-out infinite alternate;
}

.bio-ros circle:nth-child(2n) { animation-delay: -.5s; }
.bio-ros circle:nth-child(3n) { animation-delay: -.9s; }

.bio-accumulation circle {
  fill: var(--exhibit-red);
}

.bio-alert-ring {
  fill: none;
  stroke: var(--exhibit-red);
  stroke-width: 2;
  stroke-dasharray: 6 8;
  transform-origin: center;
  animation: bio-ring 10s linear infinite;
}

.bio-axis-label {
  fill: #a6bdaf;
  font: 700 10px/1 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .1em;
}

.bio-value {
  fill: var(--exhibit-ink);
  font: 700 12px/1 ui-monospace, "SFMono-Regular", Consolas, monospace;
}

.bio-normal-value {
  transition: opacity .35s cubic-bezier(.16,1,.3,1);
}

.bio-stress-value {
  fill: var(--exhibit-amber);
  opacity: 0;
  transition: opacity .35s cubic-bezier(.16,1,.3,1);
}

.bio-exhibit[data-bio-step]:not([data-bio-step="0"]) .bio-beam {
  opacity: .65;
  stroke: var(--exhibit-amber);
  transform: scaleY(1.045);
}

.bio-exhibit[data-bio-step]:not([data-bio-step="0"]) .bio-stress-value {
  opacity: 1;
}

.bio-exhibit[data-bio-step]:not([data-bio-step="0"]) .bio-normal-value {
  opacity: .12;
}

.bio-exhibit[data-bio-step="2"] .bio-ros,
.bio-exhibit[data-bio-step="3"] .bio-ros,
.bio-exhibit[data-bio-step="4"] .bio-ros,
.bio-exhibit[data-bio-step="5"] .bio-ros {
  opacity: 1;
}

.bio-exhibit[data-bio-step="5"] .bio-accumulation,
.bio-exhibit[data-bio-step="5"] .bio-alert-ring {
  opacity: .82;
}

.bio-exhibit[data-bio-step="5"] .bio-leaf {
  fill: #1a3527;
  stroke: #789f80;
}

.bio-narrative {
  display: flex;
  flex-direction: column;
  padding: 26px 24px;
  border-left: 1px solid var(--exhibit-line);
  background: #0a151d;
}

.bio-science-tag {
  align-self: flex-start;
  margin: 0 0 16px;
  padding: 5px 7px;
  border: 1px solid var(--bio-state);
  color: var(--bio-state);
  font-size: .57rem;
  transition: color .3s cubic-bezier(.16,1,.3,1), border-color .3s cubic-bezier(.16,1,.3,1);
}

.bio-narrative h2 {
  margin: 0 0 12px;
  color: var(--exhibit-ink);
  font-size: clamp(1.45rem, 2.7vw, 2.2rem);
  line-height: 1.05;
  letter-spacing: -.035em;
}

.bio-narrative > p {
  min-height: 106px;
  margin: 0;
  color: var(--exhibit-muted);
  font-size: .9rem;
  line-height: 1.68;
}

.bio-molecule {
  margin: 18px 0 0;
  padding-top: 18px;
  border-top: 1px solid var(--exhibit-line);
  opacity: .3;
  transition: opacity .5s cubic-bezier(.16,1,.3,1);
}

.bio-exhibit[data-bio-step="3"] .bio-molecule,
.bio-exhibit[data-bio-step="4"] .bio-molecule,
.bio-exhibit[data-bio-step="5"] .bio-molecule {
  opacity: 1;
}

.bio-molecule svg {
  display: block;
  width: 100%;
  height: auto;
}

.molecule-bond {
  fill: none;
  stroke: var(--exhibit-muted);
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.molecule-change {
  fill: none;
  stroke: var(--exhibit-blue);
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-dasharray: 90;
  stroke-dashoffset: 90;
}

.bio-exhibit[data-bio-step="3"] .molecule-change,
.bio-exhibit[data-bio-step="4"] .molecule-change,
.bio-exhibit[data-bio-step="5"] .molecule-change {
  animation: molecule-draw .85s cubic-bezier(.16,1,.3,1) forwards;
}

.molecule-label,
.molecule-enzyme {
  fill: var(--exhibit-ink);
  font: 700 9.5px/1 ui-monospace, "SFMono-Regular", Consolas, monospace;
}

.molecule-enzyme { fill: var(--exhibit-blue); }
.molecule-atom { fill: var(--exhibit-muted); font: 700 9px/1 ui-monospace, "SFMono-Regular", Consolas, monospace; }
.molecule-release { fill: var(--exhibit-amber); font: 700 8.5px/1 ui-monospace, "SFMono-Regular", Consolas, monospace; }

.bio-progress {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  border-top: 1px solid var(--exhibit-line);
  background: #09131a;
}

.bio-step-button {
  position: relative;
  min-height: 72px;
  padding: 12px 8px 10px;
  border-right: 1px solid var(--exhibit-line);
  background: transparent;
  text-align: left;
}

.bio-step-button:last-child { border-right: 0; }

.bio-step-button::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  border-top: 2px solid transparent;
}

.bio-step-button span,
.bio-step-button small {
  display: block;
}

.bio-step-button span {
  color: var(--exhibit-muted);
  font-size: .63rem;
}

.bio-step-button small {
  margin-top: 5px;
  color: #718a9b;
  font-size: .56rem;
  font-weight: 600;
  letter-spacing: 0;
}

.bio-step-button[aria-current="step"]::before { border-color: var(--bio-state); }
.bio-step-button[aria-current="step"] span { color: var(--exhibit-ink); }

.technical-record {
  margin-top: 24px;
  border-top: 1px solid var(--exhibit-line);
  border-bottom: 1px solid var(--exhibit-line);
}

.technical-record > summary {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  align-items: center;
  min-height: 62px;
  padding: 14px 4px;
  color: var(--exhibit-ink);
  font-weight: 700;
  list-style: none;
  cursor: pointer;
}

.technical-record > summary::-webkit-details-marker { display: none; }

.technical-record > summary::after {
  content: "Open";
  color: var(--exhibit-blue);
  font: 700 .68rem/1 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.technical-record[open] > summary::after { content: "Close"; }

.technical-record-summary small {
  display: block;
  margin-top: 3px;
  color: var(--exhibit-muted);
  font-size: .75rem;
  font-weight: 500;
}

.technical-scroll {
  overflow-x: auto;
  margin-bottom: 20px;
  border: 1px solid var(--exhibit-line);
  background: #0a151d;
  -webkit-overflow-scrolling: touch;
}

.technical-scroll .mermaid {
  min-width: 820px;
  padding: 24px;
}

.technical-note {
  margin: 0 0 18px;
  color: var(--exhibit-muted);
  font-size: .78rem;
}

/* Intelligence structure exhibit */
.org-exhibit {
  --org-active: var(--exhibit-blue);
}

.org-exhibit[data-org-view="operational"] {
  --org-active: var(--exhibit-amber);
}

.org-stage-wrap,
.loop-stage-wrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 250px;
  min-height: 590px;
}

.org-map {
  position: relative;
  min-width: 0;
  padding: 34px;
  background-color: var(--exhibit-bg);
  background-image:
    linear-gradient(var(--exhibit-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--exhibit-grid) 1px, transparent 1px);
  background-size: 32px 32px;
}

.org-command {
  position: relative;
  display: flex;
  justify-content: center;
  padding-bottom: 48px;
}

.org-command::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 1px;
  height: 48px;
  background: var(--org-active);
}

.org-lanes {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 46px;
}

.org-lanes::before {
  content: "";
  position: absolute;
  top: 0;
  left: 25%;
  right: 25%;
  border-top: 1px solid var(--org-active);
}

.org-lane {
  position: relative;
  display: grid;
  gap: 12px;
  padding-top: 30px;
}

.org-lane::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  height: 30px;
  border-left: 1px solid var(--org-active);
}

.org-lane-label {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 2px;
  color: var(--exhibit-muted);
  font: 700 .62rem/1.3 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.org-lane-label::before {
  content: "";
  width: 20px;
  border-top: 2px solid var(--exhibit-blue);
}

.org-lane--pla .org-lane-label::before {
  border-color: var(--exhibit-amber);
}

.org-card {
  position: relative;
  width: 100%;
  min-height: 62px;
  padding: 12px 14px;
  border: 1px solid #315365;
  border-radius: 3px;
  background: #0f2029;
  color: var(--exhibit-ink);
  text-align: left;
  cursor: pointer;
  transition: opacity .3s cubic-bezier(.16,1,.3,1), border-color .3s cubic-bezier(.16,1,.3,1), background-color .3s cubic-bezier(.16,1,.3,1), transform .3s cubic-bezier(.16,1,.3,1);
}

.org-card + .org-card::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -13px;
  height: 12px;
  border-left: 1px solid #315365;
}

.org-lane--pla .org-card {
  border-color: #68583e;
  background: #211e19;
}

.org-card strong,
.org-card small {
  display: block;
}

.org-card strong {
  font-size: .8rem;
  line-height: 1.25;
}

.org-card small {
  margin-top: 4px;
  color: var(--exhibit-muted);
  font: .6rem/1.4 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .03em;
}

.org-card:hover,
.org-card.is-active,
.org-card:focus-visible {
  border-color: var(--org-active);
  background: #17313d;
  transform: translateY(-2px);
}

.org-card--command {
  max-width: 330px;
  border-top: 2px solid var(--exhibit-blue);
}

.org-convergence {
  position: relative;
  margin-top: 48px;
  padding-top: 30px;
}

.org-convergence::before {
  content: "";
  position: absolute;
  top: 0;
  left: 25%;
  right: 25%;
  height: 30px;
  border-top: 1px dashed var(--org-active);
  border-left: 1px dashed var(--org-active);
  border-right: 1px dashed var(--org-active);
}

.org-facility {
  padding: 18px;
  border: 1px solid #3c6e7f;
  border-top: 3px solid var(--exhibit-blue);
  background: #0c2731;
}

.org-facility-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: baseline;
  margin-bottom: 14px;
}

.org-facility-head strong {
  color: var(--exhibit-ink);
  font-size: .9rem;
}

.org-facility-head span {
  color: var(--exhibit-blue);
  font: 700 .58rem/1 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.org-facility-cells {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}

.org-facility .org-card {
  min-height: 70px;
  background: #10242d;
}

.org-facility .org-card::before {
  display: none;
}

.org-exhibit[data-org-view="operational"] .org-card:not(.is-operational) {
  opacity: .3;
}

.org-exhibit[data-org-view="operational"] .org-card.is-operational {
  border-color: var(--exhibit-amber);
}

.org-inspector,
.loop-inspector {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 26px 22px;
  border-left: 1px solid var(--exhibit-line);
  background: #0a151d;
}

.org-inspector h2,
.loop-inspector h2,
.attack-inspector h2 {
  margin: 0 0 10px;
  color: var(--exhibit-ink);
  font-size: 1.3rem;
  line-height: 1.15;
  letter-spacing: -.025em;
}

.org-inspector p,
.loop-inspector p,
.attack-inspector p {
  margin: 0;
  color: var(--exhibit-muted);
  font-size: .88rem;
  line-height: 1.65;
}

.org-route-key {
  display: grid;
  gap: 8px;
  margin-top: 22px;
  padding-top: 17px;
  border-top: 1px solid var(--exhibit-line);
}

.org-route-key span {
  color: var(--exhibit-muted);
  font: .63rem/1.4 ui-monospace, "SFMono-Regular", Consolas, monospace;
}

.org-route-key b {
  color: var(--exhibit-ink);
  font-weight: 700;
}

/* Closed-loop systems exhibit */
.loop-exhibit {
  --loop-active: var(--exhibit-blue);
}

.loop-exhibit[data-loop-mode="compromised"] {
  --loop-active: var(--exhibit-red);
}

.loop-canvas {
  position: relative;
  overflow: hidden;
  min-width: 0;
  background-color: var(--exhibit-bg);
  background-image: radial-gradient(circle at 50% 48%, rgba(88,184,222,.08), transparent 52%);
}

.loop-canvas svg {
  display: block;
  width: 100%;
  min-height: 590px;
}

.loop-orbit,
.loop-path,
.loop-exploit,
.loop-trust-line {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.loop-orbit {
  stroke: #294b5a;
  stroke-width: 1;
  stroke-dasharray: 3 8;
}

.loop-path {
  stroke: var(--exhibit-blue);
  stroke-width: 2.5;
  stroke-dasharray: 8 9;
  animation: exhibit-flow 1.8s linear infinite;
  transition: opacity .35s cubic-bezier(.16,1,.3,1);
}

.loop-exploit {
  opacity: 0;
  stroke: var(--exhibit-red);
  stroke-width: 4;
  stroke-dasharray: 11 9;
  animation: exhibit-flow 1s linear infinite;
  transition: opacity .35s cubic-bezier(.16,1,.3,1);
}

.loop-trust-line {
  stroke: var(--exhibit-amber);
  stroke-width: 1.5;
  stroke-dasharray: 3 6;
}

.loop-exhibit[data-loop-mode="compromised"] .loop-path {
  opacity: .18;
}

.loop-exhibit[data-loop-mode="compromised"] .loop-exploit {
  opacity: 1;
}

.loop-node {
  cursor: pointer;
}

.loop-node rect,
.loop-node circle {
  fill: #10212b;
  stroke: #42697a;
  stroke-width: 1.4;
  transition: fill .28s cubic-bezier(.16,1,.3,1), stroke .28s cubic-bezier(.16,1,.3,1), transform .28s cubic-bezier(.16,1,.3,1);
}

.loop-node:hover rect,
.loop-node:hover circle,
.loop-node.is-active rect,
.loop-node.is-active circle,
.loop-node:focus-visible rect,
.loop-node:focus-visible circle {
  fill: #17313d;
  stroke: var(--loop-active);
}

.loop-node text {
  pointer-events: none;
  fill: var(--exhibit-ink);
  font: 700 11px/1 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .04em;
}

.loop-node .loop-node-detail {
  fill: var(--exhibit-muted);
  font-size: 8px;
  font-weight: 500;
  letter-spacing: 0;
}

.loop-zone-label,
.loop-center-label {
  fill: var(--exhibit-muted);
  font: 700 9px/1 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .12em;
}

.loop-center-ring {
  fill: #0a171f;
  stroke: #315365;
  stroke-width: 1.5;
}

.loop-center-state {
  fill: var(--loop-active);
  transition: fill .3s cubic-bezier(.16,1,.3,1);
}

.loop-compromise-note {
  opacity: 0;
  transition: opacity .3s cubic-bezier(.16,1,.3,1);
}

.loop-compromise-note rect {
  fill: #3b2024;
  stroke: var(--exhibit-red);
}

.loop-compromise-note text {
  fill: #ffe7e7;
  font: 700 9px/1 ui-monospace, "SFMono-Regular", Consolas, monospace;
}

.loop-exhibit[data-loop-mode="compromised"] .loop-compromise-note {
  opacity: 1;
}

/* Attack progression exhibit */
.attack-map {
  overflow-x: auto;
  padding: 34px 28px 42px;
  background-color: var(--exhibit-bg);
  background-image: linear-gradient(90deg, rgba(121,175,201,.045) 1px, transparent 1px);
  background-size: 20% 100%;
}

.attack-track {
  display: grid;
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  min-width: 790px;
}

.attack-phase {
  position: relative;
  min-height: 318px;
  padding: 0 13px 18px;
  border-right: 1px solid #203b48;
  background: transparent;
  color: var(--exhibit-ink);
  text-align: left;
}

.attack-phase:last-child {
  border-right: 0;
}

.attack-phase::before {
  content: "";
  position: absolute;
  top: 80px;
  left: 0;
  right: 0;
  border-top: 2px solid #315365;
  transition: border-color .3s cubic-bezier(.16,1,.3,1);
}

.attack-phase::after {
  content: "";
  position: absolute;
  top: 75px;
  right: -1px;
  width: 10px;
  height: 10px;
  border-top: 2px solid #315365;
  border-right: 2px solid #315365;
  transform: rotate(45deg);
}

.attack-phase:last-child::after {
  display: none;
}

.attack-phase-select {
  appearance: none;
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.attack-phase-index,
.attack-phase-name,
.attack-event,
.attack-boundary {
  display: block;
}

.attack-phase-index {
  color: #617f90;
  font: 700 .62rem/1 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .1em;
}

.attack-phase-name {
  margin-top: 8px;
  font-size: 1rem;
  font-weight: 800;
}

.attack-marker {
  position: relative;
  z-index: 1;
  display: block;
  width: 17px;
  height: 17px;
  margin: 21px 0 26px;
  border: 4px solid var(--exhibit-bg);
  background: #537182;
  box-shadow: 0 0 0 1px #537182;
  transform: rotate(45deg);
  transition: background-color .3s cubic-bezier(.16,1,.3,1), box-shadow .3s cubic-bezier(.16,1,.3,1), transform .3s cubic-bezier(.16,1,.3,1);
}

.attack-event {
  appearance: none;
  display: block;
  width: 100%;
  min-height: 64px;
  padding: 11px;
  border: 1px solid #294754;
  background: #0d1b23;
  color: var(--exhibit-muted);
  font-family: inherit;
  font-size: .73rem;
  line-height: 1.45;
  text-align: left;
  cursor: pointer;
  transition: border-color .28s cubic-bezier(.16,1,.3,1), background-color .28s cubic-bezier(.16,1,.3,1), color .28s cubic-bezier(.16,1,.3,1), transform .28s cubic-bezier(.16,1,.3,1);
}

.attack-event + .attack-event {
  margin-top: 8px;
}

.attack-boundary {
  margin-top: 12px;
  color: #617f90;
  font: 700 .56rem/1.4 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.attack-phase:hover .attack-marker,
.attack-phase.is-active .attack-marker,
.attack-phase-select:focus-visible .attack-marker {
  background: var(--exhibit-red);
  box-shadow: 0 0 0 1px var(--exhibit-red), 0 0 20px rgba(216,88,88,.3);
  transform: rotate(45deg) scale(1.18);
}

.attack-phase.is-active::before {
  border-color: var(--exhibit-red);
}

.attack-event:hover,
.attack-event:focus-visible {
  border-color: #6d4b50;
  color: var(--exhibit-ink);
  transform: translateY(-1px);
}

.attack-event:active {
  transform: translateY(1px);
}

.attack-event.is-active {
  border-color: #87454a;
  background: #25191d;
  color: var(--exhibit-ink);
}

.attack-event.is-active::before {
  content: "ACTIVE / ";
  color: var(--exhibit-red);
  font: 700 .55rem/1 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .08em;
}

.attack-inspector {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(250px, .7fr);
  gap: 28px;
  align-items: start;
  padding: 24px 26px;
  border-top: 1px solid var(--exhibit-line);
  background: #0a151d;
}

.attack-inspector-meta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.attack-inspector-meta > div {
  padding: 9px 10px;
  border-left: 2px solid var(--exhibit-red);
  background: #101e26;
  color: var(--exhibit-muted);
  font: .6rem/1.45 ui-monospace, "SFMono-Regular", Consolas, monospace;
}

.attack-inspector-meta b,
.attack-inspector-meta > div > span {
  display: block;
}

.attack-inspector-meta b {
  color: var(--exhibit-ink);
  font-size: .65rem;
}

.attack-terminal {
  border-top: 1px solid var(--exhibit-line);
  background: #050a0e;
  color: #bbd1dc;
  font-family: ui-monospace, "SFMono-Regular", Consolas, monospace;
}

.attack-terminal-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 13px;
  align-items: center;
  min-height: 42px;
  padding: 9px 16px;
  border-bottom: 1px solid #1d3540;
  background: #0b141a;
  color: #6f8c9b;
  font-size: .58rem;
  line-height: 1;
  letter-spacing: .1em;
}

.attack-terminal-head strong {
  color: var(--exhibit-red);
  font-size: .57rem;
  text-align: right;
}

.attack-terminal-lamps {
  display: inline-grid;
  grid-auto-flow: column;
  gap: 5px;
}

.attack-terminal-lamps i {
  display: block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #36505c;
}

.attack-terminal-lamps i:first-child { background: var(--exhibit-red); }
.attack-terminal-lamps i:nth-child(2) { background: var(--exhibit-amber); }
.attack-terminal-lamps i:last-child { background: var(--exhibit-green); }

.attack-terminal-body {
  min-height: 230px;
  padding: 22px 24px 26px;
  background-image:
    linear-gradient(rgba(88,184,222,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(88,184,222,.018) 1px, transparent 1px);
  background-size: 100% 22px, 22px 100%;
}

.attack-terminal-body.is-refreshing > * {
  animation: terminal-refresh .42s cubic-bezier(.16,1,.3,1) both;
}

.attack-terminal-context,
.attack-terminal-command,
.attack-terminal-output p {
  margin: 0;
}

.attack-terminal-context {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: baseline;
  padding-bottom: 16px;
  border-bottom: 1px solid #162b34;
}

.attack-terminal-context span {
  color: #587786;
  font-size: .55rem;
  letter-spacing: .12em;
}

.attack-terminal-context strong {
  color: var(--exhibit-ink);
  font-size: .68rem;
  letter-spacing: .045em;
}

.attack-terminal-command {
  display: flex;
  gap: 9px;
  align-items: center;
  padding: 17px 0 15px;
  color: var(--exhibit-green);
  font-size: .72rem;
}

.attack-terminal-command > span {
  flex: 0 0 auto;
  color: var(--exhibit-blue);
}

.attack-terminal-command code {
  overflow-wrap: anywhere;
  color: #d8e6ed;
  font: inherit;
}

.attack-terminal-command i {
  display: inline-block;
  width: 7px;
  height: 14px;
  background: var(--exhibit-blue);
  animation: terminal-cursor 1.05s steps(1,end) infinite;
}

.attack-terminal-output {
  display: grid;
  gap: 7px;
}

.attack-terminal-output p {
  display: grid;
  grid-template-columns: 108px 70px minmax(0, 1fr);
  gap: 10px;
  align-items: baseline;
  color: #8fa8b5;
  font-size: .67rem;
  line-height: 1.6;
}

.attack-terminal-output time,
.attack-terminal-output b {
  color: #557482;
  font-size: .56rem;
  letter-spacing: .07em;
}

.attack-terminal-output b {
  color: var(--exhibit-amber);
}

.attack-terminal-note {
  margin-top: 6px !important;
  padding-top: 10px;
  border-top: 1px solid #162b34;
}

.attack-terminal-note b { color: var(--exhibit-green); }

@keyframes terminal-refresh {
  from { opacity: .25; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes terminal-cursor {
  0%, 48% { opacity: 1; }
  49%, 100% { opacity: 0; }
}

/* Stuxnet historical case file */
.stuxnet-page {
  max-width: 1050px;
}

.stuxnet-hero {
  display: grid;
  grid-template-columns: minmax(280px, .72fr) minmax(470px, 1.28fr);
  margin-bottom: 26px;
}

.stuxnet-hero-copy {
  position: relative;
  z-index: 1;
  padding: clamp(26px, 4vw, 48px);
  border-right: 1px solid var(--exhibit-line);
  background: #0b171f;
}

.stuxnet-hero-copy::after {
  content: "CASE / 2010";
  position: absolute;
  right: -28px;
  bottom: 58px;
  padding: 5px 9px;
  border: 1px solid #694149;
  background: #25191d;
  color: #d99696;
  font: 700 .52rem/1 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .11em;
  transform: rotate(-90deg);
}

.stuxnet-hero-copy h2,
.stuxnet-deception-copy h2,
.stuxnet-reading h2,
.stuxnet-era-inspector h2 {
  margin: 0;
  color: var(--exhibit-ink);
  letter-spacing: -.025em;
}

.stuxnet-hero-copy h2 {
  margin-top: 10px;
  font-size: clamp(1.5rem, 3vw, 2.4rem);
  line-height: 1.08;
}

.stuxnet-hero-copy > p:not(.exhibit-eyebrow) {
  margin: 20px 0 0;
  color: var(--exhibit-muted);
  font-size: .9rem;
  line-height: 1.75;
}

.stuxnet-facts {
  display: grid;
  gap: 0;
  margin: 30px 0 0;
}

.stuxnet-facts div {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  padding: 9px 0;
  border-top: 1px solid #203944;
}

.stuxnet-facts dt,
.stuxnet-facts dd {
  margin: 0;
  font: .63rem/1.4 ui-monospace, "SFMono-Regular", Consolas, monospace;
}

.stuxnet-facts dt { color: #698594; }
.stuxnet-facts dd { color: var(--exhibit-ink); text-align: right; }

.stuxnet-vault {
  position: relative;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  background: #071017;
}

.stuxnet-vault svg {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 440px;
}

.stuxnet-vault figcaption,
.stuxnet-signal-compare figcaption {
  position: absolute;
  right: 14px;
  bottom: 10px;
  color: #607b89;
  font: .52rem/1.4 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .04em;
}

.stux-signal-path {
  animation: stux-signal 3.2s linear infinite;
}

.stuxnet-timeline {
  margin: 26px 0;
}

.stuxnet-file-stamp {
  color: #688593;
  font: 700 .57rem/1.4 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .1em;
}

.stuxnet-era-track {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  padding: 30px 26px 24px;
  background-color: var(--exhibit-bg);
  background-image: linear-gradient(90deg, rgba(121,175,201,.045) 1px, transparent 1px);
  background-size: 25% 100%;
}

.stuxnet-era-track::before {
  content: "";
  position: absolute;
  left: calc(12.5% + 13px);
  right: calc(12.5% + 13px);
  top: 60px;
  border-top: 1px solid #385968;
}

.stuxnet-era {
  position: relative;
  appearance: none;
  min-height: 128px;
  padding: 0 13px 13px;
  border: 0;
  border-right: 1px solid #1d3742;
  background: transparent;
  color: var(--exhibit-muted);
  text-align: left;
  cursor: pointer;
}

.stuxnet-era:last-child { border-right: 0; }

.stuxnet-era::before {
  content: "";
  position: relative;
  z-index: 1;
  display: block;
  width: 13px;
  height: 13px;
  margin: 24px 0 19px;
  border: 4px solid var(--exhibit-bg);
  background: #55717f;
  box-shadow: 0 0 0 1px #55717f;
  transform: rotate(45deg);
  transition: transform .3s cubic-bezier(.16,1,.3,1), background-color .3s cubic-bezier(.16,1,.3,1), box-shadow .3s cubic-bezier(.16,1,.3,1);
}

.stuxnet-era > span,
.stuxnet-era > strong,
.stuxnet-era > small {
  display: block;
}

.stuxnet-era > span {
  position: absolute;
  top: 0;
  color: #6b8795;
  font: 700 .6rem/1 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .09em;
}

.stuxnet-era > strong {
  color: var(--exhibit-ink);
  font-size: .8rem;
}

.stuxnet-era > small {
  margin-top: 3px;
  color: #6d8794;
  font: .57rem/1.4 ui-monospace, "SFMono-Regular", Consolas, monospace;
}

.stuxnet-era:hover::before,
.stuxnet-era:focus-visible::before,
.stuxnet-era.is-active::before {
  background: var(--exhibit-red);
  box-shadow: 0 0 0 1px var(--exhibit-red), 0 0 18px rgba(216,88,88,.25);
  transform: rotate(45deg) scale(1.18);
}

.stuxnet-era:active { transform: translateY(1px); }

.stuxnet-era-inspector {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .72fr);
  gap: 36px;
  padding: 28px;
  border-top: 1px solid var(--exhibit-line);
  background: #0b171f;
}

.stuxnet-era-inspector h2 {
  margin-top: 7px;
  font-size: clamp(1.25rem, 2.4vw, 1.75rem);
}

.stuxnet-era-inspector p {
  max-width: 68ch;
  margin: 12px 0 0;
  color: var(--exhibit-muted);
  font-size: .85rem;
  line-height: 1.7;
}

.stuxnet-era-inspector dl {
  display: grid;
  gap: 8px;
  margin: 0;
}

.stuxnet-era-inspector dl > div {
  padding: 10px 12px;
  border-left: 2px solid var(--exhibit-red);
  background: #101e26;
}

.stuxnet-era-inspector dt,
.stuxnet-era-inspector dd {
  margin: 0;
}

.stuxnet-era-inspector dt {
  color: #698594;
  font: 700 .54rem/1.4 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.stuxnet-era-inspector dd {
  margin-top: 4px;
  color: var(--exhibit-ink);
  font-size: .72rem;
  line-height: 1.45;
}

.stuxnet-deception {
  display: grid;
  grid-template-columns: minmax(250px, .62fr) minmax(480px, 1.38fr);
  margin: 26px 0;
  border: 1px solid var(--exhibit-line);
  background: #0a151d;
}

.stuxnet-deception-copy {
  padding: clamp(25px, 4vw, 44px);
  border-right: 1px solid var(--exhibit-line);
}

.stuxnet-deception-copy h2 {
  margin-top: 9px;
  font-size: clamp(1.45rem, 2.8vw, 2.2rem);
  line-height: 1.1;
}

.stuxnet-deception-copy > p:not(.exhibit-eyebrow) {
  margin: 17px 0 0;
  color: var(--exhibit-muted);
  font-size: .87rem;
  line-height: 1.75;
}

.stuxnet-deception-copy strong { color: var(--exhibit-ink); }

.stuxnet-signal-compare {
  position: relative;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  background: #071017;
}

.stuxnet-signal-compare svg {
  display: block;
  width: 100%;
  min-height: 300px;
}

.stux-physical-trace,
.stux-reported-trace {
  stroke-dasharray: 8 6;
  animation: stux-trace 2.8s linear infinite;
}

.stux-reported-trace { animation-duration: 4.2s; }

.stuxnet-reading {
  display: grid;
  grid-template-columns: minmax(240px, .55fr) minmax(0, 1.45fr);
  gap: 42px;
  margin-top: 30px;
  padding: 34px 4px 10px;
  border-top: 1px solid var(--exhibit-line);
}

.stuxnet-reading h2 {
  margin-top: 8px;
  font-size: clamp(1.5rem, 3vw, 2.2rem);
  line-height: 1.1;
}

.stuxnet-reading > div:last-child > p {
  max-width: 68ch;
  margin: 0 0 17px;
  color: var(--exhibit-muted);
  font-size: .92rem;
  line-height: 1.8;
}

.stuxnet-reading blockquote {
  margin: 30px 0 24px;
  padding: 10px 0 10px 22px;
  border-left: 2px solid var(--exhibit-red);
  color: var(--exhibit-ink);
  font-size: 1.05rem;
  font-style: italic;
}

.stuxnet-reading small {
  color: #64808e;
  font: .58rem/1.5 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .06em;
  text-transform: uppercase;
}

@keyframes stux-signal {
  to { stroke-dashoffset: -60; }
}

@keyframes stux-trace {
  to { stroke-dashoffset: -42; }
}

/* Compact links from long-form dossiers to the canonical exhibits */
.exhibit-gateway {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 20px;
  align-items: center;
  margin: 28px 0;
  padding: 22px 24px;
  border: 1px solid var(--exhibit-line);
  border-left: 3px solid var(--exhibit-blue);
  background: #0a151d;
}

.exhibit-gateway--danger {
  border-left-color: var(--exhibit-red);
}

.exhibit-gateway p,
.exhibit-gateway h2,
.exhibit-gateway h3 {
  margin: 0;
}

.exhibit-gateway h2,
.exhibit-gateway h3 {
  color: var(--exhibit-ink);
  font-size: 1.12rem;
}

.exhibit-gateway p {
  margin-top: 5px;
  color: var(--exhibit-muted);
  font-size: .86rem;
  line-height: 1.6;
}

.exhibit-gateway a {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  padding: 9px 13px;
  border: 1px solid var(--exhibit-blue);
  border-radius: 3px;
  color: var(--exhibit-ink);
  font: 700 .68rem/1 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .04em;
  white-space: nowrap;
  transition: background-color .25s cubic-bezier(.16,1,.3,1), transform .25s cubic-bezier(.16,1,.3,1);
}

.exhibit-gateway a:hover {
  background: #17313d;
  transform: translateY(-2px);
}

/* Reference-file maps */
.location-network {
  position: relative;
  min-height: 480px;
  overflow: hidden;
  border: 1px solid var(--exhibit-line);
  background-color: var(--exhibit-bg);
  background-image:
    linear-gradient(var(--exhibit-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--exhibit-grid) 1px, transparent 1px);
  background-size: 32px 32px;
}

.location-network::before,
.location-network::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  background: #315365;
  transform: translate(-50%, -50%);
}

.location-network::before {
  width: 62%;
  height: 1px;
}

.location-network::after {
  width: 1px;
  height: 64%;
}

.location-node,
.location-network-hub {
  position: absolute;
  z-index: 1;
  border: 1px solid #315365;
  background: #0e2029;
}

.location-node {
  width: min(250px, 34%);
  min-height: 104px;
  padding: 15px 16px;
}

.location-node--detroit { top: 38px; left: 34px; border-top: 3px solid var(--exhibit-blue); }
.location-node--dc { top: 38px; right: 34px; border-top: 3px solid var(--exhibit-amber); }
.location-node--illinois { bottom: 38px; left: 34px; border-top: 3px solid var(--exhibit-green); }
.location-node--fac { right: 34px; bottom: 38px; border-top: 3px solid var(--exhibit-red); }

.location-node span,
.location-node strong,
.location-node small {
  display: block;
}

.location-node span {
  color: var(--exhibit-muted);
  font: 700 .56rem/1 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.location-node strong {
  margin-top: 8px;
  color: var(--exhibit-ink);
  font-size: .9rem;
}

.location-node small {
  margin-top: 4px;
  color: var(--exhibit-muted);
  font-size: .7rem;
  line-height: 1.45;
}

.location-network-hub {
  left: 50%;
  top: 50%;
  width: 164px;
  min-height: 74px;
  padding: 13px;
  border-color: var(--exhibit-blue);
  color: var(--exhibit-ink);
  text-align: center;
  transform: translate(-50%, -50%);
}

.location-network-hub strong,
.location-network-hub span {
  display: block;
}

.location-network-hub strong {
  font-size: .8rem;
}

.location-network-hub span {
  margin-top: 5px;
  color: var(--exhibit-muted);
  font: .58rem/1.4 ui-monospace, "SFMono-Regular", Consolas, monospace;
}

.location-route-label {
  position: absolute;
  z-index: 2;
  padding: 4px 6px;
  border: 1px solid var(--exhibit-line);
  background: #0a151d;
  color: var(--exhibit-muted);
  font: 700 .52rem/1 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.location-route-label--intel { top: 50%; left: 19%; transform: translateY(-50%); }
.location-route-label--oversight { top: 50%; right: 16%; transform: translateY(-50%); }
.location-route-label--research { bottom: 23%; left: 50%; transform: translateX(-50%); }
.location-route-label--attack { top: 22%; left: 50%; transform: translateX(-50%); }

.agency-response-map {
  overflow-x: auto;
  margin: 2rem 0;
  border: 1px solid var(--exhibit-line);
  background: var(--exhibit-bg);
  -webkit-overflow-scrolling: touch;
}

.agency-response-inner {
  min-width: 790px;
  padding: 24px;
}

.agency-command {
  position: relative;
  width: 300px;
  margin: 0 auto 50px;
  padding: 13px 15px;
  border: 1px solid var(--exhibit-amber);
  border-top: 3px solid var(--exhibit-amber);
  background: #221e18;
  color: var(--exhibit-ink);
  text-align: center;
}

.agency-command::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 100%;
  height: 50px;
  border-left: 1px solid var(--exhibit-amber);
}

.agency-command strong,
.agency-command small {
  display: block;
}

.agency-command small {
  margin-top: 4px;
  color: var(--exhibit-muted);
  font: .58rem/1.4 ui-monospace, "SFMono-Regular", Consolas, monospace;
}

.agency-lanes {
  position: relative;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 10px;
}

.agency-lanes::before {
  content: "";
  position: absolute;
  left: 10%;
  right: 10%;
  top: 0;
  border-top: 1px solid var(--exhibit-amber);
}

.agency-group {
  position: relative;
  padding-top: 25px;
}

.agency-group::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  height: 25px;
  border-left: 1px solid var(--exhibit-amber);
}

.agency-group h3 {
  min-height: 42px;
  margin: 0;
  padding: 9px 8px;
  border: 1px solid #355565;
  border-top: 2px solid var(--exhibit-blue);
  background: #10212b;
  color: var(--exhibit-ink);
  font: 700 .62rem/1.35 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .04em;
  text-align: center;
  text-transform: uppercase;
}

.agency-group--food h3 { border-top-color: var(--exhibit-green); }
.agency-group--defense h3 { border-top-color: var(--exhibit-amber); }

.agency-group ul {
  display: grid;
  gap: 6px;
  margin: 7px 0 0;
  padding: 0;
  list-style: none;
}

.agency-group li {
  min-height: 48px;
  padding: 8px;
  border: 1px solid #263f4b;
  background: #0c1921;
  color: var(--exhibit-muted);
  font-size: .62rem;
  line-height: 1.35;
}

.agency-group li strong {
  display: block;
  color: var(--exhibit-ink);
  font-size: .67rem;
}

.agency-seam {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  align-items: center;
  margin-top: 20px;
  padding: 13px 15px;
  border: 1px solid #724044;
  background: #24191c;
}

.agency-seam strong {
  color: var(--exhibit-red);
  font: 700 .62rem/1 ui-monospace, "SFMono-Regular", Consolas, monospace;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.agency-seam span {
  color: var(--exhibit-muted);
  font-size: .75rem;
  line-height: 1.5;
}

@keyframes exhibit-flow {
  to { stroke-dashoffset: -30; }
}

@keyframes bio-pulse {
  from { opacity: .28; transform: scale(.78); }
  to { opacity: 1; transform: scale(1.2); }
}

@keyframes bio-ring {
  to { transform: rotate(360deg); }
}

@keyframes molecule-draw {
  to { stroke-dashoffset: 0; }
}

@media (max-width: 1120px) {
  .exhibit-toolbar { grid-template-columns: 1fr; }
  .exhibit-control-group { justify-self: start; }
  .system-stage-wrap { grid-template-columns: 1fr; }
  .system-stage svg { min-height: 560px; }
  .system-inspector { min-height: 220px; border-top: 1px solid var(--exhibit-line); border-left: 0; }
  .bio-stage-wrap { grid-template-columns: 1fr; }
  .bio-narrative { border-top: 1px solid var(--exhibit-line); border-left: 0; }
  .bio-narrative > p { min-height: 0; }
  .bio-molecule { max-width: 420px; }
  .org-stage-wrap,
  .loop-stage-wrap { grid-template-columns: 1fr; }
  .org-inspector,
  .loop-inspector { min-height: 210px; border-top: 1px solid var(--exhibit-line); border-left: 0; }
  .stuxnet-hero,
  .stuxnet-deception,
  .stuxnet-reading { grid-template-columns: 1fr; }
  .stuxnet-hero-copy,
  .stuxnet-deception-copy { border-right: 0; border-bottom: 1px solid var(--exhibit-line); }
  .stuxnet-hero-copy::after { right: 12px; bottom: -13px; transform: none; }
  .stuxnet-vault svg { min-height: 390px; }
  .stuxnet-reading { gap: 22px; }
}

@media (max-width: 760px) {
  .exhibit-page { padding-bottom: 28px; }
  .exhibit-intro { grid-template-columns: 1fr; gap: 16px; margin-top: 0; }
  .exhibit-intro h1 { font-size: clamp(1.9rem, 10vw, 2.7rem); }
  .exhibit-toolbar { padding: 14px; }
  .exhibit-control-group { width: 100%; grid-auto-flow: row; grid-template-columns: 1fr 1fr; }
  .exhibit-control:last-child:nth-child(3) { grid-column: 1 / -1; }
  .system-stage { overflow-x: auto; }
  .mobile-diagram-hint {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 1;
    display: block;
    margin: 0;
    padding: 6px 8px;
    border: 1px solid var(--exhibit-line);
    background: #0a151d;
    color: var(--exhibit-muted);
    font: 700 .6rem/1.3 ui-monospace, "SFMono-Regular", Consolas, monospace;
    letter-spacing: .06em;
    text-transform: uppercase;
    pointer-events: none;
  }
  .system-stage svg { width: 760px; min-height: 540px; }
  .system-inspector { padding: 22px 18px; }
  .bio-visual { min-height: 440px; }
  .bio-visual > svg { min-width: 620px; min-height: 440px; transform: translateX(-68px); }
  .bio-narrative { padding: 22px 18px; }
  .bio-progress { grid-template-columns: 1fr 1fr; }
  .bio-step-button { min-height: 62px; border-bottom: 1px solid var(--exhibit-line); }
  .technical-scroll .mermaid { min-width: 720px; }
  .org-map { padding: 24px 16px; }
  .org-lanes { gap: 16px; }
  .org-facility-cells { grid-template-columns: 1fr; }
  .org-facility .org-card { min-height: 58px; }
  .loop-canvas { overflow-x: auto; }
  .loop-canvas svg { width: 760px; min-height: 540px; }
  .attack-map { padding-right: 14px; padding-left: 14px; }
  .attack-inspector { grid-template-columns: 1fr; padding: 22px 18px; }
  .attack-terminal-head { grid-template-columns: auto 1fr; }
  .attack-terminal-head strong { grid-column: 2; text-align: left; }
  .attack-terminal-body { min-height: 270px; padding: 19px 16px 22px; }
  .attack-terminal-command { align-items: flex-start; flex-wrap: wrap; }
  .attack-terminal-output p { grid-template-columns: 80px minmax(0, 1fr); gap: 5px 8px; }
  .attack-terminal-output p > span { grid-column: 1 / -1; padding-left: 0; }
  .stuxnet-hero-copy,
  .stuxnet-deception-copy { padding: 24px 19px; }
  .stuxnet-vault { overflow-x: auto; }
  .stuxnet-vault svg { width: 700px; min-height: 420px; }
  .stuxnet-era-track { grid-template-columns: 1fr; padding: 18px; }
  .stuxnet-era-track::before {
    left: 37px;
    right: auto;
    top: 48px;
    bottom: 48px;
    border-top: 0;
    border-left: 1px solid #385968;
  }
  .stuxnet-era {
    min-height: 94px;
    padding: 13px 10px 13px 56px;
    border-right: 0;
    border-bottom: 1px solid #1d3742;
  }
  .stuxnet-era:last-child { border-bottom: 0; }
  .stuxnet-era::before { position: absolute; left: 13px; top: 29px; margin: 0; }
  .stuxnet-era > span { position: static; margin-bottom: 9px; }
  .stuxnet-era-inspector { grid-template-columns: 1fr; gap: 20px; padding: 22px 18px; }
  .stuxnet-signal-compare { overflow-x: auto; }
  .stuxnet-signal-compare svg { width: 660px; }
  .stuxnet-signal-compare figcaption,
  .stuxnet-vault figcaption { position: static; display: block; padding: 9px 12px; }
  .stuxnet-reading { padding-right: 2px; padding-left: 2px; }
  .exhibit-gateway { grid-template-columns: 1fr; padding: 19px; }
  .exhibit-gateway a { justify-self: start; }
  .location-network { min-height: auto; padding: 16px; }
  .location-network::before,
  .location-network::after,
  .location-route-label { display: none; }
  .location-node,
  .location-network-hub {
    position: relative;
    inset: auto;
    width: 100%;
    min-height: 0;
    margin-bottom: 10px;
    transform: none;
  }
  .location-network-hub { margin-bottom: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .system-flow,
  .system-compromise path,
  .bio-ros circle,
  .bio-alert-ring,
  .molecule-change {
    animation: none !important;
  }

  .system-plane,
  .system-plane-edge,
  .system-node,
  .system-link-field,
  .system-compromise,
  .system-callout,
  .bio-beam,
  .bio-leaf,
  .bio-ros,
  .bio-accumulation,
  .bio-alert-ring,
  .bio-molecule {
    transition-duration: .01ms !important;
  }

  .loop-path,
  .loop-exploit,
  .stux-signal-path,
  .stux-physical-trace,
  .stux-reported-trace,
  .attack-terminal-command i {
    animation: none !important;
  }

  .molecule-change { stroke-dashoffset: 0; }
}
