:root { color-scheme: dark; --ink:#0e1013; --panel:#15181d; --paper:#e8e5dd; --muted:#aeb5bd; --line:rgba(255,255,255,.17); --cyan:#61cbd0; --gold:#e1b75b; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--ink); color:#f5f3ec; font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:inherit; }
img { display:block; width:100%; height:100%; object-fit:cover; }
.skip-link { position:fixed; top:-5rem; left:1rem; padding:.8rem 1rem; background:#fff; color:#000; z-index:100; }
.skip-link:focus { top:1rem; }
header, footer { display:flex; justify-content:space-between; align-items:center; gap:2rem; padding:1.25rem clamp(1rem,4vw,4rem); border-bottom:1px solid var(--line); }
.wordmark { text-decoration:none; font-weight:800; letter-spacing:.14em; }
.wordmark span { margin-left:.8rem; font-weight:450; letter-spacing:.05em; }
nav { display:flex; gap:clamp(.8rem,3vw,2.5rem); }
nav a { text-decoration:none; text-transform:uppercase; letter-spacing:.14em; font-size:.7rem; }
.hero { position:relative; min-height:calc(100svh - 70px); display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:4vw; align-items:center; padding:clamp(3rem,8vw,8rem) clamp(1rem,4vw,4rem); overflow:hidden; }
.hero::before { content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px); background-size:72px 72px; mask-image:linear-gradient(to right,#000,transparent 78%); }
.hero-copy,.hero-visual,.hero-note { position:relative; z-index:1; }
.eyebrow,.section-label { color:var(--cyan); text-transform:uppercase; letter-spacing:.16em; font-size:.7rem; font-weight:750; }
h1,h2,h3 { font-family:Georgia,"Times New Roman",serif; font-weight:400; }
h1 { margin:1rem 0 1.5rem; max-width:780px; font-size:clamp(4rem,9vw,10rem); line-height:.83; letter-spacing:-.065em; }
h1 em { color:var(--cyan); }
.lede { max-width:720px; color:#d2d4d4; font-family:Georgia,serif; font-size:clamp(1.2rem,1.9vw,1.7rem); line-height:1.55; }
.hero-visual { min-height:650px; perspective:1000px; }
.frame { position:absolute; border:1px solid rgba(255,255,255,.3); box-shadow:0 30px 90px #000; }
.frame::after { content:""; position:absolute; inset:0; background:linear-gradient(135deg,transparent 50%,rgba(97,203,208,.25)); mix-blend-mode:screen; }
.frame--one { width:68%; height:55%; top:3%; left:6%; transform:rotateY(-9deg) rotateZ(-2deg); }
.frame--two { width:56%; height:45%; right:3%; bottom:4%; transform:rotateY(9deg) rotateZ(2deg); }
.frame--three { width:38%; height:38%; left:3%; bottom:2%; transform:translateZ(100px); }
.axis { position:absolute; width:44px; height:44px; display:grid; place-items:center; border:1px solid var(--cyan); color:var(--cyan); border-radius:50%; font-size:.7rem; }
.axis--x { right:4%; top:8%; }.axis--y { right:19%; top:2%; }.axis--z { right:1%; top:25%; }
.hero-note { position:absolute; left:clamp(1rem,4vw,4rem); right:clamp(1rem,4vw,4rem); bottom:1.5rem; display:flex; gap:2rem; padding-top:1rem; border-top:1px solid var(--line); text-transform:uppercase; letter-spacing:.14em; font-size:.65rem; color:var(--muted); }
.question,.lab,.findings,.methods,.research-agenda,.acknowledgment,.sources { padding:clamp(4rem,8vw,8rem) clamp(1rem,4vw,4rem); }
.question { background:var(--paper); color:#17191d; }
.question h2,.lab h2,.findings h2,.methods h2,.research-agenda h2,.sources h2 { margin:.5rem 0 2rem; max-width:1050px; font-size:clamp(3rem,6vw,7rem); line-height:.91; letter-spacing:-.05em; }
.question-grid { display:grid; grid-template-columns:1fr .75fr; gap:clamp(2rem,7vw,8rem); }
.question .lead { font-family:Georgia,serif; font-size:clamp(1.4rem,2.5vw,2.4rem); line-height:1.42; }
.hypothesis { align-self:end; padding:1.5rem; border:1px solid rgba(0,0,0,.25); }
.hypothesis span { color:#3d777b; font-size:.7rem; text-transform:uppercase; letter-spacing:.14em; }
.hypothesis p { font-size:1.15rem; line-height:1.55; }
.sequence { grid-column:1/-1; display:flex; justify-content:space-between; gap:1rem; padding-top:2rem; border-top:1px solid rgba(0,0,0,.22); text-transform:uppercase; letter-spacing:.12em; font-size:.72rem; }
.sequence i { color:#3d777b; font-style:normal; }
.lab { background:#111419; }
.lab-heading { display:grid; grid-template-columns:1.1fr .65fr; gap:4rem; align-items:end; }
.lab-heading>p { color:var(--muted); line-height:1.75; }
.prototype-tabs { display:flex; gap:.5rem; margin:2rem 0 0; }
.prototype-tabs button,.prototype-toolbar button,.scene-strip button { min-height:44px; border:1px solid var(--line); background:transparent; color:#fff; padding:.8rem 1rem; cursor:pointer; }
.prototype-tabs button[aria-selected="true"],.prototype-toolbar button[aria-pressed="true"],.scene-strip button[aria-current="true"] { background:var(--cyan); border-color:var(--cyan); color:#071012; }
.prototype-stage { display:grid; grid-template-columns:minmax(250px,.36fr) minmax(0,1fr); border:1px solid var(--line); }
.prototype-copy { padding:clamp(1.5rem,4vw,4rem); background:#1b1f25; }
.prototype-copy>p:first-child { color:var(--gold); text-transform:uppercase; letter-spacing:.14em; font-size:.67rem; }
.prototype-copy h3 { font-size:clamp(2rem,3.5vw,4rem); line-height:.98; }
.prototype-copy>p { color:var(--muted); line-height:1.7; }
dl { margin-top:2.5rem; }
dl div { padding:1rem 0; border-top:1px solid var(--line); }
dt { color:var(--cyan); text-transform:uppercase; letter-spacing:.13em; font-size:.65rem; }
dd { margin:.5rem 0 0; line-height:1.5; }
.prototype-viewer { min-width:0; background:#050505; }
.prototype-toolbar { display:flex; justify-content:flex-end; gap:.4rem; padding:.6rem; border-bottom:1px solid var(--line); background:#15181d; }
#prototype-frame { display:block; width:100%; height:min(70vh,760px); min-height:520px; border:0; }
.scene-strip { display:flex; gap:.4rem; padding:.6rem; overflow-x:auto; background:#15181d; }
.scene-strip button { flex:0 0 auto; min-width:46px; padding:.6rem; }
.prototype-note { margin:1rem 0 0; color:var(--muted); font-size:.8rem; line-height:1.6; }
.findings { background:#0d3035; }
.finding-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(255,255,255,.25); border-left:1px solid rgba(255,255,255,.25); }
.finding-grid article { min-height:300px; padding:1.5rem; border-right:1px solid rgba(255,255,255,.25); border-bottom:1px solid rgba(255,255,255,.25); }
.finding-grid span { color:var(--gold); font-size:.7rem; letter-spacing:.14em; }
.finding-grid h3 { font-size:1.8rem; }
.finding-grid p { color:#c4d6d6; line-height:1.7; }
.methods { background:var(--paper); color:#17191d; }
.method-list { border-top:1px solid rgba(0,0,0,.25); }
.method-list article { display:grid; grid-template-columns:.4fr 1fr 1.1fr .25fr .75fr; gap:2rem; align-items:start; padding:1.8rem 0; border-bottom:1px solid rgba(0,0,0,.25); }
.method-list span,.method-list b { color:#3d777b; text-transform:uppercase; letter-spacing:.12em; font-size:.67rem; }
.method-list h3 { margin:0; font-size:1.55rem; }
.method-list p { margin:0; line-height:1.6; }
.research-agenda { display:grid; grid-template-columns:.35fr 1fr; gap:4rem; }
.research-agenda ul { padding:0; list-style:none; }
.research-agenda li { padding:1.1rem 0; border-top:1px solid var(--line); font-family:Georgia,serif; font-size:clamp(1.15rem,2vw,1.7rem); line-height:1.4; }
.acknowledgment { display:grid; grid-template-columns:.35fr 1fr; gap:4rem; background:var(--gold); color:#151515; }
.acknowledgment .section-label { color:#6d4c0f; }
.acknowledgment p:last-child { max-width:1050px; margin:0; font-family:Georgia,serif; font-size:clamp(1.5rem,3vw,3rem); line-height:1.35; }
.sources { display:grid; grid-template-columns:1fr 1fr; gap:4rem; }
.sources ul { margin:0; padding:0; list-style:none; }
.sources li { border-bottom:1px solid var(--line); }
.sources a { display:flex; justify-content:space-between; gap:1rem; padding:1.1rem 0; text-decoration:none; }
.sources a::after { content:"↗"; color:var(--cyan); }
footer { border-top:1px solid var(--line); border-bottom:0; color:var(--muted); text-transform:uppercase; letter-spacing:.14em; font-size:.66rem; }
footer a { text-decoration:none; }
@media (max-width:1050px) { .hero { grid-template-columns:1fr; }.hero-visual{min-height:520px}.prototype-stage{grid-template-columns:1fr}.finding-grid{grid-template-columns:repeat(2,1fr)}.method-list article{grid-template-columns:.35fr 1fr 1.3fr}.method-list b,.method-list b+p{grid-column:2/4}.sources{grid-template-columns:1fr} }
@media (max-width:720px) { header{align-items:flex-start}.wordmark span{display:none}nav{gap:.75rem}nav a{font-size:.58rem}.hero{min-height:auto;padding-bottom:6rem}.hero-visual{min-height:390px}.question-grid,.lab-heading,.research-agenda,.acknowledgment{grid-template-columns:1fr}.sequence{overflow-x:auto}.prototype-tabs{display:grid}.prototype-toolbar{justify-content:flex-start;overflow-x:auto}#prototype-frame{min-height:60vh}.finding-grid{grid-template-columns:1fr}.method-list article{grid-template-columns:1fr}.method-list b,.method-list b+p{grid-column:auto}.hero-note{flex-wrap:wrap} }
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}