:root {
  --paper: #e9e1cf;
  --paper-bright: #f4eddd;
  --ink: #191c36;
  --indigo: #11142d;
  --indigo-2: #171b3d;
  --rose: #e7929f;
  --rose-dark: #a95668;
  --silver: #aab1b7;
  --line: rgba(25, 28, 54, .18);
  --mono: 'JetBrains Mono', monospace;
  --serif: 'Newsreader', serif;
  --night-progress: 0;
  --drift: 0px;
  --stage-weight: 420;
  --stage-space: 0em;
  --stage-scale: 1;
  --stage-skew: 0deg;
  --stage-progress: 0;
  --section-progress: 0;
  --sleep-depth: 0;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: clip; scrollbar-color: var(--rose) var(--indigo); scrollbar-width: thin; }
html::-webkit-scrollbar { width: 9px; }
html::-webkit-scrollbar-track { background: var(--indigo); }
html::-webkit-scrollbar-thumb { background: linear-gradient(var(--rose-dark),var(--rose)); border: 2px solid var(--indigo); border-radius: 99px; }
body { margin: 0; overflow-x: clip; background: var(--indigo); color: var(--paper); font-family: var(--serif); font-optical-sizing: auto; text-rendering: optimizeLegibility; }
body::before { content: ''; position: fixed; inset: 0; z-index: 80; pointer-events: none; box-shadow: inset 0 0 150px rgba(0,0,0,.5); }
body::after { content: ''; position: fixed; inset: 0; z-index: 69; pointer-events: none; background: radial-gradient(circle at calc(18% + var(--night-progress) * 60%) 42%, rgba(231,146,159,.055), transparent 26%), linear-gradient(115deg, transparent 20%, rgba(255,255,255,.025) 50%, transparent 72%); mix-blend-mode: screen; }
a { color: inherit; }
button, a { touch-action: manipulation; -webkit-tap-highlight-color: rgba(231,146,159,.16); }
::selection { background: var(--rose); color: var(--indigo); }
:focus-visible { outline: 2px solid var(--rose); outline-offset: 4px; }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
p, blockquote { text-wrap: pretty; }
.skip-link { position: fixed; left: 1rem; top: 1rem; z-index: 100; background: var(--paper); color: var(--ink); padding: .8rem 1rem; transform: translateY(-150%); font: 600 .72rem var(--mono); }
.skip-link:focus { transform: none; }
.paper-noise { position: fixed; inset: 0; z-index: 70; pointer-events: none; opacity: .19; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E"); mix-blend-mode: soft-light; }

.lab-header { position: fixed; top: 0; left: 0; right: 0; z-index: 60; min-height: 72px; padding: 10px 26px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; background: linear-gradient(90deg,rgba(10,12,31,.92),rgba(17,20,45,.72),rgba(10,12,31,.9)); border-bottom: 1px solid rgba(233,225,207,.15); backdrop-filter: blur(18px) saturate(120%); }
.wordmark { justify-self: start; display: flex; align-items: center; gap: 10px; text-decoration: none; font: 600 .68rem/1.1 var(--mono); letter-spacing: .08em; text-transform: uppercase; transition: color .25s ease; }
.wordmark:hover { color: var(--rose); }
.wordmark-mark { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid var(--silver); border-radius: 50%; color: var(--rose); transition: border-color .25s ease, transform .4s cubic-bezier(.16,.8,.2,1); }
.wordmark:hover .wordmark-mark { border-color: var(--rose); transform: rotate(-9deg); }
.night-id { text-align: center; font: .61rem var(--mono); letter-spacing: .16em; text-transform: uppercase; color: var(--silver); }
.night-id strong { display: block; margin-top: 3px; color: var(--paper); font-weight: 500; }
.stage-nav { justify-self: end; display: flex; gap: 2px; }
.stage-nav a { min-width: 46px; min-height: 46px; display: grid; place-items: center; text-decoration: none; border: 1px solid transparent; border-radius: 50%; font: 600 .66rem var(--mono); color: var(--silver); transition: color .25s ease, border-color .25s ease, background-color .25s ease, transform .25s ease; }
.stage-nav a:hover, .stage-nav a.active { color: var(--paper); border-color: var(--rose); background: rgba(231,146,159,.1); }
.stage-nav a:active { transform: scale(.92); }

.night-rail { position: fixed; z-index: 55; top: 94px; bottom: 26px; right: 20px; width: 86px; display: flex; flex-direction: column; align-items: center; color: var(--silver); }
.rail-time { width: 100%; text-align: center; }
.rail-time > span { display: block; color: var(--paper); font: 500 .83rem var(--mono); }
.rail-time small { display: block; min-height: 2.2em; margin-top: 5px; font: 500 .46rem/1.3 var(--mono); letter-spacing: .08em; }
.rail-time b { display: block; margin-top: 7px; color: var(--rose); font: 500 .39rem/1.25 var(--mono); letter-spacing: .12em; }
.rail-plot { position: relative; flex: 1; width: 80px; margin: 10px 0; }
.rail-plot svg { width: 100%; height: 100%; overflow: visible; }
.rail-grid { stroke: rgba(170,177,183,.11); stroke-width: 1; vector-effect: non-scaling-stroke; }
.rail-path { fill: none; stroke-width: 2; vector-effect: non-scaling-stroke; }
.rail-path-base { stroke: rgba(170,177,183,.22); }
.rail-path-active { stroke: var(--rose); stroke-width: 2.5; filter: drop-shadow(0 0 6px rgba(231,146,159,.6)); }
.rail-label { position: absolute; left: 4px; font: .45rem var(--mono); transform: translateY(-50%); }
.rail-label.wake { top: 7%; }.rail-label.rem { top: 25%; }.rail-label.n1 { top: 43%; }.rail-label.n2 { top: 61%; }.rail-label.n3 { top: 79%; }
.rail-pip { fill: var(--rose); stroke: var(--paper); stroke-width: 1.2; vector-effect: non-scaling-stroke; filter: drop-shadow(0 0 7px var(--rose)); }
.night-rail > p { margin: 0; writing-mode: vertical-rl; font: .45rem var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.night-id, .rail-time, .glass-readout, .spindle-meta, .cycle-math, .deep-note, .summary-head, .summary-stats, .site-footer { font-variant-numeric: tabular-nums slashed-zero; }

.night-section { position: relative; min-height: 100svh; padding: clamp(8rem, 12vw, 11rem) max(9vw, 120px) 9rem clamp(2rem, 7vw, 7rem); overflow: clip; isolation: isolate; scroll-margin-top: 72px; }
.night-section::after { content: ''; position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(rgba(233,225,207,.034) 1px, transparent 1px), linear-gradient(90deg, rgba(233,225,207,.034) 1px, transparent 1px); background-size: 54px 54px; mask-image: linear-gradient(to bottom, transparent, #000 20%, #000 80%, transparent); }
.night-section:not(.hero)::before { content: attr(data-time); position: absolute; left: clamp(1.2rem,3vw,3.2rem); bottom: 2.4rem; z-index: -1; color: rgba(233,225,207,.035); font: 200 clamp(7rem,15vw,16rem)/.7 var(--mono); letter-spacing: -.12em; transform: translate3d(calc((var(--section-progress) - .5) * -3vw),0,0); }
.eyebrow { margin: 0 0 1.25rem; color: var(--rose); font: 600 .65rem/1.4 var(--mono); text-transform: uppercase; letter-spacing: .19em; }
.lead { max-width: 680px; margin: 1.8rem 0 0; font-size: clamp(1.17rem, 2vw, 1.52rem); line-height: 1.45; color: rgba(244,237,221,.84); }
.stage-copy h2, .dawn-copy h2, .wolf-copy h2 { margin: 0; max-width: 980px; font-size: clamp(3.4rem, 8.5vw, 8.8rem); font-weight: var(--stage-weight); line-height: .82; letter-spacing: var(--stage-space); text-wrap: balance; transform: translate3d(var(--drift),0,0) scaleX(var(--stage-scale)) skewX(var(--stage-skew)); transform-origin: left center; transition: font-weight .45s cubic-bezier(.2,.7,.2,1), letter-spacing .45s ease, transform .45s cubic-bezier(.2,.7,.2,1); }
.stage-stamp { position: absolute; top: 8rem; right: max(10vw, 150px); display: flex; align-items: center; gap: 12px; font: .56rem var(--mono); text-transform: uppercase; letter-spacing: .12em; color: var(--silver); }
.stage-stamp b { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 50%; font-weight: 400; color: var(--rose); }

.hero { min-height: 110svh; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(360px, .8fr); gap: clamp(3rem, 7vw, 9rem); align-items: center; padding-top: 8.5rem; background: radial-gradient(ellipse at 70% 47%, rgba(103,110,166,.22), transparent 28%), radial-gradient(circle at 12% 88%, rgba(231,146,159,.09), transparent 22%), linear-gradient(110deg,#080a1d,#171b3b 61%,#0b0d22); }
.hero::after { z-index: 0; opacity: .72; }
.hero-trace { position: absolute; z-index: 1; inset: 18% -4% auto -4%; width: 108%; height: 56%; opacity: .09; color: var(--rose); filter: drop-shadow(0 0 12px rgba(231,146,159,.3)); }
.hero-trace path { fill: none; stroke: currentColor; stroke-width: 1.4; vector-effect: non-scaling-stroke; path-length: 1; stroke-dasharray: 1; animation: traceArrival 2.5s .15s cubic-bezier(.2,.75,.2,1) both; }
@keyframes traceArrival { from { stroke-dashoffset: 1; opacity: 0; } to { stroke-dashoffset: 0; opacity: 1; } }
.hero-copy { position: relative; z-index: 2; }
.hero h1 { margin: 0; font-size: clamp(5rem, 11.8vw, 12.8rem); line-height: .67; letter-spacing: -.07em; font-weight: 270; font-kerning: normal; }
.hero h1 span, .hero h1 em { display: block; }
.hero h1 span:nth-child(2) { position: relative; z-index: -1; padding-left: .19em; color: rgba(233,225,207,.06); -webkit-text-stroke: .7px rgba(202,208,211,.72); letter-spacing: -.055em; transform: translateY(.025em); }
.hero h1 span:nth-child(2)::after { content: attr(data-echo); position: absolute; inset: 0 auto auto .235em; color: transparent; -webkit-text-stroke: .55px rgba(231,146,159,.38); transform: translate(.045em,.07em); filter: blur(.2px); }
.hero h1 em { padding-left: .46em; color: var(--rose); font-weight: 380; }
.hero-deck { max-width: 535px; margin: 3.2rem 0 2.4rem 19%; font-size: 1.25rem; line-height: 1.52; color: rgba(233,225,207,.74); }
.enter-night { margin-left: 19%; min-height: 50px; display: inline-flex; align-items: center; gap: 15px; text-decoration: none; font: 600 .66rem var(--mono); text-transform: uppercase; letter-spacing: .16em; }
.enter-night i { width: 74px; height: 1px; background: var(--rose); position: relative; transition: width .3s ease; }
.enter-night i::after { content: ''; position: absolute; right: 0; top: -3px; width: 7px; height: 7px; border-right: 1px solid var(--rose); border-bottom: 1px solid var(--rose); transform: rotate(45deg); }
.enter-night:hover i { width: 98px; }
.enter-night:focus-visible i { width: 98px; }
.hero-protocol { margin: 3.4rem 0 0 19%; display: flex; flex-wrap: wrap; gap: .55rem 1.3rem; color: rgba(170,177,183,.72); font: 500 .48rem var(--mono); text-transform: uppercase; letter-spacing: .1em; }
.hero-protocol span { padding-left: .8rem; border-left: 1px solid rgba(231,146,159,.55); }
.observation-glass { align-self: center; position: relative; z-index: 2; min-height: 510px; padding: 26px; border: 1px solid rgba(195,202,207,.26); background: linear-gradient(135deg, rgba(234,238,240,.075), rgba(0,0,0,.31)); box-shadow: inset 0 0 70px rgba(0,0,0,.45), -18px 24px 0 rgba(9,11,29,.28), 0 30px 80px rgba(0,0,0,.34); backdrop-filter: blur(4px); transform: translateY(2.2rem); }
.observation-glass::after { content: 'OBSERVATION GLASS / DO NOT KNOCK'; position: absolute; right: -2rem; top: 1.5rem; color: rgba(170,177,183,.48); font: 500 .42rem var(--mono); letter-spacing: .14em; writing-mode: vertical-rl; }
.observation-glass::before { content: ''; position: absolute; inset: 10px; border: 1px solid rgba(170,177,183,.08); pointer-events: none; }
.glass-head { display: flex; justify-content: space-between; font: .56rem var(--mono); letter-spacing: .13em; color: var(--silver); }
.rec-dot { color: var(--rose); }
.rec-dot::before { content: ''; display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 8px currentColor; }
#eegCanvas { display: block; width: 100%; height: 270px; margin-top: 35px; background-image: linear-gradient(rgba(170,177,183,.075) 1px, transparent 1px), linear-gradient(90deg, rgba(170,177,183,.075) 1px, transparent 1px); background-size: 20px 20px; }
.glass-readout { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid rgba(170,177,183,.16); border-bottom: 1px solid rgba(170,177,183,.16); }
.glass-readout div { padding: 15px 6px; text-align: center; border-right: 1px solid rgba(170,177,183,.16); }
.glass-readout div:last-child { border: 0; }
.glass-readout span, .glass-readout small { font: .48rem var(--mono); color: var(--silver); }
.glass-readout strong { margin: 0 5px; color: var(--paper); font: 400 1.6rem var(--mono); }
.technician-note { margin: 25px 5px 0; font-size: .97rem; line-height: 1.4; font-style: italic; color: rgba(233,225,207,.7); }
.technician-note span { display: block; margin-top: 5px; color: var(--silver); font: .48rem var(--mono); font-style: normal; }
.hero-index { position: absolute; left: 3vw; bottom: 1rem; color: rgba(233,225,207,.035); font: 200 clamp(8rem, 20vw, 22rem)/.7 var(--mono); letter-spacing: -.14em; }
.hero-index span { color: rgba(231,146,159,.08); }
.reveal { opacity: 0; transform: translateY(25px); animation: reveal 1.05s .12s cubic-bezier(.16,.8,.22,1) forwards; }
.delay-2 { animation-delay: .36s; }.delay-3 { animation-delay: .64s; }
@keyframes reveal { to { opacity: 1; transform: none; } }

.stage-n1 { background: radial-gradient(circle at calc(82% - var(--section-progress) * 24%) 35%, rgba(231,146,159,.17), transparent 31%), linear-gradient(160deg,#151936 0,#191c3f 48%,#11142d 100%); }
.stage-n1::after { background-size: 54px 54px, 54px 54px; opacity: calc(.45 + var(--section-progress) * .5); }
.stage-n1 .stage-copy { margin-top: 10vh; }
.threshold-field { position: absolute; inset: 10% 5% auto 38%; height: 68%; pointer-events: none; }
.threshold-field span { position: absolute; color: rgba(233,225,207,.14); font: 300 clamp(2rem,5vw,6rem) var(--serif); letter-spacing: calc(.02em + var(--section-progress) * .22em); filter: blur(calc(.25px + var(--section-progress) * 1.25px)); transform: translate3d(calc((var(--section-progress) - .5) * var(--float-x, 50px)),calc((var(--section-progress) - .5) * var(--float-y, 30px)),0); }
.threshold-field span:nth-child(1) { top: 5%; left: 42%; --float-x:-80px; --float-y:20px }.threshold-field span:nth-child(2) { top: 33%; right: 1%; --float-x:55px; --float-y:-40px }.threshold-field span:nth-child(3) { bottom: 16%; left: 12%; --float-x:-45px; --float-y:70px }.threshold-field span:nth-child(4) { top: 53%; left: 50%; --float-x:90px; --float-y:35px }.threshold-field span:nth-child(5) { bottom: 0; right: 8%; --float-x:-70px; --float-y:-55px }
.micro-report { position: relative; z-index: 2; width: min(470px, 42vw); margin: 10vh 0 0 44%; padding: 25px 30px 25px 42px; border-left: 1px solid var(--rose); background: rgba(12,14,34,.32); }
.micro-report::before { content: '“'; position: absolute; left: 10px; top: 5px; color: var(--rose); font-size: 3rem; }
.micro-report p { margin: 0; font-size: 1.22rem; line-height: 1.48; font-style: italic; }
.micro-report cite { display: block; margin-top: 16px; color: var(--silver); font: normal .52rem var(--mono); text-transform: uppercase; letter-spacing: .1em; }

.stage-n2 { background: linear-gradient(90deg,#e5dcc9 0,#f1e9d9 12%,#e9e1cf 55%,#ded8cb 100%); color: var(--ink); }
.stage-n2::after { background-image: repeating-linear-gradient(0deg, rgba(25,28,54,.05) 0, rgba(25,28,54,.05) 1px, transparent 1px, transparent 8px), linear-gradient(90deg, transparent 49.9%, rgba(169,86,104,.12) 50%, transparent 50.1%); mask-image: none; }
.stage-n2 .eyebrow { color: var(--rose-dark); }
.stage-n2 .lead { color: rgba(25,28,54,.75); }
.stage-n2 .stage-stamp { color: #656a75; }
.stage-n2 .stage-stamp b { color: var(--rose-dark); }
.stage-n2::before, .stage-rem::before, .dawn-section::before { color: rgba(25,28,54,.04); }
.spindle-instrument { position: relative; margin: 8rem 0 6rem -7vw; width: calc(100% + 7vw); padding: 18px 0; border-top: 1px solid rgba(25,28,54,.28); border-bottom: 1px solid rgba(25,28,54,.28); overflow: hidden; background: linear-gradient(90deg,rgba(231,146,159,.06),transparent 28% 72%,rgba(25,28,54,.04)); }
.spindle-meta { padding: 0 15px 10px; display: flex; justify-content: space-between; color: #626774; font: .55rem var(--mono); letter-spacing: .1em; }
.spindle-instrument svg { display: block; width: 100%; height: 170px; }
.spindle-baseline { stroke: rgba(25,28,54,.15); stroke-width: 1; }
.spindle-wave { fill: none; stroke: var(--ink); stroke-width: 2.5; vector-effect: non-scaling-stroke; stroke-dasharray: 1; stroke-dashoffset: calc(1 - var(--section-progress)); }
.spindle-sweep { position: absolute; top: 36px; bottom: 18px; width: 25%; left: -25%; background: linear-gradient(90deg, transparent, rgba(231,146,159,.35), transparent); mix-blend-mode: multiply; animation: spindleSweep 4.8s ease-in-out infinite; }
@keyframes spindleSweep { 0%,20% { transform: translateX(0); } 70%,100% { transform: translateX(500%); } }
body[data-stage="n2"] .stage-n2 .stage-copy h2 { animation: spindleType 6.4s cubic-bezier(.2,.7,.2,1) infinite; }
@keyframes spindleType { 0%,37%,46%,100% { letter-spacing: var(--stage-space); transform: translate3d(var(--drift),0,0) scaleX(var(--stage-scale)); } 39% { letter-spacing: .008em; transform: translate3d(4px,0,0) scaleX(.996); } 41% { letter-spacing: -.045em; transform: translate3d(-3px,0,0) scaleX(1.012); } 43% { letter-spacing: -.01em; transform: translate3d(2px,0,0) scaleX(.998); } }
.cycle-math { display: grid; grid-template-columns: 1.2fr repeat(3, 1fr); gap: 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.cycle-math > * { padding: 25px; border-right: 1px solid rgba(25,28,54,.22); }
.cycle-math > :last-child { border: 0; }
.math-title { font: 600 .68rem var(--mono); text-transform: uppercase; letter-spacing: .13em; }
.cycle-math div b { display: block; font: 300 clamp(2.5rem,4vw,5rem) var(--serif); color: var(--rose-dark); }
.cycle-math div p { margin: 4px 0; font: .57rem/1.4 var(--mono); text-transform: uppercase; }
.cycle-math .math-note { grid-column: 1/-1; margin: 0; border-top: 1px solid rgba(25,28,54,.22); font: .7rem/1.6 var(--mono); color: #4e5361; }

.stage-n3 { min-height: 125svh; background: radial-gradient(ellipse at 24% 22%, rgba(75,83,145,.32), transparent 27%), radial-gradient(ellipse at 75% 78%,rgba(231,146,159,.06),transparent 32%), #070919; }
.stage-n3 .stage-copy h2 { font-weight: 780; letter-spacing: -.055em; }
.stage-n3 .lead { max-width: 600px; }
.pressure-chart { width: min(820px, 76%); margin: 8rem 0 3rem auto; padding: 30px; border: 1px solid rgba(170,177,183,.2); background: linear-gradient(145deg,rgba(24,28,61,.86),rgba(8,10,27,.78)); box-shadow: -24px 30px 0 rgba(32,37,77,.3), 0 50px 100px rgba(0,0,0,.38); transform: translateY(calc((.5 - var(--section-progress)) * 34px)); }
.chart-heading { display: grid; grid-template-columns: 1fr auto; align-items: end; font: .55rem var(--mono); color: var(--silver); text-transform: uppercase; letter-spacing: .1em; }
.chart-heading strong { color: var(--paper); font: 400 1.6rem var(--serif); text-transform: none; letter-spacing: 0; }
.chart-heading small { grid-column: 2; font: .45rem var(--mono); }
.pressure-chart svg { width: 100%; height: auto; margin-top: 30px; overflow: visible; }
.chart-grid { fill: none; stroke: rgba(170,177,183,.1); stroke-width: 1; }
.pressure-area { fill: url(#pressureFill); }
.pressure-line { fill: none; stroke: var(--rose); stroke-width: 3; vector-effect: non-scaling-stroke; stroke-dasharray: 1; stroke-dashoffset: calc(1 - var(--section-progress)); filter: drop-shadow(0 0 8px rgba(231,146,159,.35)); }
.chart-labels { fill: var(--silver); font: 13px var(--mono); }
.pressure-chart > p { margin: 20px 0 0; max-width: 610px; color: rgba(244,237,221,.78); font-size: 1rem; line-height: 1.55; }
.deep-note { margin: 0; color: var(--silver); font: .55rem var(--mono); text-align: right; letter-spacing: .08em; }
.deep-note strong { color: var(--rose); font-weight: 500; }

.stage-rem { min-height: 132svh; color: var(--ink); background: radial-gradient(circle at 14% 70%, rgba(169,86,104,.22), transparent 27%), linear-gradient(125deg, #f3ead8 0 43%, #d5d6d6 43% 59%, #ead3d1 59% 68%, #e9e1cf 68%); }
.stage-rem::before { color: rgba(25,28,54,.045); mix-blend-mode: multiply; }
.stage-rem .eyebrow { color: var(--rose-dark); }
.stage-rem .lead { color: rgba(25,28,54,.78); }
.stage-rem .stage-copy { margin-left: 9%; }
.stage-rem .stage-copy h2 { transform: rotate(calc(-1.4deg + var(--stage-progress) * 1.8deg)) translate3d(var(--drift),0,0) skewX(var(--stage-skew)); }
.stage-rem .stage-stamp { color: #656a75; transform: rotate(6deg); }
.stage-rem .stage-stamp b { color: var(--rose-dark); }
.memory-contact { width: min(440px,42vw); margin: 3rem 2rem -1rem auto; position: relative; z-index: 6; }
.memory-button { width: 100%; min-height: 64px; padding: 8px 18px 8px 8px; display: flex; align-items: center; gap: 14px; color: var(--ink); background: rgba(244,237,221,.46); border: 1px solid rgba(25,28,54,.42); border-radius: 999px; cursor: pointer; text-align: left; box-shadow: 0 12px 30px rgba(25,28,54,.09); transition: color .3s ease, background-color .3s ease, border-color .3s ease, box-shadow .45s ease, transform .45s cubic-bezier(.16,.8,.2,1); }
.memory-button:hover { color: var(--rose-dark); background: rgba(255,251,241,.78); border-color: var(--rose-dark); transform: translateY(-2px); box-shadow: 0 18px 36px rgba(25,28,54,.16); }
.memory-button:active { transform: translateY(1px) scale(.99); }
.memory-button > span:last-child { min-width: 0; }
.memory-button b, .memory-button small { display: block; font-family: var(--mono); text-transform: uppercase; }
.memory-button b { font-size: .58rem; letter-spacing: .14em; }
.memory-button small { margin-top: 4px; color: #686775; font-size: .46rem; letter-spacing: .08em; }
.electrode { flex: 0 0 46px; width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid #878d98; border-radius: 50%; background: radial-gradient(circle at 35% 30%,#f8faf9 0 5%,#cdd2d4 24%,#858c94 65%,#d8dcde 100%); box-shadow: inset 0 0 0 5px rgba(17,20,45,.12), 0 4px 10px rgba(25,28,54,.2); }
.electrode i { width: 8px; height: 8px; border-radius: 50%; background: var(--indigo); box-shadow: 0 0 0 5px rgba(17,20,45,.15); }
.memory-button[aria-pressed="true"] { color: var(--paper-bright); background: var(--indigo); border-color: var(--rose); box-shadow: 0 0 0 1px rgba(231,146,159,.28), 0 0 44px rgba(169,86,104,.3); }
.memory-button[aria-pressed="true"] small { color: var(--rose); }
.memory-button[aria-pressed="true"] .electrode i { background: var(--rose); box-shadow: 0 0 0 5px rgba(231,146,159,.18),0 0 16px var(--rose); }
.dream-desk { position: relative; min-height: 720px; margin-top: 4rem; perspective: 1100px; }
.memory-thread { position: absolute; inset: 0; z-index: 1; opacity: 0; pointer-events: none; transition: opacity .6s ease; }
.memory-thread svg { width: 100%; height: 100%; overflow: visible; }
.memory-thread path { fill: none; stroke: var(--rose-dark); stroke-width: 1.4; vector-effect: non-scaling-stroke; stroke-dasharray: 1; stroke-dashoffset: 1; }
.memory-thread circle { fill: var(--rose-dark); opacity: 0; }
.memory-synthesis { position: absolute; z-index: 4; left: 50%; top: 46%; width: min(720px,75vw); margin: 0; padding: clamp(1.5rem,3vw,2.8rem); color: var(--paper-bright); background: rgba(17,20,45,.94); border: 1px solid var(--rose); box-shadow: -16px 20px 0 rgba(169,86,104,.18),0 28px 70px rgba(25,28,54,.25); opacity: 0; transform: translate3d(-50%,-45%,100px) scale(.94); pointer-events: none; transition: opacity .5s ease, transform .75s cubic-bezier(.16,.8,.2,1); }
.memory-synthesis::before { content: ''; position: absolute; inset: 10px; border: 1px solid rgba(233,225,207,.12); }
.memory-synthesis span { color: var(--rose); font: 600 .5rem var(--mono); letter-spacing: .14em; }
.memory-synthesis p { max-width: 620px; margin: 1.3rem 0 0; font-size: clamp(1.85rem,4vw,4.2rem); line-height: .98; letter-spacing: -.028em; font-style: italic; }
.dream-card { position: absolute; width: min(430px, 38vw); min-height: 250px; padding: 28px 30px; color: var(--ink); background: linear-gradient(150deg,#fbf6ea,#eee7d9); border: 1px solid rgba(25,28,54,.35); box-shadow: 0 25px 50px rgba(25,28,54,.2); transition: transform .55s cubic-bezier(.16,.8,.2,1), box-shadow .4s ease, opacity .5s ease, filter .5s ease; }
.dream-card::after { content: ''; position: absolute; inset: 7px; border: 1px solid rgba(25,28,54,.08); pointer-events: none; }
.dream-card > span, .dream-card footer { font: .53rem var(--mono); letter-spacing: .1em; text-transform: uppercase; color: #6b6770; }
.dream-card p { font-size: clamp(1.2rem,2.1vw,1.65rem); line-height: 1.35; font-style: italic; }
.card-a { left: 2%; top: 5%; transform: translate3d(var(--card-x,0px),var(--card-y,0px),30px) rotate(-3deg); }
.card-b { right: 3%; top: 22%; transform: translate3d(var(--card-x,0px),var(--card-y,0px),55px) rotate(4deg); background: linear-gradient(145deg,#e5e2e7,#d6d3da); }
.card-c { left: 29%; bottom: 2%; transform: translate3d(var(--card-x,0px),var(--card-y,0px),80px) rotate(-1deg); background: linear-gradient(145deg,#f3d9d6,#e9c7c9); }
.dream-card:hover, .dream-card:focus-visible { z-index: 5; transform: translate3d(0,-14px,120px) rotate(0); box-shadow: 0 36px 70px rgba(25,28,54,.28); outline: 2px solid var(--rose-dark); outline-offset: 5px; }
.dream-orbit { position: absolute; left: 49%; top: 31%; width: 270px; height: 270px; border: 1px solid rgba(25,28,54,.32); border-radius: 50%; transform: translateX(-50%); }
.dream-orbit::before, .dream-orbit::after { content: ''; position: absolute; inset: 22px; border: 1px solid rgba(169,86,104,.4); border-radius: 49% 51% 42% 58%; transform: rotate(30deg); }
.dream-orbit::after { inset: 55px; transform: rotate(-40deg); }
.dream-orbit span { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); font: 300 4.5rem var(--serif); color: var(--rose-dark); }
.dream-orbit i { position: absolute; width: 11px; height: 11px; left: 8px; top: 50%; border-radius: 50%; background: var(--ink); animation: orbit 10s linear infinite; transform-origin: 127px 0; }
.dream-orbit b { position: absolute; right: -40px; top: 12px; font: 500 .48rem var(--mono); text-transform: uppercase; letter-spacing: .1em; }
.dream-instruction { position: absolute; right: 1rem; bottom: 0; color: #5f6170; font: 500 .48rem var(--mono); text-transform: uppercase; letter-spacing: .1em; }
.memory-coherent .memory-thread { opacity: .9; }
.memory-coherent .memory-thread path { animation: memoryTrace 1.1s cubic-bezier(.2,.75,.2,1) forwards, memoryPulse 1.8s 1.1s ease-in-out infinite; }
.memory-coherent .memory-thread circle { animation: memoryNode .45s .85s ease forwards; }
.memory-coherent .memory-synthesis { opacity: 1; transform: translate3d(-50%,-50%,140px) scale(1); }
.memory-coherent .dream-card { opacity: .24; filter: blur(.8px); }
.memory-coherent .card-a { transform: translate3d(-7vw,-3rem,0) rotate(-7deg); }
.memory-coherent .card-b { transform: translate3d(7vw,-2rem,0) rotate(7deg); }
.memory-coherent .card-c { transform: translate3d(0,4rem,0) rotate(-3deg); }
@keyframes memoryTrace { to { stroke-dashoffset: 0; } }
@keyframes memoryPulse { 50% { stroke-width: 2.5; filter: drop-shadow(0 0 8px rgba(169,86,104,.7)); } }
@keyframes memoryNode { to { opacity: 1; } }
@keyframes orbit { to { transform: rotate(360deg); } }

.wolf-section { min-height: 110svh; display: grid; grid-template-columns: 1fr 1.1fr; gap: 7vw; align-items: center; background: radial-gradient(ellipse at 43% 46%, rgba(63,70,124,.38), transparent 47%), linear-gradient(180deg,#090b1c,#060717); }
.wolf-clock { display: flex; align-items: center; justify-content: center; color: rgba(233,225,207,.08); font: 200 clamp(7rem,16vw,17rem)/1 var(--mono); letter-spacing: -.12em; }
.wolf-clock i { width: 12px; height: 12px; margin: 0 .12em; border-radius: 50%; background: var(--rose); box-shadow: 0 38px 0 var(--rose), 0 0 25px var(--rose); transform: translateY(-19px); }
.wolf-copy { max-width: 720px; }
.wolf-copy h2 { font-size: clamp(4rem,8vw,8rem); }
.wolf-copy > p:last-child { max-width: 590px; margin-top: 2rem; color: rgba(244,237,221,.76); font-size: 1rem; line-height: 1.6; }
.observation-note { position: absolute; bottom: 9%; left: 12%; width: min(450px,36vw); padding: 22px; border-top: 1px solid var(--rose); background: rgba(17,20,45,.7); }
.observation-note span, .observation-note cite { font: .52rem var(--mono); color: var(--silver); letter-spacing: .1em; }
.observation-note p { font-style: italic; font-size: 1.15rem; }
.observation-note cite { font-style: normal; }

.dawn-section { min-height: 132svh; padding-top: 14rem; color: var(--ink); background: radial-gradient(ellipse at 70% 38%,rgba(255,235,202,.3),transparent 26%), linear-gradient(to bottom, #0d1028 0, #33395f 11%, #8c7180 25%, #caa0a0 39%, #ebc8ae 54%, #efe5cf 71%, #ccd9de 100%); }
.dawn-section::after { background-image: linear-gradient(rgba(25,28,54,.035) 1px, transparent 1px),linear-gradient(90deg,rgba(25,28,54,.025) 1px,transparent 1px); }
.dawn-copy { margin-left: 8%; color: var(--paper-bright); text-shadow: 0 2px 25px rgba(17,20,45,.35); }
.dawn-copy h2 { font-weight: 300; }
.dawn-copy .lead { color: rgba(244,237,221,.9); }
.night-summary { margin-top: 9rem; padding: clamp(1.5rem,4vw,4rem); color: var(--ink); background: linear-gradient(100deg,rgba(248,241,225,.9),rgba(236,230,216,.76)); border: 1px solid rgba(25,28,54,.24); backdrop-filter: blur(14px); box-shadow: -22px 26px 0 rgba(17,20,45,.08), 0 40px 100px rgba(17,20,45,.2); }
.summary-head { display: flex; justify-content: space-between; font: .6rem var(--mono); letter-spacing: .11em; }
.signature-plot { width: 100%; height: 350px; margin-top: 20px; overflow: visible; }
.signature-grid { fill: none; stroke: rgba(25,28,54,.13); stroke-width: 1; }
.signature-line { fill: none; stroke: var(--ink); stroke-width: 3; vector-effect: non-scaling-stroke; filter: drop-shadow(0 4px 4px rgba(25,28,54,.2)); stroke-dasharray: 1; stroke-dashoffset: calc(1 - var(--section-progress)); }
.signature-labels { fill: #5d6170; font: 12px var(--mono); }
.summary-stats { display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid rgba(25,28,54,.25); border-bottom: 1px solid rgba(25,28,54,.25); }
.summary-stats div { padding: 22px; border-right: 1px solid rgba(25,28,54,.18); }
.summary-stats div:last-child { border: 0; }
.summary-stats small { display: block; font: .54rem var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.summary-stats b { display: block; margin-top: 8px; font: 400 clamp(1.7rem,3vw,3.4rem) var(--serif); }
.signature-caption { margin: 30px 0 0; font-style: italic; }
.signature-caption span { float: right; font: .55rem var(--mono); text-transform: uppercase; }
.wake-line { margin: 6.5rem 0 0; text-align: center; font: .58rem var(--mono); letter-spacing: .32em; }
.wake-line span { margin: 0 2rem; }

.site-footer { position: relative; z-index: 2; min-height: 150px; padding: 40px max(9vw,120px) 40px clamp(2rem,7vw,7rem); display: flex; justify-content: space-between; align-items: center; gap: 2rem; background: #d1dade; color: var(--ink); border-top: 1px solid rgba(25,28,54,.25); font: .58rem var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.site-footer nav { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px 24px; }
.site-footer a { min-height: 44px; display: inline-flex; align-items: center; text-decoration: none; border-bottom: 1px solid transparent; }
.site-footer a:hover { border-color: currentColor; }
.site-footer a:focus-visible { border-color: currentColor; }

body[data-stage="dawn"] .lab-header { background: rgba(17,20,45,.96); }
body[data-stage="dawn"] .night-rail { color: #3e4354; }
body[data-stage="dawn"] .rail-time > span { color: var(--ink); }
body.at-night-end .night-rail { opacity: 0; transform: translateX(24px); pointer-events: none; transition: opacity .35s ease, transform .35s ease; }

body[data-stage="n1"] { --drift: 14px; --stage-space: .025em; --stage-weight: 330; }
body[data-stage="n2"] { --drift: 0px; --stage-space: -.025em; --stage-weight: 440; }
body[data-stage="n3"] { --drift: 0px; --stage-space: -.06em; --stage-weight: 780; }
body[data-stage="rem"] { --drift: -10px; --stage-space: -.035em; --stage-weight: 390; }

@media (max-width: 900px) {
  .lab-header { grid-template-columns: 1fr 1fr; padding: 9px 16px; }
  .night-id { display: none; }
  .night-rail { right: 6px; width: 46px; opacity: .88; }
  .rail-plot { width: 43px; }.rail-label { display: none; }.night-rail > p { display: none; }
  .night-section { padding-left: 30px; padding-right: 74px; }
  .hero { grid-template-columns: 1fr; padding-top: 9rem; gap: 3rem; }
  .hero h1 { font-size: clamp(5.5rem,17vw,10rem); }
  .observation-glass { min-height: 450px; width: min(640px,100%); justify-self: end; transform: none; }
  .stage-stamp { right: 80px; }
  .cycle-math { grid-template-columns: repeat(3,1fr); }
  .math-title { grid-column: 1/-1; }
  .pressure-chart { width: 90%; }
  .stage-rem .stage-copy { margin-left: 0; }
  .dream-card { width: min(390px,52vw); }
  .dream-desk { min-height: 900px; }
  .memory-contact { width: min(420px,62vw); }
  .card-a { left: 0; top: 2%; }
  .card-b { right: 0; top: 38%; }
  .card-c { left: 20%; bottom: 0; }
  .wolf-section { grid-template-columns: 1fr; padding-top: 10rem; }
  .wolf-clock { position: absolute; top: 13%; left: 4%; }
  .wolf-copy { margin-left: 16%; }
  .observation-note { left: 9%; width: 55vw; }
  .dawn-copy { margin-left: 0; }
  .night-summary { box-shadow: -12px 16px 0 rgba(17,20,45,.08),0 30px 70px rgba(17,20,45,.18); }
  .site-footer { padding-right: 74px; }
}

@media (max-width: 600px) {
  .lab-header { min-height: 64px; }
  .wordmark { font-size: .58rem; }.wordmark-mark { width: 34px; height: 34px; }
  .stage-nav a { min-width: 44px; min-height: 44px; }
  .night-rail { top: 78px; bottom: 18px; right: 0; width: 38px; }
  .rail-plot { width: 34px; }
  .rail-time > span { font-size: .63rem; }.rail-time small { font-size: .38rem; }
  .rail-time b { display: none; }
  .night-section { padding: 7.5rem 52px 6rem 20px; min-height: auto; }
  .hero { min-height: 100svh; padding-top: 8.5rem; padding-bottom: 7rem; }
  .hero h1 { font-size: clamp(4rem,19.5vw,6rem); line-height: .74; letter-spacing: -.058em; }
  .hero h1 span:nth-child(2) { padding-left: .11em; }
  .hero h1 span:nth-child(2)::after { left: .14em; }
  .hero h1 em { padding-left: .32em; }
  .hero-deck { margin: 2.5rem 0 2rem 0; font-size: 1.08rem; }
  .enter-night { margin-left: 0; }
  .hero-protocol { margin: 2.4rem 0 0; gap: .5rem .8rem; }
  .observation-glass { min-height: 390px; padding: 18px; }
  #eegCanvas { height: 210px; margin-top: 25px; }
  .glass-readout strong { font-size: 1.2rem; }.technician-note { font-size: .85rem; }
  .stage-stamp { position: relative; top: auto; right: auto; margin-bottom: 3rem; }
  .stage-copy h2, .dawn-copy h2, .wolf-copy h2 { font-size: clamp(3.1rem,15vw,4.5rem); line-height: .9; }
  .lead { font-size: 1.08rem; }
  .stage-n1 .stage-copy { margin-top: 0; }
  .threshold-field { inset: 20% 10% auto 15%; }
  .micro-report { width: 100%; margin: 7rem 0 0; padding-right: 18px; }
  .spindle-instrument { margin: 5rem 0 4rem -20px; width: calc(100% + 82px); }
  .spindle-meta { padding-right: 52px; font-size: .42rem; }
  .spindle-instrument svg { height: 120px; }
  .cycle-math { grid-template-columns: 1fr; }
  .cycle-math > *, .cycle-math > :last-child { border-right: 0; border-bottom: 1px solid rgba(25,28,54,.22); padding: 18px; }
  .cycle-math .math-note { grid-column: auto; border-bottom: 0; }
  .stage-n3 { min-height: auto; }
  .pressure-chart { width: 100%; margin: 6rem 0 2rem; padding: 18px 14px; }
  .chart-heading { grid-template-columns: 1fr; }.chart-heading strong, .chart-heading small { grid-column: 1; }.chart-heading strong { margin-top: 8px; }
  .deep-note { line-height: 1.5; }
  .stage-rem { min-height: 1420px; background: linear-gradient(145deg,#f0e7d6 0 40%,#dad7d2 40% 58%,#ead3d1 58% 68%,#e9e1cf 68%); }
  .memory-contact { width: 100%; margin: 2.5rem 0 0; }
  .memory-button { min-height: 62px; }
  .dream-desk { min-height: 990px; margin-top: 3.5rem; }
  .dream-card { width: calc(100% - 8px); min-height: 220px; padding: 24px; }
  .card-a { left: 0; top: 0; transform: rotate(-2deg); }.card-b { right: -6px; top: 320px; transform: rotate(2deg); }.card-c { left: 3px; bottom: 0; transform: rotate(-1deg); }
  .dream-card:hover, .dream-card:focus-visible { transform: translateY(-8px) rotate(0); }
  .dream-orbit { width: 170px; height: 170px; top: 43%; left: 65%; opacity: .42; }
  .dream-orbit i { transform-origin: 77px 0; }.dream-orbit span { font-size: 3rem; }
  .memory-synthesis { top: 47%; width: calc(100% - 8px); padding: 2.7rem 1.5rem; box-shadow: -8px 10px 0 rgba(169,86,104,.18); }
  .memory-coherent .dream-card { opacity: .15; filter: none; }
  .memory-coherent .card-a { transform: translate3d(-18px,-20px,0) rotate(-4deg); }
  .memory-coherent .card-b { transform: translate3d(16px,0,0) rotate(4deg); }
  .memory-coherent .card-c { transform: translate3d(-10px,20px,0) rotate(-2deg); }
  .wolf-section { min-height: 950px; display: block; padding-top: 10rem; }
  .wolf-clock { top: 8rem; font-size: 6rem; }
  .wolf-copy { margin: 8rem 0 0; }
  .observation-note { left: 20px; bottom: 6rem; width: calc(100% - 82px); }
  .dawn-section { min-height: auto; padding-top: 10rem; }
  .night-summary { margin-top: 6rem; padding: 18px 12px; }
  .summary-head { gap: 10px; font-size: .45rem; }
  .signature-plot { height: 220px; }
  .summary-stats { grid-template-columns: 1fr 1fr; }
  .summary-stats div:nth-child(2) { border-right: 0; }.summary-stats div:nth-child(-n+2) { border-bottom: 1px solid rgba(25,28,54,.18); }
  .summary-stats div { padding: 15px 10px; }
  .signature-caption span { float: none; display: block; margin-top: 8px; }
  .wake-line { margin-top: 4.5rem; line-height: 2; letter-spacing: .17em; }.wake-line span { margin: 0 .5rem; }
  .site-footer { min-height: 210px; padding: 30px 20px; display: block; }
  .site-footer nav { margin-top: 14px; display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; justify-content: stretch; }
  .site-footer nav a:first-child { grid-column: 1/-1; }
  .site-footer a { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
  .stage-copy h2, .stage-rem .stage-copy h2 { transform: none !important; }
  .dream-card { transform: none !important; }
  .memory-thread { display: none; }
  .memory-synthesis, .memory-coherent .memory-synthesis { transform: translate3d(-50%,-50%,0) !important; }
}