
/* Narrative agency and Sensorium: shared page elements */
.story-photo{width:100%;height:100%;object-fit:cover;object-position:center 43%;display:block}
.story-photo-credit{position:absolute;left:20px;bottom:15px;background:rgba(247,245,239,.91);font:10px/1.55 var(--mono);padding:7px 10px;letter-spacing:.04em;color:#333c38;max-width:calc(100% - 40px)}
.story-lede{max-width:680px;font:clamp(23px,2.3vw,32px)/1.52 var(--serif);letter-spacing:-.025em;margin:0 0 36px;color:var(--text)}
.thread-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:36px 0 82px}
.thread-card{background:#f8f6f0;border:1px solid var(--line);padding:clamp(25px,3vw,42px);text-decoration:none;display:flex;flex-direction:column;min-height:280px;transition:transform .2s,border-color .2s}
.thread-card:hover{transform:translateY(-3px);border-color:#8e918a}
.thread-card .tiny{margin-bottom:24px}.thread-card h3{font:normal clamp(28px,3.3vw,47px)/1.09 var(--serif);letter-spacing:-.045em;margin:0 0 18px}
.thread-card p{font:15px/1.75 var(--sans);color:#5d6460;margin-bottom:25px;max-width:540px}
.thread-card .thread-link{margin-top:auto;font:11px var(--mono);letter-spacing:.04em;text-transform:uppercase;text-decoration:underline;text-underline-offset:6px}
.interlude-quote{padding:50px 0 80px;max-width:770px;font:italic clamp(27px,3.3vw,43px)/1.45 var(--serif);letter-spacing:-.03em}
.instrument-panel{margin:10px 0 80px;background:#242927;color:#f5f3eb;padding:clamp(18px,4vw,56px)}
.instrument-panel-header{display:flex;gap:20px;align-items:baseline;justify-content:space-between;flex-wrap:wrap;padding-bottom:18px}
.instrument-panel-header .tiny{color:#d0c7b8}
.instrument-panel-header p{font:12px/1.7 var(--mono);color:#c9ccc3;margin:0}
.sensorium-film{width:100%;aspect-ratio:16/9;object-fit:contain;background:#080a09;display:block}
.audio-console{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:15px;padding:20px 0 4px}
.audio-actions{display:flex;flex-wrap:wrap;gap:9px}
.audio-button{border:1px solid #868c87;background:transparent;color:#f5f3eb;font:12px/1.4 var(--sans);padding:12px 15px;cursor:pointer;min-height:42px}
.audio-button:hover,.audio-button[aria-pressed=true]{background:#f5f3eb;color:#242927}
.audio-status{max-width:460px;font:12px/1.55 var(--mono);color:#c9ccc3}
.sound-note{font:11px/1.7 var(--sans);color:#c0c6bd;opacity:.82;margin:14px 0 0}
.sensorium-still{width:100%;object-fit:cover;max-height:800px;display:block}
.ecology-panel{background:#e6e2d9;padding:35px;margin:35px 0;border-left:2px solid #a3927f}
.ecology-panel p{font:16px/1.8 var(--serif);color:#4a534d}
.board-cover{width:100%;height:auto;display:block;max-height:610px;object-fit:cover;object-position:center}
.board-layout{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(35px,7vw,110px);padding:80px 0;align-items:center}
.board-layout h2{font:normal clamp(38px,4.7vw,66px)/1.1 var(--serif);letter-spacing:-.05em;margin:15px 0 22px}
.board-layout p{font:16px/1.82 var(--sans);color:#626862;max-width:570px}
.board-notes{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin:25px 0 85px}
.board-note{background:#f7f5f0;border:1px solid #d5d0c7;padding:25px}
.board-note .tiny{display:block;margin-bottom:20px}.board-note h3{font:normal 28px/1.2 var(--serif);letter-spacing:-.03em;margin:0 0 18px}
.board-note p{font:14px/1.7 var(--sans);color:#626862}
@media(max-width:700px){.thread-grid,.board-layout,.board-notes{grid-template-columns:1fr}.thread-card{min-height:235px}.board-layout{padding:53px 0}.board-notes{margin-bottom:53px}.story-photo-credit{font-size:9px}.instrument-panel{margin-bottom:55px}.audio-actions{width:100%}.audio-button{flex:1}.sensorium-film{aspect-ratio:16/9}.audio-status{width:100%}}
@media(prefers-reduced-motion:reduce){.thread-card{transition:none}}

/* Research Board: a lightweight relational exploration */
.agency-map{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:clamp(44px,6vw,80px) 0;margin:30px 0 65px}
.agency-map-intro{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:end;margin-bottom:32px}
.agency-map-intro h2{font:normal clamp(39px,4.7vw,65px)/1.07 var(--serif);letter-spacing:-.05em;margin:16px 0 0}
.agency-map-intro p{font:15px/1.8 var(--sans);color:#5b645d;max-width:420px}
.agency-map-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);gap:18px}
.agency-node-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.agency-node-grid button{appearance:none;background:#edeae3;border:1px solid #cecac1;color:inherit;font:normal clamp(18px,2vw,27px)/1.16 var(--serif);text-align:left;padding:24px;min-height:104px;cursor:pointer;transition:background .2s}
.agency-node-grid button:hover,.agency-node-grid button[aria-pressed=true]{background:#d9d4ca;border-color:#979185}
.agency-node-detail{background:#f8f6f0;padding:clamp(25px,4vw,47px);min-height:330px;display:flex;flex-direction:column;align-items:start}
.agency-node-detail h3{font:normal clamp(29px,3.5vw,49px)/1.13 var(--serif);letter-spacing:-.04em;margin:19px 0 15px}
.agency-node-detail>p{font:16px/1.8 var(--serif);color:#505a52;max-width:490px;margin:0 0 25px}
.agency-node-detail .agency-links{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-top:auto;padding-bottom:20px}
.agency-links .tiny{width:100%;margin-bottom:7px}
.agency-links button{border:1px solid #b8b4a9;background:transparent;cursor:pointer;padding:8px 10px;font:12px/1.35 var(--sans);color:#464a45}
.agency-links button:hover{background:#edeae3}
.agency-primary{font:12px/1.5 var(--mono);text-decoration:underline;text-underline-offset:5px}
@media(max-width:750px){.agency-map-intro,.agency-map-body{grid-template-columns:1fr;gap:25px}.agency-node-grid button{padding:16px;min-height:85px}.agency-node-detail{min-height:250px}}
