:root {
  --paper:#f5f3ec;
  --ink:#262923;
  --muted:#6b6e64;
  --line:#cfcec3;
  --accent:#8a4632;
  --soft:#e9e8df;
  --serif:Georgia,'Times New Roman',serif;
  --mono:ui-monospace,SFMono-Regular,Consolas,monospace;
}
* {
  box-sizing:border-box;
}
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font:15px/1.6 system-ui,-apple-system,sans-serif;
}
.sheet {
  max-width:1440px;
  margin:auto;
  padding:32px 64px 24px;
}
button,a,summary,audio,textarea {
  touch-action:manipulation;
}
button {
  font:inherit;
  cursor:pointer;
}
button:disabled {
  opacity:.5;
  cursor:wait;
}
button:focus-visible,a:focus-visible,summary:focus-visible {
  outline:2px solid var(--accent);
  outline-offset:5px;
}
a {
  color:var(--accent);
  text-underline-offset:4px;
}
header {
  border-bottom:1px solid var(--ink);
  padding-bottom:24px;
}
.edition,.section-line {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  font:10px/1.5 var(--mono);
  letter-spacing:.09em;
}
.edition {
  color:var(--muted);
  margin-bottom:34px;
}
h1 {
  font:normal clamp(27px,4.4vw,59px)/1.05 var(--serif);
  letter-spacing:-.035em;
  margin:0 0 16px;
}
.subhead {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
}
.subhead p {
  font:italic 23px var(--serif);
  margin:0;
}
.specimen {
  font:11px var(--mono);
  color:var(--muted);
}
h2 {
  font:inherit;
  margin:0;
}
h3 {
  font:normal 20px var(--serif);
  margin:22px 0 6px;
}
p {
  margin:0 0 12px;
}
.small,.source {
  font-size:11px;
  color:var(--muted);
  line-height:1.6;
}
.small {
  margin:0;
}
.muted {
  color:var(--muted);
}
.text-button {
  color:var(--accent);
  font:11px var(--mono);
  background:none;
  border:0;
  padding:5px 0;
  letter-spacing:0;
}
.text-button:hover {
  text-decoration:underline;
  text-underline-offset:5px;
}
#entry {
  padding:34px 0 40px;
}
textarea {
  display:block;
  resize:vertical;
  min-height:325px;
  width:100%;
  border:0;
  border-bottom:1px solid var(--line);
  background:transparent;
  padding:28px 0 20px;
  outline:none;
  font:24px/1.65 var(--serif);
  color:var(--ink);
  border-radius:0;
}
textarea::placeholder {
  color:#94978c;
}
textarea:focus {
  border-bottom-color:var(--accent);
}
.entry-foot {
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding:12px 0;
}
.source:empty {
  display:none;
}
.source {
  margin-bottom:6px;
}
.submit-row {
  display:flex;
  align-items:center;
  gap:26px;
  margin-top:24px;
}
.primary {
  border:1px solid var(--ink);
  background:var(--ink);
  color:var(--paper);
  min-height:52px;
  padding:0 22px;
  font:12px var(--mono);
  letter-spacing:.1em;
  min-width:230px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:35px;
}
.primary:hover {
  background:#444a3d;
}
.primary span {
  font-size:22px;
}
.submit-row p {
  font-size:11px;
  color:var(--muted);
  margin:0;
}
.method {
  border-top:1px solid var(--line);
  padding:19px 0;
}
.method summary {
  font:11px/1.5 var(--mono);
  letter-spacing:.09em;
  cursor:pointer;
}
.method summary span {
  font:12px system-ui;
  color:var(--muted);
  letter-spacing:0;
  margin-left:20px;
}
.method-content {
  max-width:750px;
  padding:24px 0 8px;
  line-height:1.8;
}
.method-content a {
  font-size:12px;
}
footer {
  border-top:1px solid var(--line);
  padding-top:18px;
  color:var(--muted);
}
footer p {
  font:9px/1.8 var(--mono);
  letter-spacing:.06em;
}
footer span {
  font-size:10px;
}
#progress-panel {
  padding:60px 0 90px;
  max-width:800px;
}
#stage {
  font:30px var(--serif);
  margin:30px 0 20px;
}
progress {
  display:block;
  width:100%;
  height:3px;
  accent-color:var(--accent);
  margin-bottom:24px;
}
#error {
  border-left:2px solid var(--accent);
  padding:15px;
  margin:20px 0;
  color:var(--accent);
  background:var(--soft);
}
#replay {
  padding:28px 0 30px;
}
.replay-heading {
  margin-bottom:30px;
}
.instrument {
  display:grid;
  grid-template-columns:1fr 1.1fr;
  gap:44px;
}
.poem-pane {
  min-width:0;
}
.response-pane {
  border-left:1px solid var(--line);
  padding-left:35px;
  min-width:0;
}
#spoken-poem {
  margin:26px 0;
  min-height:265px;
  max-height:600px;
  overflow:auto;
  font:22px/1.8 var(--serif);
}
.poem-line {
  border-left:2px solid transparent;
  padding:3px 8px 3px 15px;
  margin-left:0;
  transition:background .15s,color .15s;
  color:var(--muted);
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}
.poem-line.active {
  border-color:var(--accent);
  color:var(--ink);
  background:var(--soft);
}
.line-number {
  font:9px var(--mono);
  color:#92958a;
  display:inline-block;
  min-width:25px;
  vertical-align:middle;
}
audio {
  width:100%;
  height:38px;
  margin:14px 0 6px;
}
.live-rate {
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:10px;
  margin:20px 0 20px;
}
.live-rate>div>span {
  font:40px var(--serif);
  font-variant-numeric:tabular-nums;
}
.live-rate small {
  font:10px var(--mono);
  margin-left:8px;
  color:var(--muted);
}
.delta {
  font:11px var(--mono);
  color:var(--accent);
}
.chart-title {
  font:9px var(--mono);
  display:flex;
  justify-content:space-between;
  gap:10px;
  color:var(--muted);
}
.chart-title small {
  font:9px var(--mono);
  margin-left:6px;
  color:#888b7f;
}
svg {
  display:block;
  width:100%;
  height:auto;
  overflow:visible;
}
.chart-path {
  fill:none;
  stroke:var(--ink);
  stroke-width:1.3;
  vector-effect:non-scaling-stroke;
}
.envelope-path {
  fill:var(--soft);
  stroke:#7a8171;
  stroke-width:1;
  vector-effect:non-scaling-stroke;
}
.cursor {
  stroke:var(--accent);
  stroke-width:1;
  vector-effect:non-scaling-stroke;
}
.baseline {
  stroke:#999d91;
  stroke-dasharray:4 4;
  stroke-width:1;
}
.axis-text {
  fill:var(--muted);
  font:10px var(--mono);
}
.chart-band {
  fill:var(--soft);
  opacity:.8;
}
.event-mark {
  fill:var(--accent);
}
.population-label {
  border-bottom:1px solid var(--line);
  padding-bottom:8px;
  margin-top:20px;
}
.live-pop {
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:7px 0;
  border-bottom:1px solid #e1e0d6;
  font:11px var(--mono);
}
.live-pop span:last-child {
  font-variant-numeric:tabular-nums;
}
.response-pane>.small {
  margin-top:14px;
}
.record-foot {
  display:flex;
  justify-content:space-between;
  gap:20px;
  border-top:1px solid var(--line);
  margin-top:28px;
  padding-top:15px;
}
#results {
  border-top:1px solid var(--ink);
}
.measurements {
  padding:32px 0;
}
.measurements>.section-line h2,.reading-section h2 {
  font:23px var(--serif);
  letter-spacing:0;
}
.section-description {
  font:italic 17px var(--serif);
  color:var(--muted);
  margin:12px 0 28px;
}
.metrics {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:22px;
  margin:0 0 32px;
}
.metric {
  border-top:1px solid var(--line);
  padding-top:10px;
}
.metric-label {
  font:10px var(--mono);
  color:var(--muted);
}
.metric-value {
  font:27px/1.8 var(--serif);
}
.metric-note {
  font-size:10px;
  color:var(--muted);
}
.tables {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:35px;
}
.table-wrap {
  overflow:auto;
}
table {
  width:100%;
  border-collapse:collapse;
  font:11px/1.6 var(--mono);
  margin:14px 0 20px;
}
th,td {
  text-align:right;
  border-bottom:1px solid var(--line);
  padding:9px 5px;
  vertical-align:top;
}
th {
  color:var(--muted);
  font-weight:normal;
  font-size:9px;
}
th:first-child,td:first-child {
  text-align:left;
  padding-left:0;
}
td:first-child {
  overflow-wrap:anywhere;
  max-width:200px;
}
th:last-child,td:last-child {
  padding-right:0;
}
details:not(.method)>summary {
  cursor:pointer;
  font:11px var(--mono);
  padding:15px 0;
  color:var(--accent);
}
.caution {
  margin-top:16px;
}
.reading-section {
  padding:30px 0;
  border-top:1px solid var(--ink);
}
#reading-text {
  font:24px/1.7 var(--serif);
  max-width:980px;
  margin:26px 0 22px;
}
.reading-section>.small {
  margin-bottom:14px;
}
pre {
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  max-height:440px;
  overflow:auto;
  background:var(--soft);
  padding:18px;
  font:10px/1.7 var(--mono);
}
.downloads {
  display:flex;
  flex-wrap:wrap;
  gap:12px 24px;
  padding:15px 0;
}
.downloads a {
  font:11px var(--mono);
}
#provenance {
  border-top:1px solid var(--line);
  padding-bottom:18px;
}
#events p {
  font:11px/1.8 var(--mono);
}
[hidden] {
  display:none!important;
}
@media(min-width:1500px) {
  .sheet {
    padding-top:45px;
  }
}
@media(max-width:1000px) {
  .sheet {
    padding:24px 32px;
  }
  .instrument {
    gap:25px;
  }
  .response-pane {
    padding-left:25px;
  }
  .live-rate {
    flex-wrap:wrap;
    gap:0;
  }
  .tables {
    grid-template-columns:1fr;
  }
  .metrics {
    grid-template-columns:repeat(2,1fr);
  }
  #spoken-poem {
    font-size:20px;
  }
  .specimen {
    font-size:9px;
  }
}
@media(max-width:700px) {
  .sheet {
    padding:20px;
  }
  .edition {
    font-size:8px;
    gap:20px;
    margin-bottom:25px;
  }
  .subhead {
    align-items:flex-start;
    flex-direction:column;
    gap:12px;
  }
  .subhead p {
    font-size:21px;
  }
  h1 {
    font-size:clamp(25px,6.6vw,42px);
    letter-spacing:-.045em;
  }
  .section-line {
    font-size:9px;
    gap:12px;
  }
  .text-button {
    font-size:10px;
  }
  textarea {
    font-size:21px;
    min-height:280px;
  }
  .entry-foot {
    align-items:flex-start;
  }
  .submit-row {
    align-items:flex-start;
    flex-direction:column;
    gap:16px;
  }
  .primary {
    width:100%;
  }
  .submit-row p br {
    display:none;
  }
  .method summary span {
    display:block;
    margin:10px 0 0 16px;
    font-size:11px;
  }
  .instrument {
    grid-template-columns:1fr;
    gap:35px;
  }
  .response-pane {
    border-left:0;
    border-top:1px solid var(--line);
    padding:24px 0 0;
  }
  #spoken-poem {
    min-height:0;
    max-height:340px;
  }
  .replay-heading {
    align-items:flex-start;
  }
  .live-rate {
    justify-content:space-between;
  }
  .record-foot {
    flex-direction:column;
    align-items:flex-start;
  }
  .metrics {
    gap:18px;
  }
  .metric-value {
    font-size:25px;
  }
  #reading-text {
    font-size:21px;
  }
  .measurements>.section-line,.reading-section>.section-line {
    align-items:flex-start;
  }
  .measurements>.section-line>span,.reading-section>.section-line>span {
    font-size:8px;
    max-width:130px;
    text-align:right;
  }
  footer p {
    font-size:8px;
  }
  .tables {
    gap:8px;
  }
}
@media(prefers-reduced-motion:reduce) {
  * {
    scroll-behavior:auto!important;
    transition:none!important;
  }
}
/* The specimen is a view of recorded measurements, never a behavioral decoder. */
.instrument { grid-template-columns:1.35fr 1fr; gap:32px; }
.response-pane { padding-left:28px; }
.specimen-stage { position:relative; height:340px; margin-top:16px; background:radial-gradient(ellipse at 50% 75%,#e7e3d6, #f0eee5 65%,#f5f3ec); border:1px solid var(--line); overflow:hidden; }
#fly-scene { width:100%; height:100%; }
#fly-scene canvas { display:block; width:100%; height:100%; }
.scene-top,.scene-bottom { position:absolute; left:14px; right:14px; display:flex; justify-content:space-between; gap:12px; align-items:center; font:8px/1.5 var(--mono); letter-spacing:.05em; pointer-events:none; color:var(--muted); }
.scene-top { top:12px; align-items:flex-start; }
.scene-top .text-button { pointer-events:auto; font-size:9px; flex-shrink:0; padding:0; }
.scene-bottom { bottom:12px; }
.scene-caption { font-size:9px; line-height:1.6; color:var(--muted); margin:8px 0 0; }
.current-verse { margin:20px 0 16px; min-height:86px; }
.current-verse>span { font:9px var(--mono); color:var(--accent); letter-spacing:.1em; }
.current-verse p { font:italic 25px/1.4 var(--serif); margin:8px 0 0; overflow-wrap:anywhere; }
.player { display:flex; align-items:center; gap:14px; border-top:1px solid var(--line); padding:14px 0 8px; }
.play-button { background:var(--ink); color:var(--paper); border:0; min-width:74px; height:36px; font:10px var(--mono); letter-spacing:.08em; }
#seek { accent-color:var(--accent); min-width:0; flex:1; }
#player-time { font:9px var(--mono); white-space:nowrap; }
.voice-credit { display:flex; justify-content:space-between; gap:12px; font:9px/1.6 var(--mono); color:var(--muted); margin-bottom:12px; }
.voice-credit a { white-space:nowrap; }
.poem-transcript { margin-top:12px; border-top:1px solid var(--line); }
#spoken-poem { min-height:0; max-height:200px; margin:0 0 18px; font-size:18px; }
@media(max-width:1000px) { .specimen-stage { height:300px; } .instrument { gap:24px; } .response-pane { padding-left:20px; } .current-verse p { font-size:22px; } .player { flex-wrap:wrap; } #player-time { margin-left:auto; } }
@media(max-width:700px) { .instrument { grid-template-columns:1fr; } .specimen-stage { height:280px; } .response-pane { padding-left:0; } .scene-top { font-size:7px; } .current-verse { min-height:70px; } }

.edition-notice { border-bottom:1px solid var(--line); padding:18px 0; font:11px/1.8 var(--mono); color:var(--muted); max-width:960px; }
/* The listening chamber pairs an illustrative body with independently recorded neural evidence. */
.listening-room { background:#101c21; color:#e4e9df; padding:24px; border:1px solid #39494b; --ink:#e4e9df; --muted:#a4b5b5; --line:#3a4c4f; --soft:#233438; --accent:#edba77; }
.chamber-title { display:flex; justify-content:space-between; gap:20px; font:9px/1.6 var(--mono); letter-spacing:.13em; color:#a8bcba; border-bottom:1px solid #3a4c4f; padding-bottom:16px; margin-bottom:22px; }
.instrument {grid-template-columns:1.3fr 1fr;gap:28px;}
.specimen-stage {height:420px;background:radial-gradient(ellipse at 45% 45%,#3a4c4d,#18292e 65%,#101c21);border-color:#3a4c4f;}
.scene-top,.scene-bottom {color:#becdc8;}
.scene-top {font-size:7px;}
.scene-caption {color:#a4b5b5;}
.neural-volume {height:245px;position:relative;background:#091317;margin:16px 0 8px;border:1px solid #304347;}
#neural-scene {height:100%;width:100%;}
#neural-scene canvas {display:block;}
.neural-tag,#spatial-count {position:absolute;left:12px;font:8px var(--mono);letter-spacing:.08em;color:#a4b5b5;pointer-events:none;}
.neural-tag {top:12px;} #spatial-count {bottom:12px;color:#edba77;}
#neural-caption {font-size:9px;line-height:1.5;}
.live-rate {margin:12px 0;}.live-rate>div>span {font-size:30px;}
.chart-path {stroke:#edba77;}.control-path {fill:none;stroke:#77bdcf;stroke-width:1.3;stroke-dasharray:5 3;vector-effect:non-scaling-stroke;}
.listening-room .play-button {background:#edba77;color:#101c21;}
.listening-room .live-pop {border-color:#304347;font-size:9px;}.live-pop span:last-child {white-space:nowrap;}
.current-verse {border-left:2px solid #edba77;padding-left:16px;min-height:76px;}
.current-verse p {font-size:30px;}
.benchmark-panel {margin-top:24px;padding:20px 0;border-top:1px solid var(--ink);}
#benchmark-verdict {font:20px/1.6 var(--serif);margin:18px 0 10px;max-width:1000px;}
@media(max-width:1000px){.listening-room{padding:18px;}.specimen-stage{height:360px;}.instrument{gap:20px;}.response-pane{padding-left:20px;}.current-verse p{font-size:25px;}.live-pop{flex-wrap:wrap;}}
@media(max-width:700px){.listening-room{padding:14px;margin:0 -8px;}.instrument{grid-template-columns:1fr;}.response-pane{padding-left:0;}.chamber-title{font-size:8px;}.chamber-title span:last-child{max-width:130px;text-align:right;}.specimen-stage{height:330px;}.neural-volume{height:300px;}.benchmark-panel .section-line{align-items:flex-start;}.benchmark-panel .section-line span{max-width:150px;text-align:right;}}
.circuit-meanings {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin:24px 0;}
.circuit-card {border-top:1px solid var(--line);padding-top:16px;}
.circuit-card h4 {font:22px var(--serif);margin:0 0 6px;}
.circuit-id {font:10px var(--mono);color:var(--accent);display:block;margin-bottom:12px;}
.circuit-card p {font-size:13px;line-height:1.7;}
.circuit-card .circuit-measurement {font:11px/1.8 var(--mono);background:var(--soft);padding:12px;}
.circuit-card a {font:10px var(--mono);display:inline-block;margin-top:10px;}
@media(max-width:700px){.circuit-meanings{grid-template-columns:1fr;}}
.performance-tabs,.interpretation-tabs {display:flex;gap:10px;flex-wrap:wrap;margin:0 0 14px;}
.performance-tabs button,.interpretation-tabs button {padding:12px 18px;border:1px solid var(--line);background:transparent;color:var(--ink);font:11px var(--mono);}
.performance-tabs button[aria-pressed=true],.interpretation-tabs button[aria-pressed=true] {background:var(--ink);color:var(--paper);border-color:var(--ink);}
#performance-note {margin-bottom:24px;max-width:900px;}
.interpretation-tabs {margin-top:22px;}
#affect-text {font:24px/1.7 var(--serif);max-width:980px;margin:26px 0 22px;}
@media(max-width:700px){#affect-text{font-size:21px;}}
.performance-tabs {position:sticky;top:0;z-index:20;background:var(--paper);padding:14px 0;margin:16px 0 0;border-bottom:1px solid var(--line);}
#replay {scroll-margin-top:85px;}
#reading-heading {scroll-margin-top:110px;}

/* One synchronized transcript, also readable while paused. */
#spoken-poem { height: 200px; overflow-y: auto; margin: 16px 0; }
#reading-heading, #response-heading { scroll-margin-top: 110px; }
#show-reading { margin: 12px 0; font-weight: 600; }

/* Controlled delivery lives in the listening interface, with its own ensemble provenance. */
#emphasis-mode { margin: 28px 0; }
#emphasis-mode h3 { font: 18px Georgia,serif; }
#emphasis-mode select { padding: 10px; max-width: 100%; background: transparent; color: inherit; }
.em-choice { display: flex; flex-wrap: wrap; gap: 12px; margin: 18px 0; }
.em-choice button { padding: 9px 12px; border: 1px solid #cfcec3; background: transparent; color: inherit; cursor: pointer; }
.em-choice button[aria-pressed="true"] { border-color: #a55235; background: #ede8dd; }
.em-grid { display: grid; grid-template-columns: 1fr 1.5fr; gap: 32px; margin: 24px 0; }
.em-poem { max-height: 360px; overflow: auto; font: 20px/1.7 Georgia,serif; }
.em-poem .em-target { border-left: 2px solid #a55235; padding-left: 8px; }
.em-poem .active { background: #ebe4d6; }
.em-reading { border-top: 1px solid #cfcec3; padding-top: 20px; margin-top: 24px; }
#emphasis-mode [data-em="reading"] { font: 23px/1.5 Georgia,serif; }
#emphasis-mode [data-em="chart"] { width: 100%; }
#emphasis-mode details { margin-top: 24px; }
@media(max-width:700px) { .em-grid { grid-template-columns: 1fr; } }

#passage-mode svg { width: 100%; display: block; }
#passage-mode select { max-width: 100%; }
#passage-mode .em-choice { align-items: center; }

.population-scroll { overflow-x: auto; }
.population-scroll button { background: transparent; border: 1px solid var(--line); color: inherit; padding: 8px; cursor: pointer; }