/* Landau Lab · Homepage preview C — "a guided visit"
   Everything below the hero. The hero, header and film player keep the current homepage's inline styles. */

:root{
  --dk:#0b1b1e;
  --dk-0:#061012;
  --dk-2:#0e2226;
  --pet-l:#7fb9bd;
  --sand:#a9864f;
  --sand-l:#d2ae72;
  --sand-soft:rgba(169,134,79,.10);
  --sand-line:rgba(169,134,79,.38);
  --on-dk:#f5f2ec;
  --on-dk-2:rgba(245,242,236,.74);
  --on-dk-3:rgba(245,242,236,.52);
  --on-dk-line:rgba(245,242,236,.12);
  --route-h:44px;
  --stick:calc(72px + var(--route-h));
}
html{scroll-padding-top:calc(var(--stick) + 8px)}
body{overflow-x:clip}
::selection{background:rgba(46,88,95,.18)}
sup,sub{line-height:0}

/* ---------------------------------------------------------------- shared type */
.kicker{font-family:var(--mono);font-size:.68rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--accent)}
.prose p{color:var(--ink-soft);max-width:48ch}
.prose p + p{margin-top:1rem}
.cap{font-size:.8rem;line-height:1.55;color:var(--muted);margin-top:.9rem;max-width:72ch}
.cap a{color:var(--accent-deep);border-bottom:1px solid var(--accent-line)}
.cap b{color:var(--ink-soft);font-weight:600}
.tag{display:inline-block;vertical-align:.08em;margin-right:.35rem;font-family:var(--mono);font-size:.56rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
  padding:.12rem .45rem;border-radius:999px;border:1px solid var(--accent-line);color:var(--accent-deep);white-space:nowrap}
.tag-sim{border-style:dashed;border-color:var(--sand-line);color:#7d5f2f}
.go{display:inline-flex;align-items:center;gap:.45rem;margin-top:1.4rem;padding-bottom:.18rem;font-family:var(--mono);font-size:.74rem;letter-spacing:.04em;
  color:var(--accent-deep);border-bottom:1px solid var(--accent-line);transition:color .2s ease,border-color .2s ease}
.go span{transition:transform .2s ease}
.go:hover{border-bottom-color:var(--accent)}
.go:hover span{transform:translateX(3px)}
.go-quiet{color:var(--muted);border-bottom-color:var(--line-strong)}

/* ---------------------------------------------------------------- route strip */
.route{position:fixed;left:0;right:0;top:72px;z-index:95;
  background:var(--paper);background:color-mix(in srgb,var(--paper) 95%,transparent);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);
  transform:translateY(-100%);opacity:0;visibility:hidden;
  transition:transform .5s cubic-bezier(.22,1,.36,1),opacity .35s ease,visibility 0s linear .5s}
.route.is-on{transform:none;opacity:1;visibility:visible;transition-delay:0s}
.route[hidden]{display:none}
.route-in{position:relative;display:flex;align-items:center;gap:1.4rem;height:var(--route-h)}
.route-now{display:flex;align-items:baseline;gap:.5rem;min-width:0;white-space:nowrap;
  font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.route-n{color:var(--accent);font-weight:500}
.route-t{margin-left:.35rem;font-family:var(--serif);font-style:italic;font-size:1rem;letter-spacing:0;text-transform:none;color:var(--ink);overflow:hidden;text-overflow:ellipsis}
.route-stops{list-style:none;margin:0 0 0 auto;padding:0;display:flex;align-items:center}
.route-stops li{position:relative;display:flex;align-items:center}
.route-stops li + li::before{content:"";width:22px;height:1px;background:var(--line-strong)}
.route-stops a{position:relative;display:grid;place-items:center;width:26px;height:var(--route-h)}
.rs-dot{width:9px;height:9px;border-radius:50%;border:1px solid var(--line-strong);background:var(--paper);transition:background .3s ease,border-color .3s ease,box-shadow .3s ease,transform .3s ease}
.route-stops a.is-past .rs-dot{background:var(--accent-line);border-color:var(--accent-line)}
.route-stops a.is-now .rs-dot{background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft);transform:scale(1.15)}
.route-stops a:hover .rs-dot{border-color:var(--accent)}
.rs-l{position:absolute;top:calc(100% - 4px);left:50%;transform:translate(-50%,4px);white-space:nowrap;pointer-events:none;
  font-family:var(--mono);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--paper);background:var(--ink);
  padding:.3rem .5rem;border-radius:3px;opacity:0;transition:opacity .15s ease,transform .15s ease}
.route-stops a:hover .rs-l,.route-stops a:focus-visible .rs-l{opacity:1;transform:translate(-50%,0)}
.route-stops a:focus-visible{outline-offset:-4px}
.route-next{display:inline-flex;align-items:baseline;gap:.5rem;white-space:nowrap;padding:.3rem 0 .3rem 1.2rem;border-left:1px solid var(--line);
  font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.route-next .rn-t{font-family:var(--serif);font-style:italic;font-size:.98rem;letter-spacing:0;text-transform:none;color:var(--accent-deep)}
.route-next:hover .rn-t{color:var(--accent)}
.route-next[aria-disabled="true"]{visibility:hidden}
.route-bar{position:absolute;left:var(--gutter);right:var(--gutter);bottom:-1px;height:1px;overflow:hidden}
.route-bar i{position:absolute;inset:0;background:var(--accent);transform-origin:left;transform:scaleX(0)}
@media (max-width:980px){.route-stops{display:none}.route-next{margin-left:auto}}
@media (max-width:560px){
  :root{--route-h:40px}
  .route-in{gap:.8rem}
  .route-t{font-size:.94rem;max-width:44vw}
  .route-next{padding-left:.8rem}
  .route-next .rn-t{display:none}
}
@media print{.route,.pv,.review-legend{display:none!important}}

/* ---------------------------------------------------------------- start here */
.orient{padding-block:clamp(4.5rem,9vw,7.5rem) clamp(4rem,8vw,6.5rem);background:var(--paper)}
.orient-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,19rem);gap:clamp(2rem,6vw,6rem);align-items:end}
.orient-title{margin-top:1rem;font-size:clamp(2.3rem,1.5rem + 3vw,4.1rem);line-height:1.03;letter-spacing:-.025em;text-wrap:balance}
.orient-title em,.ch-title em,.h3-lg em,.step h3 em,.coda-t em{font-style:italic;font-weight:300;color:var(--accent-deep)}
.orient-lede{margin-top:1.4rem;max-width:42ch;font-family:var(--serif);font-weight:300;font-size:clamp(1.15rem,1rem + .6vw,1.45rem);line-height:1.5;color:var(--ink-soft)}
.oa-k{font-family:var(--mono);font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-bottom:.7rem}
.oa-film{display:grid;grid-template-columns:7.2rem minmax(0,1fr);gap:1rem;align-items:center;width:100%;padding:.55rem .9rem .55rem .55rem;
  background:var(--paper-2);border:1px solid var(--line);border-radius:6px;cursor:pointer;text-align:left;font:inherit;color:inherit;
  transition:border-color .2s ease,background .2s ease}
