@font-face{font-family:Archivo;src:url('../assets/ArchivoBlack-Regular.ttf') format('truetype');font-weight:900;font-display:swap}
@font-face{font-family:Chakra;src:url('../assets/ChakraPetch-SemiBold.ttf') format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:Inter;src:url('../assets/Inter-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
:root{color-scheme:dark;--jet:#0a0a0c;--surface:#141419;--volt:#c8ff00;--white:#fff;--steel:#a4a5ae;--line:#303038;--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}body{margin:0;background:var(--jet);color:var(--white);font-family:Inter,Arial,sans-serif}a{color:inherit}button,a,summary{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--volt);outline-offset:6px}button{font:inherit}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.masthead{max-width:1720px;margin:auto;min-height:86px;padding:23px 4.5%;display:flex;align-items:center;justify-content:space-between;gap:25px}.brand{display:block;line-height:0}.brand img{width:150px;height:auto;display:block}.masthead p{margin:0;font:600 11px Chakra,Arial,sans-serif;text-transform:uppercase;letter-spacing:.12em;color:#bebec6}.masthead p span{padding:0 8px;color:var(--volt)}.back{font-size:12px;text-decoration:none}.back span{display:inline-block;margin-left:14px;font-size:18px}.back:hover{color:var(--volt)}
main{max-width:1600px;margin:0 auto 36px;padding:0 24px}.stage{position:relative;isolation:isolate;overflow:hidden;aspect-ratio:16/9;min-height:620px;background:#0d0d10;border:1px solid #28282e}.ambient{position:absolute;inset:0;z-index:-3;background:radial-gradient(ellipse at 76% 42%,#272b23 0,rgba(22,24,22,.7) 21%,transparent 51%),linear-gradient(115deg,#141418,#08080a 53%,#17191a)}.grain{position:absolute;inset:0;opacity:.13;z-index:-2;background-image:repeating-linear-gradient(120deg,transparent 0 3px,#62646c 3px 4px);mask-image:linear-gradient(90deg,transparent 30%,#000)}.plane{position:absolute;inset:0;z-index:-1;pointer-events:none}.plane-one{clip-path:polygon(62% 0,70% 0,40% 100%,32% 100%);background:linear-gradient(160deg,rgba(255,255,255,.025),transparent 75%)}.plane-two{clip-path:polygon(91% 0,92% 0,63% 100%,62% 100%);background:linear-gradient(160deg,rgba(200,255,0,.25),transparent 85%)}.circuit{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}.track{fill:none;stroke:#424942;stroke-width:1.25;opacity:.6}.dim{opacity:.35}.signal{fill:none;stroke:var(--volt);stroke-width:1.6;stroke-dasharray:.09 .91;stroke-dashoffset:0;opacity:.7}
.chapter{position:relative;z-index:3;margin:40px 0 0 6.5%;width:51%}.eyebrow{font:600 11px Chakra,Arial,sans-serif;letter-spacing:.2em;display:flex;align-items:center;gap:16px;margin:0 0 20px}.chapter-number{color:var(--volt);font-size:14px;letter-spacing:.05em}.chapter h2{margin:0 0 20px;padding:0 .1em .04em 0;font:900 italic clamp(48px,5.9vw,94px)/.91 Archivo,Impact,sans-serif;letter-spacing:-.055em}.chapter h2 em{font:inherit;color:var(--volt)}.chapter-line{margin:0;max-width:390px;color:#d0d0d7;font-size:15px;line-height:1.55;letter-spacing:-.015em}
.fan{position:absolute;inset:0;z-index:2;pointer-events:none;perspective:1400px}.fan-halo{position:absolute;left:54%;top:17%;width:41%;height:70%;border-radius:50%;background:radial-gradient(ellipse,rgba(200,255,0,.075),transparent 69%);filter:blur(14px)}.slab{position:absolute;width:26%;margin:0;top:17%;left:56.5%;transform-origin:50% 78%;filter:drop-shadow(0 25px 17px rgba(0,0,0,.65));will-change:transform}.slab img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:contain}.slab-wemb{z-index:3;transform:translate(-2%,-2%) rotate(-4deg) rotateY(-7deg)}.slab-wemb img{clip-path:polygon(15.1% .8%,82.8% .9%,84.5% 1.8%,85% 3%,87.3% 89.9%,85.9% 90.8%,17.2% 90.8%,15.8% 89.8%,12.2% 4%,13% 2.2%)}.slab-lebron{z-index:1;transform:translate(-31%,5%) rotate(-18deg) rotateY(-9deg)}.slab-lebron img{clip-path:polygon(13.4% .7%,82.4% .9%,84.1% 2%,80% 83.1%,78.7% 84%,16.6% 83.9%,15.2% 82.8%,11.7% 2.7%)}.slab-kobe{z-index:2;transform:translate(38%,9%) rotate(14deg) rotateY(5deg)}.slab-kobe img{clip-path:polygon(4.6% 6%,87.8% 2.4%,89.7% 3.1%,90.3% 4.5%,85.9% 87.4%,84.6% 88.3%,25.2% 91%,23.7% 90.5%,3.6% 8.3%,3.8% 7.1%)}
.stage-foot{position:absolute;bottom:4%;left:6.5%;right:5%;display:flex;justify-content:space-between;align-items:center;gap:16px;z-index:4}.stage-foot p{margin:0;font:600 10px Chakra,Arial,sans-serif;letter-spacing:.12em;color:#a9aab1}.stage-foot p:first-child{color:#d7d7dd;letter-spacing:.19em}.stage-foot span{padding:0 7px;color:var(--volt)}
.transport{display:flex;align-items:flex-start;gap:40px;padding:23px 0 18px}.controls{display:flex;align-items:center;gap:10px;flex-shrink:0}.controls button{height:40px;min-width:88px;display:inline-flex;align-items:center;justify-content:center;gap:9px;border:1px solid #3c3c44;background:#17171c;color:#fff;border-radius:4px;font-size:12px;cursor:pointer}.controls button:hover{background:#26272b;border-color:#72747a}.controls button:disabled{opacity:.45;cursor:default}.controls button:first-child{background:var(--volt);border-color:var(--volt);color:#0a0a0c}.controls button:first-child:hover{background:#ddff65}.play-symbol{font-family:Arial,sans-serif;font-weight:bold;font-size:13px;width:12px}.runtime{font:600 11px Chakra,Arial,sans-serif;min-width:83px;margin-left:8px;font-variant-numeric:tabular-nums}.runtime>span+span{color:#777;margin:0 3px}.progress-group{flex:1;padding-top:8px}.progress{height:2px;background:#33333a;position:relative;overflow:hidden}.progress span{position:absolute;inset:0;background:var(--volt);transform:scaleX(0);transform-origin:0 50%}.chapter-ticks{margin-top:11px;display:grid;grid-template-columns:34.375% 34.375% 31.25%;font:600 9px Chakra,Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--steel)}.chapter-ticks span:last-child{text-align:right}
.study-note{display:flex;justify-content:space-between;gap:32px;border-top:1px solid #25252b;padding:16px 0 0}.study-note p{margin:0;color:var(--steel);font-size:11px;line-height:1.55;max-width:470px}.study-note p:last-child{text-align:right}.reduced-note{display:none}.source-note{margin:25px 0 0;padding-top:18px;border-top:1px solid #25252b;font-size:12px;color:#b7b7bf}.source-note summary{cursor:pointer;width:max-content;padding:3px 0}.source-note p{max-width:800px;font-size:12px;line-height:1.6}.source-links{display:flex;flex-wrap:wrap;gap:24px;line-height:1.8}.source-links a{text-underline-offset:4px}.source-links a:hover{color:var(--volt)}.no-script{font-size:12px;color:var(--steel)}
/* The default, script-free layout shows every chapter. Animation is progressive enhancement. */
body:not(.motion-on) .stage{min-height:850px;aspect-ratio:auto}body:not(.motion-on) .chapter{padding-bottom:15px;width:45%}body:not(.motion-on) .chapter h2{font-size:clamp(36px,3.6vw,57px)}body:not(.motion-on) .chapter h2 br{display:none}body:not(.motion-on) .fan{top:16%}body:not(.motion-on) .slab{left:62%;width:23%}body:not(.motion-on) .stage-foot{bottom:26px}
.motion-on .chapter{position:absolute;top:27%;left:6.5%;margin:0;width:51%;opacity:0}.motion-on .chapter-one{animation:chapter-one 16s linear infinite}.motion-on .chapter-two{animation:chapter-two 16s linear infinite}.motion-on .chapter-three{animation:chapter-three 16s linear infinite}.motion-on .slab-wemb{animation:fan-center 16s var(--ease) infinite}.motion-on .slab-lebron{animation:fan-left 16s var(--ease) infinite}.motion-on .slab-kobe{animation:fan-right 16s var(--ease) infinite}.motion-on .signal{animation:circuit-pass 16s linear infinite}.motion-on .fan-halo{animation:halo 16s var(--ease) infinite}
@keyframes chapter-one{0%,1%{opacity:0;transform:translateY(17px)}5%,30%{opacity:1;transform:translateY(0)}33%,97%{opacity:0;transform:translateY(-12px)}98%,100%{opacity:0;transform:translateY(17px)}}
@keyframes chapter-two{0%,33%{opacity:0;transform:translateY(17px)}37%,65%{opacity:1;transform:translateY(0)}68%,100%{opacity:0;transform:translateY(-12px)}}
@keyframes chapter-three{0%,68%{opacity:0;transform:translateY(17px)}72%,95%{opacity:1;transform:translateY(0)}99%,100%{opacity:0;transform:translateY(-12px)}}
@keyframes fan-center{0%{transform:translate(8%,6%) rotate(2deg) rotateY(-4deg) scale(.97)}7%,30%{transform:translate(-2%,-2%) rotate(-4deg) rotateY(-7deg) scale(1)}38%,65%{transform:translate(-1%,0) rotate(1deg) rotateY(5deg) scale(.95)}73%,95%{transform:translate(-2%,-3%) rotate(-4deg) rotateY(-7deg) scale(1.03)}100%{transform:translate(8%,6%) rotate(2deg) rotateY(-4deg) scale(.97)}}
@keyframes fan-left{0%{transform:translate(-9%,10%) rotate(-7deg) rotateY(-9deg) scale(.9)}8%,30%{transform:translate(-31%,5%) rotate(-18deg) rotateY(-9deg) scale(1)}38%,65%{transform:translate(-44%,4%) rotate(-15deg) rotateY(-6deg) scale(1)}73%,95%{transform:translate(-33%,7%) rotate(-18deg) rotateY(-9deg) scale(.97)}100%{transform:translate(-9%,10%) rotate(-7deg) rotateY(-9deg) scale(.9)}}
@keyframes fan-right{0%{transform:translate(15%,12%) rotate(4deg) rotateY(5deg) scale(.9)}9%,30%{transform:translate(38%,9%) rotate(14deg) rotateY(5deg) scale(1)}38%,65%{transform:translate(49%,5%) rotate(16deg) rotateY(8deg) scale(1.01)}73%,95%{transform:translate(36%,9%) rotate(13deg) rotateY(5deg) scale(.98)}100%{transform:translate(15%,12%) rotate(4deg) rotateY(5deg) scale(.9)}}
@keyframes circuit-pass{0%,24%{stroke-dashoffset:.15;opacity:0}27%{opacity:.8}58%{stroke-dashoffset:-.95;opacity:.8}61%,100%{stroke-dashoffset:-.95;opacity:0}}
@keyframes halo{0%,30%{opacity:.7}40%,65%{opacity:1}75%,100%{opacity:.7}}
@media(min-width:1680px){.chapter h2{font-size:94px}}
@media(max-width:900px){.masthead{padding:22px 24px}.masthead p{font-size:9px;letter-spacing:.07em}.masthead p span{padding:0 3px}.brand img{width:120px}.back{font-size:11px}.back span{margin-left:4px}.stage{min-height:510px}.chapter h2{font-size:clamp(40px,6vw,62px)}.chapter-line{font-size:12px;max-width:270px}.eyebrow{font-size:9px;letter-spacing:.13em;gap:9px}.slab{width:28%;left:56%;top:24%}.stage-foot p{font-size:8px}.transport{gap:24px}.runtime{display:none}.study-note{gap:18px}.study-note p{font-size:10px}}
@media(max-width:600px){.masthead{padding:18px 20px;min-height:94px;gap:14px;flex-wrap:wrap}.brand img{width:115px}.masthead p{order:3;width:100%;text-align:left;font-size:9px}.back{font-size:11px}main{padding:0 12px;margin-bottom:26px}.stage{height:650px;min-height:0;aspect-ratio:auto}.motion-on .chapter{top:43px;left:7%;width:88%}.chapter h2{font-size:clamp(43px,11.9vw,70px);line-height:.94;margin-bottom:14px}.chapter h2 br{display:none}.chapter-one h2{max-width:330px}.chapter-two h2{max-width:350px}.chapter-three h2{max-width:340px}.eyebrow{font-size:9px;letter-spacing:.14em;margin-bottom:16px}.chapter-line{font-size:12px;line-height:1.5;max-width:300px}.slab{width:42%;left:28%;top:43%}.fan-halo{left:7%;top:33%;width:86%;height:60%}.stage-foot{bottom:22px;left:7%;right:7%;align-items:flex-start;flex-direction:column;gap:8px}.stage-foot p{font-size:8px;letter-spacing:.09em}.stage-foot p:first-child{letter-spacing:.15em}.circuit{opacity:.65}.transport{flex-direction:column;gap:17px;padding:18px 4px}.controls{width:100%}.controls button{height:42px;min-width:87px}.runtime{display:inline;margin-left:auto}.progress-group{width:100%;padding-top:0}.chapter-ticks{font-size:8px;letter-spacing:.03em;grid-template-columns:32% 31% 37%}.study-note{display:block;padding:15px 4px 0}.study-note p{font-size:10px;max-width:100%}.study-note p:last-child{text-align:left;margin-top:7px}.source-note{margin:20px 4px 0}.source-links{flex-direction:column;gap:8px}body:not(.motion-on) .stage{min-height:1060px}body:not(.motion-on) .chapter{width:86%;margin:28px 7% 0}body:not(.motion-on) .chapter h2{font-size:38px;line-height:1}body:not(.motion-on) .chapter-line{font-size:12px}body:not(.motion-on) .fan{top:58%;bottom:0}body:not(.motion-on) .slab{top:4%;left:28%;width:42%}}
@media(prefers-reduced-motion:reduce){.motion-note{display:none}.reduced-note{display:block}.signal{stroke-dasharray:none;opacity:.16}.slab{will-change:auto}.progress-group{display:none}.transport{padding-bottom:16px}.controls .runtime{display:none}}

.slab img{clip-path:none}

/* v2.2: preserve the complete clear-case silhouettes during native motion. */
.slab-wemb img{clip-path:inset(4.0% 14.4% 5.3% 14.3% round 2.2%)}
.slab-kobe img{clip-path:inset(3.8% 12.1% 5.0% 12.1% round 2.2%)}