:root{--ink:#050a08;--deep:#07110d;--moss:#10231a;--paper:#dbe7df;--muted:#8ea197;--green:#b9ff62;--ice:#dceeff;--amber:#ffad4a;--ember:#ff5037;--mono:'JetBrains Mono',monospace;--display:'Unbounded',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--ink)}body{margin:0;background:var(--ink);color:var(--paper);font-family:var(--mono);overflow-x:hidden}button,a,input{font:inherit}a{color:inherit}.skip{position:fixed;z-index:100;left:1rem;top:1rem;padding:.8rem 1rem;background:var(--green);color:var(--ink);transform:translateY(-150%);transition:transform .2s}.skip:focus{transform:none}.topbar{position:absolute;z-index:20;inset:0 0 auto;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:84px;padding:0 3.5vw;border-bottom:1px solid #b8c5bd30;color:#e4eee8}.brand{justify-self:start;text-decoration:none;font:700 .74rem var(--display);letter-spacing:.18em;display:flex;align-items:center;gap:.75rem}.brand-eye{width:24px;height:11px;border:1px solid var(--green);border-radius:100%;position:relative}.brand-eye:after{content:"";position:absolute;width:4px;height:4px;border-radius:50%;background:var(--green);inset:3px 9px;box-shadow:0 0 9px var(--green)}nav{display:flex;gap:2.2rem}nav a{padding:15px 0;text-decoration:none;text-transform:uppercase;font-size:.63rem;letter-spacing:.12em;color:#bdc9c2}nav a:hover{color:var(--green)}.beam-switch{justify-self:end;min-height:44px;border:1px solid #b9ff6255;background:#09120ed9;color:var(--green);padding:.65rem .9rem;text-transform:uppercase;font-size:.62rem;letter-spacing:.12em;cursor:pointer}.beam-switch span{display:inline-block;width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 8px currentColor;margin-right:.5rem}.beam-switch[aria-pressed=false]{color:#849087}.survey{height:max(720px,100svh);position:relative;overflow:hidden;background:#020504}.survey canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none}.survey-scrim{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#020504eb 0%,#02050499 38%,transparent 70%),linear-gradient(0deg,#020504e8 0%,transparent 35%)}.hero-copy{position:absolute;z-index:3;left:6vw;top:22%;width:min(760px,58vw)}.kicker{font-size:.65rem;letter-spacing:.17em;text-transform:uppercase;color:var(--green);margin:0 0 1.4rem}.hero-copy h1,.guide-intro h2,.optics h2,.tradeoff h2,.logbook h2,.crossing h2{font-family:var(--display);font-weight:300;letter-spacing:-.07em;line-height:.88;margin:0}.hero-copy h1{font-size:clamp(4rem,8.3vw,9rem)}h1 em{font-style:normal;color:var(--green);text-shadow:0 0 30px #b9ff6255}.hero-deck{font-size:.82rem;line-height:1.8;color:#c0cec6;max-width:520px;margin:2rem 0}.sweep-cue{display:flex;align-items:center;gap:1rem;padding:0;background:none;border:0;color:#edf7f0;text-align:left;cursor:pointer;min-height:58px}.sweep-cue b,.sweep-cue small{display:block}.sweep-cue b{text-transform:uppercase;font-size:.66rem;letter-spacing:.14em}.sweep-cue small{color:#84958b;margin-top:.35rem}.cue-orbit{width:52px;height:52px;border:1px solid #b9ff6288;border-radius:50%;position:relative}.cue-orbit:before,.cue-orbit:after{content:"";position:absolute;border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%)}.cue-orbit:before{width:18px;height:18px;background:#f4fff7;box-shadow:0 0 22px 8px #b9ff6277}.cue-orbit:after{width:68px;height:68px;border:1px dashed #b9ff6233;animation:spin 9s linear infinite}.tally{position:absolute;z-index:5;right:3.5vw;top:21%;width:248px;background:#07100cdc;backdrop-filter:blur(12px);border:1px solid #b8c5bd35;padding:1rem}.tally-head{display:flex;align-items:baseline;justify-content:space-between;border-bottom:1px solid #b8c5bd33;padding-bottom:.7rem}.tally-head span,.tally-list span{font-size:.56rem;letter-spacing:.12em}.tally-head strong{font:300 2rem var(--display);color:var(--green)}.tally-list>div{display:grid;grid-template-columns:20px 1fr auto;align-items:center;min-height:43px;border-bottom:1px dotted #95a69c30}.tally-list i{width:13px;height:5px;border-radius:50%;background:var(--eye);opacity:.18;box-shadow:0 0 10px var(--eye)}.tally-list div.found i{opacity:1}.tally-list b{font-size:.65rem;color:#edf7f0}.tally p{color:#899a90;font-size:.56rem;line-height:1.55;margin:.8rem 0 0}.transect-line{position:absolute;z-index:4;bottom:3.2%;left:6vw;right:3.5vw;display:flex;align-items:center;gap:1rem;font-size:.55rem;letter-spacing:.18em;color:#87988e}.transect-line i{height:1px;flex:1;background:repeating-linear-gradient(90deg,#9daaa2 0 5px,transparent 5px 12px)}.reveal{opacity:0;transform:translateY(22px);animation:arrive .8s cubic-bezier(.2,.8,.2,1) forwards}.reveal:nth-child(2){animation-delay:.14s}.reveal:nth-child(3){animation-delay:.27s}.reveal:nth-child(4){animation-delay:.4s}
.field-guide{position:relative;background:#d9e2db;color:#0b130f;padding:7rem 6vw 9rem;overflow:hidden}.field-guide:before{content:"";position:absolute;inset:0;opacity:.12;pointer-events:none;background-image:repeating-linear-gradient(90deg,transparent 0 99px,#143022 99px 100px),repeating-linear-gradient(0deg,transparent 0 99px,#143022 99px 100px)}.section-index{position:relative;display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;font-size:.57rem;letter-spacing:.14em;color:#536158}.section-index i{height:1px;background:currentColor;opacity:.4}.section-index.light{color:#879a8e}.guide-intro{position:relative;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(240px,.6fr);gap:10vw;align-items:end;margin:5rem 0 7rem}.guide-intro h2,.tradeoff h2{font-size:clamp(3rem,6.5vw,7rem)}h2 span{color:#3f6851}.guide-intro p,.trade-copy>p,.crossing-copy>p{font-size:.83rem;line-height:1.9;max-width:500px;color:#46554d}.height-chart{position:relative;margin-left:6vw;border-left:1px solid #1a2c22;height:950px}.height-chart:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 189px,#1d332611 189px 190px)}.height-scale{position:absolute;right:calc(100% + 1rem);inset-block:0;display:flex;flex-direction:column;justify-content:space-between;font-size:.54rem;color:#526159}.species{position:absolute;left:0;right:0;top:var(--level);display:grid;grid-template-columns:1fr 1fr;align-items:center;border-top:1px solid #20352944}.specimen-eye{justify-self:center;display:flex;gap:38px;padding:2.5rem;filter:drop-shadow(0 0 12px var(--shine))}.specimen-eye i{display:block;width:46px;height:17px;background:var(--shine);border-radius:100%;box-shadow:0 0 32px 9px var(--shine);position:relative}.specimen-eye i:after{content:"";position:absolute;width:6px;height:100%;background:#07100c;left:50%;transform:translateX(-50%);border-radius:50%}.specimen-eye.many{display:grid;grid-template-columns:repeat(3,10px);gap:16px 22px}.specimen-eye.many i{width:7px;height:7px}.specimen-eye.many i:after{display:none}.species-copy{background:#d9e2dbea;padding:1.2rem 0 1rem 2rem;display:grid;grid-template-columns:1fr auto;gap:.2rem 2rem}.species-copy>span{grid-column:1/-1;font-size:.52rem;letter-spacing:.12em;color:#5e7066}.species-copy h3{font:400 1.25rem var(--display);letter-spacing:-.04em;margin:.5rem 0}.species-copy p{font-size:.65rem;line-height:1.65;max-width:330px;margin:0;color:#4a5b52}.species-copy dl{margin:0;grid-row:2/4;grid-column:2;display:flex;gap:1rem}.species-copy dt{font-size:.48rem;text-transform:uppercase;color:#66766d}.species-copy dd{font-size:.58rem;margin:.25rem 0}.margin-note{position:absolute;left:1.3vw;bottom:14rem;writing-mode:vertical-rl;transform:rotate(180deg);font-size:.53rem;line-height:1.7;max-height:340px;color:#56665d}
.optics{min-height:880px;padding:7rem 6vw 8rem;background:radial-gradient(circle at 68% 50%,#1a3527,#08130e 37%,#030705 72%);display:grid;grid-template-columns:.82fr 1.18fr;gap:4vw;position:relative}.optics>.section-index{position:absolute;top:7rem;left:6vw;right:6vw}.optics-copy{align-self:center}.optics-copy h2{font-size:clamp(3.2rem,5.7vw,6.5rem)}.optics-copy h2 span{color:var(--green)}.optics-copy>p:not(.kicker){color:#9aaba1;font-size:.76rem;line-height:1.9;max-width:480px;margin:2rem 0}.angle-control{display:grid;grid-template-columns:1fr auto;gap:.8rem;width:min(430px,100%);margin-top:3rem;color:#a7b7ad;text-transform:uppercase;font-size:.57rem;letter-spacing:.12em}.angle-control output{color:var(--green)}input[type=range]{grid-column:1/-1;width:100%;accent-color:var(--green)}.eye-diagram{align-self:center}.eye-diagram svg{display:block;width:100%;height:auto}.optic-labels{font:600 13px var(--mono);letter-spacing:2px}.diagram-key{display:flex;justify-content:center;gap:2rem;color:#8fa196;font-size:.55rem;text-transform:uppercase}.diagram-key span{display:flex;align-items:center;gap:.5rem}.diagram-key i{width:19px;height:3px;background:#f4fff7;box-shadow:0 0 7px currentColor}.diagram-key .green{background:var(--green)}.diagram-key .mirror{background:#b9ff62;height:8px}
.tradeoff{position:relative;background:#cbd7cf;color:#08100c;padding:8rem 6vw;display:grid;grid-template-columns:.75fr 1.25fr;gap:6vw}.trade-copy{grid-row:1}.trade-copy .section-index{margin-bottom:5rem}.trade-copy h2{font-size:clamp(2.8rem,5.4vw,6rem)}.trade-copy>p{margin-top:2rem}.vision-comparator{align-self:center}.vision-frame{height:500px;position:relative;overflow:hidden;background:linear-gradient(#07120e,#15281c 65%,#07100c);border:1px solid #51655a}.forest-lines,.forest-lines:before,.forest-lines:after{position:absolute;inset:0;content:"";background:linear-gradient(75deg,transparent 0 12%,#020604 12% 15%,transparent 15% 31%,#030805 31% 37%,transparent 37% 62%,#020504 62% 66%,transparent 66%),repeating-linear-gradient(87deg,transparent 0 60px,#050b08 61px 65px)}.forest-lines:before{transform:scale(1.25);opacity:.5}.moon{position:absolute;width:44px;height:44px;border-radius:50%;background:#cbdcd1;right:18%;top:14%;box-shadow:0 0 40px #dceeff55}.animal-mark{position:absolute;bottom:26%;right:25%;display:flex;gap:16px}.animal-mark i{width:16px;height:7px;border-radius:50%;background:var(--ice);box-shadow:0 0 17px 6px #dceeffaa}.vision-mask{position:absolute;inset:0 0 0 50%;background:linear-gradient(#2d4c3c44,#7ca56733);backdrop-filter:brightness(1.8) contrast(.7) blur(2px);border-left:1px solid #e9fff0}.vision-label{position:absolute;top:1rem;font-size:.53rem;letter-spacing:.15em;padding:.5rem;background:#07100ccc;color:#c8d7cf}.vision-label.human{left:1rem}.vision-label.tapetal{right:1rem;color:var(--green)}.vision-handle{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:44px;height:68px;border:1px solid #e9fff0;background:#07100ccc;cursor:ew-resize}.vision-handle i,.vision-handle i:after{content:"";position:absolute;top:20px;width:7px;height:24px;border-block:1px solid #e9fff0}.vision-handle i{left:10px;border-left:1px solid #e9fff0}.vision-handle i:after{left:15px;border-right:1px solid #e9fff0}.vision-comparator>p{font-size:.58rem;line-height:1.8;color:#53635a}.vision-comparator>p span{color:#132c1e;font-weight:700}.red-eye-note{grid-column:1/-1;margin-top:4rem;border-top:1px solid #7c8d82;display:grid;grid-template-columns:.8fr 1.3fr .7fr;gap:3rem;padding-top:1.3rem}.red-eye-note b,.red-eye-note span{font-size:.6rem;letter-spacing:.12em}.red-eye-note b{color:#9d2d22}.red-eye-note p{margin:0;font-size:.68rem;line-height:1.7;max-width:580px}.red-eye-note span{text-align:right;color:#77342b}
.logbook{padding:7rem 6vw 9rem;background:#07100c;position:relative;overflow:hidden}.logbook:before{content:"";position:absolute;width:700px;height:700px;border:1px solid #91a39819;border-radius:50%;right:-200px;top:200px;box-shadow:0 0 0 100px #91a39808,0 0 0 200px #91a39805}.log-head{display:flex;justify-content:space-between;align-items:end;margin:5rem 0}.log-head h2{font-size:clamp(3rem,5.7vw,6.5rem)}.log-head p{color:#7f9187;font-size:.62rem;line-height:2;text-align:right}.data-rings{display:flex;align-items:center;justify-content:center;gap:clamp(1rem,4vw,5rem);min-height:420px}.ring{--size:300px;width:var(--size);height:var(--size);border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--c) calc(var(--p)*1%),#26352d calc(var(--p)*1%));position:relative}.ring:after{content:"";position:absolute;inset:9px;border-radius:50%;background:#07100c}.ring.large{--size:360px}.ring.small{--size:230px}.ring div{z-index:1;text-align:center}.ring strong{display:block;font:300 3.2rem var(--display);letter-spacing:-.08em;color:var(--c)}.ring span{text-transform:uppercase;font-size:.55rem;line-height:1.6;color:#8fa097}.logbook blockquote{max-width:850px;margin:6rem 0 0 20vw;font:300 clamp(1.2rem,2.2vw,2rem)/1.5 var(--display);letter-spacing:-.03em;color:#b8c9bf}.logbook cite{display:block;font:500 .56rem var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--green);margin-top:1.5rem}
.crossing{min-height:850px;padding:7rem 6vw 9rem;background:#d5ded7;color:#0a120e;position:relative;overflow:hidden}.crossing canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.2}.crossing>*:not(canvas){position:relative}.crossing-copy{margin:5rem 0 4rem;width:60%}.crossing-copy h2{font-size:clamp(3.4rem,6.5vw,7.2rem)}.crossing-copy>p{margin:2rem 0}.crossing-specs{display:flex;gap:2rem;margin-top:2rem}.crossing-specs span{font-size:.52rem;text-transform:uppercase;color:#506057}.crossing-specs b{display:block;font:400 1rem var(--display);color:#102a1b;margin-bottom:.45rem}.road-schematic{position:relative;margin-left:35%;height:310px}.road{position:absolute;left:0;right:-8vw;bottom:40px;height:120px;background:#14221a;transform:skewY(-4deg);overflow:hidden}.road>i{position:absolute;top:58px;width:80px;height:3px;background:#dbe8df}.road>i:nth-child(1){left:5%}.road>i:nth-child(2){left:39%}.road>i:nth-child(3){left:73%}.car-beam{position:absolute;right:0;top:20px;width:48%;height:90px;background:linear-gradient(90deg,transparent,#ffcb7788);clip-path:polygon(0 50%,100% 0,100% 100%)}.bridge{position:absolute;left:23%;right:15%;bottom:105px;height:100px;border-radius:50% 50% 0 0;border:25px solid #1e3829;border-bottom:0;text-align:center}.bridge b{font-size:.5rem;letter-spacing:.12em;position:relative;top:-18px;background:#d5ded7;padding:.3rem}.cross-eyes{position:absolute;left:47%;bottom:182px;display:flex;gap:16px}.cross-eyes i{width:14px;height:6px;border-radius:50%;background:var(--ice);box-shadow:0 0 14px var(--ice)}.road-schematic p{position:absolute;width:310px;bottom:-2.5rem;right:0;font-size:.58rem;line-height:1.7;color:#55655c}.closing{min-height:78vh;display:grid;place-content:center;text-align:center;background:radial-gradient(circle,#11251a 0,#030705 63%);position:relative}.closing:before{content:"";position:absolute;left:50%;top:31%;width:70vw;height:32vw;transform:translateX(-50%);border-radius:50%;background:radial-gradient(ellipse,#b9ff6244 0,#b9ff6208 35%,transparent 70%);filter:blur(18px)}.closing>*{position:relative}.closing p{font-size:.63rem;letter-spacing:.2em;color:#8fa197}.closing h2{font:300 clamp(3.5rem,9vw,10rem)/.9 var(--display);letter-spacing:-.08em;margin:1rem}.closing h2 span{color:var(--green);text-shadow:0 0 35px #b9ff6266}.closing a{text-transform:uppercase;text-decoration:none;font-size:.6rem;letter-spacing:.13em;margin-top:3rem}.closing a i{display:inline-grid;place-items:center;width:44px;height:44px;border:1px solid #b9ff6255;border-radius:50%;margin-left:1rem;font-style:normal}footer{min-height:100px;padding:2rem 4vw;background:#020403;border-top:1px solid #88978e26;display:flex;align-items:center;justify-content:space-between;color:#76877d;font-size:.57rem}footer div{display:flex;gap:2rem}footer a{text-decoration:none;min-height:44px;display:flex;align-items:center}footer a:hover{color:var(--green)}
button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--green);outline-offset:4px}@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}@keyframes arrive{to{opacity:1;transform:none}}
@media(max-width:900px){.topbar{grid-template-columns:1fr auto;padding:0 4vw}.topbar nav{display:none}.hero-copy{left:5vw;top:19%;width:70vw}.tally{top:auto;right:4vw;bottom:9%;width:220px}.guide-intro{grid-template-columns:1fr;gap:2rem}.height-chart{margin-left:4vw}.species{grid-template-columns:.72fr 1.28fr}.species-copy{grid-template-columns:1fr}.species-copy dl{grid-row:auto;grid-column:1;justify-content:flex-start}.optics{grid-template-columns:1fr;padding-top:10rem}.optics-copy{padding-top:2rem}.eye-diagram{max-width:660px;margin:auto}.tradeoff{grid-template-columns:1fr}.red-eye-note{grid-template-columns:1fr 1.5fr}.red-eye-note span{display:none}.log-head{display:block}.log-head p{text-align:left}.data-rings{gap:1rem}.ring{--size:230px}.ring.large{--size:270px}.ring.small{--size:180px}.crossing-copy{width:80%}}
@media(max-width:600px){.topbar{height:70px}.beam-switch{padding:.55rem;font-size:.55rem}.survey{height:820px}.survey-scrim{background:linear-gradient(180deg,#020504cc 0%,#02050466 48%,#020504dd 78%)}.hero-copy{left:5vw;right:5vw;top:15%;width:auto}.hero-copy h1{font-size:clamp(3.35rem,16vw,4.4rem)}.hero-deck{font-size:.7rem;max-width:86%;margin:1.4rem 0}.sweep-cue{margin-top:.5rem}.tally{left:5vw;right:5vw;bottom:7%;width:auto;padding:.7rem}.tally-list{display:grid;grid-template-columns:1fr 1fr}.tally-list>div:nth-child(odd){border-right:1px dotted #95a69c30;padding-right:.6rem}.transect-line{display:none}.field-guide,.optics,.tradeoff,.logbook,.crossing{padding-left:5vw;padding-right:5vw}.field-guide{padding-top:5rem}.guide-intro{margin:3rem 0 5rem}.guide-intro h2,.tradeoff h2{font-size:2.75rem}.height-chart{height:1170px;margin-left:2.8rem}.height-scale{right:calc(100% + .5rem)}.species{grid-template-columns:1fr;top:var(--level)}.specimen-eye{justify-self:start;padding:1.2rem 2rem}.specimen-eye i{width:30px;height:12px}.species-copy{padding:.7rem 0 1rem 1rem}.species-copy p{font-size:.58rem}.species-copy dl{display:none}.species-deer{--level:9%!important}.species-fox{--level:35%!important}.species-croc{--level:61%!important}.species-spider{--level:84%!important}.margin-note{display:none}.optics{min-height:auto;padding-top:7rem}.optics>.section-index{top:4rem;left:5vw;right:5vw}.optics-copy h2{font-size:2.8rem}.eye-diagram svg{margin-top:1rem}.diagram-key{gap:.7rem;flex-wrap:wrap}.tradeoff{padding-top:5rem}.trade-copy .section-index{margin-bottom:3rem}.vision-frame{height:380px}.red-eye-note{grid-template-columns:1fr;margin-top:2rem}.logbook{padding-top:5rem}.log-head{margin:3rem 0}.log-head h2{font-size:2.8rem}.data-rings{display:grid;grid-template-columns:1fr 1fr;min-height:auto}.ring,.ring.large{--size:170px}.ring.small{--size:150px;grid-column:1/-1;margin:auto}.ring strong{font-size:2rem}.logbook blockquote{margin:4rem 0 0;font-size:1.05rem}.crossing{min-height:880px;padding-top:5rem}.crossing-copy{width:100%;margin:3rem 0}.crossing-copy h2{font-size:3rem}.crossing-specs{gap:1rem;flex-wrap:wrap}.road-schematic{margin-left:0;margin-top:4rem}.road-schematic p{width:75%;bottom:-5rem}.closing{min-height:600px}footer{align-items:flex-start;flex-direction:column;gap:1rem}footer div{width:100%;flex-wrap:wrap;gap:0 1.2rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;animation:none}.cue-orbit:after{animation:none}*{transition-duration:.01ms!important}}

/* Pass 1 refinements */
body:after{content:"";position:fixed;z-index:90;inset:0;pointer-events:none;opacity:.035;background:repeating-radial-gradient(circle at 20% 30%,#fff 0 1px,transparent 1px 4px);mix-blend-mode:soft-light}
.skip{position:absolute}
.sweep-cue small,.tally p{color:#9aaca1}
.tradeoff{padding-bottom:5.5rem}
.closing{min-height:70vh}.closing p{color:#9aaca1}
footer{color:#95a69c}
.road{background:linear-gradient(180deg,#1a2a20,#0d1711);box-shadow:0 -9px 0 #253c2e,0 14px 24px #09110c33}
.road:after{content:"";position:absolute;inset:8px 0 auto;height:9px;background:repeating-linear-gradient(90deg,var(--ice) 0 5px,transparent 5px 56px);opacity:.8}
.bridge{filter:drop-shadow(0 -9px 12px #18302155)}
.bridge:before,.bridge:after{content:"";position:absolute;bottom:-4px;width:7px;height:72px;background:#1e3829;box-shadow:10px -22px 0 -2px #345740}
.bridge:before{left:-46px}.bridge:after{right:-46px}
@media(max-width:600px){.height-chart{height:1060px}.closing{min-height:520px}}

/* Pass 2 — the field instrument becomes the visual system */
:root{--beam:#effff3;--fog:#d3ddd6;--rule:#789083;--red:#db3d2c}
body{font-size:16px;background:linear-gradient(180deg,#020504,#050b08 44%,#020403)}
body:after{opacity:.045;background:repeating-radial-gradient(circle at 17% 23%,#fff 0 .6px,transparent .8px 3px);mix-blend-mode:overlay}
.topbar{height:88px;background:linear-gradient(180deg,#020504dd,transparent);border-color:#c9ddd12b}
.brand{font-size:.78rem;letter-spacing:.2em}
.brand-eye{width:26px;height:12px;transform:skewX(-8deg)}
.topbar nav a{min-height:44px;display:flex;align-items:center;position:relative}
.topbar nav a:after{content:"";position:absolute;left:0;right:100%;bottom:8px;height:1px;background:var(--green);transition:right .35s cubic-bezier(.2,.8,.2,1)}
.topbar nav a:hover:after,.topbar nav a:focus-visible:after{right:0}
.beam-switch{display:flex;align-items:center;gap:.15rem;background:linear-gradient(135deg,#07110df2,#0b1710d9);box-shadow:inset 0 0 18px #b9ff6208,0 0 24px #000;border-color:#b9ff6266}
.beam-switch b{font-weight:500}
.survey{height:max(760px,100svh);isolation:isolate}
.survey:after{content:"";position:absolute;z-index:2;pointer-events:none;inset:0;background:linear-gradient(90deg,transparent 49.9%,#dceeff09 50%,transparent 50.1%),linear-gradient(0deg,transparent 69.9%,#dceeff08 70%,transparent 70.1%);mix-blend-mode:screen}
.survey-scrim{z-index:1;background:linear-gradient(90deg,#010403f5 0%,#010403c9 31%,#01040335 62%,transparent 86%),linear-gradient(0deg,#010403ed 0%,transparent 33%),radial-gradient(circle at 74% 45%,transparent,#0104034d 62%)}
.hero-copy{top:20%;width:min(770px,58vw)}
.hero-copy h1{font-size:clamp(4.2rem,7.7vw,8.2rem);font-weight:250;letter-spacing:-.078em;line-height:.84}
.hero-copy h1 em{position:relative;text-shadow:0 0 18px #b9ff624f,0 0 48px #b9ff6222}
.hero-copy h1 em:after{content:"";position:absolute;right:-.14em;bottom:.12em;width:.07em;height:.07em;border-radius:50%;background:var(--green);box-shadow:0 0 .2em var(--green)}
.hero-deck{font-size:.83rem;line-height:1.85;color:#cbd8d0;max-width:500px}
.sweep-cue{position:relative;padding-right:1rem}
.sweep-cue:after{content:"BEGIN  /  00";position:absolute;left:68px;bottom:-18px;color:#718279;font-size:.49rem;letter-spacing:.17em}
.cue-orbit{background:radial-gradient(circle,#eaffec 0 17%,#b9ff6242 18% 32%,transparent 34%);box-shadow:inset 0 0 20px #b9ff6222}
.beam-readout{position:absolute;z-index:4;left:6vw;bottom:4.9%;display:flex;align-items:center;gap:1.5rem;color:#71837a;font-size:.5rem;letter-spacing:.14em;animation-delay:.54s}
.beam-readout b{color:#cad9d0;font-weight:400}
.beam-readout .beam-lock{color:var(--green);border-left:1px solid #83978b55;padding-left:1.5rem}
.watcher-note{position:absolute;z-index:4;right:1.2vw;top:52%;margin:0;writing-mode:vertical-rl;color:#71837a;font-size:.49rem;letter-spacing:.2em}
.tally{top:20%;width:268px;padding:1.15rem;background:linear-gradient(145deg,#07110df2,#030806e8);border-color:#94ad9e55;box-shadow:0 22px 70px #000b,inset 0 0 30px #8fe67906}
.tally:before{content:"TRANSECT / 017";position:absolute;top:-18px;right:0;color:#71837a;font-size:.48rem;letter-spacing:.14em}
.tally-head>span{display:flex;align-items:center;gap:.45rem}
.tally-head>span i{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green);animation:signal 2.2s ease-in-out infinite}
.tally-head strong{font-size:2.3rem;letter-spacing:-.1em}
.tally-list>div{min-height:46px;transition:background .3s ease,padding .3s ease}
.tally-list>div.found{background:linear-gradient(90deg,var(--eye),transparent 4%);padding-left:.45rem}
.tally-list i{transition:opacity .25s ease,filter .25s ease;filter:saturate(.8)}
.tally-list div.found i{filter:saturate(1.2);box-shadow:0 0 16px var(--eye)}
.tally p{font-size:.58rem;min-height:2.7em}
.reset-transect{width:100%;min-height:44px;margin-top:.65rem;border:1px solid #8da0952e;background:transparent;color:#8fa197;text-align:left;padding:0 .65rem;text-transform:uppercase;font-size:.52rem;letter-spacing:.13em;cursor:pointer;display:flex;align-items:center;justify-content:space-between}
.reset-transect:hover{color:var(--green);border-color:#b9ff6266}
.transect-line{bottom:2.4%}

.field-guide{background:radial-gradient(circle at 86% 11%,#eff5f0 0,#d5dfd8 31%,#cbd7cf 100%);padding-top:6.5rem}
.field-guide:before{opacity:.16;background-image:repeating-linear-gradient(90deg,transparent 0 99px,#143022 99px 100px),repeating-linear-gradient(0deg,transparent 0 99px,#143022 99px 100px),linear-gradient(105deg,transparent 0 67%,#ffffff55 67.2%,transparent 67.5%)}
.guide-intro{margin:4.5rem 0 3rem;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:8vw}
.guide-intro h2{font-weight:260;letter-spacing:-.075em}
.guide-intro p{font-size:.86rem;color:#34483d}
.reading-order{position:relative;display:grid;grid-template-columns:auto 1fr auto 1fr auto 1fr auto;align-items:center;gap:1rem;margin:0 0 6rem 6vw;color:#3b5045;font-size:.55rem;letter-spacing:.12em;text-transform:uppercase}
.reading-order span{white-space:nowrap}
.reading-order b{display:inline-grid;place-items:center;width:27px;height:27px;margin-right:.5rem;border:1px solid #46605266;border-radius:50%;font-weight:500}
.reading-order i{height:1px;background:#45605255}
.height-chart{height:920px}
.height-chart:after{content:"TRUE HEIGHT / RELATIVE EYE LINE";position:absolute;right:0;top:-28px;font-size:.5rem;letter-spacing:.15em;color:#586b61}
.species{transition:opacity .7s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
.specimen-eye{position:relative}
.specimen-eye:after{content:"";position:absolute;left:12%;right:12%;top:50%;height:1px;background:linear-gradient(90deg,transparent,var(--shine),transparent);opacity:.35}
.species-deer .specimen-eye i{transform:scaleX(1.12)}
.species-fox .specimen-eye i:first-child{transform:rotate(8deg)}
.species-fox .specimen-eye i:last-child{transform:rotate(-8deg)}
.species-croc .specimen-eye i{height:9px;box-shadow:0 0 38px 11px var(--shine)}
.species-copy{padding:1.35rem 0 1.2rem 2rem;background:linear-gradient(90deg,#d5dfd8f2 80%,transparent);border-bottom:1px solid #2840331c}
.species-copy h3{font-size:1.35rem}
.species-copy p{font-size:.68rem;color:#34483e}
.species-copy dt,.species-copy>span{color:#4d6257}
.species-copy dd{font-size:.62rem}

.optics{min-height:930px;background:radial-gradient(circle at 72% 48%,#203e2d 0,#09160f 31%,#020604 70%);overflow:hidden}
.optics:after{content:"DOUBLE PASS / DOUBLE CHANCE";position:absolute;right:-2.6rem;bottom:7rem;writing-mode:vertical-rl;color:#b9ff622b;font:300 clamp(2rem,4vw,4rem) var(--display);letter-spacing:-.04em}
.optics-copy>p:not(.kicker){font-size:.81rem;color:#aebeb4}
.eye-diagram{position:relative}
.eye-diagram:before{content:"LIVE MODEL / MOVE THE INCIDENT BEAM";position:absolute;top:5%;right:5%;font-size:.49rem;letter-spacing:.14em;color:#8ca096}
#lightIn,#lightOut{stroke-dasharray:14 8;animation:photon 2.8s linear infinite}
#lightOut{animation-direction:reverse}
.angle-control input{min-height:44px;cursor:ew-resize}
.diagram-key{font-size:.58rem}

.tradeoff{background:radial-gradient(circle at 92% 8%,#edf3ef 0,#d2ddd6 40%,#c5d1c9 100%);padding-top:7rem}
.trade-copy>p{font-size:.84rem;color:#384c41}
.vision-frame{height:520px;box-shadow:0 24px 70px #19302428;border-color:#3d5748;cursor:ew-resize}
.vision-frame:after{content:"DRAG THE DIVIDE";position:absolute;bottom:1rem;left:50%;transform:translateX(-50%);color:#e6f2ea;font-size:.49rem;letter-spacing:.16em;background:#07100cb8;padding:.5rem}
.vision-handle{height:76px;background:#07100cf2;box-shadow:0 0 24px #0008}
.vision-comparator>p{font-size:.62rem;color:#405449}
.red-eye-note{padding-top:1.7rem}
.red-eye-note p{font-size:.72rem;color:#17261e}

.logbook{padding-top:6.5rem;background:radial-gradient(circle at 82% 44%,#10251a 0,#06100b 40%,#020604 78%)}
.logbook:before{width:900px;height:900px;right:-300px;top:120px;box-shadow:0 0 0 120px #91a39807,0 0 0 240px #91a39804}
.log-head{margin:4rem 0 5rem;align-items:start}
.log-head h2{font-weight:260;font-size:clamp(3rem,5.3vw,6rem)}
.log-head p{font-size:.68rem;color:#9aaca1;border-top:1px solid #71887b55;padding-top:1rem}
.return-ledger{position:relative;display:grid;grid-template-columns:.62fr 1.55fr .42fr;min-height:430px;border-top:1px solid #81978a44;border-bottom:1px solid #81978a44}
.ledger-total{display:grid;align-content:center;border-right:1px solid #81978a44;padding:2rem}
.ledger-total>span{font-size:.56rem;letter-spacing:.15em;color:#8fa197}
.ledger-total strong{font:200 clamp(5rem,10vw,10rem)/.9 var(--display);letter-spacing:-.1em;color:#dce8e0}
.ledger-total small{font-size:.58rem;line-height:1.7;color:var(--green);text-transform:uppercase;letter-spacing:.12em}
.ledger-traces{display:grid;align-content:center;padding:1rem 4vw}
.trace{--trace:#dceeff;display:grid;grid-template-columns:150px 1fr auto;grid-template-rows:auto auto;align-items:center;gap:.45rem 1.4rem;min-height:78px;border-bottom:1px dotted #8ca09533;color:#9baca2}
.trace:last-child{border:0}
.trace>span{font-size:.53rem;letter-spacing:.12em}
.trace i{height:13px;background:linear-gradient(90deg,transparent,var(--trace) 17%,transparent 18% 35%,var(--trace) 36% 36.7%,transparent 37% 69%,var(--trace) 70% 72%,transparent 73%);filter:drop-shadow(0 0 7px var(--trace));opacity:.85}
.trace strong{font:300 1.8rem var(--display);color:var(--trace);letter-spacing:-.08em}
.trace strong small{font-size:.7rem}
.trace em{grid-column:2/4;font-style:normal;font-size:.53rem;color:#718279}
.trace-fox{--trace:var(--amber)}.trace-croc{--trace:var(--ember)}.trace-spider{--trace:#ffbc66}
.ledger-stamp{display:flex;flex-direction:column;justify-content:space-between;padding:2rem 1rem;text-align:right}
.ledger-stamp span{font-size:.55rem;color:#75877c}
.ledger-stamp b{font:500 .58rem/1.8 var(--mono);letter-spacing:.1em;color:var(--green)}
.logbook blockquote{margin-top:5rem;color:#c9d7cf}

.crossing{background:radial-gradient(circle at 12% 84%,#eaf0ec,#d4dfd8 40%,#cbd7cf);min-height:900px}
.crossing-copy>p{font-size:.84rem;color:#34483d}
.crossing-specs span{font-size:.58rem}
.road-schematic{height:350px}
.road{height:138px;box-shadow:0 -10px 0 #253c2e,0 20px 35px #09110c3d}
.bridge{bottom:122px}
.cross-eyes{bottom:201px}
.road-schematic p{font-size:.63rem;color:#3e5147}

.closing{--look-x:50%;--look-y:50%;min-height:78vh;padding:8vw 6vw;display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:auto 1fr auto;place-content:unset;text-align:left;overflow:hidden;background:radial-gradient(circle at 54% 44%,#11271b 0,#030806 40%,#010302 72%)}
.closing:before{display:none}
.closing-eyes{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:8vw;opacity:.7;filter:blur(.2px)}
.closing-eyes i{width:min(28vw,420px);height:min(10vw,150px);border:1px solid #b9ff6233;border-radius:50%;background:radial-gradient(circle at var(--look-x) var(--look-y),#effff4 0 1.2%,#b9ff62 1.5% 3%,#b9ff6222 4% 10%,transparent 25%);box-shadow:0 0 90px #b9ff620d inset;transform:skewX(-8deg)}
.closing-index{grid-column:1/7;align-self:start;font-size:.55rem;letter-spacing:.18em;color:#8ea197}
.closing-copy{grid-column:2/10;align-self:center;z-index:2}
.closing-copy small{display:block;margin:0 0 1.8rem;font-size:.6rem;letter-spacing:.17em;line-height:1.8;color:#a7b8ae}
.closing h2{font-size:clamp(5rem,12vw,12rem);line-height:.72;margin:0;font-weight:200;letter-spacing:-.095em}
.closing h2 span{margin-left:1.05em;color:var(--green);text-shadow:0 0 32px #b9ff6255}
.closing-note{grid-column:9/13;align-self:end;max-width:330px;font-size:.65rem!important;line-height:1.8;letter-spacing:0!important;color:#98aaa0!important}
.closing>a{grid-column:1/6;align-self:end;justify-self:start;display:flex;align-items:center;margin-top:0}
footer{min-height:118px;font-size:.65rem;color:#9aaba1}
footer a{position:relative}
footer a:after{content:"";position:absolute;left:0;right:100%;bottom:8px;height:1px;background:var(--green);transition:right .3s ease}
footer a:hover:after{right:0}

@keyframes photon{to{stroke-dashoffset:-44}}
@keyframes signal{50%{opacity:.35;box-shadow:0 0 3px var(--green)}}

@media(max-width:900px){
  .hero-copy{top:18%;width:68vw}
  .beam-readout{bottom:3.2%;left:5vw}
  .watcher-note{display:none}
  .tally{bottom:8%;top:auto;width:240px}
  .guide-intro{grid-template-columns:1fr;margin-bottom:2.5rem}
  .reading-order{margin-left:4vw;gap:.6rem}
  .reading-order i{min-width:12px}
  .return-ledger{grid-template-columns:.62fr 1.38fr}
  .ledger-stamp{display:none}
  .trace{grid-template-columns:128px 1fr auto}
  .closing-copy{grid-column:1/12}
  .closing-note{grid-column:8/13}
}

@media(max-width:600px){
  body{font-size:15px}
  .topbar{height:70px}
  .brand{font-size:.68rem;letter-spacing:.16em}
  .survey{height:900px}
  .survey-scrim{background:linear-gradient(180deg,#010403e8 0%,#0104036b 49%,#010403eb 79%),linear-gradient(90deg,#01040391,transparent)}
  .hero-copy{top:13.5%;width:auto}
  .hero-copy h1{font-size:clamp(3.2rem,15.4vw,4.2rem);line-height:.86}
  .hero-deck{font-size:.72rem;line-height:1.75;max-width:92%;margin:1.3rem 0}
  .sweep-cue:after{display:none}
  .beam-readout{display:none}
  .tally{bottom:3.5%;padding:.75rem;width:auto}
  .tally:before{display:none}
  .tally-head strong{font-size:2rem}
  .tally-list>div{min-height:42px}
  .tally p{margin-top:.65rem}
  .reset-transect{margin-top:.35rem}
  .guide-intro h2,.tradeoff h2{font-size:2.65rem;line-height:.9}
  .reading-order{grid-template-columns:1fr 1fr;margin:0 0 4.5rem 2.8rem;gap:.75rem}
  .reading-order i{display:none}
  .reading-order span{font-size:.5rem}
  .height-chart{height:1120px}
  .height-chart:after{left:0;right:auto}
  .species-copy p{font-size:.64rem;line-height:1.7}
  .specimen-eye:after{left:0;right:20%}
  .optics{padding-bottom:6rem}
  .optics:after{display:none}
  .optics-copy>p:not(.kicker){font-size:.74rem}
  .eye-diagram:before{top:-.2rem;right:0;font-size:.42rem}
  .diagram-key{font-size:.5rem}
  .vision-frame{height:390px}
  .vision-comparator>p{font-size:.58rem}
  .red-eye-note p{font-size:.68rem}
  .logbook{padding-bottom:7rem}
  .log-head p{font-size:.62rem}
  .return-ledger{display:block;min-height:0;border:1px solid #81978a44}
  .ledger-total{border-right:0;border-bottom:1px solid #81978a44;padding:1.5rem;grid-template-columns:1fr auto;align-items:end}
  .ledger-total>span{grid-column:1/-1}
  .ledger-total strong{font-size:5.7rem}
  .ledger-total small{text-align:right}
  .ledger-traces{padding:.5rem 1rem}
  .trace{grid-template-columns:1fr auto;min-height:78px;gap:.3rem 1rem}
  .trace i{grid-column:1;grid-row:2}
  .trace strong{grid-column:2;grid-row:1/3}
  .trace em{grid-column:1/-1;font-size:.49rem}
  .logbook blockquote{margin-top:3.5rem}
  .crossing{min-height:920px}
  .road-schematic p{font-size:.58rem;width:78%}
  .closing{min-height:640px;padding:5rem 5vw 4rem;grid-template-rows:auto 1fr auto auto}
  .closing-eyes{gap:7vw;align-items:34%}
  .closing-eyes i{width:38vw;height:16vw}
  .closing-index{grid-column:1/13}
  .closing-copy{grid-column:1/13;align-self:center}
  .closing-copy small{font-size:.54rem}
  .closing h2{font-size:20vw;line-height:.75}
  .closing h2 span{margin-left:.5em}
  .closing-note{grid-column:4/13;grid-row:3;font-size:.58rem!important}
  .closing>a{grid-column:1/13;grid-row:4;margin-top:2rem}
  footer{font-size:.59rem;min-height:150px}
}

@media(prefers-reduced-motion:reduce){
  .tally-head>span i,#lightIn,#lightOut{animation:none}
}

/* Pass 3 — retinal memory, optical polish, and instrument-grade interaction */
html{scrollbar-color:#6d8e77 #020604;scrollbar-width:thin}
html::-webkit-scrollbar{width:10px}
html::-webkit-scrollbar-track{background:#020604}
html::-webkit-scrollbar-thumb{background:#466351;border:3px solid #020604;border-radius:10px}
html::-webkit-scrollbar-thumb:hover{background:var(--green)}
::selection{background:var(--green);color:#020604;text-shadow:none}
body{font-optical-sizing:auto;text-rendering:optimizeLegibility}
p{font-kerning:normal;text-wrap:pretty}
h1,h2,h3,.closing-copy small{text-wrap:balance}
.tally strong,.tally b,.beam-readout,.height-scale,.species-copy dd,.angle-control output,.ledger-total strong,.trace strong,.crossing-specs b{font-variant-numeric:tabular-nums slashed-zero}
.section-index,.kicker,.watcher-note,.transect-line,.reading-order,.tally-list span{font-variant-caps:all-small-caps;letter-spacing:.16em}
button,a,input{transition:color .28s cubic-bezier(.16,1,.3,1),border-color .28s cubic-bezier(.16,1,.3,1),background-color .28s cubic-bezier(.16,1,.3,1),box-shadow .28s cubic-bezier(.16,1,.3,1)}
button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--green);outline-offset:5px}
.survey canvas:focus-visible{outline-offset:-5px}
.brand:hover .brand-eye,.brand:focus-visible .brand-eye{background:#b9ff6218;box-shadow:0 0 22px #b9ff6244}
.brand:hover .brand-eye:after,.brand:focus-visible .brand-eye:after{transform:scale(1.45)}
.brand-eye:after{transition:transform .45s cubic-bezier(.16,1,.3,1)}
.beam-switch:hover,.beam-switch:focus-visible{border-color:var(--green);box-shadow:inset 0 0 24px #b9ff6212,0 0 28px #b9ff6212}
.beam-switch[aria-pressed=false]{color:#d4e2d9;border-color:#84908788;background:#020604}
.beam-switch[aria-pressed=false] span{background:var(--ember);box-shadow:0 0 12px var(--ember)}
.sweep-cue:hover .cue-orbit,.sweep-cue:focus-visible .cue-orbit{border-color:var(--green);box-shadow:inset 0 0 28px #b9ff6233,0 0 24px #b9ff621c}
.sweep-cue:hover small,.sweep-cue:focus-visible small{color:#d6e3db}
.reset-transect:focus-visible{color:var(--green);border-color:#b9ff6288}
.angle-control:focus-within{color:#dce9e1}
.vision-frame:focus-within{box-shadow:0 24px 70px #19302438,0 0 0 2px #b9ff6266}
.closing>a:hover i,.closing>a:focus-visible i{color:#07100c;background:var(--green);box-shadow:0 0 26px #b9ff6244}
footer a:hover,footer a:focus-visible{color:#dfffc7}
.survey canvas{animation:nightArrive 1.4s cubic-bezier(.16,1,.3,1) both}
.tally{animation:instrumentArrive .9s .62s cubic-bezier(.16,1,.3,1) both}
.afterimage-plate{position:absolute;z-index:5;left:48%;bottom:13%;width:min(360px,29vw);padding:1.1rem 1.25rem;border-left:1px solid var(--green);background:linear-gradient(90deg,#020604e8,transparent);opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .55s cubic-bezier(.16,1,.3,1),transform .55s cubic-bezier(.16,1,.3,1)}
.afterimage-plate>span{display:block;color:#8da095;font-size:.49rem;letter-spacing:.17em;margin-bottom:.65rem}
.afterimage-plate strong{display:block;color:#eaffec;font:300 clamp(.78rem,1.1vw,1.05rem) var(--display);letter-spacing:-.035em}
.afterimage-plate strong b{color:var(--green);font-weight:300;font-variant-numeric:tabular-nums slashed-zero}
.afterimage-plate p{margin:.65rem 0 0;color:#9fb0a6;font-size:.56rem;line-height:1.65}
.survey.beam-cut .afterimage-plate{opacity:1;transform:none}
.survey.beam-cut .hero-copy{opacity:.22;filter:blur(.7px);transition:opacity .8s ease,filter .8s ease}
.survey.beam-cut .survey-scrim{background:#01030288}
.survey.beam-cut .beam-lock{color:var(--ember)}
.survey.census-complete .tally{border-color:#b9ff62aa;box-shadow:0 22px 70px #000b,inset 0 0 50px #b9ff6212,0 0 32px #b9ff6216}
.survey.census-complete .tally:after{content:"THE DARK WAS NEVER EMPTY";position:absolute;right:0;bottom:-2rem;color:var(--green);font-size:.48rem;letter-spacing:.17em}
@keyframes nightArrive{from{opacity:.3;filter:brightness(.25)}to{opacity:1;filter:none}}
@keyframes instrumentArrive{from{opacity:0;transform:translateX(22px)}to{opacity:1;transform:none}}

@media(max-width:900px){
  .afterimage-plate{left:5vw;bottom:10%;width:280px}
}

@media(max-width:600px){
  .afterimage-plate{left:5vw;right:5vw;bottom:31%;width:auto;padding:.85rem 1rem}
  .afterimage-plate strong{font-size:.74rem}
  .afterimage-plate p{font-size:.52rem}
  .survey.beam-cut .hero-copy{opacity:.14}
  .survey.census-complete .tally:after{bottom:-1.5rem;font-size:.42rem}
}

@media(prefers-reduced-motion:reduce){
  .survey canvas,.tally{animation:none}
  .afterimage-plate,.survey.beam-cut .hero-copy{transition:none}
}