@property --spd{syntax:'<integer>';inherits:false;initial-value:0}
@property --alt{syntax:'<integer>';inherits:false;initial-value:1068}
@property --yr{syntax:'<integer>';inherits:false;initial-value:1913}
@property --pct{syntax:'<integer>';inherits:false;initial-value:0}
@property --n{syntax:'<integer>';inherits:false;initial-value:0}

body{margin:0;background:#04060A}
a{color:#7CC4FF}a:hover{color:#B5DDFF}
.lk{--gp:0;--bg:#04060A;--panel:#0B1018;--line:rgba(148,178,214,0.14);--line2:rgba(148,178,214,0.3);--text:#E9EEF5;--muted:#95A2B6;--amber:#FF9E3D;--ice:#7CC4FF;--display:'Barlow','DIN 2014','DIN Pro',system-ui,sans-serif;--sans:'Barlow','DIN 2014','DIN Pro','Helvetica Neue',system-ui,sans-serif;--mono:'IBM Plex Mono',ui-monospace,Menlo,monospace;position:relative;background:var(--bg);color:var(--text);font-family:var(--sans);font-weight:400;-webkit-font-smoothing:antialiased;overflow-x:clip}
.lk *{box-sizing:border-box}
.mono{font-family:var(--mono)}
.amber{color:var(--amber)}

/* chapters */
.ch{--p:0;position:relative}
.stage{position:sticky;top:0;height:100vh;overflow:hidden}
.ch-intro{height:220vh}
.ch-takeoff{height:220vh;--climb:clamp(0,calc((var(--p) - 0.45) / 0.55),1)}
.ch-air{height:380vh}
.ch-century{height:620vh;--span:9000px}
.ch-site{height:340vh;--lock:clamp(0,calc(var(--p) / 0.55),1);--locked:clamp(0,calc((var(--p) - 0.55) * 1000),1)}
.ch-next{height:340vh}
.ch-join{min-height:100vh}

/* fade helper: visible while --a < p < --b */
.fx{--k:8;--v:clamp(0,min(calc((var(--p) - var(--a)) * var(--k)),calc((var(--b) - var(--p)) * var(--k))),1);opacity:var(--v);transform:translateY(calc((1 - var(--v)) * 36px));will-change:transform,opacity}

.ch-label{position:absolute;left:32px;top:92px;z-index:5;font-family:var(--mono);font-size:12px;letter-spacing:.2em;color:var(--amber);display:flex;gap:12px;align-items:center}
.ch-label::before{content:'';width:28px;height:1px;background:currentColor}
.statement{margin:0;font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:clamp(36px,5vw,84px);line-height:.95;letter-spacing:-.01em;text-wrap:balance}

/* fixed chrome */
.nav{position:fixed;top:0;left:0;right:0;z-index:40;height:64px;padding:0 28px;display:flex;align-items:center;justify-content:space-between;gap:20px;background:linear-gradient(to bottom,rgba(4,6,10,0.85),rgba(4,6,10,0))}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--text)}
.brand:hover{color:var(--text)}
.brand-name{font-family:var(--display);font-weight:700;font-size:16px;letter-spacing:.26em;line-height:1}
.brand-sub{font-family:var(--mono);font-size:9.5px;letter-spacing:.22em;color:var(--muted);line-height:1;margin-top:5px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:0 20px;font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;white-space:nowrap;border:1px solid var(--amber);color:#160C02;background:var(--amber);cursor:pointer;transition:background .25s,transform .25s;clip-path:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px)}
.btn:hover{background:#FFB669;color:#160C02;transform:translateY(-1px)}
.btn:focus-visible,.idx a:focus-visible{outline:2px solid var(--ice);outline-offset:3px}
.progress{position:fixed;left:0;right:0;top:0;height:2px;z-index:41;background:var(--amber);transform-origin:left;transform:scaleX(var(--gp));box-shadow:0 0 12px rgba(255,158,61,0.8)}
.frame{position:fixed;width:22px;height:22px;z-index:30;pointer-events:none;border-color:rgba(124,196,255,0.5);border-style:solid;border-width:0}
.f-tl{left:14px;top:14px;border-left-width:1px;border-top-width:1px}
.f-tr{right:14px;top:14px;border-right-width:1px;border-top-width:1px}
.f-bl{left:14px;bottom:14px;border-left-width:1px;border-bottom-width:1px}
.f-br{right:14px;bottom:14px;border-right-width:1px;border-bottom-width:1px}
.idx{position:fixed;right:28px;top:50%;transform:translateY(-50%);z-index:30;display:flex;flex-direction:column;gap:4px}
.idx a{display:flex;align-items:center;justify-content:flex-end;gap:12px;min-height:32px;font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;color:transparent;text-decoration:none;transition:color .3s}
.idx a i{display:block;width:14px;height:1px;background:var(--line2);transition:width .4s cubic-bezier(.2,.8,.2,1),background .3s}
.idx a:hover,.idx a:focus-visible{color:var(--text)}
.idx a:hover i{background:var(--text)}
.lk[data-active="0"] .idx a:nth-child(1),.lk[data-active="1"] .idx a:nth-child(2),.lk[data-active="2"] .idx a:nth-child(3),.lk[data-active="3"] .idx a:nth-child(4),.lk[data-active="4"] .idx a:nth-child(5),.lk[data-active="5"] .idx a:nth-child(6),.lk[data-active="6"] .idx a:nth-child(7){color:var(--amber)}
.lk[data-active="0"] .idx a:nth-child(1) i,.lk[data-active="1"] .idx a:nth-child(2) i,.lk[data-active="2"] .idx a:nth-child(3) i,.lk[data-active="3"] .idx a:nth-child(4) i,.lk[data-active="4"] .idx a:nth-child(5) i,.lk[data-active="5"] .idx a:nth-child(6) i,.lk[data-active="6"] .idx a:nth-child(7) i{width:36px;background:var(--amber)}
.status{position:fixed;left:28px;bottom:24px;z-index:30;font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;color:var(--muted);display:flex;gap:18px;align-items:center}
.pct{--pct:calc(var(--gp) * 100);counter-reset:pct var(--pct);color:var(--text)}
.pct::after{content:counter(pct) '%'}
.cue{position:fixed;right:28px;bottom:24px;z-index:30;font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;color:var(--muted);display:flex;align-items:center;gap:12px;opacity:clamp(0,calc(1 - var(--gp) * 30),1)}
.cue-line{position:relative;width:1px;height:38px;background:var(--line2);overflow:hidden}
.cue-line::after{content:'';position:absolute;left:-1px;top:-10px;width:3px;height:10px;background:var(--amber);animation:drip 1.6s ease-in infinite;will-change:transform}

/* shared atmospherics */
.stars{position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(1.2px 1.2px at 8% 18%,rgba(255,255,255,.75),transparent),radial-gradient(1px 1px at 22% 62%,rgba(255,255,255,.5),transparent),radial-gradient(1.4px 1.4px at 37% 12%,rgba(255,255,255,.65),transparent),radial-gradient(1px 1px at 48% 44%,rgba(255,255,255,.35),transparent),radial-gradient(1.2px 1.2px at 63% 8%,rgba(255,255,255,.55),transparent),radial-gradient(1px 1px at 71% 33%,rgba(255,255,255,.45),transparent),radial-gradient(1.5px 1.5px at 86% 21%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 93% 54%,rgba(255,255,255,.4),transparent),radial-gradient(1px 1px at 14% 40%,rgba(255,255,255,.35),transparent),radial-gradient(1.2px 1.2px at 57% 27%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 31% 82%,rgba(255,255,255,.4),transparent),radial-gradient(1.3px 1.3px at 78% 74%,rgba(255,255,255,.5),transparent);animation:twinkle 4s ease-in-out infinite alternate}
.stars-b{transform:scale(1.6) rotate(40deg);opacity:.5;animation-delay:-2s}
.stage .scan{display:none}
.scanlines{position:fixed;inset:0;pointer-events:none;z-index:29;background:repeating-linear-gradient(to bottom,rgba(255,255,255,0.02) 0 1px,transparent 1px 3px)}
.retro{position:absolute;left:-40%;right:-40%;bottom:0;height:calc(46vh + 64px);bottom:-64px;pointer-events:none;background-image:linear-gradient(rgba(124,196,255,0.22) 1px,transparent 1px),linear-gradient(90deg,rgba(124,196,255,0.22) 1px,transparent 1px);background-size:64px 64px;transform:perspective(520px) rotateX(64deg);transform-origin:50% 100%;animation:floor 2.4s linear infinite;will-change:transform;-webkit-mask-image:linear-gradient(to top,#000,transparent 85%);mask-image:linear-gradient(to top,#000,transparent 85%)}

/* ---------- 00 intro ---------- */
.ch-intro .stars{transform:translateY(calc(var(--p) * -120px))}
.warp{position:absolute;inset:-60%;pointer-events:none;background:repeating-conic-gradient(from 0deg,transparent 0deg 3deg,rgba(124,196,255,0.4) 3deg 3.25deg);-webkit-mask-image:radial-gradient(circle,transparent 8%,#000 45%,transparent 70%);mask-image:radial-gradient(circle,transparent 8%,#000 45%,transparent 70%);opacity:clamp(0,calc(var(--p) * 2.2 - 0.3),1);transform:scale(calc(0.6 + var(--p) * 1.8)) rotate(calc(var(--p) * 25deg));will-change:transform,opacity}
.intro-exit{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;padding:0 24px;text-align:center;transform:scale(calc(1 + var(--p) * var(--p) * 9));opacity:clamp(0,calc(1 - var(--p) * 1.9),1);will-change:transform,opacity}
.typed{display:inline-block;font-family:var(--mono);font-size:12px;color:var(--amber);overflow:hidden;white-space:nowrap;width:34ch;border-right:2px solid var(--amber);animation:type 1.8s steps(34) .2s both,caret 1s step-end infinite}
.title{font-family:var(--display);font-weight:700;font-size:clamp(60px,14vw,236px);line-height:.85;letter-spacing:.03em;margin:0;display:flex;position:relative}
.title span{display:block;animation:ltr 1.3s cubic-bezier(.2,.8,.2,1) both}
.title-scan{position:absolute;top:-10%;bottom:-10%;width:3px;left:0;background:var(--ice);box-shadow:0 0 30px 6px rgba(124,196,255,0.7);opacity:0;animation:tscan 1.6s cubic-bezier(.5,0,.2,1) 1.3s both}
.tags{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px 18px;font-family:var(--mono);font-size:12px;letter-spacing:.22em;color:var(--muted);animation:fadeup 1s cubic-bezier(.2,.8,.2,1) 1.7s both}
.tags i{display:block;width:40px;height:1px;background:var(--line2)}
.cross{position:absolute;left:50%;top:50%;width:min(86vw,1100px);height:min(64vh,560px);transform:translate(-50%,-50%);pointer-events:none;opacity:clamp(0,calc(1 - var(--p) * 3),1)}
.cross::before,.cross::after{content:'';position:absolute;background:var(--line)}
.cross::before{left:0;right:0;top:50%;height:1px;animation:drawx 1.4s cubic-bezier(.2,.8,.2,1) .1s both}
.cross::after{top:0;bottom:0;left:50%;width:1px;animation:drawy 1.4s cubic-bezier(.2,.8,.2,1) .1s both}

/* ---------- 01 takeoff ---------- */
.ch-takeoff .stage{background:#04060A}
.world{position:absolute;inset:0;will-change:transform;transform:translateY(calc(var(--climb) * 22vh)) rotate(calc(var(--climb) * -3deg))}
.sky{position:absolute;left:-25%;right:-25%;top:-60vh;bottom:50%;background:linear-gradient(to bottom,#02040A 0%,#050C18 65%,#0D1D34 100%)}
.ground-base{position:absolute;left:-25%;right:-25%;top:50%;height:110vh;background:linear-gradient(to bottom,#0A1424 0%,#05080F 14%,#04060A 40%)}
.dawn{position:absolute;left:-10%;right:-10%;top:25%;height:50%;pointer-events:none;background:radial-gradient(ellipse 50% 40% at 50% 50%,rgba(255,158,61,0.34),transparent 70%);opacity:calc(0.25 + var(--climb) * 0.75)}
.horizon{position:absolute;left:-25%;right:-25%;top:50%;height:1px;background:rgba(124,196,255,0.55);box-shadow:0 0 18px rgba(124,196,255,0.6)}
.runway{position:absolute;left:50%;bottom:0;width:2400px;height:300vh;margin-left:-1200px;overflow:hidden;transform-origin:50% 100%;transform:perspective(80vh) rotateX(58deg);opacity:calc(1 - var(--climb) * 0.4);background-image:linear-gradient(90deg,transparent calc(50% - 160px),rgba(233,238,245,0.65) calc(50% - 160px) calc(50% - 155px),transparent calc(50% - 155px) calc(50% + 155px),rgba(233,238,245,0.65) calc(50% + 155px) calc(50% + 160px),transparent calc(50% + 160px)),linear-gradient(90deg,transparent calc(50% - 160px),#0D131D calc(50% - 160px) calc(50% + 160px),transparent calc(50% + 160px)),linear-gradient(90deg,rgba(124,196,255,0.16) 2px,transparent 2px);background-size:100% 100%,100% 100%,160px 100%;background-repeat:no-repeat,no-repeat,repeat;background-position:0 0,0 0,50% 0;-webkit-mask-image:linear-gradient(to top,#000 20%,transparent 75%);mask-image:linear-gradient(to top,#000 20%,transparent 75%)}
.runway-tex{position:absolute;left:0;right:0;top:-200px;bottom:0;will-change:transform;transform:translate3d(0,var(--roll,0px),0);background-image:linear-gradient(to bottom,rgba(233,238,245,0.85) 0 45%,transparent 45%),radial-gradient(circle,#FFB669 0 3px,transparent 4px),radial-gradient(circle,#FFB669 0 3px,transparent 4px),linear-gradient(rgba(124,196,255,0.22) 2px,transparent 2px);background-size:8px 200px,16px 100px,16px 100px,100% 200px;background-repeat:repeat-y,repeat-y,repeat-y,repeat;background-position:50% 0,calc(50% - 185px) 0,calc(50% + 185px) 0,0 0}
.hud{position:absolute;inset:0;color:var(--ice);pointer-events:none}
.tape{position:absolute;top:50%;width:88px;height:300px;margin-top:-150px;border:1px solid rgba(124,196,255,0.35);overflow:hidden;background:rgba(4,6,10,0.3)}
.tape-l{left:calc(50% - min(40vw,470px))}
.tape-r{right:calc(50% - min(40vw,470px))}
.ticks{position:absolute;inset:0;background-image:linear-gradient(rgba(124,196,255,0.75) 1px,transparent 1px),linear-gradient(rgba(124,196,255,0.95) 2px,transparent 2px);background-size:12px 20px,26px 100px;background-repeat:repeat-y}
.tape-l .ticks{--ty:calc(var(--p) * 2000px);background-position:right var(--ty),right var(--ty)}
.tape-r .ticks{--ty:calc(var(--climb) * 5000px);background-position:left var(--ty),left var(--ty)}
.read{position:absolute;top:50%;left:-1px;right:-1px;height:42px;margin-top:-21px;background:#04060A;border:1px solid var(--ice);display:flex;align-items:center;justify-content:center;gap:5px;font-family:var(--mono);font-size:18px;color:var(--text);font-variant-numeric:tabular-nums}
.read small{font-size:9.5px;color:var(--muted);letter-spacing:.1em}
.tape-k{position:absolute;top:calc(50% - 176px);font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;color:var(--muted)}
.spd{--spd:calc(min(var(--p) / 0.45,1) * 165 + var(--climb) * 185);counter-reset:spd var(--spd)}
.spd::after{content:counter(spd)}
.alt{--alt:calc(1068 + var(--climb) * 34000);counter-reset:alt var(--alt)}
.alt::after{content:counter(alt)}
.hdg{position:absolute;top:84px;left:50%;width:min(440px,64vw);height:46px;transform:translateX(-50%);overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 25%,#000 75%,transparent);mask-image:linear-gradient(90deg,transparent,#000 25%,#000 75%,transparent)}
.hdg-ticks{position:absolute;left:-40px;right:-40px;bottom:0;height:12px;background-image:linear-gradient(90deg,rgba(124,196,255,0.8) 1px,transparent 1px);background-size:22px 100%;transform:translateX(calc((var(--p) - 0.5) * -60px))}
.hdg-read{position:absolute;left:50%;top:0;transform:translateX(-50%);font-family:var(--mono);font-size:15px;color:var(--text);padding:2px 10px;border:1px solid var(--ice);background:#04060A}
.ladder-win{position:absolute;left:50%;top:50%;width:min(470px,78vw);height:360px;transform:translate(-50%,-50%) rotate(calc((var(--p) - 0.5) * -5deg));overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,transparent,#000 18%,#000 82%,transparent);mask-image:linear-gradient(to bottom,transparent,#000 18%,#000 82%,transparent)}
.ladder{position:absolute;left:0;right:0;top:-180px;height:720px;transform:translateY(calc(var(--climb) * 180px));will-change:transform}
.rung{position:absolute;left:0;right:0;height:0;display:flex;align-items:center;justify-content:center}
.rung i{display:block;width:min(110px,18vw);height:2px;background:var(--ice)}
.rung b{display:block;width:min(130px,20vw)}
.rung span{width:34px;text-align:center;font-family:var(--mono);font-size:11px}
.rung-0 i{width:min(170px,26vw)}
.rung-neg i{background:repeating-linear-gradient(90deg,var(--ice) 0 10px,transparent 10px 17px)}
.fpm{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);filter:drop-shadow(0 0 6px rgba(124,196,255,0.8))}
.callout{position:absolute;left:50%;top:150px;margin-left:-110px;width:220px;text-align:center;font-family:var(--mono);font-size:14px;letter-spacing:.32em;color:var(--amber);padding:8px 0;border:1px solid rgba(255,158,61,0.6);background:rgba(4,6,10,0.6);--k:40}
.to-st{position:absolute;left:clamp(24px,6vw,96px);bottom:11vh;max-width:min(15ch,88vw);font-size:clamp(34px,4.6vw,76px)}

/* ---------- 02 century ---------- */
.ch-century .stage{background:radial-gradient(ellipse 70% 60% at 50% 50%,#0A1220,#04060A 70%)}
.yr-bg{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:var(--display);font-weight:700;font-size:clamp(160px,33vw,520px);line-height:1;letter-spacing:-.03em;color:transparent;-webkit-text-stroke:1px rgba(124,196,255,0.22);white-space:nowrap;--yr:calc(1913 + var(--p) * 109);counter-reset:yr var(--yr);pointer-events:none}
.yr-bg::after{content:counter(yr)}
.cursor{position:absolute;left:50%;top:18%;bottom:18%;width:1px;background:linear-gradient(to bottom,transparent,var(--amber) 30%,var(--amber) 70%,transparent)}
.cursor-k{position:absolute;left:50%;top:calc(18% - 28px);transform:translateX(-50%);font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;color:var(--amber);white-space:nowrap;--yr:calc(1913 + var(--p) * 109);counter-reset:yr var(--yr)}
.cursor-k::after{content:'NOW PASSING ' counter(yr)}
.track{position:absolute;left:0;top:50%;width:var(--span);height:0;transform:translate3d(calc(50vw - var(--p) * var(--span)),0,0);will-change:transform}
.axis{position:absolute;left:-1200px;right:-1200px;top:-1px;height:2px;background:rgba(124,196,255,0.35)}
.axis-ticks{position:absolute;left:0;right:0;top:-6px;height:12px;background-image:linear-gradient(90deg,rgba(124,196,255,0.45) 1px,transparent 1px),linear-gradient(90deg,rgba(124,196,255,0.9) 2px,transparent 2px);background-size:calc(var(--span) / 109) 6px,calc(var(--span) / 10.9) 12px;background-repeat:repeat-x;background-position:0 3px,calc(var(--span) * 0.064220) 0}
.dec{position:absolute;top:16px;transform:translateX(-50%);font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--muted)}
.card{--d:max(calc(var(--p) - var(--pos)),calc(var(--pos) - var(--p)));--near:clamp(0,calc(1 - var(--d) * 9),1);position:absolute;width:min(300px,72vw);padding:20px 22px;border:1px solid rgba(124,196,255,0.45);background:rgba(9,14,22,0.92);opacity:calc(0.3 + var(--near) * 0.7);will-change:transform,opacity;display:flex;flex-direction:column;gap:8px}
.card.up{bottom:44px;transform:translateX(-50%) translateY(calc((1 - var(--near)) * 14px)) scale(calc(0.9 + var(--near) * 0.12))}
.card.down{top:44px;transform:translateX(-50%) translateY(calc((1 - var(--near)) * -14px)) scale(calc(0.9 + var(--near) * 0.12))}
.card::before{content:'';position:absolute;left:50%;width:1px;height:44px;background:rgba(124,196,255,0.5)}
.card.up::before{top:100%}
.card.down::before{bottom:100%}
.card::after{content:'';position:absolute;left:50%;width:9px;height:9px;margin-left:-4px;background:var(--amber);transform:rotate(45deg);box-shadow:0 0 12px var(--amber)}
.card.up::after{top:calc(100% + 39px)}
.card.down::after{bottom:calc(100% + 39px)}
.c-yr{font-family:var(--mono);font-size:13px;letter-spacing:.14em;color:var(--amber);display:flex;justify-content:space-between;gap:12px}
.c-tag{font-size:10px;letter-spacing:.2em;color:var(--ice);border:1px solid rgba(124,196,255,0.5);padding:1px 6px}
.c-name{font-family:var(--display);font-weight:600;font-size:26px;line-height:1.05;margin:0}
.c-line{margin:0;font-size:15px;line-height:1.45;color:var(--muted)}

/* ---------- 03 airframes ---------- */
.ch-air .stage{background:radial-gradient(ellipse 80% 70% at 60% 50%,#0A1426,#04060A 75%)}
.bp-grid{position:absolute;inset:-10% 0;pointer-events:none;background-image:linear-gradient(rgba(124,196,255,0.08) 1px,transparent 1px),linear-gradient(90deg,rgba(124,196,255,0.08) 1px,transparent 1px),linear-gradient(rgba(124,196,255,0.035) 1px,transparent 1px),linear-gradient(90deg,rgba(124,196,255,0.035) 1px,transparent 1px);background-size:120px 120px,120px 120px,24px 24px,24px 24px;background-position:center;transform:translateY(calc(var(--p) * -80px))}
.bp{--k:22;--d1:clamp(0,calc((var(--p) - var(--s)) / 0.12),1);--d2:clamp(0,calc((var(--p) - var(--s) - 0.09) / 0.07),1);position:absolute;inset:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);align-items:center;gap:32px;padding:96px clamp(24px,7vw,120px) 64px;pointer-events:none}
.bp-txt{display:flex;flex-direction:column;gap:14px;max-width:440px}
.bp-k{font-family:var(--mono);font-size:11px;letter-spacing:.22em;color:var(--muted)}
.bp-name{margin:0;font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:clamp(40px,5.2vw,88px);line-height:.92;letter-spacing:-.01em}
.bp-yr{font-family:var(--mono);font-size:13px;letter-spacing:.18em;color:var(--amber);display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.bp-specs{opacity:var(--d2);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;border-top:1px solid var(--line);margin-top:8px}
.bp-specs div{display:flex;flex-direction:column;gap:4px;padding:14px 0;border-bottom:1px solid var(--line)}
.sk{font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--muted)}
.sv{font-family:var(--mono);font-size:18px;color:var(--text);font-variant-numeric:tabular-nums}
.count{--n:calc(var(--d2) * var(--max));counter-reset:n var(--n)}
.count::after{content:counter(n)}
.bp-svg{width:100%;height:min(calc(100vh - 170px),62vw);display:flex;align-items:center;justify-content:center}
.bp-svg svg{height:100%;width:auto;max-width:100%;overflow:visible}
.ln{fill:rgba(124,196,255,calc(var(--d2) * 0.08));stroke:var(--ice);stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round;stroke-dasharray:1px 1px;stroke-dashoffset:calc((1 - var(--d1)) * 1px)}
.dt{fill:none;stroke:rgba(124,196,255,0.6);stroke-width:1;stroke-linecap:round;stroke-dasharray:1px 1px;stroke-dashoffset:calc((1 - var(--d2)) * 1px)}
.dim{fill:none;stroke:var(--amber);stroke-width:1;stroke-dasharray:1px 1px;stroke-dashoffset:calc((1 - var(--d2)) * 1px)}
.dim-t{fill:var(--amber);font-family:var(--mono);font-size:9px;letter-spacing:.18em;opacity:var(--d2)}

/* ---------- 04 site ---------- */
.ch-site .stage{background:#04060A}
.map{position:absolute;inset:-30%;pointer-events:none;transform:scale(calc(0.7 + var(--lock) * 0.9));will-change:transform;background-image:linear-gradient(rgba(124,196,255,0.09) 1px,transparent 1px),linear-gradient(90deg,rgba(124,196,255,0.09) 1px,transparent 1px),repeating-radial-gradient(circle at 50% 50%,transparent 0 58px,rgba(124,196,255,0.08) 58px 59px);background-size:48px 48px,48px 48px,100% 100%;background-position:center}
.s-radar{position:absolute;left:50%;top:50%;width:min(78vh,82vw);aspect-ratio:1/1;transform:translate(-50%,-50%) scale(calc(0.8 + var(--lock) * 0.3));will-change:transform;border-radius:50%;border:1px solid var(--line2)}
.s-ring{position:absolute;border-radius:50%;border:1px solid var(--line)}
.s-sweep{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,transparent 0deg 300deg,rgba(124,196,255,0.3) 359deg,rgba(124,196,255,0.85) 360deg);animation:spin 4s linear infinite;opacity:calc(1 - var(--locked) * 0.6)}
.blip{position:absolute;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-radius:50%;background:var(--ice);opacity:calc(1 - var(--lock));animation:ping 2.4s ease-out infinite}
.rwy{position:absolute;left:50%;top:50%;width:min(300px,52vw);height:22px;transform:translate(-50%,-50%) rotate(20deg) scale(calc(0.6 + var(--lock) * 0.6));border:1px solid rgba(233,238,245,0.75);background:rgba(233,238,245,0.05);display:flex;align-items:center;justify-content:space-between;padding:0 6px;font-family:var(--mono);font-size:10px;color:var(--text)}
.rwy::before{content:'';position:absolute;left:30px;right:30px;top:50%;height:1px;background:repeating-linear-gradient(90deg,rgba(233,238,245,0.8) 0 10px,transparent 10px 18px)}
.br{--off:calc((1 - var(--lock)) * 34vw + min(150px,24vw));position:absolute;left:50%;top:50%;width:34px;height:34px;margin:-17px 0 0 -17px;border:0 solid color-mix(in oklab,var(--amber) calc(var(--locked) * 100%),var(--ice));will-change:transform}
.br-tl{border-left-width:2px;border-top-width:2px;transform:translate(calc(var(--off) * -1),calc(var(--off) * -0.6))}
.br-tr{border-right-width:2px;border-top-width:2px;transform:translate(var(--off),calc(var(--off) * -0.6))}
.br-bl{border-left-width:2px;border-bottom-width:2px;transform:translate(calc(var(--off) * -1),calc(var(--off) * 0.6))}
.br-br{border-right-width:2px;border-bottom-width:2px;transform:translate(var(--off),calc(var(--off) * 0.6))}
.lock{position:absolute;left:50%;top:calc(50% - min(140px,22vw) - 70px);transform:translateX(-50%);font-family:var(--mono);font-size:13px;letter-spacing:.32em;color:var(--amber);white-space:nowrap;opacity:var(--locked);animation:blink 1s step-end infinite}
.acq{position:absolute;left:50%;top:calc(50% - min(140px,22vw) - 70px);transform:translateX(-50%);font-family:var(--mono);font-size:13px;letter-spacing:.32em;color:var(--ice);white-space:nowrap;opacity:calc(1 - var(--locked))}
.s-data{position:absolute;right:clamp(24px,6vw,96px);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:14px;font-family:var(--mono);font-size:12px;letter-spacing:.14em;--k:10}
.s-data div{display:flex;flex-direction:column;gap:3px;padding-left:14px;border-left:1px solid var(--line2)}
.s-data span:first-child{color:var(--muted);font-size:10px;letter-spacing:.2em}
.s-st{position:absolute;left:clamp(24px,6vw,96px);bottom:11vh;max-width:min(560px,88vw);display:flex;flex-direction:column;gap:16px}
.s-sub{margin:0;font-size:clamp(16px,1.4vw,20px);line-height:1.5;color:var(--muted);max-width:34ch}

/* ---------- 04 next ---------- */
.ch-next .stage{background:#030409}
.ch-next .stage::after{content:'';position:absolute;left:0;right:0;bottom:0;height:22vh;background:linear-gradient(to bottom,transparent,#04060A);pointer-events:none;z-index:3}
.ch-next .stars{opacity:calc(0.3 + var(--p) * 0.7)}
.planet{position:absolute;left:50%;top:100%;transform:translate3d(0,calc(var(--p) * -42vh),0);will-change:transform;width:260vw;aspect-ratio:1/1;margin-left:-130vw;border-radius:50%;background:radial-gradient(circle at 50% 0%,#11294A 0%,#081325 12%,#04060A 30%);box-shadow:0 0 90px 18px rgba(124,196,255,0.32),inset 0 3px 0 rgba(160,214,255,0.85),inset 0 30px 60px rgba(124,196,255,0.25)}
.planet::after{content:'';position:absolute;inset:0;border-radius:50%;background-image:repeating-linear-gradient(90deg,rgba(124,196,255,0.07) 0 1px,transparent 1px 90px),repeating-linear-gradient(0deg,rgba(124,196,255,0.07) 0 1px,transparent 1px 90px);-webkit-mask-image:radial-gradient(circle at 50% 0%,#000,transparent 22%);mask-image:radial-gradient(circle at 50% 0%,#000,transparent 22%)}
.orbits{position:absolute;left:50%;top:46%;transform:translate3d(0,calc((1 - var(--p)) * 20vh),0);will-change:transform,opacity;width:0;height:0;opacity:clamp(0,calc(var(--p) * 3),1)}
.orb{position:absolute;left:0;top:0;transform:translate(-50%,-50%) rotate(var(--tilt)) scaleY(0.28)}
.orb-ring{position:relative;border-radius:50%;border:1px solid rgba(124,196,255,0.35);animation:spin var(--dur) linear infinite}
.sat{position:absolute;left:50%;top:-5px;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:var(--amber);box-shadow:0 0 14px 3px rgba(255,158,61,0.8)}
.nx{position:absolute;left:0;right:0;top:20vh;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;padding:0 24px}
.nx .statement{font-size:clamp(46px,7vw,124px)}
.nx-sub{margin:22px 0 0;font-size:clamp(16px,1.4vw,20px);line-height:1.55;color:var(--muted);max-width:40ch}

/* ---------- 05 join ---------- */
.ch-join{display:flex;flex-direction:column;justify-content:center;overflow:hidden;background:radial-gradient(ellipse 60% 50% at 50% 100%,rgba(255,158,61,0.12),transparent 70%)}
.pulse{position:absolute;left:50%;top:50%;width:300px;height:300px;margin:-150px 0 0 -150px;border-radius:50%;border:1px solid rgba(255,158,61,0.22);z-index:0;animation:pulse 4s cubic-bezier(.2,.6,.3,1) infinite;pointer-events:none}
.join{position:relative;z-index:2;max-width:760px;margin:0 auto;padding:120px 24px 64px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:22px}
.join-k{font-family:var(--mono);font-size:12px;letter-spacing:.22em;color:var(--amber)}
.join-title{font-family:var(--display);font-weight:700;font-size:clamp(46px,7vw,112px);line-height:.9;letter-spacing:-.02em;text-transform:uppercase;margin:0}
.join-sub{margin:0;font-size:18px;color:var(--muted)}
.form{width:100%;max-width:560px;margin-top:14px;display:flex;flex-wrap:wrap;gap:12px}
.form label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.form input{flex:1 1 260px;height:54px;padding:0 18px;background:rgba(255,255,255,0.03);border:1px solid var(--line2);border-radius:0;color:var(--text);font-family:var(--sans);font-size:16px;outline:none;transition:border-color .2s,box-shadow .2s}
.form input::placeholder{color:#6F7B8E}
.form input:focus{border-color:var(--amber);box-shadow:0 0 0 3px rgba(255,158,61,0.18)}
.form .btn{flex:0 0 auto;min-height:54px;padding:0 28px}
.err{margin:0;font-family:var(--mono);font-size:13px;color:#FFB669}
.done{display:flex;flex-direction:column;align-items:center;gap:10px;animation:fadeup .7s cubic-bezier(.2,.8,.2,1) both}
.done-k{font-family:var(--mono);font-size:12px;letter-spacing:.24em;color:var(--amber)}
.done-t{font-family:var(--display);font-weight:600;font-size:32px}
.done a{margin-top:6px;display:inline-flex;align-items:center;color:var(--ice);font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;min-height:44px;text-decoration:underline;text-underline-offset:4px}
.lk [hidden]{display:none !important}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
#join-form-wrap{width:100%;max-width:560px;display:flex;flex-direction:column;align-items:center;gap:14px}
.btn:disabled{opacity:.6;cursor:wait}
.foot{position:relative;z-index:2;border-top:1px solid var(--line);padding:24px 28px 72px;display:flex;flex-wrap:wrap;gap:10px 32px;justify-content:space-between;font-size:13px;color:var(--muted)}
.foot p{margin:0;max-width:70ch;line-height:1.6}

@keyframes type{from{width:0}}
@keyframes caret{50%{border-color:transparent}}
@keyframes ltr{from{opacity:0;transform:translateY(30%) scaleY(1.5);filter:blur(14px)}to{opacity:1;transform:none;filter:none}}
@keyframes tscan{0%{left:0;opacity:0}8%{opacity:1}100%{left:100%;opacity:0}}
@keyframes fadeup{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
@keyframes drawx{from{transform:scaleX(0)}}
@keyframes drawy{from{transform:scaleY(0)}}
@keyframes twinkle{from{opacity:.45}to{opacity:1}}
@keyframes floor{from{transform:perspective(520px) rotateX(64deg) translateY(-64px)}to{transform:perspective(520px) rotateX(64deg) translateY(0)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(124,196,255,0.7)}80%,100%{box-shadow:0 0 0 14px rgba(124,196,255,0)}}
@keyframes blink{50%{opacity:.25}}
@keyframes drip{to{transform:translateY(48px)}}
@keyframes pulse{0%{transform:scale(.3);opacity:0}20%{opacity:1}100%{transform:scale(4);opacity:0}}

@media (max-width:900px){
  .idx,.s-data{display:none}
  .tape{width:70px;height:240px;margin-top:-120px}
  .tape-k{top:calc(50% - 146px)}
  .bp{grid-template-columns:minmax(0,1fr);align-content:center;gap:12px;padding:84px 24px 48px}
  .bp-svg{order:-1;height:46vh}
}
@media (max-width:600px){
  .ch-century{--span:11000px}
  .card{width:min(230px,60vw);padding:16px 18px}
  .c-name{font-size:22px}
  .tags{flex-direction:column;gap:10px}
  .tags i{display:none}
  .tape-k{display:none}
  .hdg{top:132px}
  .callout{top:190px}
  .form .btn{flex:1 1 100%}
  .nav .btn{padding:0 14px;letter-spacing:.1em}
  .brand-sub,.status{display:none}
  .nav{padding:0 16px}
  .ch-label{left:16px}
  .tape{display:none}
}
@media (prefers-reduced-motion:reduce){
  .lk *,.lk *::before,.lk *::after{animation:none !important}
}
