:root {
  color-scheme: dark;
  --paper: #fff;
  --ink: #080808;
  --white: #fff;
  --mono: "IBM Plex Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --fraktion: "PP Fraktion Mono", var(--mono);
  --model: "PP Model Mono", var(--mono);
}

.laboratory {background:#fff;color:#080808;padding-top:16px;}
.lab-header {display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 16px 16px;}
.lab-header>a:last-child {font:11px var(--mono);white-space:nowrap;}
.lab-grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;}
.lab-intro {padding:38px 16px;display:flex;flex-direction:column;justify-content:space-between;font:10px/1.6 var(--mono);}
.lab-intro p {font:normal clamp(22px,3vw,44px)/1.15 var(--mono);letter-spacing:-.06em;}
.vessel {margin:0;min-width:0;}
.vessel-view {position:relative;height:clamp(340px,33.33vw,560px);cursor:grab;touch-action:pan-y;outline-offset:-4px;}
.lab-header .nav {height:32px;padding-top:0;padding-bottom:0;}
.lab-header {min-height:76px;position:relative;}
.lab-caption {min-height:32px;}
@media(max-width:900px){.lab-spacer{display:none}}
@media(max-width:700px){.lab-header{min-height:112px}.lab-header .nav{top:48px;left:12px}}
.vessel-view:active {cursor:grabbing;}
.vessel-view canvas {display:block;width:100%;height:100%;}
.vessel-fallback {position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;background:#fff;}
.vessel-view[data-ready="true"] .vessel-fallback {visibility:hidden;}
.vessel-view:not([data-ready="true"]) canvas {visibility:hidden;}
.vessel-view[data-unavailable="true"] {cursor:default;}
.vessel figcaption {display:flex;justify-content:space-between;align-items:center;padding:12px 16px;font:9px var(--mono);color:#666;}
.vessel button {border:0;background:none;color:inherit;font:inherit;cursor:pointer;padding:8px;}
.lab-caption {display:grid;grid-template-columns:repeat(4,1fr);padding:24px 16px 16px;font:12px var(--mono);}
.lab-caption span:first-child,.lab-caption span:nth-child(2) {text-decoration:underline;}
.lab-material {display:block;width:100%;aspect-ratio:1440/900;object-fit:cover;}
@media(max-width:900px){.lab-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:0}.lab-intro{grid-column:1/-1;flex-direction:row;align-items:center;padding:24px 16px}.lab-intro p{margin:0}.lab-header .brand{font-size:24px}.lab-caption{grid-template-columns:1fr 1fr 1fr;gap:12px}}
@media(max-width:580px){.lab-grid{grid-template-columns:1fr}.vessel-view{height:440px}.vessel{border-top:1px solid #eee}.vessel figcaption{font-size:11px}.lab-header{flex-wrap:wrap}.lab-intro span{font-size:8px}.lab-caption{font-size:9px}.lab-material{aspect-ratio:1;object-fit:cover}}

* { box-sizing: border-box; }
html { scroll-behavior: auto; background: #000; }
body { margin: 0; min-width: 320px; overflow-x: clip; background: #000; color: var(--white); font-family: var(--mono); }
a, button { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
a:focus-visible { outline: 1px solid currentColor; outline-offset: 5px; }

.section { position: relative; width: 100%; min-height: 680px; height: 100svh; overflow: hidden; }
.hero { background: var(--paper); color: var(--ink); }

.site-header { position: absolute; z-index: 4; top: 16px; left: 16px; right: 16px; display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; pointer-events: none; }
.brand { display: flex; flex: 1 1 auto; align-items: flex-start; gap: clamp(28px, 5.55vw, 80px); min-width: 0; font: 40px/44px var(--fraktion); letter-spacing: 0; white-space: nowrap; pointer-events: auto; }
.brand__name { letter-spacing: 8px; }
.brand__specimen { letter-spacing: 0; }
.nav { display: flex; flex: 0 0 auto; align-items: center; gap: 16px; min-height: 32px; padding: 8px 12px; border-radius: 2px; font: 12px/12px var(--mono); white-space: nowrap; pointer-events: auto; }
.nav--dark { background: var(--ink); color: var(--white); }
.nav--light { background: var(--white); color: var(--ink); }
.nav a { color: inherit; }
.nav__rule { width: 1px; height: 32px; background: currentColor; opacity: .16; }
.nav__icon, .nav__icon img { display: block; width: 18px; height: 18px; }

.hero-details { position: absolute; z-index: 2; top: 352px; left: 0; right: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; height: 180px; padding: 16px; }
.hero-microbrand { grid-column: 1 / span 2; display: flex; gap: clamp(28px, 5.55vw, 80px); align-items: flex-start; font: 24px/28px var(--fraktion); white-space: nowrap; }
.hero-microbrand span:first-child { letter-spacing: 8px; }
.hero-loader { grid-column: 3 / span 2; display: flex; flex-direction: column; gap: 16px; align-items: flex-start; height: 148px; }
.hero-loader__line { position: relative; width: 100%; height: 2px; overflow: hidden; background: rgba(0,0,0,.08); }
.hero-loader__line span { display: block; width: min(240px, 44%); height: 2px; border-radius: 100px; background: var(--ink); }
.hero-loader p { margin: 0; font: 12px/12px var(--fraktion); letter-spacing: 8px; text-transform: uppercase; }
.hero-brief { grid-column: 5; display: flex; flex-direction: column; gap: 8px; align-items: flex-start; font: 12px/16px var(--fraktion); }
.hero-brief p { display: flex; gap: 8px; align-items: flex-start; margin: 0; white-space: nowrap; }
.hero-brief p:first-child { font-size: 14px; line-height: 18px; letter-spacing: -.42px; }
.brief-marker { position: relative; flex: 0 0 17px; width: 17px; height: 17px; border: 1.5px solid #727176; }
.brief-marker--cross::before, .brief-marker--cross::after { content: ""; position: absolute; top: 5px; left: -5px; width: 27px; height: 4px; border-radius: 5px; background: #233aa4; box-shadow: 0 0 1px rgba(24,42,146,.75); }
.brief-marker--cross::before { transform: rotate(54deg); }
.brief-marker--cross::after { transform: rotate(-58deg); }

.sequence-stage { position: absolute; z-index: 1; top: 50%; left: 50%; width: min(290px, 28vw); aspect-ratio: 290 / 472; transform: translate(-50%, -50%); }
.sequence-stage__outline, .sequence-stage__outline img { display: block; width: 100%; height: 100%; }
.sequence-stage__label { position: absolute; right: -70px; bottom: 8px; display: none; margin: 0; font: 10px/12px var(--mono); letter-spacing: .08em; white-space: nowrap; }
.hero-progress { position: absolute; z-index: 3; right: 16px; bottom: 16px; left: 16px; display: flex; align-items: flex-end; justify-content: space-between; }
.hero-progress__dot { width: 8px; height: 8px; background: var(--ink); }
.progress-meter { display: flex; flex-direction: column; gap: 16px; width: min(280px, 32vw); }
.progress-meter__head { display: flex; align-items: center; justify-content: space-between; padding-right: 2px; }
.progress-meter__percent { font: 40px/42px var(--model); letter-spacing: 0; }
.progress-meter__dots { display: flex; gap: 18px; align-items: center; padding-top: 3px; }
.progress-meter__dots i { display: block; width: 8px; height: 8px; background: #050505; }
.progress-meter__dots i:nth-child(2) { background: #ff0b1a; }
.progress-meter__dots i:nth-child(3) { background: #62ff14; }
.progress-meter__track { height: 3px; background: rgba(16,16,16,.18); }
.progress-meter__track span { display: block; width: 61.4%; height: 3px; background: var(--ink); }

.archive-section { background: #000; color: var(--white); }
.archive-media, .archive-media img { position: absolute; inset: 0; width: 100%; height: 100%; }
.archive-media { z-index: 0; background: #000; }
.archive-media img { display: block; object-fit: cover; object-position: center; }
.archive-meta { position: absolute; z-index: 2; top: 50%; right: 16px; left: 16px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; transform: translateY(-50%); font: 12px/16px var(--fraktion); letter-spacing: -.36px; pointer-events: none; }
.archive-meta span:nth-child(3) { text-align: right; }
.section-arrow { position: absolute; z-index: 4; bottom: 0; display: grid; width: 48px; height: 48px; place-items: center; background: var(--white); color: var(--ink); }
.section-arrow--left { left: 0; }
.section-arrow--right { right: 0; }
.section-arrow img { display: block; width: 24px; height: 24px; transform: rotate(90deg); }

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

@media (max-width: 1200px) {
  .hero-brief { font-size: 10px; }
  .hero-brief p:first-child { font-size: 12px; }
}

@media (max-width: 980px) {
  .site-header { gap: 12px; }
  .brand { font-size: 30px; line-height: 34px; gap: 28px; }
  .brand__name { letter-spacing: 5px; }
  .nav { max-width: 62vw; gap: 10px; overflow-x: auto; font-size: 10px; }
  .nav__rule, .nav__icon { display: none; }
  .hero-details { top: 42%; }
  .hero-brief { font-size: 10px; }
  .hero-brief p:first-child { font-size: 11px; }
  .hero-brief p { gap: 6px; }
  .brief-marker { flex-basis: 13px; width: 13px; height: 13px; }
}

@media (max-width: 700px) {
  .section { min-height: 560px; }
  .site-header { top: 12px; left: 12px; right: 12px; display: block; }
  .brand { font-size: 24px; line-height: 28px; gap: 22px; }
  .brand__name { letter-spacing: 3px; }
  .nav { position: absolute; top: 40px; left: 0; max-width: calc(100vw - 24px); width: max-content; padding: 7px 9px; font-size: 9px; }
  .hero-details { top: 36%; grid-template-columns: 1fr 1fr; height: auto; padding: 12px; }
  .hero-microbrand { grid-column: 1 / -1; font-size: 18px; line-height: 22px; gap: 24px; }
  .hero-loader { grid-column: 1 / -1; height: auto; gap: 10px; }
  .hero-loader p { font-size: 9px; letter-spacing: 5px; }
  .hero-brief { grid-column: 1 / -1; gap: 5px; font-size: 9px; line-height: 12px; }
  .hero-brief p:first-child { font-size: 10px; line-height: 14px; }
  .hero-brief p:nth-child(n+5) { display: none; }
  .sequence-stage { width: min(220px, 44vw); top: 52%; }
  .hero-progress { right: 12px; bottom: 12px; left: 12px; }
  .progress-meter { width: min(210px, 47vw); gap: 10px; }
  .progress-meter__percent { font-size: 30px; line-height: 32px; }
  .progress-meter__dots { gap: 10px; }
  .archive-meta { right: 12px; left: 12px; gap: 8px; font-size: 9px; line-height: 12px; }
  .archive-meta span:nth-child(2) { text-align: center; }
  .section-arrow { width: 40px; height: 40px; }
  .section-arrow img { width: 20px; height: 20px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

@media (max-width: 700px) {
  .lab-header {align-items:flex-start;padding-top:12px;}
  .lab-header .nav {top:52px;}
  .vessel {border-top:0;}
}

/* Field notes, laboratory study, colony register and founders — Figma 349:1376 onward. */
@font-face {font-family:"VEYL Louize";src:url("assets/fonts/Louize.ttf") format("truetype");font-style:normal;font-weight:400;font-display:swap;}
@font-face {font-family:"VEYL Fraktion";src:url("assets/fonts/PPFraktionMono-Regular.otf") format("opentype");font-style:normal;font-weight:400;font-display:swap;}
@font-face {font-family:"VEYL Fraktion";src:url("assets/fonts/PPFraktionMono-Bold.otf") format("opentype");font-style:normal;font-weight:700;font-display:swap;}
@font-face {font-family:"VEYL Plex";src:url("assets/fonts/IBMPlexMono-Regular.ttf") format("truetype");font-style:normal;font-weight:400;font-display:swap;}
.editorial-continuation {--editorial-serif:"VEYL Louize",Georgia,serif;--mono:"VEYL Plex",monospace;--fraktion:"VEYL Fraktion",var(--mono);background:#fff;color:#080808;color-scheme:light;}
.editorial-continuation :where(p,h2,h3,figure) {margin:0;}
.editorial-continuation img {display:block;}
.field-notes {padding-bottom:80px;}
.field-notes__images {display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:16px;height:50vw;overflow:hidden;}
.field-notes__spider {grid-column:span 4;width:100%;height:100%;object-fit:cover;}
.field-notes__flower {grid-column:span 3;width:100%;height:100%;object-fit:contain;}
.field-notes__copy {display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:16px;margin-top:120px;padding:0 16px;font:14px/16px var(--editorial-serif);letter-spacing:-.42px;text-align:justify;}
.field-notes__column--origin {grid-column:span 3;}
.field-notes__column--practice {grid-column:span 4;}
.field-notes__column p+p {text-indent:39px;}
.field-notes__column--practice p:first-child {text-indent:22px;}
.field-notes__footer {display:flex;gap:80px;align-items:flex-end;margin-top:24px;padding:16px;font:14px/14px var(--editorial-serif);}
.field-notes__footer span:last-child {font:12px/12px var(--fraktion);letter-spacing:-.36px;}
.research-weaving {position:relative;aspect-ratio:1440/900;}
.research-weaving__image {width:100%;height:100%;object-fit:cover;}
.editorial-masthead {position:absolute;z-index:3;top:0;left:0;right:0;display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding:16px;}
.editorial-masthead .nav {height:32px;padding-block:0;}
.editorial-masthead--closing {position:relative;min-height:76px;}
.colony {position:relative;display:flex;flex-direction:column;gap:160px;padding:120px 16px 16px;overflow:clip;}
.colony__register {display:flex;flex-direction:column;gap:80px;}
.colony__intro {position:relative;}
.colony__eyebrow {font:10px/10px var(--fraktion);letter-spacing:5px;white-space:pre;}
.colony h2 {margin-top:8px;font:700 24px/28px var(--fraktion);letter-spacing:2.4px;}
.colony__description {max-width:883px;margin-top:24px!important;font:14px/18px var(--editorial-serif);letter-spacing:-.42px;text-align:justify;}
.colony__table-scroll {position:relative;overflow-x:auto;scrollbar-width:thin;scrollbar-color:#aaa #f5f5f5;outline-offset:5px;}
.colony__table {width:100%;border-collapse:collapse;table-layout:fixed;text-align:left;white-space:nowrap;}
.colony__table col:nth-child(-n+3) {width:22.7272727%;}
.colony__table col:nth-child(n+4) {width:15.9090909%;}
.colony__table th,.colony__table td {padding:0;font-weight:400;}
.colony__table thead th {height:32px;padding-bottom:16px;border-bottom:1px solid #00000014;color:#0006;font:10px/15px var(--editorial-serif);vertical-align:top;}
.colony__table tbody::before {content:"";display:table-row;height:16px;}
.colony__table tbody tr {height:26px;}
.colony__table tbody th {font:12px/16px var(--fraktion);letter-spacing:5px;}
.colony__table tbody td {font:12px/16px var(--fraktion);letter-spacing:-.36px;}
.colony__table tbody td:nth-child(3) {font-family:var(--mono);letter-spacing:0;}
.colony__row--away {color:#0000003d;}
.colony__row--away th,.colony__row--away td:nth-child(2),.colony__row--away td:nth-child(3) {padding-left:40px;}
.colony__first-record {position:relative;}
.colony__first-record::after {content:"";position:absolute;left:-1px;right:-8px;top:50%;height:1px;background:currentColor;transform:rotate(-1deg);}
.colony__specimen {display:contents;}
.colony__cocoon {position:absolute;z-index:2;top:0;left:0;width:100%;height:auto;aspect-ratio:1440/900;object-fit:cover;pointer-events:none;}
.colony__wanderer {position:absolute;z-index:3;top:183px;left:153px;width:120px;height:120px;object-fit:cover;pointer-events:none;}
.founders {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;scroll-margin-top:24px;}
.founder {min-width:0;}
.founder__role {font:10px/10px var(--fraktion);letter-spacing:5px;}
.founder h3 {margin-top:8px;font:24px/28px var(--fraktion);letter-spacing:2.4px;}
.founder__images {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:24px;}
.founder__portrait,.founder__art {position:relative;aspect-ratio:232/320;overflow:hidden;}
.founder__portrait img {position:absolute;top:0;left:-75%;width:250%;height:241.55%;max-width:none;}
.founder__art img {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
@media(max-width:1100px) {
  .field-notes__copy {grid-template-columns:repeat(2,minmax(0,1fr));}
  .field-notes__column--origin,.field-notes__column--practice {grid-column:auto;}
  .colony {gap:0;padding-top:80px;}
  .colony__register {display:contents;}
  .colony__intro {order:0;}
  .colony__specimen {display:block;position:relative;order:1;height:440px;margin-top:24px;overflow:hidden;}
  .colony__cocoon {width:960px;height:600px;max-width:none;left:50%;top:-50px;transform:translateX(-50%);}
  .colony__table-scroll {order:2;margin-top:24px;padding-bottom:16px;}
  .colony__table {min-width:1050px;}
  .colony__table tbody th {letter-spacing:3px;}
  .founders {order:3;margin-top:96px;}
  .founder__role {letter-spacing:3px;}
}
@media(max-width:700px) {
  .field-notes {padding-bottom:56px;}
  .field-notes__images {grid-template-columns:1fr 1fr;height:58vw;gap:8px;}
  .field-notes__spider,.field-notes__flower {grid-column:auto;}
  .field-notes__copy {grid-template-columns:1fr;gap:24px;margin-top:48px;padding-inline:16px;font-size:16px;line-height:21px;letter-spacing:-.25px;text-align:left;}
  .field-notes__footer {margin-top:24px;gap:48px;}
  .research-weaving {aspect-ratio:auto;padding-top:100px;}
  .research-weaving__image {height:auto;aspect-ratio:1440/900;object-fit:contain;}
  .editorial-masthead {min-height:100px;padding:12px;}
  .editorial-masthead .nav {left:12px;top:52px;max-width:calc(100vw - 24px);}
  .editorial-masthead--closing {min-height:100px;}
  .colony {gap:0;padding:56px 16px 16px;}
  .colony__register {display:contents;}
  .colony__intro {order:0;}
  .colony__eyebrow {font-size:9px;letter-spacing:2.7px;}
  .colony h2 {max-width:360px;font-size:22px;line-height:28px;letter-spacing:1.4px;}
  .colony__description {font-size:16px;line-height:21px;letter-spacing:-.25px;text-align:left;}
  .colony__specimen {display:block;position:relative;order:1;height:360px;margin-top:24px;overflow:hidden;}
  .colony__cocoon {width:720px;height:450px;max-width:none;left:50%;top:-32px;transform:translateX(-50%);}
  .colony__table-scroll {order:2;margin-top:24px;padding-bottom:16px;}
  .colony__table {min-width:1050px;}
  .colony__table thead th {color:#666;}
  .colony__table tbody tr {height:32px;}
  .colony__row--away {color:#777;}
  .colony__wanderer {top:218px;left:132px;width:100px;height:100px;}
  .founders {order:3;grid-template-columns:1fr;gap:48px;margin-top:72px;}
  .founder__role {font-size:9px;line-height:14px;letter-spacing:3px;}
  .founder__images {grid-template-columns:repeat(2,minmax(0,1fr));margin-top:20px;}
}

/* Progressive enhancement: the source composition remains the no-script fallback. */
.colony--motion {overflow:clip;}
.colony--motion .colony__register {position:relative;}
.colony--motion .colony__specimen {display:none;}
.colony__motion-track {position:absolute;z-index:2;left:50%;top:-120px;bottom:0;width:440px;max-width:36vw;transform:translateX(-50%);pointer-events:none;}
.colony__motion-stage {position:sticky;top:clamp(130px,24vh,220px);width:100%;height:min(78vh,650px);}
.colony__motion-object {position:relative;width:100%;height:100%;transform-origin:50% 0;will-change:transform;}
.colony__motion-object::before {content:"";position:absolute;bottom:calc(100% - 2px);left:50%;width:1px;height:100vh;background:linear-gradient(90deg,#d3d2ce,#f4f3ef);}
.colony__sequence {display:block;width:100%;height:100%;object-fit:contain;}
.colony--motion .colony__table tbody tr {height:34px;}
.colony__table tbody tr {transition:background-color .24s,color .24s;}
.colony__table tbody tr.is-active {background:var(--specimen-wash,#eaece7);color:#171b17;}
.colony__table tbody tr.is-active th {box-shadow:inset 2px 0 var(--specimen-ink,#303932);}
.colony__specimen-button {all:unset;box-sizing:border-box;display:block;width:100%;min-height:34px;cursor:pointer;line-height:34px;}
.colony__specimen-button:focus-visible {outline:1px solid currentColor;outline-offset:-2px;}
.colony__runner {position:absolute;z-index:3;top:0;left:0;width:116px;height:116px;pointer-events:none;will-change:transform;filter:drop-shadow(1px 4px 2px #00000014);}
.colony__runner canvas {display:block;width:100%;height:100%;}
.colony--runner-ready .colony__wanderer {visibility:hidden;}
@media(max-width:1100px) {
 .colony--motion .colony__register {display:flex;flex-direction:column;gap:24px;}
 .colony__motion-track {position:sticky;order:1;top:-20px;left:auto;bottom:auto;width:100%;max-width:none;height:300px;transform:none;flex:none;margin:0;background:linear-gradient(#fff 75%,#ffffff00);}
 .colony__motion-stage {position:relative;top:0;width:240px;height:300px;margin:auto;}
 .colony--motion .colony__table-scroll {margin-top:0;}
 .colony--motion .colony__intro {order:0;}
 .colony--motion .colony__table-scroll {order:2;}
 .colony--motion .founders {order:3;}
}
@media(max-width:700px) {
 .colony__motion-track {height:260px;top:-35px;}
 .colony__motion-stage {width:200px;height:260px;}
 .colony--motion .colony__table tbody tr {height:38px;}
 .colony__specimen-button {min-height:38px;line-height:38px;}
 .colony__runner {width:100px;height:100px;}
}
@media(prefers-reduced-motion:reduce) {
 .colony__table tbody tr {transition:none;}
}
/* Give the runner room below the final row, including within the scroll container. */
.colony--runner-ready .colony__table-scroll {padding-bottom:64px;}

/* Native smooth scrolling must not interpolate ScrollTrigger refresh measurements. */
html.has-colony-motion {scroll-behavior:auto;}

/* Living object studies — Figma 431:1000 and 445:1446. */
.swarm {position:relative;height:62.5vw;min-height:680px;max-height:1040px;isolation:isolate;overflow:clip;background:#fff;}
.swarm__viewport {position:absolute;inset:0;touch-action:pan-y;}
.swarm__viewport canvas {display:block;width:100%;height:100%;}
.swarm__fallback {position:absolute;left:50%;top:50%;width:calc((100% - 64px)/3);max-width:620px;aspect-ratio:1;transform:translate(-50%,-50%);object-fit:contain;}
.swarm[data-ready="true"] .swarm__fallback {visibility:hidden;}
.swarm__caption {position:absolute;z-index:2;top:50%;width:221px;transform:translateY(-50%);font:14px/18px var(--fraktion);letter-spacing:-.42px;pointer-events:none;}
.swarm__caption strong {font-weight:700;}
.swarm__caption--current {left:16px;}
.swarm__caption--next {right:16px;text-align:right;}
.swarm__description {margin-top:32px!important;padding-top:10px;border-top:2px solid #00000014;font:14px/18px var(--editorial-serif);}
.swarm__choices {position:absolute;z-index:3;right:16px;bottom:16px;display:flex;align-items:center;gap:10px;width:calc((100% - 64px)/3);padding:16px;}
.swarm__choice {display:grid;place-items:center;position:relative;flex:1 1 0;min-width:0;height:88px;padding:0;background:none;border:0;cursor:pointer;}
.swarm__choice img {width:62px;height:62px;max-width:100%;object-fit:contain;opacity:.58;transition:opacity .2s,transform .2s;}
.swarm__choice:hover img,.swarm__choice:focus-visible img {opacity:.8;transform:translateY(-3px);}
.swarm__choice[aria-pressed="true"] img {opacity:1;}
.swarm__choice:focus-visible {outline:1px solid #222;outline-offset:2px;}
.perfume-film {position:relative;height:62.5vw;min-height:560px;max-height:1200px;background:#fff;}
.perfume-film__media {position:absolute!important;bottom:16px;left:16px;right:16px;aspect-ratio:1672/941;}
.film {position:relative;overflow:hidden;background:#fff;}
.film__poster,.film__video {display:block;width:100%;height:100%;object-fit:cover;}
.film__poster {position:absolute;inset:0;}
.film__video {position:absolute;inset:0;opacity:0;transition:opacity .25s;}
.film.is-ready .film__video {opacity:1;}
.film.is-failed .film__video {visibility:hidden;}
.film__toggle {position:absolute;z-index:4;right:16px;bottom:16px;display:grid;place-items:center;width:32px;height:32px;padding:0;border:1px solid #0002;border-radius:0;background:#ffffffde;color:#171717;font:11px/1 var(--mono);cursor:pointer;opacity:0;transition:opacity .2s;}
.film__toggle[hidden] {display:none;}
.film:hover .film__toggle,.film__toggle:focus-visible,.film.is-paused .film__toggle {opacity:1;}
.film__toggle:focus-visible {outline:1px solid #111;outline-offset:3px;}
@media(max-width:1100px) {
 .swarm {min-height:660px;}
 .swarm__caption {width:176px;font-size:12px;line-height:16px;}
 .swarm__description {font-size:14px;}
 .swarm__choices {width:400px;max-width:calc(100% - 32px);}
}
@media(max-width:700px) {
 .swarm {height:760px;min-height:0;max-height:none;}
 .swarm__caption {top:auto;bottom:128px;width:calc(50% - 32px);transform:none;}
 .swarm__description {margin-top:20px!important;min-height:46px;}
 .swarm__choices {left:16px;right:16px;bottom:20px;width:auto;max-width:none;padding:0;gap:4px;}
 .swarm__choice {height:72px;}
 .swarm__choice img {width:48px;height:48px;}
 .swarm__fallback {top:calc(48% - 30px);width:calc(100% - 40px);}
 .perfume-film {height:auto;min-height:0;padding-top:112px;padding-bottom:16px;}
 .perfume-film__media {position:relative!important;inset:auto;margin-inline:0;aspect-ratio:16/9;}
 .film__toggle {width:36px;height:36px;right:10px;bottom:10px;opacity:.75;}
}
@media(prefers-reduced-motion:reduce) {
 .swarm__choice img,.film__video,.film__toggle {transition:none;}
}

/* One persistent masthead, with local contrast over both paper and dark imagery. */
.global-header {position:fixed;z-index:100;top:16px;left:16px;right:16px;display:flex;align-items:flex-start;justify-content:space-between;gap:24px;pointer-events:none;mix-blend-mode:difference;color:#fff;--fraktion:'VEYL Fraktion',monospace;--mono:'VEYL Plex',monospace;}
.global-header .nav {background:#fff;color:#000;height:32px;padding-block:0;}
.global-header .nav__icon {filter:invert(1);}
.global-header .brand {font-family:'VEYL Fraktion',monospace;}
.laboratory {padding-top:100px;}
.film::after {content:'';position:absolute;z-index:2;left:0;right:0;bottom:-1px;height:clamp(48px,9vw,150px);background:linear-gradient(to bottom,rgba(255,255,255,0),#fff);pointer-events:none;}
.film__toggle {z-index:4;}
.field-notes__flower.film {height:100%;min-height:0;}
.field-notes__flower .film__video,.field-notes__flower .film__poster {object-fit:contain;}
.swarm__fallback {width:min(53vw,calc(62.5vw - 230px));max-width:1000px;top:calc(50% - 20px);}
.swarm__caption {width:clamp(150px,18vw,221px);}
.perfume-film {padding-top:90px;}
.material-archive {position:relative;background:white;height:660svh;color:#080808;}
.material-archive__stage {position:sticky;top:0;height:100svh;min-height:640px;overflow:hidden;}
.material-archive__strip {position:absolute;left:50%;top:92px;right:16px;padding-left:16px;}
.material-archive__strip h2 {margin:0 0 8px;font:18px/22px var(--fraktion);letter-spacing:1.8px;font-weight:400;}
.material-archive__strip>p {font:10px/12px var(--fraktion);letter-spacing:1px;color:#777;margin:0 0 16px;}
.material-archive__thumbnails {display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;}
.material-archive__thumb {position:relative;display:block;padding:0;border:0;background:transparent;aspect-ratio:94/128;cursor:pointer;max-height:128px;}
.material-archive__thumb img {display:block;width:100%;height:100%;object-fit:cover;}
.material-archive__thumb::after {content:none;}
.material-archive__thumb:focus-visible {outline:1px solid #111;outline-offset:4px;}
.material-archive__feature {position:absolute;inset:36% 0 16px;display:grid;grid-template-columns:1fr 1fr;}
.material-archive__media {position:relative;min-width:0;overflow:hidden;background:#f5f5f3;}
.material-archive__poster,.material-archive__video {position:absolute;inset:0;width:100%;height:100%;object-fit:contain;}
.material-archive__poster {object-fit:cover;}
.material-archive__video {opacity:0;transition:opacity .28s;background:#e5e4e4;}
.material-archive__media[data-ready=true] .material-archive__video {opacity:1;}
.material-archive__media .film__toggle {opacity:0;}
.material-archive__media:hover .film__toggle,.material-archive__media .film__toggle:focus-visible,.material-archive__media[data-paused=true] .film__toggle {opacity:1;}
.material-archive__story {display:flex;flex-direction:column;justify-content:space-between;padding:0 16px;min-width:0;}
.material-archive__copy h3 {font:24px/28px var(--fraktion);letter-spacing:1.2px;font-weight:400;text-transform:uppercase;margin:0 0 8px;}
.material-archive__description {font:24px/28px var(--editorial-serif);letter-spacing:-.72px;margin:0;}
.material-archive__category {font:12px/16px var(--fraktion);letter-spacing:1.2px;color:#6b6b6b;margin-top:40px!important;}
.material-timeline {font:10px/14px var(--fraktion);color:#6b6b6b;position:relative;height:110px;}
.material-timeline__phase {color:#090909;margin:0 0 12px;}
.material-timeline__label {text-align:center;margin:0 0 16px;}
.material-timeline__track {position:relative;height:25px;margin:0 8px;background:repeating-linear-gradient(90deg,#aaa 0 1px,transparent 1px 6px) left bottom/100% 7px no-repeat;}
.material-timeline__fill {position:absolute;left:0;right:0;bottom:0;height:1px;background:#111;transform-origin:left;transform:scaleX(var(--archive-progress,0));}
.material-timeline__cursor {position:absolute;left:calc(var(--archive-progress,0)*100%);bottom:0;height:32px;width:2px;background:#111;will-change:left;}
.material-timeline__years {display:flex;justify-content:space-between;gap:2px;}
.material-timeline__year {position:relative;font:inherit;border:0;padding:12px 0 0;min-height:34px;background:none;color:#999;cursor:pointer;}
.material-timeline__year::before {content:'';position:absolute;bottom:100%;left:50%;height:22px;width:1px;background:#aaa;}
.material-timeline__year[aria-current=true] {color:#111;font-weight:bold;}
.material-archive__traveller {position:absolute;left:0;top:0;pointer-events:none;z-index:5;object-fit:cover;visibility:hidden;transform-origin:0 0;will-change:transform;}
.silk-recovery {background:#fff;padding:120px 16px 16px;color:#000;}
.silk-study {position:relative;width:min(960px,100%);height:auto;aspect-ratio:3/2;margin:0 auto 80px;touch-action:pan-y;cursor:grab;outline-offset:6px;}
.silk-study:active {cursor:grabbing;}
.silk-study canvas,.silk-study__fallback {display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain;}
.silk-study[data-ready=true] .silk-study__fallback {visibility:hidden;}
.silk-study:not([data-ready=true]) canvas {visibility:hidden;}
.recovery-notes,.recovery-portraits {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;}
.recovery-notes h2,.recovery-notes h3 {font:12px/14px var(--fraktion);letter-spacing:1.2px;margin:0 0 12px;font-weight:400;}
.recovery-notes p {font:14px/18px var(--editorial-serif);letter-spacing:-.42px;margin:0;}
.recovery-notes>div:last-child {grid-column:4;text-align:right;}
.recovery-portraits {margin-top:16px;}
.recovery-portraits img {width:100%;aspect-ratio:1;object-fit:cover;}
.recovery-portraits img:last-child {grid-column:4;}
@media(min-width:1600px){.material-archive__strip{top:100px}.material-archive__thumb{max-height:160px}.material-archive__stage{min-height:740px}}
@media(max-width:1100px){.global-header .brand{font-size:28px;line-height:32px;gap:32px}.global-header .nav{gap:10px;font-size:10px}.global-header .brand__name{letter-spacing:5px}.material-archive__strip h2{font-size:14px;line-height:18px}.material-archive__copy h3{font-size:20px;line-height:24px}.material-archive__description{font-size:20px;line-height:24px}}
@media(max-width:700px){
 .global-header {top:12px;left:12px;right:12px;display:block;}
 .global-header .brand {font-size:24px;line-height:28px;gap:36px;}
 .global-header .nav {position:relative;top:auto;left:auto;right:auto;margin-top:12px;width:max-content;max-width:100%;gap:10px;font-size:8px;padding-inline:8px;}
 .global-header .nav__rule,.global-header .nav__icon {display:none;}
 .swarm__caption {width:calc(50% - 32px);}
 .swarm__fallback {width:calc(100% - 40px);top:calc(50% - 50px);}
 .material-archive {height:580svh;}
 .material-archive__stage {min-height:650px;}
 .material-archive__strip {top:108px;left:0;right:12px;padding-left:12px;}
 .material-archive__strip h2 {font-size:12px;line-height:16px;letter-spacing:1px;}
 .material-archive__strip>p {font-size:8px;margin-bottom:10px;}
 .material-archive__thumbnails {gap:5px;}
 .material-archive__feature {top:250px;bottom:12px;display:flex;flex-direction:column;gap:16px;}
 .material-archive__media {flex:1;min-height:180px;margin:0 12px;}
 .material-archive__story {padding:0 12px;gap:18px;}
 .material-archive__copy h3 {font-size:16px;line-height:20px;margin-bottom:4px;}
 .material-archive__description {font-size:16px;line-height:20px;}
 .material-archive__category {font-size:8px;line-height:12px;margin-top:10px!important;}
 .material-timeline {height:78px;font-size:9px;}
 .material-timeline__phase {display:none;}
 .material-timeline__label {font-size:8px;margin-bottom:8px;}
 .material-archive__media .film__toggle {opacity:1;}
 .silk-recovery {padding:112px 12px 20px;}
 .silk-study {width:100%;aspect-ratio:1.2;margin-bottom:48px;}
 .recovery-notes,.recovery-portraits {grid-template-columns:1fr 1fr;gap:20px 16px;}
 .recovery-notes>div:last-child {grid-column:2;text-align:left;}
 .recovery-notes>div:first-child {grid-column:1/-1;}
 .recovery-notes h2,.recovery-notes h3 {font-size:10px;letter-spacing:.7px;}
 .recovery-portraits img:last-child {grid-column:2;}
 .field-notes__flower.film {height:auto;aspect-ratio:3/4;}
}
@media(prefers-reduced-motion:reduce){.material-archive__video{transition:none}}
/* Reserve the colony's enhanced layout before its lazy 3D assets arrive. */
.colony__table tbody tr {height:34px;}
.colony__table-scroll {padding-bottom:64px;}
@media(max-width:1100px){.colony:not(.colony--motion) .colony__specimen{height:300px}}
@media(max-width:700px){.colony__table tbody tr{height:38px}.colony:not(.colony--motion) .colony__specimen{height:260px}}
@media(min-width:701px){.swarm{height:100svh;max-height:1100px}}
@media(max-width:380px){.global-header .nav{gap:7px;font-size:7px}.global-header .brand{font-size:22px;gap:28px}}
@media(max-width:700px){.field-notes__flower.film{height:100%;aspect-ratio:auto}.material-archive__stage{min-height:0}}
@media(max-width:700px) and (max-height:700px){.material-archive__thumb{max-height:44px}.material-archive__feature{top:210px}.material-archive__media{min-height:100px}.material-archive__story{gap:10px}.material-timeline{height:70px}}
.founders {scroll-margin-top:96px;}


/* CRT portal / thermal observation. One continuous stage, one global header. */
.thermal {position:relative;background:#000;color:#fff;}
.thermal__stage {position:relative;height:200svh;overflow:clip;isolation:isolate;background:#fff;}
.thermal__monitor {position:absolute;left:0;top:0;width:100%;height:100svh;object-fit:cover;max-width:none;transform-origin:center;will-change:transform;}
.thermal__screen {position:absolute;inset:100svh 0 0;background:#000;overflow:hidden;}
.thermal__composition {position:absolute;inset:0;}
.thermal__composition img {position:absolute;inset:0;width:100%;height:100%;object-fit:contain;}
.thermal__screen canvas {position:absolute;inset:0;width:100%;height:100%;}
.thermal__meta {position:absolute;top:75%;left:32px;right:32px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px;pointer-events:none;font:12px/16px 'VEYL Fraktion',monospace;color:#e1e2e6;}
.thermal__meta span:last-child {text-align:right;}
.thermal__advance,.thermal__pause {position:absolute;bottom:0;border:0;border-radius:0;display:grid;place-items:center;width:48px;height:48px;cursor:pointer;z-index:4;}
.thermal__advance {left:0;background:#ebebeb;}
.thermal__advance img {transform:rotate(90deg);}
.thermal__advance--dark {background:#1c1c1c;}
.thermal__advance--dark img {filter:invert(1);}
.thermal__pause {right:16px;bottom:16px;background:#101014;color:#ddd;border:1px solid #333;font:14px monospace;}
.thermal__pause[hidden] {display:none;}
.thermal__advance:focus-visible,.thermal__pause:focus-visible {outline:2px solid #7a9cff;outline-offset:-4px;}
.thermal {height:440svh;}
.thermal .thermal__stage {height:100svh;position:sticky;top:0;}
.thermal[data-enhanced="true"] .thermal__screen {inset:0;opacity:0;will-change:clip-path;}
.thermal[data-enhanced="true"] .thermal__composition {inset:auto;transform:translate(-50%,-50%);}
.thermal[data-enhanced="true"] .thermal__meta {top:50%;opacity:0;}
.thermal[data-ready="true"] .thermal__composition {visibility:hidden;}
@media(max-width:700px){
 .thermal {height:380svh;}
 .thermal__meta,.thermal[data-enhanced="true"] .thermal__meta {left:16px;right:16px;top:auto;bottom:80px;grid-template-columns:1fr auto;gap:6px;font-size:8px;line-height:12px;}
 .thermal__meta span:nth-child(2){grid-column:1;grid-row:2;}
 .thermal__meta span:last-child{grid-column:2;grid-row:1;}
 .thermal__pause {width:40px;height:40px;}
}
@media(prefers-reduced-motion:reduce){
 .thermal {height:250svh;}
 .thermal__monitor {will-change:auto;}
}

.thermal__screen canvas.thermal__scans {pointer-events:none;z-index:2;}