.oa-film:hover{border-color:var(--accent-line);background:var(--card)}
.oa-thumb{position:relative;display:block;aspect-ratio:16/9;border-radius:3px;overflow:hidden;background:#0b1b1e}
.oa-thumb img{display:block;width:100%;height:100%;object-fit:cover}
.oa-play{position:absolute;inset:0;display:grid;place-items:center;color:#f5f2ec}
.oa-play svg{width:.8rem;height:.95rem;margin-left:2px;filter:drop-shadow(0 1px 4px rgba(0,0,0,.5))}
.oa-t{display:grid;gap:.15rem}
.oa-t b{font-family:var(--serif);font-weight:400;font-size:1.08rem;color:var(--ink);line-height:1.25}
.oa-t span{font-size:.8rem;color:var(--muted)}

.map{list-style:none;margin:clamp(3.2rem,6vw,4.6rem) 0 0;padding:0;position:relative;display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.map::before{content:"";position:absolute;left:11px;right:0;top:11px;height:1px;background:var(--line-strong)}
.map a{position:relative;display:grid;align-content:start;gap:.3rem;padding:0 1rem 0 0;height:100%}
.map-dot{position:relative;width:23px;height:23px;border-radius:50%;border:1px solid var(--line-strong);background:var(--paper);display:grid;place-items:center;transition:border-color .2s ease,background .2s ease}
.map-dot::after{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent);transition:transform .25s ease}
.map-n{margin-top:.95rem;font-family:var(--mono);font-size:.66rem;font-weight:500;letter-spacing:.12em;color:var(--accent)}
.map-t{font-family:var(--serif);font-size:1.14rem;line-height:1.2;color:var(--ink);transition:color .2s ease}
.map-d{font-size:.84rem;line-height:1.45;color:var(--muted)}
.map a:hover .map-dot,.map a:focus-visible .map-dot{border-color:var(--accent);background:var(--accent-soft)}
.map a:hover .map-dot::after{transform:scale(1.4)}
.map a:hover .map-t{color:var(--accent-deep)}
.begin{display:inline-flex;align-items:center;gap:.9rem;margin-top:clamp(2.6rem,5vw,3.4rem);font-family:var(--mono);font-size:.74rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-deep)}
.begin-arrow{display:grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:50%;border:1px solid var(--accent-line);font-family:var(--sans);font-size:1rem;letter-spacing:0;transition:background .2s ease,color .2s ease,border-color .2s ease}
.begin:hover .begin-arrow{background:var(--accent);border-color:var(--accent);color:#fff}
.js .begin-arrow{animation:nudge 2.8s ease-in-out infinite}
@keyframes nudge{0%,60%,100%{transform:none}30%{transform:translateY(4px)}}

/* ---------------------------------------------------------------- chapters */
.ch{position:relative;padding-block:clamp(5rem,10vw,8.5rem)}
.ch-head{max-width:54rem;margin-bottom:clamp(3rem,6vw,4.6rem)}
.sign{display:flex;align-items:center;gap:.9rem;font-family:var(--mono);font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.sign-n{color:var(--accent);font-weight:500}
.sign-rule{width:2.4rem;height:1px;background:var(--line-strong)}
.ch-title{margin-top:1.15rem;font-size:clamp(2.4rem,1.5rem + 3.4vw,4.5rem);line-height:1.02;letter-spacing:-.026em;text-wrap:balance}
.ch-lede{margin-top:1.4rem;max-width:46ch;font-family:var(--serif);font-weight:300;font-size:clamp(1.15rem,1rem + .6vw,1.45rem);line-height:1.5;color:var(--ink-soft)}
.h3-lg{margin-top:.8rem;font-size:clamp(1.7rem,1.25rem + 1.5vw,2.45rem);line-height:1.08;letter-spacing:-.018em;text-wrap:balance}
.next{display:flex;align-items:baseline;flex-wrap:wrap;gap:.4rem 1.1rem;margin-top:clamp(4rem,8vw,6rem);padding-top:1.3rem;border-top:1px solid var(--line)}
.next-k{font-family:var(--mono);font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.next-t{font-family:var(--serif);font-size:clamp(1.3rem,1.1rem + .8vw,1.7rem);color:var(--ink);transition:color .2s ease}
.next-a{margin-left:auto;display:grid;place-items:center;width:2.4rem;height:2.4rem;border-radius:50%;border:1px solid var(--line-strong);transition:all .2s ease}
.next:hover .next-t{color:var(--accent-deep)}
.next:hover .next-a{background:var(--accent);border-color:var(--accent);color:#fff;transform:translateY(3px)}

/* dark chapters */
.ch-dark{color:var(--on-dk-2);background:var(--dk);background:radial-gradient(1100px 760px at 78% 30%,#12292d 0%,var(--dk) 58%,var(--dk-0) 100%)}
.ch-dark .sign{color:var(--on-dk-3)}
.ch-dark .sign-n{color:var(--sand-l)}
.ch-dark .sign-rule{background:rgba(245,242,236,.22)}
.ch-dark .ch-title,.ch-dark h3{color:var(--on-dk)}
.ch-dark .ch-title em,.ch-dark h3 em{color:var(--sand-l)}
.ch-dark .ch-lede,.ch-dark .prose p{color:var(--on-dk-2)}
.ch-dark .kicker{color:var(--sand-l)}
.ch-dark a:focus-visible,.ch-dark button:focus-visible,.ch-dark input:focus-visible{outline-color:var(--sand-l)}
.ch-dark ::selection{background:rgba(210,174,114,.3);color:#fff}
.ch-dark .next{border-top-color:var(--on-dk-line)}
.ch-dark .next-k{color:var(--on-dk-3)}
.ch-dark .next-t{color:var(--on-dk)}
.ch-dark .next-a{border-color:rgba(245,242,236,.25);color:var(--on-dk)}
.ch-dark .next:hover .next-t{color:var(--sand-l)}
.ch-dark .next:hover .next-a{background:var(--sand-l);border-color:var(--sand-l);color:#10201f}
.cap-dark{margin-top:1rem;font-size:.78rem;line-height:1.6;color:var(--on-dk-3);max-width:70ch}
.cap-dark a{color:var(--sand-l);border-bottom:1px solid rgba(210,174,114,.35)}
.cap-dark .tag{border-color:rgba(127,185,189,.45);color:var(--pet-l)}
.cap-dark .tag-sim{border-color:rgba(210,174,114,.5);color:var(--sand-l)}
.more-dark{display:inline-flex;flex-wrap:wrap;gap:.45rem;margin-top:1.4rem;font-family:var(--mono);font-size:.72rem;letter-spacing:.04em;color:var(--on-dk);border-bottom:1px solid rgba(210,174,114,.45);padding-bottom:.15rem}
.more-dark:hover{color:var(--sand-l)}

/* ---------------------------------------------------------------- 01 the signal */
.sig{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(2.5rem,6vw,6rem);align-items:center}
.sig-copy .prose{margin-top:1.6rem}
.sig-key{list-style:none;margin:2rem 0 0;padding:0;display:grid;gap:.75rem;border-top:1px solid var(--on-dk-line);padding-top:1.3rem}
.sig-key li{display:grid;grid-template-columns:26px minmax(0,1fr);gap:.9rem;align-items:center;font-size:.9rem;color:var(--on-dk-3);transition:color .4s ease}
.sig-key b{font-family:var(--mono);font-size:.64rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--on-dk-2);margin-right:.6rem}
.sig-key i{display:block;height:18px;border-radius:3px}
.k-line{background:linear-gradient(160deg,transparent 45%,var(--sand-l) 47%,var(--sand-l) 53%,transparent 55%),linear-gradient(20deg,transparent 45%,rgba(210,174,114,.5) 47%,rgba(210,174,114,.5) 53%,transparent 55%)}
.k-img{background:radial-gradient(circle at 50% 55%,#e4fe04 0 12%,#04fd90 26%,#0359b3 52%,#000141 70%);border-radius:50%!important;width:18px}
.k-real{border:1px solid var(--pet-l);background:rgba(127,185,189,.15)}
.sig-key li.is-lit{color:var(--on-dk)}
.sig-key li.is-lit b{color:var(--pet-l)}

.sig-fig{margin:0}
.scanner{position:relative;width:100%;max-width:580px;margin-inline:auto;aspect-ratio:1/1}
.scan-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.scan-img{position:absolute;inset:17%;border-radius:50%;overflow:hidden;background:#000;box-shadow:0 0 0 1px rgba(127,185,189,.18),0 30px 80px -30px rgba(0,0,0,.9)}
.scan-f{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .55s ease}
.scan-f.is-on{opacity:1}
.scan-tag{position:absolute;left:50%;bottom:5.5%;transform:translateX(-50%);white-space:nowrap;
  font-family:var(--mono);font-size:.58rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;
  padding:.24rem .6rem;border-radius:999px;border:1px solid rgba(127,185,189,.5);color:var(--pet-l);background:rgba(6,16,18,.7);transition:color .3s ease,border-color .3s ease}
.scan-tag.is-sim{border-style:dashed;border-color:rgba(210,174,114,.6);color:var(--sand-l)}
.scan-ui{max-width:580px;margin:1.4rem auto 0}
.scan-row{display:flex;justify-content:space-between;align-items:baseline;gap:1rem}
.scan-row label{font-family:var(--mono);font-size:.64rem;letter-spacing:.18em;text-transform:uppercase;color:var(--on-dk-3)}
.scan-row output{font-family:var(--serif);font-size:1.15rem;color:var(--on-dk)}
.scan-ui input[type=range]{-webkit-appearance:none;appearance:none;display:block;width:100%;height:28px;margin:.5rem 0 0;background:transparent;cursor:pointer}
.scan-ui input[type=range]::-webkit-slider-runnable-track{height:2px;border-radius:2px;background:linear-gradient(90deg,var(--sand-l) var(--fill,100%),rgba(245,242,236,.18) var(--fill,100%))}
.scan-ui input[type=range]::-moz-range-track{height:2px;border-radius:2px;background:rgba(245,242,236,.18)}
.scan-ui input[type=range]::-moz-range-progress{height:2px;background:var(--sand-l)}
.scan-ui input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;margin-top:-8px;border-radius:50%;background:var(--dk);border:2px solid var(--sand-l);box-shadow:0 0 0 4px rgba(210,174,114,.14)}
.scan-ui input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--dk);border:2px solid var(--sand-l)}
.scan-ui input[type=range]:focus-visible{outline:2px solid var(--sand-l);outline-offset:4px;border-radius:4px}
.scan-ticks{display:flex;justify-content:space-between;font-family:var(--mono);font-size:.58rem;letter-spacing:.08em;color:var(--on-dk-3);margin-top:.1rem}
.scan-ticks span:nth-child(2){margin-left:auto;margin-right:9%}
.scan-row-b{margin-top:.8rem;align-items:flex-start}
.scan-note{font-size:.9rem;color:var(--on-dk-2);min-height:2.9em}
.scan-replay{flex:none;display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .75rem;border-radius:999px;border:1px solid rgba(245,242,236,.25);background:transparent;color:var(--on-dk);cursor:pointer;
  font-family:var(--mono);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase}
.scan-replay svg{width:13px;height:13px}
.scan-replay:hover{border-color:var(--sand-l);color:var(--sand-l)}
.scan-replay[hidden]{display:none}
.sig-fig .cap-dark{max-width:580px;margin-inline:auto;margin-top:1.4rem;padding-top:1rem;border-top:1px solid var(--on-dk-line)}

.again{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(2.5rem,6vw,6rem);align-items:start;margin-top:clamp(4.5rem,9vw,7rem);padding-top:clamp(3rem,6vw,4.4rem);border-top:1px solid var(--on-dk-line)}
.again-title{font-size:clamp(1.6rem,1.2rem + 1.4vw,2.3rem);line-height:1.12;letter-spacing:-.015em;margin-bottom:1.1rem;text-wrap:balance}
.again-copy p{color:var(--on-dk-2);max-width:46ch}
.again-fig{margin:0}
.strip{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.5rem,1.2vw,.9rem)}
.strip img{display:block;width:100%;height:auto;aspect-ratio:1/1;border-radius:4px;background:#000;box-shadow:0 0 0 1px rgba(245,242,236,.08)}
.strip span{display:block;margin-top:.55rem;font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--on-dk-2)}
.cbar{display:flex;align-items:center;gap:.7rem;margin-top:1.1rem;font-family:var(--mono);font-size:.62rem;letter-spacing:.06em;color:var(--on-dk-3)}
.cbar > i{flex:1;height:6px;border-radius:3px;background:linear-gradient(90deg,#000141,#001e77,#0359b3,#0497f2,#03d7cb,#04fd90,#3afb46,#70fe0d,#aafd04,#e4fe04,#fef802,#fdbc07,#fa8003,#fb4202,#ab3338)}
.cbar .it{font-style:italic;font-family:var(--serif);font-size:.8rem}

/* ---------------------------------------------------------------- 02 research themes (scroll tour) */
.themes{background:var(--paper)}
.howto{list-style:none;margin:1.8rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.7rem 1.8rem;font-size:.88rem;color:var(--muted)}
.howto li{display:flex;align-items:center;gap:.6rem}
.howto b{color:var(--ink-soft);font-weight:600}
.ht-n{display:grid;place-items:center;width:1.4rem;height:1.4rem;border-radius:50%;border:1px solid var(--accent-line);font-family:var(--mono);font-size:.64rem;color:var(--accent-deep)}
.ht-sw{width:26px;height:18px;border-radius:3px;flex:none}
.ht-draw{background:#12272b url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 22'%3E%3Cg fill='none' stroke='%237fb9bd' stroke-width='1.1' stroke-linecap='round'%3E%3Cpath d='M15 11l-7-5M15 11l8-4M15 11l-6 6M15 11l7 6'/%3E%3C/g%3E%3Ccircle cx='15' cy='11' r='2.6' fill='%23d2ae72'/%3E%3C/svg%3E") center/cover no-repeat}

.tour{display:grid;grid-template-columns:minmax(0,4.6fr) minmax(0,7.4fr);gap:clamp(2rem,4.5vw,4.5rem);align-items:start}
.tour-steps{grid-column:1;grid-row:1}
.tour-stage{grid-column:2;grid-row:1;position:sticky;top:calc(var(--stick) + 1.4rem);height:min(calc(100vh - var(--stick) - 2.8rem),640px);min-height:420px;
  border-radius:8px;overflow:hidden;isolation:isolate;color:var(--on-dk);
  background:#0d1a1d;background:radial-gradient(85% 105% at 60% 42%,#17302f 0%,#102226 42%,#0b1719 100%);
  box-shadow:0 44px 80px -52px rgba(11,27,30,.8),0 0 0 1px rgba(11,27,30,.9)}
.tour-stage::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:linear-gradient(rgba(245,242,236,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(245,242,236,.03) 1px,transparent 1px);
  background-size:44px 44px;-webkit-mask-image:radial-gradient(70% 80% at 55% 45%,#000 20%,transparent 78%);mask-image:radial-gradient(70% 80% at 55% 45%,#000 20%,transparent 78%)}
.tour-canvas{position:absolute;inset:0;z-index:1;width:100%;height:100%;display:block;touch-action:pan-y;-webkit-tap-highlight-color:transparent}
.st-top{position:absolute;z-index:3;left:1.2rem;right:.95rem;top:.8rem;display:flex;align-items:center;gap:.8rem;pointer-events:none}
.st-scale{display:flex;align-items:center;gap:.55rem;margin:0;font-family:var(--mono);font-size:.6rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--on-dk-3)}
.st-scale svg{width:22px;height:8px;fill:none;stroke:var(--sand-l);stroke-width:1}
.st-ticks{list-style:none;margin:0 .2rem 0 auto;padding:0;display:flex;gap:.3rem;font-family:var(--mono);font-size:.56rem;letter-spacing:.1em;color:rgba(245,242,236,.34)}
.st-ticks li{padding:.18rem .38rem;border-radius:3px;border:1px solid transparent;transition:all .3s ease}
.st-ticks li.is-on{color:var(--sand-l);border-color:rgba(210,174,114,.45)}
.st-flag{font-family:var(--mono);font-size:.56rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(245,242,236,.46);padding:.26rem .5rem;border:1px solid rgba(245,242,236,.14);border-radius:3px}
.st-motion{flex:none;pointer-events:auto;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;cursor:pointer;padding:0;
  border:1px solid rgba(245,242,236,.24);background:rgba(8,16,18,.42);color:var(--on-dk);transition:border-color .2s ease,background .2s ease}
.st-motion:hover{border-color:var(--sand-l);background:rgba(210,174,114,.12)}
.st-motion:focus-visible{outline:2px solid var(--sand-l);outline-offset:3px}
.st-motion svg{width:10px;height:10px}
.st-motion .i-pause{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.st-motion .i-play{display:none;fill:currentColor}
.st-motion.is-paused .i-play{display:block}
.st-motion.is-paused .i-pause{display:none}
.st-state{position:absolute;z-index:2;left:50%;top:3.3rem;transform:translateX(-50%);margin:0;white-space:nowrap;
  font-family:var(--serif);font-style:italic;font-size:1.02rem;color:var(--sand-l);opacity:0;transition:opacity .35s ease}
.st-state.is-on{opacity:1}
.st-hint{position:absolute;z-index:2;left:1.2rem;bottom:1.1rem;right:9.5rem;margin:0;font-family:var(--mono);font-size:.62rem;letter-spacing:.05em;color:var(--on-dk-3)}
.st-hint:not(:empty)::before{content:"";display:inline-block;width:5px;height:5px;margin:0 .55rem .1rem 0;border-radius:50%;background:var(--sand-l);animation:ping 2.6s ease-out infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(210,174,114,.5)}70%,100%{box-shadow:0 0 0 7px rgba(210,174,114,0)}}
.st-meter{position:absolute;z-index:2;right:1.2rem;bottom:1.15rem;display:grid;gap:.45rem;justify-items:end;font-family:var(--mono);font-size:.6rem;font-weight:500;letter-spacing:.1em;color:var(--on-dk-3);transition:opacity .3s ease}
.st-meter b{font-weight:500;color:var(--sand-l);margin-left:.35rem}
.st-meter em{display:block;position:relative;width:110px;height:3px;border-radius:2px;overflow:hidden;background:rgba(245,242,236,.14)}
.st-meter i{position:absolute;inset:0;background:linear-gradient(90deg,#b99257,#e6ca94);transform-origin:left;transform:scaleX(0)}
.st-meter.is-off{opacity:0}

.step{position:relative;min-height:min(84vh,820px);padding-bottom:10vh;transition:opacity .5s ease}
.step:last-child{min-height:0;padding-bottom:0}
.js .step{opacity:.34}
.js .step.is-on{opacity:1}
.step-k{display:flex;align-items:baseline;gap:.8rem;font-family:var(--mono);font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.step-n{font-family:var(--serif);font-weight:300;font-size:2.8rem;line-height:1;letter-spacing:-.02em;color:var(--accent);text-transform:none}
.step h3{margin-top:.8rem;font-size:clamp(1.75rem,1.3rem + 1.5vw,2.55rem);line-height:1.06;letter-spacing:-.02em;text-wrap:balance}
.step-text{margin-top:1rem;max-width:46ch;color:var(--ink-soft)}
.try{margin-top:1.5rem;padding:1rem 1.1rem 1.05rem;border:1px solid var(--line);border-radius:6px;background:var(--paper-2);transition:border-color .3s ease,box-shadow .3s ease}
.step.is-on .try{border-color:var(--accent-line);box-shadow:0 14px 30px -24px rgba(27,26,22,.35)}
.try-k{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.3rem 1rem;font-family:var(--mono);font-size:.62rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--accent)}
.try-demo{display:none;letter-spacing:.08em;text-transform:none;font-weight:400;color:#7d5f2f}
.try-demo::before{content:"";display:inline-block;width:5px;height:5px;margin:0 .45rem .1rem 0;border-radius:50%;background:var(--sand);animation:ping 2.6s ease-out infinite}
.is-demo .try-demo,.try-demo.is-on{display:inline}
.try-row{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:.75rem}
.pill{display:inline-flex;align-items:center;gap:.5rem;min-height:36px;padding:.38rem .9rem .38rem .72rem;border-radius:999px;cursor:pointer;
  border:1px solid var(--line-strong);background:var(--card);color:var(--ink);font-family:var(--mono);font-size:.7rem;font-weight:500;letter-spacing:.04em;
  transition:border-color .2s ease,background .2s ease,color .2s ease,transform .15s ease,box-shadow .3s ease}
.pill small{font-size:.92em;font-weight:400;color:var(--muted);letter-spacing:.02em}
.pill i{flex:none;width:8px;height:8px;border-radius:50%;border:1px solid currentColor;transition:background .2s ease,box-shadow .3s ease}
.pill:hover{border-color:var(--accent)}
.pill:active{transform:scale(.97)}
.pill[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.pill[aria-pressed="true"] small{color:rgba(245,242,236,.6)}
.pill[aria-pressed="true"] i{background:var(--sand-l);border-color:var(--sand-l);box-shadow:0 0 8px rgba(210,174,114,.7)}
.pill-go i{border:0;border-radius:1px;background:linear-gradient(currentColor,currentColor) center/100% 1.5px no-repeat,linear-gradient(currentColor,currentColor) center/1.5px 100% no-repeat}
.pill.is-hit{box-shadow:0 0 0 4px rgba(169,134,79,.28)}
@media (min-width:420px){.seg-4{display:grid;grid-template-columns:repeat(2,max-content);justify-content:start}.seg-4 .pill{justify-content:flex-start}}
.try-note{margin-top:.8rem;font-size:.9rem;line-height:1.55;color:var(--ink-soft);max-width:48ch}
.touch-only{display:none}
@media (hover:none){.pointer-only{display:none}.touch-only{display:inline}}
.seeing{margin-top:1.15rem;max-width:48ch;font-size:.88rem;line-height:1.6;color:var(--muted)}
.seeing .k{display:block;margin-bottom:.2rem;font-family:var(--mono);font-size:.6rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--accent)}
.seeing-key{padding-left:1rem;border-left:2px solid var(--accent);font-family:var(--serif);font-size:1.08rem;line-height:1.5;color:var(--ink)}
.step-fig{margin:1.3rem 0 0;max-width:34rem}
.step-fig img{display:block;width:100%;height:auto;border-radius:4px;border:1px solid var(--line);background:#fff}
.step-fig-l{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;margin-top:.45rem;text-align:center;font-family:var(--mono);font-size:.56rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-deep)}
.step-fig figcaption{margin-top:.55rem;font-size:.76rem;line-height:1.5;color:var(--muted)}
.step-fig figcaption a{color:var(--accent-deep);border-bottom:1px solid var(--accent-line)}

/* ---------------------------------------------------------------- 03 how we know */
.know{background:var(--paper-2);border-top:1px solid var(--line)}
.venn-block{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(2rem,6vw,5.5rem);align-items:center}
.venn-fig{margin:0}
.venn{display:block;width:100%;max-width:470px;height:auto;margin-inline:auto;overflow:visible}
.venn .vc{stroke-width:1.2;transition:fill-opacity .45s ease,stroke-width .45s ease,opacity .45s ease}
.vc-pet{fill:#2e585f;fill-opacity:.08;stroke:#2e585f}
.vc-tis{fill:#a9864f;fill-opacity:.09;stroke:#a9864f}
.vc-beh{fill:#6f6b61;fill-opacity:.06;stroke:#6f6b61}
.venn.has-on .vc{opacity:.45}
.venn .vc.is-on{opacity:1;fill-opacity:.2;stroke-width:2}
.venn .vt{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;fill:var(--ink-soft)}
.venn .vt-s{font-size:9px;fill:var(--muted)}
.venn .v-dot{fill:var(--accent)}
.venn .v-center{font-family:var(--serif);font-style:italic;font-size:16px;fill:var(--ink)}
.venn-fig .cap{text-align:center;margin-inline:auto;max-width:36ch}
.meas{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.m{padding:1.15rem .2rem 1.2rem 0;border-bottom:1px solid var(--line);transition:opacity .35s ease,background .35s ease;outline:none}
.m:focus-visible{box-shadow:inset 3px 0 0 var(--accent)}
.meas.has-on .m:not(.is-on){opacity:.5}
.m-k{display:flex;align-items:center;gap:.7rem;font-family:var(--mono);font-size:.66rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}
.m .sw{width:12px;height:12px;border-radius:50%;border:1.2px solid}
.sw-pet{border-color:#2e585f;background:rgba(46,88,95,.18)}
.sw-tis{border-color:#a9864f;background:rgba(169,134,79,.2)}
.sw-beh{border-color:#6f6b61;background:rgba(111,107,97,.14)}
.m-sees,.m-cant{margin-top:.45rem;font-size:.94rem;line-height:1.55;color:var(--ink-soft);max-width:52ch}
.m-cant{color:var(--muted)}
.m b{font-family:var(--mono);font-size:.6rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-right:.45rem}
.m-cant b{color:var(--sand)}

.agree{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(2rem,6vw,5.5rem);align-items:center;margin-top:clamp(4.5rem,9vw,7rem);padding-top:clamp(3rem,6vw,4.5rem);border-top:1px solid var(--line)}
.agree-copy p:not(.kicker){margin-top:1rem;color:var(--ink-soft);max-width:46ch}
.agree-also{padding-top:1rem;border-top:1px solid var(--line);font-size:.93rem}
.agree-also b{color:var(--ink);font-weight:600}
.agree-fig{margin:0;padding:clamp(1.3rem,3vw,2rem);background:var(--card);border:1px solid var(--line);border-radius:6px;box-shadow:0 20px 40px -32px rgba(27,26,22,.3)}
.bars-k{font-family:var(--mono);font-size:.62rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.bars{position:relative;margin-top:1.3rem;padding-left:5.6rem;padding-right:3.4rem}
.bars-g{position:relative;padding-block:.5rem}
.bars-g + .bars-g{margin-top:.6rem}
.bars-l{position:absolute;left:-5.6rem;top:50%;transform:translateY(-50%);width:5rem;font-family:var(--mono);font-size:.72rem;color:var(--ink-soft)}
.bar{position:relative;height:20px}
.bar + .bar{margin-top:6px}
.bar i{position:absolute;left:0;top:0;bottom:0;width:calc(var(--v) / 60 * 100%);border-radius:0 2px 2px 0;transform-origin:left;transform:scaleX(0);transition:transform 1.2s cubic-bezier(.22,1,.36,1)}
.bar-pet i{background:#2e585f}
.bar-ar i{background:#a9864f;transition-delay:.18s}
.bar span{position:absolute;top:50%;left:calc(var(--v) / 60 * 100% + .5rem);transform:translateY(-50%);font-family:var(--mono);font-size:.74rem;color:var(--ink);opacity:0;transition:opacity .4s ease .9s}
.agree-fig.in .bar i,html.no-js .bar i{transform:scaleX(1)}
.agree-fig.in .bar span,html.no-js .bar span{opacity:1}
.bars-axis{display:flex;justify-content:space-between;margin-top:.8rem;padding-top:.4rem;border-top:1px solid var(--line);font-family:var(--mono);font-size:.6rem;color:var(--muted)}
.bars-legend{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;margin-top:1.1rem;font-size:.8rem;color:var(--ink-soft)}
.bars-legend > span{display:inline-flex;align-items:center;gap:.45rem}
.bars-legend i{width:12px;height:8px;border-radius:1.5px}
.lg-pet{background:#2e585f}.lg-ar{background:#a9864f}

.models{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,6vw,5.5rem);align-items:center;margin-top:clamp(4.5rem,9vw,7rem);padding-top:clamp(3rem,6vw,4.5rem);border-top:1px solid var(--line)}
.herd{margin-top:1.6rem;max-width:400px}
.herd svg{display:block;width:100%;height:auto;overflow:visible}
.herd .h-line{stroke:var(--line-strong);stroke-width:1.2;fill:none}
.herd .h-l{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;fill:var(--muted)}
.herd .h-mouse,.herd .h-pig{transition:transform 1.4s cubic-bezier(.22,1,.36,1),opacity .8s ease}
.js .herd:not(.in) .h-mouse{transform:translateX(-40px);opacity:0}
.js .herd:not(.in) .h-pig{transform:translateX(50px);opacity:0}
.models-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.6rem;margin-top:1.4rem}
.models-two p:not(.mk){font-size:.94rem;color:var(--ink-soft)}
.mk{font-family:var(--mono);font-size:.64rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin-bottom:.4rem}
.collab-k{margin-top:1.8rem;padding-top:1.1rem;border-top:1px solid var(--line);font-size:.9rem;color:var(--muted);max-width:56ch}
.models-fig{margin:0}
.frame-dark{background:#000;border-radius:6px;overflow:hidden;box-shadow:0 30px 60px -36px rgba(0,0,0,.6)}
.frame-dark img{display:block;width:100%;height:auto}
.know-cta{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.6rem;margin-top:clamp(3.5rem,7vw,5rem);padding:1.3rem 1.5rem;border:1px solid var(--line);border-radius:6px;background:var(--card)}
.know-cta p{font-family:var(--serif);font-size:1.2rem;color:var(--ink)}
.know-cta .btn{margin-left:auto}

/* ---------------------------------------------------------------- 04 go deeper */
.deeper{background:#0c1d20}
.tickets{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1rem,1.6vw,1.3rem)}
.ticket{display:flex}
.tk{display:flex;flex-direction:column;width:100%;padding:0;margin:0;text-align:left;font:inherit;color:inherit;cursor:pointer;
  background:rgba(245,242,236,.035);border:1px solid rgba(245,242,236,.13);border-radius:8px;overflow:hidden;transition:border-color .25s ease,background .25s ease,transform .25s ease}
.tk:hover{border-color:rgba(210,174,114,.55);background:rgba(245,242,236,.055);transform:translateY(-3px)}
.tk:focus-visible{outline:2px solid var(--sand-l);outline-offset:3px}
.tk-media{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;background:var(--dk-0)}
.tk-media img{display:block;width:100%;height:100%;object-fit:cover;opacity:.92;transition:transform .7s cubic-bezier(.22,1,.36,1)}
.tk:hover .tk-media img{transform:scale(1.04)}
.tk-play{position:absolute;left:50%;top:50%;width:3rem;height:3rem;margin:-1.5rem 0 0 -1.5rem;border-radius:50%;display:grid;place-items:center;
  border:1px solid rgba(245,242,236,.6);background:rgba(6,16,18,.45);color:var(--on-dk);transition:background .2s ease,color .2s ease}
.tk-play svg{width:.8rem;height:.95rem;margin-left:3px}
.tk:hover .tk-play{background:var(--on-dk);color:#10201f}
.tk-art{display:grid;place-items:center;background:radial-gradient(90% 90% at 50% 40%,#16302f,#0a171a)}
.tk-art svg{width:84%;height:auto;overflow:visible}
.ta-grid path{stroke:rgba(245,242,236,.22);stroke-width:1;fill:none}
.ta-fill{fill:rgba(127,185,189,.16)}
.ta-line{fill:none;stroke:#7fb9bd;stroke-width:1.8;stroke-linejoin:round}
.ta-dots circle{fill:rgba(245,242,236,.75)}
.tk-art text{font-family:var(--mono);font-size:8px;letter-spacing:.1em;fill:var(--on-dk-3)}
.w-e path{stroke:#d2ae72;stroke-width:1.6;fill:none}
.w-e .w-sat{stroke-dasharray:3 4;stroke:rgba(245,242,236,.35)}
.w-n circle{fill:rgba(245,242,236,.04);stroke:rgba(245,242,236,.45);stroke-width:1.2}
.w-n .w-sat{stroke-dasharray:3 3;opacity:.7}
.w-n circle:first-child{fill:rgba(127,185,189,.14);stroke:#7fb9bd}
.w-t text{font-family:var(--mono);font-size:10px;letter-spacing:.08em;fill:var(--on-dk)}
.tk-body{position:relative;display:flex;flex-direction:column;gap:.6rem;flex:1;padding:1.35rem 1.25rem 1.3rem;border-top:1px dashed rgba(245,242,236,.2)}
.tk-body::before,.tk-body::after{content:"";position:absolute;top:-10px;width:20px;height:20px;border-radius:50%;background:#0c1d20}
.tk-body::before{left:-11px}
.tk-body::after{right:-11px}
.tk-meta{display:flex;justify-content:space-between;gap:1rem;font-family:var(--mono);font-size:.6rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--sand-l)}
.tk-meta span:last-child{color:var(--on-dk-3)}
.tk-t{font-family:var(--serif);font-size:1.34rem;line-height:1.2;color:var(--on-dk)}
.tk-d{font-size:.88rem;line-height:1.55;color:var(--on-dk-2)}
.tk-go{margin-top:auto;padding-top:.6rem;font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;color:var(--on-dk)}
.tk:hover .tk-go{color:var(--sand-l)}

/* ---------------------------------------------------------------- 05 the lab */
.lab{background:var(--paper)}
.pi{display:grid;grid-template-columns:minmax(0,16rem) minmax(0,1fr);gap:clamp(2rem,5vw,4.5rem);align-items:center}
.portrait,.frames li{position:relative;aspect-ratio:4/5;border:1px dashed var(--line-strong);border-radius:4px;
  background:repeating-linear-gradient(135deg,transparent 0 11px,rgba(46,88,95,.035) 11px 12px),var(--paper-2)}
.portrait{display:grid;place-items:center}
.portrait .mono{font-family:var(--serif);font-weight:300;font-size:clamp(3rem,2rem + 3vw,4.4rem);letter-spacing:.02em;color:var(--accent);opacity:.55}
.portrait .lbl{position:absolute;left:1.7rem;bottom:.75rem;font-family:var(--mono);font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:var(--sand)}
.c{position:absolute;width:14px;height:14px;border-color:var(--accent-line);border-style:solid}
.c1{left:10px;top:10px;border-width:1px 0 0 1px}.c2{right:10px;top:10px;border-width:1px 1px 0 0}
.c3{left:10px;bottom:10px;border-width:0 0 1px 1px}.c4{right:10px;bottom:10px;border-width:0 1px 1px 0}
.pi-who h3{margin-top:.7rem;font-size:clamp(1.9rem,1.4rem + 1.6vw,2.7rem);letter-spacing:-.018em}
.pi-role{margin-top:.45rem;color:var(--accent-deep);font-weight:500}
.pi-affil{margin-top:.15rem;font-size:.93rem;color:var(--muted)}
.pi-bio{margin-top:1.2rem;max-width:56ch;color:var(--ink-soft)}
.pi-links{display:flex;flex-wrap:wrap;gap:.6rem 1.3rem;margin-top:1.3rem}
.pi-links a{font-family:var(--mono);font-size:.74rem;letter-spacing:.04em;color:var(--accent-deep);border-bottom:1px solid var(--accent-line)}
.pi-links a:hover{border-bottom-color:var(--accent)}
.team{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(2rem,5vw,4.5rem);align-items:center;margin-top:clamp(3.5rem,7vw,5rem);padding-top:clamp(2.4rem,5vw,3.4rem);border-top:1px solid var(--line)}
.team-t{margin-top:.8rem;font-family:var(--serif);font-weight:300;font-size:1.3rem;line-height:1.45;color:var(--ink);max-width:30ch}
.frames{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(.6rem,1.4vw,1rem)}
.lab-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(1.6rem,4vw,3.5rem);margin-top:clamp(3.5rem,7vw,5rem);align-items:stretch}
.join{display:flex;flex-direction:column;align-items:flex-start;gap:1rem;padding:clamp(1.6rem,3.2vw,2.4rem);border-radius:8px;color:var(--on-dk-2);
  background:var(--accent-deep);background:radial-gradient(120% 140% at 0% 0%,#2e585f,#1d3a40)}
.join .kicker{color:var(--sand-l)}
.join-t{font-family:var(--serif);font-weight:300;font-size:clamp(1.2rem,1.05rem + .5vw,1.4rem);line-height:1.45;color:var(--on-dk);max-width:34ch}
.join .btn-primary{margin-top:auto;background:var(--paper);color:#1b2c30}
.join .btn-primary:hover{background:#fff}
.join a:focus-visible{outline-color:var(--sand-l)}
.facts{margin:0;border-top:1px solid var(--line)}
.facts div{display:grid;grid-template-columns:6.5rem minmax(0,1fr);gap:1rem;padding:1rem 0;border-bottom:1px solid var(--line);align-items:baseline}
.facts dt{font-family:var(--mono);font-size:.64rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.facts dd{margin:0;font-size:.94rem;color:var(--ink-soft)}
.facts a{border-bottom:1px solid var(--accent-line)}
.facts a:hover{border-bottom-color:var(--accent)}

/* ---------------------------------------------------------------- 06 the record */
.record{background:var(--paper-2);border-top:1px solid var(--line)}
.num-lg{font-weight:300;color:var(--accent-deep)}
.dots-fig{margin:0;position:relative}
.chips{display:flex;flex-wrap:wrap;gap:.4rem}
.chips button{font-family:var(--sans);font-size:.84rem;border:1px solid var(--line-strong);background:transparent;color:var(--ink-soft);border-radius:999px;padding:.36rem .85rem;cursor:pointer;transition:all .2s ease}
.chips button:hover{border-color:var(--accent);color:var(--ink)}
.chips button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.chips .c{position:static;width:auto;height:auto;border:0;font-family:var(--mono);font-size:.7rem;opacity:.65;margin-left:.3rem}
.dots-demo{display:none;margin-top:.8rem;font-family:var(--mono);font-size:.64rem;letter-spacing:.06em;color:#7d5f2f}
.dots-demo.is-on{display:block}
.dots-plot{position:relative;margin-top:1.6rem;min-height:120px}
.dots-plot svg{display:block;width:100%;height:auto;overflow:visible}
.dots-plot .d{fill:var(--accent);fill-opacity:.62;transition:fill-opacity .35s ease,fill .35s ease;cursor:pointer}
.dots-plot .d.dim{fill-opacity:.1}
.dots-plot .d.hi{fill:var(--accent-deep);fill-opacity:1}
.dots-plot .d.is-hover{fill:var(--sand);fill-opacity:1}
.dots-plot .axis{stroke:var(--line-strong);stroke-width:1}
.dots-plot .yl{font-family:var(--mono);font-size:10px;fill:var(--muted)}
.dots-plot .yl.major{fill:var(--ink-soft)}
.dots-plot .dg{transition:transform .7s cubic-bezier(.22,1,.36,1),opacity .5s ease}
.dots-plot.pre .dg{transform:translateY(14px);opacity:0}
.dots-tip{position:absolute;z-index:6;max-width:300px;padding:.6rem .75rem;border-radius:4px;background:var(--ink);color:#f2efe7;font-size:.8rem;line-height:1.45;pointer-events:none;box-shadow:0 12px 30px -12px rgba(0,0,0,.45)}
.dots-tip b{display:block;margin-bottom:.2rem;font-family:var(--mono);font-size:.64rem;font-weight:500;letter-spacing:.08em;color:#bdb8ad}
.dots-tip[hidden]{display:none}
.dots-sum{margin-top:1.2rem;font-size:.95rem;color:var(--ink-soft)}
.dots-sum b{font-family:var(--serif);font-size:1.3rem;font-weight:400;color:var(--ink)}
.dots-sum a{color:var(--accent-deep);border-bottom:1px solid var(--accent-line);margin-left:.3rem}
.picks{margin-top:clamp(3.5rem,7vw,5rem)}
.picks-h{font-size:clamp(1.4rem,1.2rem + .7vw,1.8rem)}
.picks-list{list-style:none;margin:1.4rem 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(2rem,5vw,4rem);border-top:1px solid var(--line)}
.picks-list li{display:grid;grid-template-columns:3.4rem minmax(0,1fr);gap:1rem;padding:1.1rem 0;border-bottom:1px solid var(--line);align-items:baseline}
.picks-list .yr{font-family:var(--mono);font-size:.8rem;color:var(--accent)}
.picks-list a{font-family:var(--serif);font-size:1.06rem;line-height:1.38;color:var(--ink);border-bottom:1px solid transparent;transition:border-color .2s ease}
.picks-list a:hover{border-bottom-color:var(--accent-line)}
.picks-list .src{margin-top:.3rem;font-size:.8rem;color:var(--muted)}
.picks-more{margin-top:.6rem}
.picks-sep{color:var(--line-strong);margin:0 .6rem}

/* ---------------------------------------------------------------- coda */
.coda{background:var(--paper);border-top:1px solid var(--line);padding-block:clamp(4.5rem,9vw,7rem)}
.coda-in{display:flex;flex-direction:column;align-items:center;text-align:center}
.emblem{width:min(210px,50vw)}
.emblem svg{display:block;width:100%;height:auto;overflow:visible}
.emblem g{transition:transform 1.4s cubic-bezier(.22,1,.36,1),opacity .9s ease}
.js .emblem:not(.in) .e-arch,.js .emblem:not(.in) .e-ring{opacity:0;transform:scale(.92);transform-origin:325px 330px}
.js .emblem:not(.in) .e-sides,.js .emblem:not(.in) .e-diag,.js .emblem:not(.in) .e-tick{opacity:0}
.js .emblem:not(.in) .e-base{transform:scaleX(0);transform-origin:325px 586px}
.js .emblem:not(.in) .e-bl{transform:translateX(-46px);opacity:0}
.js .emblem:not(.in) .e-br{transform:translateX(46px);opacity:0}
.js .emblem:not(.in) .e-mouse{transform:translateX(-90px);opacity:0}
.js .emblem:not(.in) .e-pig{transform:translateX(110px);opacity:0}
.emblem.in .e-ring{transition-delay:.1s}.emblem.in .e-sides,.emblem.in .e-diag{transition-delay:.25s}
.emblem.in .e-bl,.emblem.in .e-br{transition-delay:.45s}.emblem.in .e-base{transition-delay:.3s}
.emblem.in .e-mouse{transition-delay:.8s}.emblem.in .e-pig{transition-delay:.95s}.emblem.in .e-tick{transition-delay:1.2s}
.coda-k{margin-top:2rem;font-family:var(--mono);font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
.coda-t{margin-top:.7rem;font-family:var(--serif);font-size:clamp(2rem,1.4rem + 2.4vw,3.3rem);line-height:1.1;letter-spacing:-.02em;color:var(--ink)}
.coda-links{display:flex;flex-wrap:wrap;justify-content:center;gap:.8rem 2rem;margin-top:1.8rem}
.coda-links a{font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-deep);border-bottom:1px solid var(--accent-line);padding-bottom:.15rem}
.coda-links a:hover{border-bottom-color:var(--accent)}

/* ---------------------------------------------------------------- 07 contact + footer */
.contact{background:var(--dk);color:var(--on-dk-2)}
.contact .sign{color:var(--on-dk-3)}.contact .sign-n{color:var(--sand-l)}.contact .sign-rule{background:rgba(245,242,236,.22)}
.contact .ch-title{color:var(--on-dk)}.contact .ch-title em{color:var(--sand-l)}
.contact .ch-lede{color:var(--on-dk-2)}
.contact a:focus-visible{outline-color:var(--sand-l)}
.contact-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(2rem,6vw,5rem);align-items:end}
.contact-mail{display:inline-block;margin-top:2rem;font-family:var(--serif);font-size:clamp(1.3rem,1rem + 1.4vw,2rem);color:var(--on-dk);border-bottom:1px solid rgba(245,242,236,.28);padding-bottom:.25rem;word-break:break-word;transition:border-color .25s ease,color .25s ease}
.contact-mail:hover{border-color:var(--sand-l);color:#fff}
.contact-info{margin:0;border-top:1px solid var(--on-dk-line)}
.contact-info div{padding:1rem 0;border-bottom:1px solid var(--on-dk-line)}
.contact-info dt{font-family:var(--mono);font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--on-dk-3)}
.contact-info dd{margin:.35rem 0 0;font-size:.96rem;line-height:1.55;color:var(--on-dk)}
.contact-info a{border-bottom:1px solid transparent}
.contact-info a:hover{border-bottom-color:var(--sand-l)}

.foot-c{background:var(--dk-0);color:var(--on-dk-3);border-top:1px solid rgba(245,242,236,.07)}
.fc-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.8fr) minmax(0,1fr);gap:2rem;padding-block:clamp(2.6rem,5vw,3.6rem) 2rem}
.foot-c .brand .wordmark{font-family:var(--serif);color:#f2efe7;font-size:1.2rem}
.fc-brand p{margin-top:.9rem;font-size:.86rem;line-height:1.6}
.fc-col{display:flex;flex-direction:column;align-items:flex-start;gap:.45rem}
.fc-k{font-family:var(--mono);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(245,242,236,.4);margin-bottom:.3rem}
.fc-col a{font-size:.88rem;color:rgba(245,242,236,.72);transition:color .2s ease}
.fc-col a:hover{color:#fff}
.foot-c a:focus-visible{outline-color:var(--sand-l)}
.fc-fine{padding-block:1.2rem 5.2rem;border-top:1px solid rgba(245,242,236,.07);font-family:var(--mono);font-size:.66rem;letter-spacing:.03em;line-height:1.6;color:rgba(245,242,236,.4)}

/* ---------------------------------------------------------------- preview chip + review mode */
.pv{position:fixed;left:14px;bottom:14px;z-index:90;display:inline-flex;align-items:center;gap:.15rem;padding:.3rem .35rem .3rem .8rem;border-radius:999px;
  background:rgba(27,26,22,.92);color:#f5f2ec;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(245,242,236,.14);
  box-shadow:0 10px 26px -12px rgba(0,0,0,.55);font-family:var(--mono);font-size:.6rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;line-height:1}
.pv-k{display:inline-flex;align-items:center;gap:.55rem;margin-right:.4rem}
.pv-k::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--sand-l);flex:none}
.pv a,.pv button{display:grid;place-items:center;min-width:28px;height:26px;padding:0 .45rem;border-radius:999px;border:0;background:transparent;color:rgba(245,242,236,.62);
  font:inherit;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:background .2s ease,color .2s ease}
.pv a:hover,.pv button:hover{background:rgba(245,242,236,.12);color:#fff}
.pv button[aria-pressed="true"]{background:var(--sand-l);color:#1b1a16}
.pv a:focus-visible,.pv button:focus-visible{outline:2px solid var(--sand-l);outline-offset:2px}
.pv{transition:opacity .3s ease,transform .3s ease}
.pv.is-away{opacity:0;transform:translateY(10px);pointer-events:none}
.pv-short{display:none}
@media (max-width:640px){.pv{left:10px;bottom:10px;font-size:.54rem}.pv-k{margin-right:.2rem}.pv-long{display:none}.pv-short{display:inline}}

.review-legend{display:none}
body.review .review-legend{position:fixed;left:14px;bottom:56px;z-index:90;display:flex;flex-wrap:wrap;gap:.45rem 1rem;max-width:min(560px,calc(100vw - 28px));
  padding:.6rem .8rem;border-radius:8px;background:rgba(27,26,22,.94);color:#e9e6de;font-family:var(--mono);font-size:.62rem;letter-spacing:.05em}
.review-legend span{display:inline-flex;align-items:center;gap:.45rem}
.review-legend i{width:12px;height:3px;border-radius:2px;display:inline-block}
[data-src]{position:relative}
body.review [data-src]::before{content:"";position:absolute;left:-.8rem;top:.25em;bottom:.25em;width:3px;border-radius:2px}
body.review [data-src="tnu"]::before,.review-legend .tnu{background:#2e585f}
body.review [data-src="adapted"]::before,.review-legend .adapted{background:#7fa5aa}
body.review [data-src="lit"]::before,.review-legend .lit{background:#6d7fae}
body.review [data-src="pub"]::before,.review-legend .pub{background:#8a7aa6}
body.review [data-src="new"]::before,.review-legend .new{background:var(--sand)}
body.review [data-src="todo"]::before{background:repeating-linear-gradient(180deg,#b5654a 0 4px,transparent 4px 7px)}
.review-legend .todo{background:#b5654a}
body.review .ch-dark [data-src="new"]::before{background:var(--sand-l)}

/* ---------------------------------------------------------------- responsive */
@media (max-width:1100px){
  .tickets{grid-template-columns:repeat(2,minmax(0,1fr))}
  .map-d{font-size:.8rem}
}
@media (max-width:900px){
  .orient-head{grid-template-columns:1fr;align-items:start}
  .orient-aside{max-width:26rem}
  .map{grid-template-columns:1fr;gap:0}
  .map::before{left:11px;right:auto;top:12px;bottom:12px;width:1px;height:auto}
  .map a{grid-template-columns:23px auto minmax(0,1fr);grid-template-areas:"dot n t" "dot n d";column-gap:.9rem;row-gap:.05rem;padding:.55rem 0;align-items:baseline}
  .map-dot{grid-area:dot;align-self:start;margin-top:.05rem}
  .map-n{grid-area:n;margin-top:0}
  .map-t{grid-area:t}
  .map-d{grid-area:d}
  .sig,.again,.venn-block,.agree,.models,.pi,.team,.lab-grid,.contact-grid{grid-template-columns:minmax(0,1fr)}
  .sig-fig{order:0}
  .again-fig{order:2}
  .venn{max-width:380px}
  .pi .portrait{max-width:13rem}

  /* scroll tour: the stage sticks at the top, full width, and the steps scroll under it */
  .tour{display:block}
  .tour-stage{position:sticky;top:var(--stick);z-index:5;height:46vh;height:46svh;min-height:300px;max-height:460px;
    margin-inline:calc(-1 * var(--gutter));border-radius:0;box-shadow:0 18px 30px -24px rgba(11,27,30,.7)}
  .step{min-height:0;padding:2.2rem 0 3.2rem;background:var(--paper)}
  .step:last-child{padding-bottom:0}
  .step + .step{border-top:1px solid var(--line)}
  .js .step{opacity:.55}
  .st-hint{right:1rem;bottom:.8rem}
  .st-meter{top:2.7rem;bottom:auto;left:1.2rem;right:auto;justify-items:start}
  .st-state{top:auto;bottom:2.15rem;font-size:.95rem}
}
@media (max-width:640px){
  .tickets{grid-template-columns:minmax(0,1fr)}
  .tk-media{aspect-ratio:16/8}
  .picks-list{grid-template-columns:minmax(0,1fr)}
  .models-two{grid-template-columns:minmax(0,1fr);gap:1.1rem}
  .know-cta .btn{margin-left:0}
  .fc-grid{grid-template-columns:1fr 1fr}
  .fc-brand{grid-column:1/-1}
  .st-top{left:.9rem;right:.7rem;top:.65rem;gap:.55rem}
  .st-scale span{display:none}
  .st-flag{font-size:.5rem;letter-spacing:.16em;padding:.22rem .42rem}
  .st-ticks{gap:.15rem}
  .st-motion{width:30px;height:30px}
  .st-hint{left:.9rem;font-size:.56rem}
  .st-meter{left:.9rem;top:2.6rem;font-size:.54rem}
  .st-meter em{width:84px}
  .step-n{font-size:2.3rem}
  .pill{min-height:38px;font-size:.66rem;padding:.36rem .78rem .36rem .66rem}
  .pill small{display:none}
  .scan-ticks{font-size:.52rem}
  .strip span{font-size:.54rem;letter-spacing:.04em}
  .bars{padding-left:4.4rem}
  .bars-l{left:-4.4rem;width:4rem;font-size:.66rem}
  .facts div{grid-template-columns:5.2rem minmax(0,1fr)}
  .frames{grid-template-columns:repeat(4,minmax(0,1fr));gap:.45rem}
  .frames .c{width:9px;height:9px}
  .frames .c1,.frames .c3{left:6px}.frames .c2,.frames .c4{right:6px}
  .frames .c1,.frames .c2{top:6px}.frames .c3,.frames .c4{bottom:6px}
  .route-now .route-of{display:none}
}

/* ---------------------------------------------------------------- motion preferences */
@media (prefers-reduced-motion:reduce){
  .route,.step,.tk,.tk-media img,.scan-f,.bar i,.bar span,.emblem g,.herd .h-mouse,.herd .h-pig,.dots-plot .dg,.dots-plot .d{transition:none!important}
  .js .begin-arrow,.st-hint::before,.try-demo::before{animation:none}
  .js .step{opacity:1}
  .tk:hover{transform:none}
}
.dots-tip .tip-go{display:block;margin-top:.35rem;font-family:var(--mono);font-size:.62rem;letter-spacing:.06em;color:#d2ae72}

/* ---------------------------------------------------------------- without JavaScript: everything reads as plain text */
html.no-js .tour{display:block}
html.no-js .tour-stage,html.no-js .try-row,html.no-js .try-demo,html.no-js .scan-canvas,html.no-js .scan-ui input,html.no-js .scan-ticks,html.no-js .scan-replay,html.no-js .dots-fig .chips,html.no-js .begin-arrow{display:none}
html.no-js .step{min-height:0;padding-bottom:3.5rem}
html.no-js .scan-img{inset:6%}