@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');

.lab-protocol{padding:clamp(70px,9vw,130px) clamp(24px,8vw,140px);background:#dceae6;color:#10282a;border-top:1px solid #5d9a9a}.protocol-heading{display:grid;grid-template-columns:1fr 1fr;gap:18px 7vw;align-items:end;margin-bottom:40px}.protocol-heading p{grid-column:1/-1;margin:0;color:#176c69;font:700 .68rem monospace;letter-spacing:.17em}.protocol-heading h2{margin:0;font:700 clamp(2.5rem,5vw,5.5rem)/1.03 'Space Grotesk',sans-serif;letter-spacing:-.065em}.protocol-heading>span{max-width:400px;line-height:1.7;color:#3d5b5d}.protocol-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid #24777666;background:repeating-linear-gradient(0deg,transparent 0 29px,#2477760b 30px)}.protocol-grid article{display:flex;flex-direction:column;gap:15px;min-height:220px;padding:25px;border-right:1px solid #24777666}.protocol-grid article:last-child{border-right:0}.protocol-grid small{color:#176c69;font:700 .63rem monospace;letter-spacing:.13em}.protocol-grid strong{font:700 clamp(1.6rem,2.5vw,2.7rem) 'Space Grotesk',sans-serif;letter-spacing:-.05em}.protocol-grid span{margin-top:auto;font-size:.87rem;line-height:1.55;color:#3d5b5d}.lab-protocol>a{display:inline-block;margin-top:30px;color:#075d60;font:700 .8rem monospace;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:5px}@media(max-width:850px){.protocol-grid{grid-template-columns:repeat(2,1fr)}.protocol-grid article:nth-child(2){border-right:0}.protocol-grid article:nth-child(-n+2){border-bottom:1px solid #24777666}}@media(max-width:550px){.protocol-heading,.protocol-grid{grid-template-columns:1fr}.protocol-grid article{min-height:155px;border-right:0;border-bottom:1px solid #24777666}}

:root {
  color-scheme: dark;
  --ink: #f1f1e9;
  --muted: #a3a8a6;
  --dim: #6e7778;
  --night: #080b0e;
  --panel: #0d1317;
  --line: #d5f77335;
  --acid: #d8ff68;
  --cyan: #6cf5e5;
  --violet: #ab8bff;
  --pink: #ff81c7;
  --mono: 'DM Mono', 'Courier New', monospace;
  --sans: 'DM Sans', Arial, sans-serif;
  --display: 'Space Grotesk', var(--sans);
  font-family: var(--sans);
  background: var(--night);
  color: var(--ink);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 76px; }
body { margin: 0; min-width: 320px; overflow-x: hidden; background: var(--night); }
body::before { content: ''; position: fixed; inset: 0; z-index: 20; pointer-events: none; opacity: .16; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.16'/%3E%3C/svg%3E"); mix-blend-mode: screen; }
a { color: inherit; }
button, a { outline-offset: 5px; }
a:focus-visible { outline: 2px solid var(--acid); }
.site-header { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 17px clamp(22px, 5.4vw, 88px); background: #080b0ee8; border-bottom: 1px solid #d8ff6828; backdrop-filter: blur(18px); }
.brand { font: 700 1.05rem var(--display); text-decoration: none; letter-spacing: -.055em; }
.brand:first-letter { color: var(--acid); }
.site-header nav { display: flex; gap: clamp(16px, 2.6vw, 38px); }
.site-header nav a { color: #aeb5b2; text-decoration: none; font: 500 .7rem var(--mono); letter-spacing: .04em; transition: color .2s ease; }
.site-header nav a:hover, .source-link:hover { color: var(--acid); }

.hero { position: relative; isolation: isolate; min-height: min(900px, calc(100svh - 62px)); display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(300px, .9fr); align-items: center; gap: 2vw; padding: clamp(76px, 10vw, 154px) clamp(24px, 8.5vw, 142px); overflow: hidden; background: radial-gradient(ellipse at 77% 48%, #133d41 0, #102128 17%, #11121d 40%, #080b0e 73%); border-bottom: 1px solid var(--line); }
.hero::before { content: ''; position: absolute; z-index: -2; width: min(86vw, 1120px); aspect-ratio: 1; right: -16%; top: -20%; border-radius: 50%; background: repeating-radial-gradient(circle, transparent 0 52px, #72f8e40b 53px 54px), conic-gradient(from 30deg, transparent 0 22%, #d8ff6811 22.2% 22.4%, transparent 22.6% 48%, #ac8bff12 48.2% 48.4%, transparent 48.6%); mask-image: radial-gradient(circle, #000 32%, transparent 71%); animation: slow-turn 100s linear infinite; }
.hero::after { content: 'FIELD 001 / SYSTEMS FOR HUMAN AGENCY'; position: absolute; top: 45%; right: -5.5rem; transform: rotate(90deg); transform-origin: center; color: #b4e9d431; font: 500 .58rem var(--mono); letter-spacing: .24em; }
.hero-glow { position: absolute; z-index: -1; inset: 0; pointer-events: none; background: linear-gradient(90deg, var(--night) 4%, transparent 52%), radial-gradient(ellipse at 78% 50%, #54f4d516, transparent 34%), repeating-linear-gradient(0deg, transparent 0 79px, #d8ff6808 80px); mask-image: linear-gradient(90deg, transparent, #000 42%, #000); }
.hero-copy { position: relative; z-index: 2; max-width: 790px; }
.eyebrow, .section-index, .code-art, .portrait figcaption, .source-link { font-family: var(--mono); }
.eyebrow { margin: 0 0 23px; color: var(--acid); font-size: .64rem; font-weight: 500; letter-spacing: .18em; line-height: 1.6; }
.hero h1, h2 { font-family: var(--display); font-weight: 500; letter-spacing: -.075em; }
.hero h1 { max-width: 900px; margin: 0 0 26px; font-size: clamp(4.5rem, 6vw, 7rem); line-height: .79; }
.hero h1 em, h2 em { color: var(--acid); font-weight: 400; font-style: normal; }
.hero h1 em { text-shadow: 0 0 40px #d8ff6830; }
.hero-interruption { display: inline-block; position: relative; margin: 4px 0 35px; padding: 9px 12px 8px; color: #09100e; background: var(--acid); font: 500 .65rem var(--mono); letter-spacing: .04em; transform: rotate(-1.5deg); box-shadow: 4px 4px 0 #6cf5e555; }
.hero-interruption span { white-space: nowrap; }
.mission { max-width: 710px; margin: 0 0 16px; font-size: clamp(1.25rem, 2vw, 1.9rem); line-height: 1.38; letter-spacing: -.03em; }
.mission-detail { max-width: 630px; margin: 0 0 30px; color: #aab3b3; font-size: .95rem; line-height: 1.8; }
.hero-link { display: inline-flex; min-width: 216px; align-items: center; justify-content: space-between; gap: 30px; padding: 14px 16px; background: var(--acid); color: #10150c; text-decoration: none; font: 600 .76rem var(--mono); transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.hero-link:hover { transform: translate(-2px, -2px); background: #e8ff9c; box-shadow: 5px 5px 0 var(--cyan); }
.hero-orbit { position: relative; justify-self: center; width: min(37vw, 500px); aspect-ratio: 1; display: grid; place-items: center; border: 1px solid #8cf7df6b; border-radius: 50%; background: radial-gradient(circle at 47% 47%, #94fff21a 0 1%, transparent 2%), repeating-radial-gradient(circle, transparent 0 37px, #70f2e51c 38px 39px), radial-gradient(circle, #1b686332, #10262c1a 47%, transparent 68%); box-shadow: inset 0 0 90px #4af0df1a, 0 0 0 24px #70f2e507, 0 0 0 64px #70f2e506, 0 0 100px #3ee9e51e; transform: perspective(900px) rotateY(-20deg) rotateX(9deg); animation: orbit-float 8s ease-in-out infinite; }
.hero-orbit::before, .hero-orbit::after { content: ''; position: absolute; inset: 12%; border: 1px solid #b38cff86; border-radius: 50%; transform: rotateX(68deg) rotate(-28deg); box-shadow: 0 0 26px #a17aff25; }
.hero-orbit::after { inset: 6%; border-color: #d8ff685c; transform: rotateY(64deg) rotate(34deg); }
.hero-orbit span { position: absolute; z-index: 1; color: var(--cyan); font: 500 .55rem var(--mono); letter-spacing: .2em; }
.hero-orbit span:nth-child(1) { top: 8%; left: 8%; }.hero-orbit span:nth-child(2) { top: 49%; right: -10%; }.hero-orbit span:nth-child(3) { bottom: 8%; left: 23%; }
.hero-orbit strong { position: relative; z-index: 1; display: grid; place-content: center; width: 45%; aspect-ratio: 1; border: 1px solid #d8ff688c; border-radius: 50%; color: var(--ink); text-align: center; font: 500 clamp(.7rem, 1.2vw, 1rem)/1.5 var(--mono); letter-spacing: .1em; background: radial-gradient(circle, #4fd8c721, #081014a8 70%); box-shadow: 0 0 35px #40e5d82c, inset 0 0 32px #a4ffe41b; }

.signal-strip { position: relative; display: flex; justify-content: space-around; gap: 26px; overflow: hidden; padding: 15px 4vw; border-bottom: 1px solid #080b0e; background: var(--acid); color: #11170d; white-space: nowrap; font: 500 clamp(.62rem, .9vw, .78rem) var(--mono); letter-spacing: .08em; }
.signal-strip span:nth-child(even) { color: #37666a; }
.principle, .ponytail, .culture, .promise, .acceleration, .singularity, .origins { position: relative; isolation: isolate; padding: clamp(78px, 9vw, 146px) clamp(24px, 8.5vw, 142px); border-bottom: 1px solid #d8ff6826; overflow: hidden; }
.principle { background: radial-gradient(ellipse at 12% 75%, #182329, transparent 40%), linear-gradient(120deg, #0b1014, #0d1015 55%, #0a0e10); }
.ponytail { background: radial-gradient(ellipse at 85% 50%, #12352e, #101b1a 28%, #0a100f 67%); }
.culture { background: radial-gradient(ellipse at 15% 60%, #272319, #171510 25%, #0c0d0f 69%); }
.section-index { position: relative; display: flex; justify-content: space-between; gap: 20px; padding-bottom: 16px; border-bottom: 1px solid #d8ff6853; color: var(--acid); font-size: .6rem; font-weight: 500; letter-spacing: .13em; }
.principle-grid, .ponytail-grid, .culture-grid, .acceleration-grid, .singularity-grid, .origins-grid { display: grid; grid-template-columns: minmax(270px, .8fr) minmax(0, 1.2fr); align-items: center; gap: clamp(42px, 7vw, 118px); margin-top: 59px; }
.ponytail-grid, .culture-grid { grid-template-columns: minmax(0, 1.13fr) minmax(270px, .87fr); }
.culture-grid { grid-template-columns: minmax(0, 1fr); }
.section-copy { max-width: 760px; }
.section-copy h2, .promise h2 { margin: 0 0 28px; font-size: clamp(3rem, 6.1vw, 6.7rem); line-height: .9; }
.section-copy>p:not(.eyebrow) { max-width: 64ch; margin: 0 0 19px; color: #bcc4c1; font-size: .98rem; line-height: 1.82; }
.section-copy>p i { color: var(--acid); }
.margin-note { display: inline-block !important; max-width: 550px !important; margin: 7px 0 20px !important; padding: 11px 14px; border: 1px dashed #ff81c786; color: #ffa8d8 !important; background: #ff81c70a; font: 500 .67rem/1.55 var(--mono) !important; letter-spacing: .03em; transform: rotate(-.8deg); }
.margin-note b { color: white; font-size: 1.08rem; }.margin-note.acid { border-color: #d8ff6886; color: var(--acid) !important; background: #d8ff6809; transform: rotate(.65deg); }
.portrait { position: relative; max-width: 530px; margin: 0; padding: 10px 10px 0; border: 1px solid #baf6df55; background: #101719; box-shadow: 18px 18px 0 #61f1d40a, 0 25px 85px #0008; }
.portrait::before { content: 'ARCHIVE / HUMAN SYSTEMS'; position: absolute; z-index: 2; top: 20px; left: 22px; color: #d8ff68; font: 500 .54rem var(--mono); letter-spacing: .13em; }
.portrait img { display: block; width: 100%; height: clamp(350px, 42vw, 610px); object-fit: cover; filter: grayscale(1) contrast(1.08) brightness(.83); }
.musk-portrait img { object-position: center 25%; }.joeyray-portrait img { object-position: center 20%; }
.portrait figcaption { padding: 13px 2px 4px; color: #929f9d; font-size: .55rem; line-height: 1.6; letter-spacing: .01em; }.portrait figcaption a { color: var(--cyan); }
.algorithm { list-style: none; counter-reset: step; margin: 27px 0 26px; padding: 0; border-top: 1px solid #d8ff6838; }
.algorithm li { counter-increment: step; display: grid; grid-template-columns: 30px minmax(92px, .55fr) 1fr; align-items: baseline; gap: 14px; padding: 15px 0; border-bottom: 1px solid #d8ff682c; }
.algorithm li::before { content: counter(step, decimal-leading-zero); color: var(--acid); font: 500 .61rem var(--mono); }
.algorithm b { font: 500 1.28rem var(--display); letter-spacing: -.04em; }.algorithm span { color: #9fa9a6; font-size: .81rem; line-height: 1.5; }
.source-link { display: inline-flex; margin-top: 9px; color: var(--cyan); text-decoration: none; font-size: .63rem; font-weight: 500; letter-spacing: .03em; line-height: 1.6; }
.source-row { display: flex; flex-wrap: wrap; column-gap: 24px; }
.code-art { position: relative; max-width: 590px; padding: 25px; border: 1px solid #6cf5e575; background: linear-gradient(145deg, #0d1816, #080d0c 72%); box-shadow: 20px 20px 0 #6cf5e40c, 0 35px 90px #0009; font-size: .65rem; letter-spacing: .04em; }
.code-art::before { content: ''; position: absolute; inset: 9px; border: 1px solid #6cf5e41b; pointer-events: none; }
.code-top { display: flex; justify-content: space-between; color: var(--cyan); padding-bottom: 16px; border-bottom: 1px solid #6cf5e43b; }.code-old, .code-new { display: flex; flex-direction: column; gap: 12px; padding: 24px 10px; }
.code-old span, .code-new span { color: #a7b3ae; font-size: .58rem; letter-spacing: .15em; }.code-old s { color: #9d757b; text-decoration-color: #ff81c7; }
.code-new { margin-top: 8px; padding: 23px 10px; border-left: 2px solid var(--acid); background: #d8ff680c; }.code-new code { color: #e5ff9f; font-size: clamp(.95rem, 1.8vw, 1.4rem); }.code-art p { margin: 24px 0 0; color: var(--cyan); font-size: .6rem; }

.acceleration { background: radial-gradient(ellipse at 79% 48%, #34215a, #17172a 27%, #0a0c13 70%); }
.acceleration-grid, .singularity-grid { grid-template-columns: minmax(0, 1fr) minmax(300px, .85fr); }
.acceleration h2 em { color: var(--violet); }.acceleration .source-link { color: var(--violet); }
.future-art { position: relative; display: grid; place-items: center; min-width: 0; aspect-ratio: 1; isolation: isolate; }
.future-art::before { content: ''; position: absolute; z-index: -1; inset: 21%; border-radius: 50%; background: radial-gradient(circle at 38% 33%, #f5b5ff, #a653eb 20%, #56289c 43%, #17122d 72%); box-shadow: 0 0 85px #ac58f19c, 0 0 175px #c65bfa42, inset -20px -28px 55px #090914; }
.future-art::after { content: ''; position: absolute; inset: 7%; border: 1px solid #a88aff55; border-radius: 50%; background: repeating-radial-gradient(circle, transparent 0 38px, #ad8bff14 39px 40px); }
.future-orbit { position: absolute; z-index: 1; width: 90%; height: 38%; border: 1px solid var(--acid); border-radius: 50%; transform: rotate(-28deg); box-shadow: 0 0 19px #d8ff6870, inset 0 0 18px #d8ff6821; }
.future-orbit.two { transform: rotate(62deg); border-color: var(--pink); box-shadow: 0 0 20px #ff81c77c, inset 0 0 18px #ff81c723; }
.future-core { position: relative; z-index: 2; color: white; font: 600 clamp(3rem, 7vw, 7.4rem)/1 var(--display); letter-spacing: -.12em; text-shadow: 5px 7px 0 #391767, 0 0 32px #fff8; }.future-core span { color: var(--acid); }
.future-caption { position: absolute; z-index: 3; right: -2%; bottom: 8%; padding: 12px 14px; background: var(--acid); color: #151421; font: 500 .66rem/1.45 var(--mono); transform: rotate(5deg); box-shadow: 5px 5px 0 var(--pink); }
.singularity { background: radial-gradient(ellipse at 77% 51%, #481748, #1b1125 28%, #0b0c12 70%); }
.singularity h2 em, .singularity .source-link { color: var(--pink); }
.singularity-art { position: relative; min-width: 0; aspect-ratio: 1; border: 1px solid #ff81c75c; border-radius: 50%; background: repeating-radial-gradient(circle at center, transparent 0 39px, #ff81c716 40px 41px), radial-gradient(circle, #441d4a35, transparent 65%); box-shadow: inset 0 0 75px #fa6acc22, 0 0 65px #fa82d012; }
.singularity-art::before { content: ''; position: absolute; inset: 9%; border: 1px solid #ff82d878; border-radius: 50%; transform: rotateX(69deg) rotate(-22deg); }.singularity-art::after { content: ''; position: absolute; inset: 19%; border: 1px solid #d8ff687d; border-radius: 50%; transform: rotateY(68deg) rotate(35deg); }
.planet { position: absolute; inset: 32%; border-radius: 50%; background: radial-gradient(circle at 34% 28%, #ffcaea, #b74ccd 29%, #602574 56%, #1a0d27 76%); box-shadow: 0 0 65px #e15aff83, inset -14px -20px 35px #15081f; }
.human-mark { position: absolute; inset: 0; display: grid; place-content: center; color: var(--acid); font: 600 clamp(5rem, 13vw, 13rem)/1 var(--display); text-shadow: 0 0 24px #d8ff68, 5px 7px 0 #18101d; }
.radar-label, .radar-note { position: absolute; z-index: 4; padding: 8px 10px; border: 1px solid currentColor; background: #0a0b11; color: var(--pink); font: 500 .56rem var(--mono); letter-spacing: .05em; }
.radar-label { top: 8%; left: -5%; transform: rotate(-6deg); }.radar-note { right: -4%; bottom: 12%; color: var(--acid); transform: rotate(5deg); }
.origins { background: radial-gradient(ellipse at 76% 54%, #3c243c, #1a121e 30%, #0b0c11 69%); }.origins-grid { grid-template-columns: minmax(0, 1fr) minmax(360px, 1fr); }.origins h2 em, .origins .source-link { color: var(--pink); }
.lineage { position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 13px; padding: 37px 18px; border: 1px solid #ff81c765; background: #170f1dd9; box-shadow: 14px 14px 0 #ff81c70d, inset 0 0 50px #fc70cb0c; transform: rotate(1deg); }
.lineage::before { content: 'ORIGIN SEQUENCE / 001 → 003'; position: absolute; top: -10px; left: 18px; padding: 3px 7px; background: #170f1d; color: var(--pink); font: 500 .5rem var(--mono); letter-spacing: .13em; }
.lineage span { display: block; min-width: 120px; max-width: 190px; padding: 16px 13px; border: 1px solid #ff81c766; background: #33223b; color: white; font: 500 clamp(.85rem, 1.35vw, 1.15rem)/1.3 var(--display); }
.lineage span:last-child { background: var(--acid); color: #131711; border-color: var(--acid); }.lineage small { display: block; margin-bottom: 12px; color: #ff9bda; font: 500 .5rem var(--mono); letter-spacing: .12em; }.lineage span:last-child small { color: #4c5b16; }.lineage i { color: var(--acid); font: 500 1.8rem var(--mono); font-style: normal; }
.promise { text-align: center; background: radial-gradient(ellipse at center, #172f31, #10171d 33%, #090c10 72%); }.promise h2 { margin: 0 auto 52px; }.promise h2 em { color: var(--cyan); }
.promise-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; max-width: 1160px; margin: 0 auto 48px; text-align: left; }
.promise-grid p { position: relative; margin: 0; padding: 20px 0 0; border-top: 1px solid #6cf5e56c; color: #afb9b8; font-size: .9rem; line-height: 1.75; }
.promise-grid p::before { content: '↗'; position: absolute; top: 17px; right: 0; color: var(--cyan); font: 500 1rem var(--mono); }.promise-grid b { display: block; margin: 0 28px 8px 0; color: var(--ink); font: 500 1.28rem var(--display); letter-spacing: -.04em; }
footer { display: flex; align-items: center; flex-wrap: wrap; gap: 15px 35px; padding: 38px clamp(24px, 8.5vw, 142px); color: #a8b1af; font-size: .72rem; background: #07090b; }footer a { color: var(--acid); text-decoration: none; }footer small { flex-basis: 100%; color: #6f7a78; font: .58rem/1.6 var(--mono); }
@keyframes slow-turn { to { transform: rotate(360deg); } }
@keyframes orbit-float { 0%, 100% { transform: perspective(900px) rotateY(-20deg) rotateX(9deg) translateY(0); } 50% { transform: perspective(900px) rotateY(-14deg) rotateX(13deg) translateY(-12px); } }
@media (max-width: 900px) {
  .hero { grid-template-columns: 1fr; min-height: 760px; }
  .hero-orbit { position: absolute; right: -10%; bottom: 0; width: min(56vw, 460px); opacity: .6; }
  .hero-copy { max-width: 760px; }
  .principle-grid, .ponytail-grid, .culture-grid, .acceleration-grid, .singularity-grid, .origins-grid { grid-template-columns: 1fr; }
  .principle-grid, .ponytail-grid, .culture-grid, .acceleration-grid, .singularity-grid, .origins-grid { gap: 46px; }
  .portrait { max-width: 520px; }.culture .section-copy { max-width: 850px; }
  .code-art { justify-self: center; width: min(100%, 590px); }
  .future-art, .singularity-art { width: min(78vw, 470px); justify-self: center; }
  .lineage { width: min(100%, 680px); justify-self: center; }
}
@media (max-width: 600px) {
  html { scroll-padding-top: 62px; }
  .site-header { padding: 14px 15px; }.site-header nav { gap: 9px; }.site-header nav a { font-size: .55rem; }.site-header nav a:nth-child(4) { display: none; }
  .hero { min-height: 780px; padding: 70px 22px 90px; }.hero h1 { font-size: clamp(4rem, 17vw, 6.8rem); }.hero-copy { align-self: start; }.hero-orbit { right: -19%; bottom: 2%; width: 72vw; opacity: .38; }.hero-orbit strong { display: none; }.hero::after { display: none; }.mission { font-size: 1.22rem; }.mission-detail { font-size: .88rem; }
  .signal-strip { justify-content: center; gap: 22px; padding: 13px 0; }.signal-strip span:nth-child(n+3) { display: none; }
  .principle, .ponytail, .culture, .promise, .acceleration, .singularity, .origins { padding: 74px 22px; }
  .principle-grid, .ponytail-grid, .culture-grid, .acceleration-grid, .singularity-grid, .origins-grid { gap: 36px; margin-top: 36px; }
  .section-copy h2, .promise h2 { font-size: clamp(3.1rem, 13.5vw, 5rem); }.section-copy>p:not(.eyebrow) { font-size: .9rem; }.section-index { font-size: .5rem; }.section-index span:last-child { max-width: 54%; text-align: right; }
  .portrait img { height: 390px; }.portrait { padding: 8px 8px 0; }
  .algorithm li { grid-template-columns: 24px 92px 1fr; gap: 7px; }.algorithm b { font-size: 1.06rem; }.algorithm span { font-size: .7rem; }
  .code-art { padding: 18px; }.code-old, .code-new { padding-inline: 5px; }.code-old { gap: 11px; }
  .future-art, .singularity-art { width: min(85vw, 390px); }.future-caption { right: 0; bottom: 1%; font-size: .56rem; }.radar-label { left: -1%; }.radar-note { right: -1%; }
  .lineage { gap: 8px; padding: 25px 9px; }.lineage span { min-width: 0; flex: 1 1 78px; padding: 11px 8px; font-size: .73rem; }.lineage small { font-size: .43rem; }.lineage i { font-size: 1.1rem; }
  .promise-grid { grid-template-columns: 1fr; gap: 23px; }.promise h2 { margin-bottom: 38px; }
  footer { padding: 30px 22px; gap: 13px 20px; font-size: .67rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}

/* New visual chapters: the moving image and the lab's live field map. */
.film-section { position: relative; isolation: isolate; overflow: hidden; padding: clamp(72px, 8vw, 126px) clamp(24px, 8.5vw, 142px); border-bottom: 1px solid #ff81c73a; background: radial-gradient(ellipse at 50% 50%, #382044, #171420 45%, #0a0c11 82%); }
.film-section::before { content: ''; position: absolute; z-index: -1; inset: 0; opacity: .65; background: repeating-linear-gradient(90deg, transparent 0 calc(10% - 1px), #ff81c70b calc(10% - 1px) 10%), repeating-linear-gradient(0deg, transparent 0 calc(10% - 1px), #6cf5e509 calc(10% - 1px) 10%); mask-image: radial-gradient(ellipse at center, #000, transparent 76%); }
.film-shell { display: grid; grid-template-columns: minmax(230px, .62fr) minmax(0, 1.38fr); align-items: center; gap: clamp(32px, 5vw, 76px); max-width: 1500px; margin: 0 auto; }
.film-copy { max-width: 510px; }
.film-copy h2 { margin: 0 0 22px; font: 500 clamp(2.6rem, 4.6vw, 5rem)/.91 var(--display); letter-spacing: -.075em; }
.film-copy h2 em { color: var(--pink); }
.film-copy p:not(.eyebrow) { color: #b9b8c1; font-size: .94rem; line-height: 1.8; }
.film-copy .film-hint { margin-top: 25px; color: var(--pink) !important; font: 500 .62rem var(--mono) !important; letter-spacing: .09em; }
.film-frame { position: relative; aspect-ratio: 16 / 9; min-width: 0; padding: 8px; border: 1px solid #ff81c783; background: #080910; box-shadow: 0 0 0 1px #6cf5e522, 0 22px 0 -10px #d8ff68, 0 35px 95px #000b, 0 0 95px #c456ff28; }
.film-frame::before { content: 'RISE UP / ONE SHOT'; position: absolute; z-index: 2; top: -13px; left: 19px; padding: 5px 9px; background: var(--acid); color: #11150d; font: 500 .55rem var(--mono); letter-spacing: .12em; }
.film-frame::after { content: 'LIVE IMAGE / 01'; position: absolute; z-index: 2; right: -1px; bottom: -22px; color: #ff9ddb; font: 500 .52rem var(--mono); letter-spacing: .13em; }
.film-frame iframe { display: block; width: 100%; height: 100%; border: 0; background: #050509; }
.film-meta { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px 28px; margin-top: -15px; color: #aeb6b9; font: 500 .58rem/1.5 var(--mono); letter-spacing: .08em; }
.film-meta a { color: var(--acid); text-decoration: none; }
.film-meta a:hover { text-decoration: underline; }
.field-map { position: relative; isolation: isolate; overflow: hidden; padding: clamp(82px, 10vw, 158px) clamp(24px, 8.5vw, 142px); border-bottom: 1px solid #6cf5e54a; background: radial-gradient(ellipse at 52% 54%, #123a3c, #101a20 30%, #0a0e12 70%); }
.field-map::before { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, transparent 49.9%, #6cf5e51a 50%, transparent 50.1%), linear-gradient(0deg, transparent 49.9%, #6cf5e51a 50%, transparent 50.1%), repeating-radial-gradient(ellipse at 50% 50%, transparent 0 70px, #6cf5e50b 71px 72px); mask-image: radial-gradient(ellipse, #000 15%, transparent 74%); }
.field-intro { max-width: 850px; margin: 60px auto 0; text-align: center; }
.field-intro h2 { margin: 0 0 23px; font: 500 clamp(3rem, 7vw, 7rem)/.94 var(--display); letter-spacing: -.085em; }
.field-intro h2 em { color: var(--cyan); }
.field-intro > p:last-child { max-width: 58ch; margin: 0 auto; color: #b0bebc; font-size: 1rem; line-height: 1.75; }
.field-grid { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(3, minmax(150px, auto)); align-items: center; gap: clamp(20px, 3.8vw, 58px); max-width: 1120px; min-height: 690px; margin: 58px auto 0; }
.field-grid::before, .field-grid::after { content: ''; position: absolute; z-index: -1; left: 12%; right: 12%; top: 50%; height: 1px; background: linear-gradient(90deg, transparent, #6cf5e583, #d8ff68, #6cf5e583, transparent); box-shadow: 0 0 18px #6cf5e550; }
.field-grid::after { transform: rotate(31deg) scaleX(.8); }
.field-node { position: relative; display: grid; align-content: center; justify-items: start; min-height: 140px; padding: 20px 22px; border-left: 1px solid #6cf5e57d; background: linear-gradient(90deg, #0b1215e8, #0b121599 75%, transparent); text-decoration: none; transition: transform .2s ease, border-color .2s ease; }
.field-node:hover, .field-node:focus-visible { transform: translateY(-4px); border-color: var(--acid); }
.field-node::before { content: ''; position: absolute; top: 0; left: -3px; width: 5px; height: 5px; border-radius: 50%; background: var(--acid); box-shadow: 0 0 13px var(--acid); }
.field-node > small { margin-bottom: 13px; color: var(--cyan); font: 500 .5rem var(--mono); letter-spacing: .1em; }
.field-node > strong { color: var(--ink); font: 600 clamp(1.2rem, 2vw, 1.75rem) var(--display); letter-spacing: -.04em; }
.field-node > b { margin-top: 15px; color: var(--acid); font: 500 .55rem var(--mono); letter-spacing: .11em; }
.field-node > span:not(.field-status) { max-width: 27ch; margin-top: 9px; color: #aab7b5; font-size: .78rem; line-height: 1.55; }
.field-node em.field-status { position: absolute; top: 11px; right: 10px; color: var(--cyan); font: 500 .49rem var(--mono); font-style: normal; letter-spacing: .1em; }
.field-core { position: relative; z-index: 1; grid-column: 2; grid-row: 1 / 3; display: grid; place-content: center; justify-self: center; width: min(100%, 260px); aspect-ratio: 1; border: 1px solid #d8ff68c9; border-radius: 50%; background: radial-gradient(circle at 40% 35%, #4df1d930, #0b171c 59%, #0b1013); color: var(--acid); text-align: center; font: 500 clamp(1rem, 2vw, 1.45rem)/1.4 var(--mono); letter-spacing: .08em; box-shadow: 0 0 0 12px #d8ff6809, 0 0 0 35px #6cf5e508, 0 0 70px #61f0d52e, inset 0 0 45px #6cf5e41c; }
.field-core::before, .field-core::after { content: ''; position: absolute; inset: -10%; border: 1px solid #6cf5e57d; border-radius: 50%; transform: rotateX(68deg) rotate(-25deg); }
.field-core::after { inset: -19%; border-color: #ab8bff73; transform: rotateY(65deg) rotate(25deg); }
.field-core span { display: block; position: relative; z-index: 1; }
.field-core small { display: block; position: relative; z-index: 1; margin-top: 10px; color: #b8f8ed; font: 500 .43rem var(--mono); letter-spacing: .05em; }
.field-node:nth-of-type(1) { grid-column: 1; grid-row: 1; }.field-node:nth-of-type(2) { grid-column: 3; grid-row: 1; }.field-node:nth-of-type(3) { grid-column: 1; grid-row: 2; }.field-node:nth-of-type(4) { grid-column: 3; grid-row: 2; }.field-node:nth-of-type(5) { grid-column: 2; grid-row: 3; }
@media (max-width: 900px) {
  .film-shell { grid-template-columns: 1fr; gap: 35px; }
  .film-copy { max-width: 760px; }
  .film-frame { width: 100%; }
  .field-grid { gap: 16px; min-height: 420px; }
  .field-node { padding: 16px 13px; }
}
@media (max-width: 600px) {
  .hero h1 { max-width: 100%; font-size: clamp(2.75rem, 10.7vw, 4rem); letter-spacing: -.08em; }
  .hero { min-height: 720px; }
  .film-section, .field-map { padding: 72px 22px; }
  .film-shell { gap: 30px; }
  .film-copy h2 { font-size: clamp(2.8rem, 13vw, 4.2rem); }
  .film-frame { padding: 5px; }
  .field-grid { grid-template-columns: 1fr 1fr; grid-template-rows: auto 190px auto auto; gap: 13px 10px; min-height: 0; margin-top: 40px; }
  .field-grid::before { left: 20%; right: 20%; top: 50%; transform: rotate(90deg); }
  .field-grid::after { transform: rotate(0); }
  .field-core { grid-column: 1 / 3; grid-row: 2; width: 160px; }
  .field-node { min-height: 112px; padding: 18px 10px 10px; }
  .field-intro { margin-top: 40px; }.field-intro h2 { font-size: clamp(2.7rem, 11vw, 4.5rem); }.field-intro > p:last-child { font-size: .86rem; }
  .field-node > strong { font-size: 1rem; }.field-node > b { font-size: .5rem; }
  .field-node > span:not(.field-status) { font-size: .66rem; }
  .field-node em.field-status { top: 5px; right: 6px; font-size: .4rem; }
  .field-node:nth-of-type(1) { grid-column: 1; grid-row: 1; }.field-node:nth-of-type(2) { grid-column: 2; grid-row: 1; }.field-node:nth-of-type(3) { grid-column: 1; grid-row: 3; }.field-node:nth-of-type(4) { grid-column: 2; grid-row: 3; }.field-node:nth-of-type(5) { grid-column: 1 / 3; grid-row: 4; }
  .field-node { justify-self: stretch; }
}