*{box-sizing:border-box} :root{color-scheme:dark;--cyan:#71edff;--ink:#090b0d;--muted:#a8b1b6} body{margin:0;background:var(--ink);color:#f4f6f7;font:16px/1.6 system-ui,sans-serif} body.intro-active{overflow:hidden} button,a{-webkit-tap-highlight-color:transparent} button{font:inherit;cursor:pointer} a{color:inherit;text-decoration-thickness:1px;text-underline-offset:5px} :focus-visible{outline:2px solid var(--cyan);outline-offset:6px} ::selection{background:var(--cyan);color:#000} main{max-width:1320px;margin:auto;padding:0 clamp(24px,6vw,88px)} header{display:flex;justify-content:space-between;gap:24px;padding:30px 0;border-bottom:1px solid #30373b} header a{font-weight:650;text-decoration:none} header span,.note,footer{color:var(--muted);font-size:14px} .proposal{padding:clamp(64px,10vh,120px) 0 72px;max-width:850px} h1{font-size:clamp(34px,5.2vw,70px);font-weight:500;line-height:1.08;letter-spacing:-.035em;margin:0 0 28px;text-wrap:balance} .proposal>p{max-width:55ch;color:#c1c9cd} #replay{margin:24px 0;background:var(--cyan);border:0;border-radius:4px;color:#061114;padding:16px 24px;display:inline-flex;gap:40px;align-items:center} #replay:hover{background:#adf5ff} .proposal .note{font-size:14px;max-width:62ch} h2{font-size:22px;font-weight:500;margin:0 0 24px}.references>a{display:grid;grid-template-columns:1fr 1.7fr auto;gap:24px;padding:24px 0;border-top:1px solid #30373b;text-decoration:none;align-items:baseline}.references>a span:nth-child(2){color:var(--muted);font-size:14px}.references>a:hover{color:var(--cyan)}footer{padding:48px 0}.intro[hidden]{display:none}.intro{position:fixed;inset:0;z-index:10;overflow:hidden;background:transparent;display:grid;place-items:center}.panel{position:absolute;top:0;bottom:0;width:50.1%;background:#000;will-change:transform;transition:transform 950ms cubic-bezier(.76,0,.24,1)}.panel-left{left:0}.panel-right{right:0}#skip{position:absolute;right:clamp(24px,4vw,64px);bottom:32px;background:#000;color:#c9d1d6;border:1px solid #43494c;border-radius:4px;padding:10px 18px}#skip:hover{color:#fff;border-color:var(--cyan)}.intro-caption{position:absolute;top:22px;left:clamp(24px,4vw,64px);font-size:12px;letter-spacing:.14em;color:#a8b1b6}.beam{position:absolute;z-index:2;top:0;bottom:0;left:50%;width:2px;background:var(--cyan);transform:scaleY(0);transition:transform 250ms ease,opacity 500ms ease;pointer-events:none}.intro.is-cut .beam{transform:scaleY(1)}.intro.is-cut video,.intro.is-cut #skip,.intro.is-cut .intro-caption{opacity:0;pointer-events:none}.intro.is-open .panel-left{transform:translateX(-100%)}.intro.is-open .panel-right{transform:translateX(100%)}.intro.is-open .beam{opacity:0} @media(max-width:650px){header{font-size:14px}.references>a{grid-template-columns:1fr auto;gap:8px}.references>a span:nth-child(2){grid-column:1;grid-row:2}.references>a span:last-child{grid-column:2;grid-row:1}#skip{bottom:24px}.proposal{padding-top:64px}} @media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* The source video itself fills the entire viewport. */

.panel{background:#010106}


.beam{z-index:3}#skip,.intro-caption{z-index:4}
.intro.is-cut 
.demo-controls{display:flex;flex-wrap:wrap;gap:16px;align-items:center;margin:24px 0}
.demo-controls #replay{margin:0}
#lift{border:1px solid #71edff;background:transparent;color:#71edff;padding:16px 24px;border-radius:4px}
#lift:hover{background:#12252c}
.intro[data-variant="lift"]{transition:transform 1000ms cubic-bezier(.76,0,.24,1);background:#010106}
.intro[data-variant="lift"].is-cut video{opacity:1}
.intro[data-variant="lift"] .beam{display:none}
.intro[data-variant="lift"].is-open{transform:translateY(-100%)}
.intro[data-variant="lift"].is-open .panel{transform:none}
@media(prefers-reduced-motion:reduce){.intro{transition:none!important}}





#logo-video{position:absolute;inset:0;z-index:2;width:100%;height:100%;object-fit:cover;object-position:center;opacity:1;transition:opacity 220ms ease}