:root {
  --ink:#11110f;
  --paper:#f4f1eb;
  --soft:#faf9f6;
  --line:rgba(17,17,15,.15);
  --muted:#6e6d67;
  --orange:#ff5b2e;
  --blue:#5167ff
}

* {
  box-sizing:border-box
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:76px
}

body {
  margin:0;
  background:var(--soft);
  color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,Helvetica,sans-serif
}

a {
  color:inherit;
  text-decoration:none
}

img {
  display:block;
  max-width:100%
}

#site-shell {
  background:var(--soft);
  position:relative;
  z-index:101
}

/* Apple-style sticky scroll stage: 400vh yields a 300vh animation travel. */
.intro-scroll {
  --intro-track:400vh;
  height:var(--intro-track);
  position:relative;
  z-index:100
}

.intro-screen {
  align-items:center;
  background:
    radial-gradient(circle at 18% 22%,rgba(255,79,37,.14),transparent 34%),
    radial-gradient(circle at 82% 68%,rgba(91,75,205,.18),transparent 38%),
    #07070a;
  color:#fff;
  display:flex;
  height:100vh;
  height:100svh;
  isolation:isolate;
  justify-content:center;
  overflow:hidden;
  padding:40px;
  position:-webkit-sticky;
  position:sticky;
  top:0;
  width:100%
}

.intro-screen[hidden] {
  display:none
}

/* A matching backdrop rises beneath the word mask before the video planes are
   removed. This keeps the hand-off continuous instead of exposing the wall or
   snapping directly to black. */
.intro-enhanced .intro-screen::after {
  background:
    radial-gradient(circle at 18% 22%,rgba(255,79,37,.14),transparent 34%),
    radial-gradient(circle at 82% 68%,rgba(91,75,205,.18),transparent 38%),
    #07070a;
  content:"";
  inset:0;
  opacity:var(--blackout-opacity,0);
  pointer-events:none;
  position:absolute;
  z-index:2
}

/* Apple ChipHero structure: the background stays fixed while a black/white
   multiply layer scales from an extreme crop to the complete wordmark. */
.logo-mask-layer {
  align-items:center;
  background:#000;
  display:flex;
  inset:0;
  justify-content:center;
  mix-blend-mode:multiply;
  opacity:var(--word-mask-opacity,var(--mask-opacity,1));
  overflow:hidden;
  pointer-events:none;
  position:absolute;
  z-index:3;
  will-change:opacity
}

.logo-mask-text {
  color:#fff;
  flex-shrink:0;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue",Arial,sans-serif;
  font-size:clamp(310px,35vw,600px);
  font-weight:700;
  letter-spacing:0;
  line-height:1.06;
  margin:0;
  position:relative;
  text-rendering:geometricPrecision;
  transform:translate(var(--mask-x,0px),var(--mask-y,0px)) scale(var(--mask-scale,100));
  transform-origin:var(--mask-origin-x,50%) 50%;
  white-space:nowrap;
  -webkit-font-smoothing:antialiased
}

.intro-fallback .logo-mask-layer {
  display:none
}

.intro-fallback .intro-screen::before {
  background:rgba(0,0,0,.56);
  content:"";
  inset:0;
  pointer-events:none;
  position:absolute;
  z-index:2
}

.intro-fallback .intro-screen {
  --blackout-opacity:0;
  --copy-opacity:1;
  --copy-y:0px;
  --hint-opacity:0;
  --mask-opacity:1;
  --slot-opacity:1
}

/* The video plane stays fixed while the word mask scales above it. */
.intro-video-plane {
  contain:strict;
  inset:0;
  overflow:hidden;
  position:absolute;
  transform:translateZ(0)
}

.intro-video-wall {
  filter:brightness(var(--grid-brightness,1));
  opacity:1;
  pointer-events:none;
  transform:translateZ(0);
  will-change:filter;
  z-index:1
}

/* As the supporting copy appears, the moving worlds settle into a quiet,
   shadowed backdrop. The shade is scroll-driven and has no pointer behavior. */
.intro-video-wall::after {
  background:
    radial-gradient(ellipse at 50% 46%,rgba(7,7,10,.3),rgba(7,7,10,.7)),
    rgba(7,7,10,.18);
  content:"";
  inset:0;
  opacity:var(--grid-shade-opacity,0);
  pointer-events:none;
  position:absolute;
  z-index:2
}

/* A complete alternate layer is revealed with a speed-dependent capsule path.
   The front and trailing points move at different rates, so fast mouse movement
   naturally stretches the reveal while slow movement settles into a circle. */
.intro-video-lens {
  --lens-accent:#ff7048;
  --lens-accent-2:#606cff;
  clip-path:circle(0 at 50% 50%);
  inset:0;
  opacity:0;
  pointer-events:none;
  transition:opacity .24s ease;
  -webkit-clip-path:circle(0 at 50% 50%);
  will-change:clip-path,opacity;
  z-index:5
}

.intro-screen.is-settled.is-pointer-active .intro-video-lens {
  opacity:1
}

.intro-lens-media,
.intro-lens-video,
.intro-lens-canvas {
  height:100%;
  inset:0;
  position:absolute;
  width:100%
}

.intro-lens-content-stage {
  align-items:center;
  box-sizing:border-box;
  display:flex;
  height:100vh;
  height:100svh;
  justify-content:center;
  left:0;
  padding:40px;
  pointer-events:none;
  position:absolute;
  top:0;
  width:100vw;
  z-index:2
}

.intro-content--lens {
  color:#fff4e8;
  z-index:0
}

.intro-content--lens .intro-kicker {
  color:rgba(255,244,232,.7);
  mix-blend-mode:normal
}

.intro-content--lens .intro-paper-title,
.intro-content--lens .intro-authors {
  color:#fff4e8;
  mix-blend-mode:normal;
  text-shadow:0 3px 18px rgba(5,7,12,.38)
}

.intro-content--lens .intro-affiliations {
  color:rgba(255,244,232,.76);
  mix-blend-mode:normal
}

.intro-enhanced .intro-content--lens .logo-slot {
  background:none!important;
  color:#fff4e8!important;
  text-shadow:none;
  -webkit-text-fill-color:#fff4e8!important;
  -webkit-text-stroke:0 transparent!important
}

.intro-content--lens .project-link,
.intro-content--lens .project-link:first-child {
  background:rgba(255,255,255,.7);
  border-color:rgba(8,9,11,.5);
  color:#08090b
}

.intro-content--lens .project-link .icon img,
.intro-content--lens .project-link:first-child .icon img,
.intro-content--lens .project-link .icon--huggingface img {
  filter:brightness(0)
}

.intro-lens-media {
  background:#07070a;
  height:100vh;
  height:100svh;
  inset:0;
  width:100vw;
  z-index:0
}

.intro-lens-canvas {
  display:block;
  filter:none
}

.intro-video-lens::before {
  display:none
}

.intro-video-lens::after {
  display:none
}

.intro-lens-video {
  display:none
}

.intro-lens-copy {
  align-items:center;
  color:#090a0d;
  display:none;
  flex-direction:column;
  left:50%;
  pointer-events:none;
  position:absolute;
  text-align:center;
  text-shadow:none;
  top:50%;
  transform:translate(-50%,-50%);
  width:min(70vw,420px);
  z-index:2
}

.intro-lens-copy::before,
.intro-lens-copy::after {
  border:1px solid rgba(255,255,255,.3);
  border-radius:50%;
  content:"";
  height:calc(var(--lens-radius) * 1.18);
  left:50%;
  position:absolute;
  top:50%;
  transform:translate(-50%,-50%) rotate(-14deg) scaleY(.46);
  width:calc(var(--lens-radius) * 1.18)
}

.intro-lens-copy::after {
  border-color:rgba(255,255,255,.16);
  transform:translate(-50%,-50%) rotate(22deg) scaleY(.58);
  width:calc(var(--lens-radius) * 1.48)
}

.intro-lens-copy span,
.intro-lens-copy small {
  background:rgba(255,255,255,.82);
  border:1px solid rgba(255,255,255,.7);
  border-radius:999px;
  box-shadow:0 8px 28px rgba(0,0,0,.15);
  font:9px monospace;
  letter-spacing:.18em;
  padding:6px 10px;
  position:relative;
  z-index:1
}

.intro-lens-copy strong {
  background:rgba(255,255,255,.9);
  border:1px solid rgba(255,255,255,.82);
  border-radius:999px;
  box-shadow:0 12px 38px rgba(0,0,0,.2);
  font-size:clamp(24px,3vw,46px);
  font-weight:620;
  letter-spacing:-.045em;
  line-height:1;
  margin:12px 0 14px;
  padding:.2em .48em .25em;
  position:relative;
  z-index:1
}

.intro-lens-copy small {
  color:rgba(9,10,13,.68);
  font-size:8px
}

.intro-screen.is-settled.is-pointer-active {
  cursor:default
}

.intro-screen.is-settled.is-pointer-active:active {
  cursor:default
}

.intro-screen.is-settled.is-pointer-active a,
.intro-screen.is-settled.is-pointer-active button {
  cursor:pointer
}

.intro-world-cursor {
  --cursor-x:-100px;
  --cursor-y:-100px;
  display:none;
  height:30px;
  left:0;
  opacity:0;
  pointer-events:none;
  position:absolute;
  top:0;
  transform:translate3d(var(--cursor-x),var(--cursor-y),0) translate(-50%,-50%);
  transition:opacity .18s ease;
  width:34px;
  will-change:transform;
  z-index:9
}

.intro-screen.is-pointer-active .intro-world-cursor {
  opacity:1
}

.intro-world-cursor::before,
.intro-world-cursor::after {
  content:"";
  position:absolute
}

.intro-world-cursor::before {
  border:1px solid rgba(255,244,232,.82);
  border-radius:50%;
  box-shadow:0 0 10px rgba(255,244,232,.13),inset 0 0 8px rgba(255,244,232,.06);
  inset:7px 2px;
  transform:rotate(-18deg);
  transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease
}

.intro-world-cursor::after {
  background:radial-gradient(circle,rgba(255,154,114,.22),transparent 68%);
  border-radius:50%;
  height:20px;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:20px
}

.intro-world-cursor i {
  background:#fff4e8;
  border-radius:50%;
  box-shadow:0 0 5px rgba(255,244,232,.95),0 0 13px rgba(255,154,114,.58);
  height:6px;
  left:50%;
  position:absolute;
  top:50%;
  transform:translate(-50%,-50%);
  transition:background .2s ease,box-shadow .2s ease,transform .2s ease;
  width:6px;
  z-index:2
}

.intro-world-cursor span {
  animation:intro-cursor-planet 2.8s linear infinite;
  background:#ff6a3d;
  border-radius:50%;
  box-shadow:0 0 6px rgba(255,106,61,.82);
  height:4px;
  left:50%;
  position:absolute;
  top:50%;
  transition:opacity .2s ease;
  width:4px;
  z-index:3
}

.intro-screen.is-cursor-interactive .intro-world-cursor::before {
  border-color:#ff9a72;
  box-shadow:0 0 12px rgba(255,106,61,.26);
  transform:rotate(-18deg) scale(.74)
}

.intro-screen.is-cursor-interactive .intro-world-cursor i {
  background:#ff9a72;
  box-shadow:0 0 7px rgba(255,106,61,.9),0 0 15px rgba(255,106,61,.48);
  transform:translate(-50%,-50%) scale(1.35)
}

.intro-screen.is-cursor-interactive .intro-world-cursor span {
  opacity:0
}

.intro-cursor-trail {
  --trail-x:-100px;
  --trail-y:-100px;
  display:none;
  background:radial-gradient(circle at 34% 28%,rgba(255,255,255,.52),rgba(255,255,255,.12) 40%,transparent 72%);
  border:1px solid rgba(255,255,255,.24);
  border-radius:50%;
  filter:blur(.2px);
  height:14px;
  left:0;
  opacity:0;
  pointer-events:none;
  position:absolute;
  top:0;
  transform:translate3d(var(--trail-x),var(--trail-y),0) translate(-50%,-50%);
  transition:opacity .28s ease;
  width:14px;
  will-change:transform;
  z-index:7
}

.intro-screen.is-pointer-active .intro-cursor-trail {
  opacity:.72
}

@keyframes intro-cursor-planet {
  0% {opacity:.72;transform:translate(-50%,-50%) translate(13px,-4px) scale(.82)}
  25% {opacity:1;transform:translate(-50%,-50%) translate(2px,5px) scale(1.12)}
  50% {opacity:.78;transform:translate(-50%,-50%) translate(-13px,4px) scale(.88)}
  75% {opacity:.48;transform:translate(-50%,-50%) translate(-2px,-5px) scale(.66)}
  100% {opacity:.72;transform:translate(-50%,-50%) translate(13px,-4px) scale(.82)}
}

.intro-video-grid {
  background:#07070a;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-template-rows:repeat(4,minmax(0,1fr));
  height:100%;
  position:relative;
  transform:translate3d(0,0,0) scale(2);
  transform-origin:50% 50%;
  transition:transform 6.4s cubic-bezier(.16,.72,.18,1);
  width:100%;
  will-change:transform;
  z-index:0
}

.intro-screen.is-grid-ready .intro-video-grid {
  transform:translate3d(0,0,0) scale(1)
}

/* Every tile keeps the original H3 video from the opening close-up through the
   final 4x4 view. There is no canvas resampling or mid-animation media swap. */
.intro-video-tile {
  background:#07070a;
  min-height:0;
  min-width:0;
  opacity:0;
  overflow:hidden;
  position:relative;
  transform:translateZ(0);
  transition:opacity .32s ease;
  will-change:opacity
}

.intro-video-tile.is-visible {
  opacity:1
}

.intro-video-tile video {
  display:block;
  height:100%;
  object-fit:cover;
  transform:scale(1.003);
  width:100%
}

.intro-video-tile.is-media-error::after {
  background:#07070a;
  content:"";
  inset:0;
  position:absolute
}

.logo-mask-layer.is-hidden,
.intro-video-wall.is-hidden {
  visibility:hidden
}

/* Placeholder that reserves the wordmark's final position. The mask uses
   the same system display face so the hand-off stays aligned. */
.logo-slot {
  animation:intro-gradient 6s ease-in-out infinite;
  background:linear-gradient(100deg,#ff542e 0%,#ff9a5a 24%,#5965ff 53%,#ba6fd4 76%,#ff542e 100%);
  background-clip:text;
  background-size:300% 300%;
  color:transparent;
  display:block;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue",Arial,sans-serif;
  font-size:clamp(82px,9.2vw,158px);
  font-weight:700;
  letter-spacing:0;
  line-height:1.06;
  margin-bottom:-.14em;
  opacity:var(--slot-opacity,0);
  padding:0 .06em .14em;
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent
}

.intro-enhanced .logo-slot {
  animation:none;
  background:none;
  opacity:var(--slot-opacity,0)!important;
  transition:color .35s ease,-webkit-text-fill-color .35s ease;
  -webkit-text-fill-color:transparent;
  -webkit-text-stroke:0 transparent
}

.intro-enhanced .intro-screen.is-settled .logo-slot {
  color:#fff4e8;
  text-shadow:none;
  -webkit-text-fill-color:#fff4e8;
  -webkit-text-stroke:0 transparent
}

.intro-enhanced .intro-screen.is-pointer-active .logo-slot {
  -webkit-text-stroke:0 transparent
}

.intro-fallback .logo-slot {
  animation:none;
  background:none;
  color:#fff4e8;
  text-shadow:none;
  -webkit-text-fill-color:#fff4e8
}

.intro-hint {
  color:rgba(255,255,255,.55);
  inset:0;
  opacity:var(--hint-opacity,1);
  position:absolute;
  pointer-events:none;
  z-index:5
}

.intro-start-cue {
  inset:0;
  opacity:0;
  position:absolute;
  transition:opacity .75s ease .62s
}

.intro-screen.is-grid-ready .intro-start-cue {
  opacity:1
}

.intro-start-logo {
  align-items:center;
  display:flex;
  gap:14px;
  left:50%;
  position:absolute;
  top:50%;
  transform:translate(-50%,-50%);
  white-space:nowrap
}

.intro-start-logo .mark {
  --earth-size:5px;
  --jupiter-size:7px;
  --orbit-earth-h:11px;
  --orbit-earth-w:24px;
  --orbit-jupiter-h:17px;
  --orbit-jupiter-w:36px;
  --orbit-saturn-h:23px;
  --orbit-saturn-w:47px;
  --saturn-size:6px;
  --sun-size:12px;
  background:rgba(7,7,10,.82);
  border:1px solid rgba(255,255,255,.24);
  box-shadow:0 10px 36px rgba(0,0,0,.28);
  height:52px;
  width:52px
}

.intro-start-logo .solar-sun {
  animation:solar-pulse 2.8s ease-in-out infinite
}

.intro-start-logo .solar-planet {
  will-change:transform,opacity,filter
}

.intro-start-logo strong {
  color:#fff;
  font-size:22px;
  font-weight:750;
  letter-spacing:.2em
}

.intro-start-prompt {
  font:11px monospace;
  left:50%;
  letter-spacing:.22em;
  position:absolute;
  top:calc(50% + 88px);
  transform:translateX(-50%);
  white-space:nowrap
}

.intro-hint i {
  animation:hint-slide 1.7s ease-in-out infinite;
  background:linear-gradient(#2385ff,transparent);
  display:block;
  height:34px;
  left:50%;
  position:absolute;
  top:calc(50% + 118px);
  transform:translateX(-50%);
  width:1px
}

@keyframes hint-slide {
  0%,100% {opacity:.25;transform:translate(-50%,-5px)}
  50% {opacity:1;transform:translate(-50%,4px)}
}

@keyframes solar-pulse {
  0%,100% {box-shadow:0 0 6px rgba(255,139,60,.72),0 0 13px rgba(255,92,42,.22);filter:brightness(.98);transform:translate(-50%,-50%) scale(.97)}
  50% {box-shadow:0 0 10px rgba(255,201,111,.92),0 0 22px rgba(255,92,42,.42);filter:brightness(1.1);transform:translate(-50%,-50%) scale(1.05)}
}

.intro-content {
  align-items:center;
  display:flex;
  height:100%;
  justify-content:center;
  max-width:1300px;
  position:relative;
  text-align:center;
  width:100%;
  z-index:4
}

.intro-content .intro-kicker,
.intro-content .intro-paper-title,
.intro-content .intro-authors,
.intro-content .intro-project-links {
  opacity:var(--copy-opacity,0)
}

.intro-content .intro-kicker,
.intro-content .intro-authors,
.intro-content .intro-project-links {
  transform:translate3d(var(--content-x,0px),calc(var(--copy-y,18px) + var(--copy-lift,0px)),0)
}

.intro-content .intro-paper-title {
  transform:translate3d(0,calc(var(--copy-y,18px) + var(--copy-lift,0px)),0)
}

.intro-kicker {
  color:rgba(255,244,232,.68);
  font:10px monospace;
  left:0;
  letter-spacing:.22em;
  margin:0;
  position:absolute;
  right:0;
  top:11vh
}

.intro-title {
  align-items:center;
  display:flex;
  flex-direction:column;
  margin:0;
  position:relative;
  transform:translate3d(var(--content-x,0px),var(--title-lift,0px),0);
  width:100%
}

.intro-content .intro-authors,
.intro-content .intro-project-links {
  --copy-lift:var(--support-lift,0px)
}

.intro-paper-title {
  color:#fff4e8;
  display:block;
  font-size:clamp(22px,2.4vw,38px);
  font-weight:520;
  left:0;
  letter-spacing:-.045em;
  line-height:1.08;
  margin-top:24px;
  position:absolute;
  right:0;
  top:100%
}


.intro-authors {
  color:rgba(255,244,232,.86);
  left:0;
  margin:0 auto;
  max-width:min(1320px,96vw);
  position:absolute;
  right:0;
  top:calc(50% + clamp(112px,calc(7.5vw + 24px),140px))
}

.intro-author-list {
  display:flex;
  flex-direction:column;
  gap:7px
}

.intro-authors p {
  align-items:baseline;
  display:flex;
  flex-wrap:nowrap;
  font-size:clamp(13px,1.15vw,16px);
  font-weight:520;
  gap:5px clamp(15px,1.7vw,26px);
  justify-content:center;
  line-height:1.22;
  margin:0
}

.intro-author-row > a,
.intro-author-row > .intro-author-static {
  color:inherit;
  text-decoration:none;
  transition:color .2s ease
}

.intro-authors .intro-author-row {
  line-height:1.06
}

.intro-author-row a:hover,
.intro-author-row a:focus-visible {
  color:#fff;
  outline:none
}

.intro-author-row > :not(:last-child):after {
  color:rgba(255,244,232,.42);
  content:",";
  margin-left:1px
}

.intro-authors sup {
  color:rgba(255,244,232,.88);
  font:8px monospace;
  margin-left:3px
}

.intro-authors .intro-affiliations {
  color:rgba(255,244,232,.68);
  font:12px monospace;
  gap:4px clamp(12px,1.4vw,21px);
  letter-spacing:.04em;
  margin-top:11px
}

.intro-authors .intro-affiliations sup {
  font-size:7px;
  margin:0 3px 0 0
}

.intro-content .intro-project-links {
  left:0;
  margin-top:0;
  pointer-events:none;
  position:absolute;
  right:0;
  top:calc(50% + clamp(216px,17vw,262px))
}

.intro-screen.is-settled .intro-project-links {
  pointer-events:auto
}

.intro-project-links .project-link {
  background:rgba(255,255,255,.04);
  border-color:rgba(255,255,255,.28);
  color:#fff4e8
}

.intro-project-links .project-link:first-child {
  border-color:rgba(255,255,255,.28);
  color:#fff4e8
}

.intro-project-links .project-link:hover {
  background:rgba(255,255,255,.1);
  border-color:rgba(255,255,255,.68)
}

.intro-project-links .icon img {
  filter:brightness(0) invert(1)
}

.intro-project-links .project-link:first-child .icon img {
  filter:brightness(0) invert(1)
}

.intro-project-links .icon--huggingface img {
  filter:none
}

.intro-project-links .icon--access {
  color:inherit;
  font-size:18px;
  font-weight:400;
  line-height:1
}

.intro-content .intro-project-links {
  gap:clamp(6px,.7vw,10px)
}

.intro-project-links .project-link {
  padding-left:clamp(13px,1.15vw,18px);
  padding-right:clamp(13px,1.15vw,18px)
}

.intro-enhanced .intro-video-lens .intro-content--lens .logo-slot {
  background:none!important;
  color:#fff4e8!important;
  text-shadow:none;
  -webkit-text-fill-color:#fff4e8!important;
  -webkit-text-stroke:0 transparent!important
}

.intro-video-lens .intro-content--lens .intro-authors,
.intro-video-lens .intro-content--lens .intro-authors span {
  color:#fff4e8
}

.intro-video-lens .intro-content--lens .intro-authors .intro-affiliations,
.intro-video-lens .intro-content--lens .intro-authors .intro-affiliations span {
  color:rgba(255,244,232,.76)
}

.intro-video-lens .intro-content--lens .intro-authors sup,
.intro-video-lens .intro-content--lens .intro-authors .intro-affiliations sup {
  color:#ff9a72
}

.intro-video-lens .intro-content--lens .intro-project-links .project-link,
.intro-video-lens .intro-content--lens .intro-project-links .project-link:first-child {
  background:rgba(255,255,255,.72);
  border-color:rgba(8,9,11,.52);
  color:#08090b
}

.intro-video-lens .intro-content--lens .intro-project-links .icon img,
.intro-video-lens .intro-content--lens .intro-project-links .icon--huggingface img {
  filter:brightness(0)
}

.intro-footnote {
  bottom:28px;
  color:rgba(255,244,232,.48);
  font:9px monospace;
  left:50%;
  letter-spacing:.18em;
  margin:0;
  opacity:var(--copy-opacity,0);
  position:absolute;
  transform:translateX(-50%);
  white-space:nowrap;
  z-index:4
}

@keyframes intro-gradient {
  0%,100% {background-position:0% 50%}
  50% {background-position:100% 50%}
}

.nav {
  align-items:center;
  background:rgba(250,249,246,.91);
  backdrop-filter:blur(18px);
  border-bottom:1px solid var(--line);
  display:grid;
  grid-template-columns:1fr auto 1fr;
  height:72px;
  padding:0 4vw;
  position:sticky;
  top:0;
  z-index:20
}

.brand {
  align-items:center;
  display:flex;
  font-size:13px;
  font-weight:800;
  gap:9px;
  letter-spacing:.16em;
  width:max-content
}

.mark {
  --earth-size:3px;
  --jupiter-size:4px;
  --orbit-earth-h:6px;
  --orbit-earth-w:11px;
  --orbit-jupiter-h:9px;
  --orbit-jupiter-w:17px;
  --orbit-saturn-h:12px;
  --orbit-saturn-w:23px;
  --saturn-size:3.5px;
  --sun-size:7px;
  align-items:center;
  background:radial-gradient(circle at 50% 50%,rgba(255,110,48,.16) 0,rgba(14,20,38,.92) 31%,#03050b 72%);
  border:1px solid rgba(255,255,255,.16);
  border-radius:50%;
  box-shadow:inset 0 0 10px rgba(74,110,210,.12);
  color:transparent;
  display:flex;
  height:26px;
  justify-content:center;
  overflow:hidden;
  position:relative;
  width:26px
}

.solar-sun {
  background:radial-gradient(circle at 38% 32%,#fff9c8 0 16%,#ffc45e 36%,#ff6935 72%,#e83c28 100%);
  border-radius:50%;
  box-shadow:0 0 5px rgba(255,139,60,.72),0 0 10px rgba(255,92,42,.2);
  content:"";
  height:var(--sun-size);
  left:50%;
  position:absolute;
  top:50%;
  transform:translate(-50%,-50%);
  width:var(--sun-size);
  will-change:transform,filter;
  z-index:3
}

.solar-orbit {
  --orbit-h:var(--orbit-earth-h);
  --orbit-tilt:-18deg;
  --orbit-w:var(--orbit-earth-w);
  border:1px solid rgba(198,216,255,.38);
  border-radius:50%;
  box-shadow:0 0 3px rgba(94,137,255,.12),inset 0 0 3px rgba(94,137,255,.08);
  height:var(--orbit-h);
  left:50%;
  position:absolute;
  top:50%;
  transform:translate(-50%,-50%) rotate(var(--orbit-tilt));
  width:var(--orbit-w);
  z-index:1
}

.solar-orbit--jupiter {
  --orbit-h:var(--orbit-jupiter-h);
  --orbit-tilt:10deg;
  --orbit-w:var(--orbit-jupiter-w);
  border-color:rgba(218,201,170,.33)
}

.solar-orbit--saturn {
  --orbit-h:var(--orbit-saturn-h);
  --orbit-tilt:-9deg;
  --orbit-w:var(--orbit-saturn-w);
  border-color:rgba(196,205,239,.27)
}

.solar-planet {
  background:
    radial-gradient(circle at 66% 60%,#52bf75 0 15%,transparent 16%),
    radial-gradient(circle at 34% 30%,#d9f7ff 0 9%,#59b8fa 27%,#1b65c8 62%,#061b54 100%);
  border:1px solid rgba(255,255,255,.7);
  border-radius:50%;
  box-shadow:inset -1px -1px 2px rgba(0,0,0,.58),0 0 3px rgba(72,167,255,.75);
  height:var(--earth-size);
  left:94%;
  position:absolute;
  top:28%;
  transform:translate(-50%,-50%);
  width:var(--earth-size)
}

.solar-planet--jupiter {
  background:
    radial-gradient(circle at 30% 25%,rgba(255,255,255,.72) 0 10%,transparent 28%),
    linear-gradient(180deg,#f4dba8 0 23%,#a96445 24% 38%,#efc17e 39% 60%,#8d4e38 61% 72%,#dca86e 73% 100%);
  box-shadow:inset -1px -1px 2px rgba(45,16,8,.65),0 0 3px rgba(231,181,116,.55);
  height:var(--jupiter-size);
  left:18%;
  top:78%;
  width:var(--jupiter-size)
}

.solar-planet--saturn {
  background:radial-gradient(circle at 34% 28%,#fff5c8 0 13%,#dfbd72 46%,#9b6d32 100%);
  box-shadow:inset -1px -1px 2px rgba(52,30,7,.58),0 0 3px rgba(232,201,135,.48);
  height:var(--saturn-size);
  left:72%;
  top:7%;
  width:var(--saturn-size)
}

.solar-planet--saturn:after {
  border:1px solid rgba(239,216,163,.9);
  border-radius:50%;
  content:"";
  height:45%;
  left:50%;
  position:absolute;
  top:50%;
  transform:translate(-50%,-50%) rotate(-18deg);
  width:185%
}

.navlinks {
  display:flex;
  font-size:13px;
  gap:32px
}

.navlinks a:hover {
  color:var(--orange)
}

.updates {
  font-size:13px;
  font-weight:700;
  justify-self:end
}

.updates b {
  color:var(--orange)
}

.project-links {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:center;
  margin-top:32px
}

.project-link {
  align-items:center;
  background:transparent;
  border:1px solid rgba(17,17,15,.16);
  border-radius:999px;
  display:flex;
  font-size:clamp(13px,1vw,16px);
  font-weight:520;
  gap:8px;
  justify-content:center;
  min-height:48px;
  padding:10px 18px;
  transition:.18s
}

.project-link:hover {
  border-color:rgba(17,17,15,.35);
  transform:translateY(-2px)
}

.project-link:first-child {
  border:1px solid rgba(17,17,15,.16);
  color:var(--ink)
}

.icon {
  align-items:center;
  background:transparent;
  border-radius:0;
  color:var(--ink);
  display:flex;
  height:22px;
  justify-content:center;
  width:22px
}

.icon img {
  height:19px;
  object-fit:contain;
  width:19px
}

.icon--arxiv img {
  height:16px;
  width:26px
}

.icon--huggingface img {
  height:22px;
  width:22px
}

.icon--modelscope img {
  filter:none!important;
  height:20px;
  width:20px
}

.project-link:first-child .icon {
  background:transparent;
  color:var(--ink)
}

.project-link:first-child .icon img {
  filter:none
}

.project-link small {
  color:#999891;
  font:8px monospace;
  letter-spacing:.08em;
  text-transform:uppercase
}

.stage {
  border-radius:28px 28px 0 0;
  height:min(63vw,790px);
  min-height:540px;
  overflow:hidden;
  position:relative
}

.stage-grid {
  display:grid;
  gap:3px;
  grid-template-columns:2fr 1fr 1fr;
  grid-template-rows:1.15fr .85fr;
  height:100%
}

.shot {
  overflow:hidden
}

.shot img {
  filter:saturate(.9) contrast(1.04);
  height:100%;
  object-fit:cover;
  width:100%
}

.shot-main {
  grid-row:1/3
}

.shot-city {
  grid-column:2/4
}

.shot-desert {
  grid-column:2
}

.shot-forest {
  grid-column:3
}

.stage:after {
  background:linear-gradient(180deg,rgba(6,8,12,.53),transparent 28%,transparent 54%,rgba(5,7,10,.78));
  content:"";
  inset:0;
  position:absolute
}

.stage-top,.stage-center,.stage-bottom {
  color:#fff;
  position:absolute;
  z-index:2
}

.stage-top {
  display:flex;
  font:10px monospace;
  justify-content:space-between;
  left:28px;
  letter-spacing:.12em;
  right:28px;
  top:25px
}

.stage-center {
  align-items:center;
  display:flex;
  font:clamp(11px,1.1vw,15px) monospace;
  gap:18px;
  left:50%;
  letter-spacing:.18em;
  top:47%;
  transform:translate(-50%,-50%)
}

.stage-center i {
  background:var(--orange);
  border-radius:50%;
  height:6px;
  width:6px
}

.stage-bottom {
  align-items:end;
  bottom:27px;
  display:flex;
  justify-content:space-between;
  left:28px;
  right:28px
}

.stage-bottom span {
  font:9px monospace;
  letter-spacing:.14em
}

.stage-bottom strong {
  display:block;
  font-size:clamp(24px,3vw,46px);
  letter-spacing:-.04em;
  margin-top:5px
}

section {
  padding:120px 5vw
}

.label {
  color:var(--muted);
  font:12px monospace;
  letter-spacing:.15em;
  margin-bottom:48px
}

.overview-section {
  background:#fff;
  padding-left:max(5vw,24px);
  padding-right:max(5vw,24px)
}

.overview-head {
  margin:auto;
  max-width:980px;
  text-align:center
}

.overview-head .label {
  margin-bottom:0
}

h2 {
  font-size:clamp(36px,4.2vw,64px);
  font-weight:550;
  letter-spacing:-.05em;
  line-height:1;
  margin:0
}

.showcase-video {
  aspect-ratio:16/9;
  background:#0b0b0a;
  border-radius:18px;
  box-shadow:0 22px 70px rgba(17,17,15,.14);
  margin:30px auto 0;
  max-width:1060px;
  overflow:hidden;
  position:relative
}

.showcase-video video {
  background:#0b0b0a;
  display:block;
  height:100%;
  object-fit:cover;
  width:100%
}

.showcase-video>span {
  background:rgba(10,10,9,.68);
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  color:#fff;
  font:8px monospace;
  left:16px;
  letter-spacing:.13em;
  padding:8px 11px;
  pointer-events:none;
  position:absolute;
  top:16px
}

.overview-copy {
  margin:54px auto 0;
  max-width:860px;
  text-align:left
}

.overview-copy p {
  color:rgba(17,17,15,.62);
  font-size:15px;
  font-weight:400;
  letter-spacing:0;
  line-height:1.55;
  margin:0
}

.overview-copy strong {
  color:#242422;
  font-weight:650
}

.stack {
  background:var(--ink);
  color:#fff;
  display:grid;
  gap:7vw;
  grid-template-columns:.82fr 1.18fr
}

.stack-head em {
  color:var(--orange);
  font-style:normal
}

.stack-head p,.section-head p {
  color:#8f8f89;
  font-size:17px;
  line-height:1.5;
  max-width:470px
}

.stack-list {
  border-top:1px solid rgba(255,255,255,.2)
}

.stack-card {
  border-bottom:1px solid rgba(255,255,255,.2);
  display:grid;
  gap:25px;
  grid-template-columns:42px 1fr auto;
  padding:32px 0
}

.stack-card>span {
  color:var(--orange);
  font:9px monospace;
  letter-spacing:.14em
}

.stack-card small {
  color:#8f8f89;
  font:9px monospace;
  letter-spacing:.14em
}

.stack-card h3 {
  font-size:clamp(25px,2.5vw,38px);
  font-weight:520;
  letter-spacing:-.04em;
  margin:12px 0
}

.stack-card p {
  color:#a3a39e;
  line-height:1.5;
  margin:0;
  max-width:520px
}

.stack-card b {
  color:#7e7e78;
  font-size:24px
}

.canvas {
  background:var(--paper)
}

.section-head {
  display:grid;
  gap:30px 6vw;
  grid-template-columns:1.4fr .8fr;
  margin-bottom:64px
}

.section-head .label {
  grid-column:1/3;
  margin:0
}

.section-head p {
  align-self:end;
  margin:0
}

.media-grid {
  display:grid;
  gap:12px;
  grid-template-columns:repeat(12,1fr);
  grid-template-rows:530px 390px
}

.media {
  background-position:center;
  background-size:cover;
  border-radius:18px;
  color:#fff;
  overflow:hidden;
  padding:20px;
  position:relative
}

.media:after {
  background:linear-gradient(180deg,rgba(4,6,8,.35),transparent 35%,rgba(4,6,8,.75));
  content:"";
  inset:0;
  position:absolute
}

.media-top,.media-cap {
  position:relative;
  z-index:2
}

.media-top {
  display:flex;
  font:9px monospace;
  justify-content:space-between;
  letter-spacing:.11em
}

.media-cap {
  position:absolute;
  bottom:20px;
  left:20px
}

.media-cap h3 {
  font-size:clamp(23px,2.6vw,39px);
  font-weight:550;
  letter-spacing:-.045em;
  margin:0 0 5px
}

.media-cap span {
  font:9px monospace;
  letter-spacing:.12em;
  text-transform:uppercase
}

.note {
  color:var(--muted);
  font-size:11px;
  text-align:right
}

.release {
  align-items:center;
  background:#5b63ff;
  color:#fff;
  display:flex;
  min-height:650px;
  overflow:hidden;
  position:relative
}

.release:after {
  border:1px solid rgba(255,255,255,.3);
  border-radius:50%;
  content:"";
  height:520px;
  position:absolute;
  right:-120px;
  transform:rotate(-25deg);
  width:780px
}

.release-content {
  max-width:940px;
  position:relative;
  z-index:2
}

.release small {
  font:10px monospace;
  letter-spacing:.15em
}

.release h2 {
  font-size:clamp(48px,6vw,96px);
  line-height:.88;
  margin:54px 0 36px
}

.release p {
  font-size:clamp(18px,1.8vw,25px);
  line-height:1.45;
  max-width:650px
}

.release-pills {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:42px
}

.release-pills a {
  align-items:center;
  border:1px solid rgba(255,255,255,.5);
  border-radius:999px;
  display:flex;
  font-size:12px;
  gap:8px;
  padding:7px 14px 7px 7px;
  transition:.18s
}

.release-pills a:hover {
  background:rgba(255,255,255,.12);
  border-color:#fff;
  transform:translateY(-2px)
}

.release-pills img {
  background:#fff;
  border-radius:50%;
  height:27px;
  object-fit:contain;
  padding:6px;
  width:27px
}

.release-pills img.wide-logo {
  padding:8px 4px
}

.release-pills small {
  color:rgba(255,255,255,.68);
  font:8px monospace;
  letter-spacing:.08em;
  text-transform:uppercase
}

.demo-intro {
  background:var(--soft);
  border-top:1px solid var(--line)
}

.demo-intro-grid {
  display:grid;
  gap:7vw;
  grid-template-columns:1.05fr .95fr;
  margin:auto;
  max-width:1360px
}

.demo-intro-grid>div>p {
  color:#45443f;
  font-size:clamp(18px,1.45vw,23px);
  line-height:1.5;
  margin:0 0 42px
}

.chapter-jump {
  border-top:1px solid var(--line);
  display:grid;
  grid-template-columns:repeat(2,1fr)
}

.chapter-jump a {
  align-items:center;
  border-bottom:1px solid var(--line);
  display:flex;
  font-size:14px;
  gap:16px;
  padding:18px 8px 18px 0;
  transition:color .18s,padding .18s
}

.chapter-jump a:hover {
  color:var(--orange);
  padding-left:7px
}

.chapter-jump span {
  color:var(--orange);
  font:9px monospace
}

.demo-chapter {
  padding:88px 5vw 98px
}

.chapter--dark {
  background:var(--ink);
  color:#fff
}

.chapter--paper {
  background:var(--paper)
}

.chapter--lavender {
  background:#e9e8ff
}

.chapter--orange {
  background:#ff7048;
  color:#161411
}

.chapter-head {
  align-items:end;
  display:grid;
  gap:30px 5vw;
  grid-template-columns:130px 1fr .8fr;
  margin:0 auto 48px;
  max-width:1500px
}

.chapter-number {
  align-self:start;
  color:var(--orange);
  font:9px monospace;
  letter-spacing:.14em;
  padding-top:8px
}

.chapter--orange .chapter-number {
  color:#fff
}

.chapter-head h2 {
  font-size:clamp(40px,4.6vw,72px)
}

.chapter--dark .chapter-head h2,
.chapter--paper .chapter-head h2 {
  font-size:clamp(34px,3.7vw,58px)
}

.chapter-head p {
  color:rgba(17,17,15,.62);
  font-size:15px;
  line-height:1.55;
  margin:0;
  max-width:480px
}

.chapter--dark .chapter-head p {
  color:rgba(255,255,255,.58)
}

.video-grid {
  display:grid;
  gap:24px 14px;
  grid-template-columns:repeat(2,minmax(0,1fr));
  margin:auto;
  max-width:1500px
}

.video-card--featured {
  grid-column:1/3;
  justify-self:center;
  margin-bottom:18px;
  max-width:980px;
  width:100%
}

.video-card:not(.video-card--featured) {
  cursor:pointer;
  max-width:360px;
  width:100%
}

.video-card:not(.video-card--featured):nth-child(2) {
  justify-self:end
}

.video-card:not(.video-card--featured):nth-child(3) {
  justify-self:start
}

.video-card:not(.video-card--featured):focus-visible {
  border-radius:14px;
  outline:3px solid rgba(81,103,255,.48);
  outline-offset:5px
}

.video-frame {
  aspect-ratio:16/9;
  background:#070706;
  border-radius:16px;
  box-shadow:0 14px 45px rgba(10,10,8,.13);
  overflow:hidden;
  position:relative
}

.video-card:not(.video-card--featured) .video-frame {
  border-radius:12px;
  box-shadow:0 10px 28px rgba(10,10,8,.12);
  transition:box-shadow .2s,transform .2s
}

.video-card:not(.video-card--featured):hover .video-frame {
  box-shadow:0 16px 38px rgba(10,10,8,.2);
  transform:translateY(-4px)
}

.video-card:not(.video-card--featured) video {
  pointer-events:none
}

.chapter--dark .video-frame {
  box-shadow:0 0 0 1px rgba(255,255,255,.14),0 20px 55px rgba(0,0,0,.35)
}

.video-frame video {
  background:#070706;
  display:block;
  height:100%;
  object-fit:cover;
  width:100%
}

.video-badge {
  background:rgba(8,8,7,.72);
  border:1px solid rgba(255,255,255,.24);
  border-radius:999px;
  color:#fff;
  font:8px monospace;
  letter-spacing:.12em;
  padding:8px 10px;
  pointer-events:none;
  position:absolute;
  right:14px;
  top:14px
}

.video-caption {
  display:grid;
  gap:8px;
  grid-template-columns:1fr;
  padding:18px 4px 0
}

.video-card:not(.video-card--featured) .video-caption p {
  display:none
}

.video-card:not(.video-card--featured) .video-caption h3:after {
  color:var(--orange);
  content:"  ↗";
  font-size:.72em
}

.video-caption h3 {
  font-size:clamp(18px,1.6vw,24px);
  font-weight:560;
  letter-spacing:-.04em;
  margin:0
}

.video-caption p {
  color:rgba(17,17,15,.58);
  font-size:12px;
  line-height:1.45;
  margin:0
}

.chapter--dark .video-caption p {
  color:rgba(255,255,255,.52)
}

.team {
  background:var(--soft)
}

.team-head {
  display:block;
  margin:auto;
  max-width:980px;
  text-align:center
}

.team-head .label {
  margin-bottom:26px
}

.team-head h2 {
  font-size:clamp(38px,4vw,58px);
  line-height:1;
  margin:0
}

.team-body {
  margin:32px auto 0;
  max-width:1120px
}

.authors {
  align-items:baseline;
  display:flex;
  flex-wrap:wrap;
  gap:10px 0;
  justify-content:center;
  padding:18px 24px 10px
}

.author {
  align-items:baseline;
  display:flex;
  gap:5px;
  min-height:auto;
  padding:0
}

.author:not(:last-child):after {
  color:#bbb8b0;
  content:",";
  font-size:16px;
  margin:0 12px 0 1px
}

.author span {
  font-size:clamp(15px,1.25vw,18px);
  font-weight:500;
  letter-spacing:-.02em;
  white-space:nowrap
}

.author sup,.team-contact sup {
  color:var(--orange);
  font:8px monospace;
  letter-spacing:.04em
}

.author--corresponding span:before {
  content:none
}

.team-contact {
  color:var(--muted);
  display:flex;
  font-size:11px;
  gap:22px;
  justify-content:center;
  padding:18px 20px 0
}

.team-contact a {
  color:var(--blue);
  transition:color .18s
}

.team-contact a:hover {
  color:var(--orange)
}

.institutions {
  align-items:center;
  display:flex;
  flex-wrap:wrap;
  gap:10px 28px;
  justify-content:center;
  margin-top:14px
}

.institution {
  align-items:baseline;
  display:flex;
  gap:6px;
  padding:5px 0
}

.institution>span {
  color:var(--orange);
  font:8px monospace;
}

.institution strong {
  font-size:13px;
  font-weight:550;
  letter-spacing:-.015em
}

.citation {
  background:var(--paper)
}

.citation>.label {
  margin-bottom:34px;
  text-align:center
}

.citation-grid {
  margin:auto;
  max-width:900px
}

.citation pre {
  background:var(--ink);
  border-radius:16px;
  color:#e8e6df;
  font:clamp(11px,1.1vw,14px)/1.75 monospace;
  margin:0;
  overflow:auto;
  padding:30px
}

.footer {
  align-items:end;
  background:var(--ink);
  color:#fff;
  display:grid;
  gap:30px;
  grid-template-columns:1fr auto 1fr;
  min-height:220px;
  padding:48px 5vw
}

.footer p {
  color:#898984;
  font-size:12px;
  margin:0
}

.footer-links {
  display:flex;
  font-size:12px;
  gap:22px;
  justify-self:end
}

@media(max-width:900px) {
  .nav {
    grid-template-columns:1fr auto
  }
  .navlinks {
    display:none
  }
  .stage {
    height:690px
  }
  .stage-grid {
    grid-template-columns:1fr 1fr;
    grid-template-rows:1.4fr .8fr
  }
  .shot-main {
    grid-column:1/3;
    grid-row:1
  }
  .shot-city {
    display:none
  }
  .shot-desert {
    grid-column:1;
    grid-row:2
  }
  .shot-forest {
    grid-column:2;
    grid-row:2
  }
  .stack,.citation-grid {
    grid-template-columns:1fr
  }
  .section-head {
    grid-template-columns:1fr
  }
  .section-head .label {
    grid-column:1
  }
  .media-grid {
    grid-template-rows:400px 400px
  }
  .m1,.m3 {
    grid-column:1/7
  }
  .m2,.m4 {
    grid-column:7/13
  }
  .demo-intro-grid,.chapter-head {
    grid-template-columns:1fr
  }
  .chapter-head {
    align-items:start
  }
  .chapter-head p {
    max-width:620px
  }
  .video-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .video-card--featured {
    grid-column:1/3
  }
}

@media(max-width:620px) {
  .intro-screen {
    padding:28px 20px
  }
  .intro-scroll {
    --intro-track:320vh
  }
  .intro-start-logo strong {
    font-size:18px
  }
  .intro-start-logo .mark {
    height:46px;
    width:46px
  }
  .intro-kicker {
    top:9vh
  }
  .logo-slot {
    font-size:clamp(52px,14.5vw,78px)
  }
  .logo-mask-text {
    font-size:clamp(208px,58vw,310px)
  }
  .intro-paper-title {
    font-size:clamp(20px,6.5vw,30px);
    line-height:1.04;
    margin-top:20px
  }
  .intro-content .intro-project-links {
    top:calc(50% + 240px)
  }
  .intro-authors {
    max-width:94vw;
    top:calc(50% + 94px)
  }
  .intro-authors p {
    flex-wrap:wrap;
    font-size:11px;
    gap:4px 10px;
    line-height:1.2
  }
  .intro-authors .intro-affiliations {
    font-size:8px;
    gap:3px 9px;
    margin-top:8px
  }
  .nav {
    height:64px;
    padding:0 20px
  }
  .updates {
    font-size:12px
  }
  .project-link {
    flex:1 1 calc(50% - 10px);
    font-size:13px;
    min-height:46px;
    padding:9px 12px
  }
  .project-links {
    gap:8px;
    margin-top:26px
  }
  .stage {
    min-height:590px
  }
  .stage-top,.stage-bottom {
    left:18px;
    right:18px
  }
  .stage-top span:last-child,.scroll {
    display:none
  }
  section {
    padding:86px 20px
  }
  h2 {
    font-size:34px
  }
  .showcase-video {
    border-radius:12px;
    margin-top:36px
  }
  .overview-copy {
    margin-top:34px;
    text-align:left
  }
  .overview-copy p {
    font-size:15px;
    line-height:1.55
  }
  .media-grid {
    display:block
  }
  .media {
    height:390px;
    margin-bottom:10px
  }
  .note {
    text-align:left
  }
  .release {
    padding:80px 20px
  }
  .release h2 {
    font-size:48px
  }
  .demo-intro-grid>div>p {
    font-size:17px
  }
  .chapter-jump {
    grid-template-columns:1fr
  }
  .demo-chapter {
    padding:82px 20px 94px
  }
  .chapter-head {
    margin-bottom:42px
  }
  .chapter-head h2 {
    font-size:44px
  }
  .video-grid {
    gap:28px 8px;
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .video-card--featured {
    grid-column:1/3;
    margin-bottom:4px
  }
  .video-card:not(.video-card--featured) {
    max-width:none
  }
  .video-card:not(.video-card--featured) .video-caption h3 {
    font-size:14px
  }
  .video-frame {
    border-radius:12px
  }
  .video-caption {
    gap:8px;
    grid-template-columns:1fr;
    padding-top:14px
  }
  .team-body {
    margin-top:28px
  }
  .authors {
    gap:12px 0;
    padding:12px 6px 8px
  }
  .author {
    padding:0
  }
  .author span {
    font-size:15px
  }
  .author:not(:last-child):after {
    margin:0 10px
  }
  .team-contact {
    align-items:center;
    flex-direction:column;
    gap:6px;
    padding:14px 12px 0
  }
  .institutions {
    gap:8px 18px
  }
  .institution {
    padding:4px 0
  }
  .citation pre {
    font-size:10px;
    padding:20px
  }
  .footer {
    align-items:start;
    grid-template-columns:1fr;
    padding:42px 20px
  }
  .footer p {
    display:none
  }
  .footer-links {
    justify-self:start
  }
}

@supports(height:100svh) {
  .intro-scroll {
    --intro-track:400svh
  }
}

@media(max-width:620px) and (min-height:1px) {
  @supports(height:100svh) {
    .intro-scroll {
      --intro-track:320svh
    }
  }
}

@media(prefers-reduced-motion:reduce) {
  .logo-slot,.intro-hint i,.intro-start-logo .solar-sun {
    animation:none
  }
  .intro-screen,#site-shell {
    transition:none
  }
  .intro-video-grid,.intro-video-tile,.intro-start-cue {
    transition:none
  }
  .intro-scroll {
    --intro-track:100vh
  }
}

.intro-fallback .intro-scroll {
  --intro-track:100vh
}

@supports(height:100svh) {
  @media(prefers-reduced-motion:reduce) {
    .intro-scroll {
      --intro-track:100svh
    }
  }
  .intro-fallback .intro-scroll {
    --intro-track:100svh
  }
}

/* Immersive product-story sequence begins at Overview. The opening experience
   above this point intentionally keeps its original layout and timing. */
.story-dark {
  background:#000;
  color:#f5f5f7;
  overflow:clip;
  position:relative
}

.story-dark::after {
  display:none
}

.nav {
  backdrop-filter:none;
  background:rgba(0,0,0,.96);
  border-bottom-color:rgba(255,255,255,.13);
  color:#f5f5f7;
  transition:background-color .45s ease,border-color .45s ease,color .45s ease
}

.nav.nav--story-dark {
  background:rgba(0,0,0,.78);
  border-bottom-color:rgba(255,255,255,.13);
  color:#f5f5f7
}

.nav.nav--story-dark .updates,
.nav.nav--story-dark .navlinks {
  color:rgba(245,245,247,.86)
}

.scroll-scene {
  --scene-copy-opacity:1;
  --scene-copy-y:0px;
  --scene-opacity:1;
  --scene-scale:1;
  --scene-stage-y:0px;
  position:relative
}

.scene-sticky {
  opacity:var(--scene-opacity);
  transform:scale(var(--scene-scale));
  transform-origin:50% 50%;
  will-change:opacity,transform
}

.overview-section {
  background:#000;
  color:#f5f5f7;
  min-height:185vh;
  padding:0 max(5vw,24px)
}

.overview-sticky {
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  height:calc(100vh - 72px);
  padding:42px 0 36px;
  position:sticky;
  top:72px
}

.overview-head {
  max-width:1060px;
  width:100%
}

.overview-head .label,
.story-dark .label {
  color:#86868b
}

.showcase-video {
  align-self:center;
  background:#09090b;
  border:1px solid rgba(255,255,255,.13);
  border-radius:24px;
  box-shadow:0 30px 100px rgba(0,0,0,.62),0 0 80px rgba(72,87,155,.12);
  margin:24px auto 0;
  max-height:58vh;
  max-width:1040px;
  transform:translateY(var(--scene-stage-y));
  width:min(72vw,1040px)
}

.showcase-video video {
  background:#09090b
}

.overview-copy {
  margin:28px auto 0;
  max-width:900px;
  opacity:var(--scene-copy-opacity);
  text-align:left;
  transform:translateY(var(--scene-copy-y));
  will-change:opacity,transform
}

.overview-copy p {
  color:#a1a1a6;
  font-size:clamp(15px,1.15vw,18px);
  line-height:1.58
}

.overview-copy strong {
  color:#f5f5f7;
  font-weight:620
}

.demo-intro {
  background:#1d1d1f;
  border-color:rgba(255,255,255,.1);
  color:#f5f5f7;
  min-height:72vh;
  padding:15vh 7vw
}

.demo-intro-grid {
  align-items:center;
  max-width:1240px
}

.demo-intro-grid h2 {
  font-size:clamp(46px,5.5vw,82px);
  font-weight:560
}

.demo-intro-grid>div>p {
  color:#a1a1a6;
  font-size:clamp(17px,1.35vw,22px)
}

.chapter-jump {
  border-color:rgba(255,255,255,.16)
}

.chapter-jump a {
  border-color:rgba(255,255,255,.16);
  color:#f5f5f7
}

.demo-chapter,
.chapter--dark,
.chapter--paper,
.chapter--lavender,
.chapter--orange {
  background:#000;
  border-top:1px solid rgba(255,255,255,.1);
  color:#f5f5f7;
  min-height:180vh;
  padding:0 5vw;
  position:relative
}

.demo-chapter::before {
  background:radial-gradient(circle at 82% 18%,var(--scene-glow,rgba(62,91,210,.18)),transparent 31%);
  content:"";
  inset:0;
  pointer-events:none;
  position:absolute
}

#chapter-1 {--scene-glow:rgba(55,104,255,.2)}
#chapter-2 {--scene-glow:rgba(37,164,145,.16)}
#chapter-3 {--scene-glow:rgba(125,87,232,.18)}
#chapter-4 {--scene-glow:rgba(255,91,46,.18)}

.chapter-sticky {
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  height:calc(100vh - 72px);
  padding:30px 0 26px;
  position:sticky;
  top:72px;
  z-index:1
}

.chapter-head {
  align-items:end;
  gap:20px 4vw;
  grid-template-columns:116px 1fr minmax(260px,.72fr);
  margin:0 auto 22px;
  max-width:1320px;
  width:100%
}

.chapter-number,
.chapter--orange .chapter-number {
  color:#ff6b43;
  font-size:10px
}

.chapter-head h2,
.chapter--dark .chapter-head h2,
.chapter--paper .chapter-head h2 {
  color:#f5f5f7;
  font-size:clamp(32px,3.45vw,54px);
  font-weight:560;
  line-height:.96
}

.chapter-head p,
.chapter--dark .chapter-head p {
  color:#a1a1a6;
  font-size:14px;
  line-height:1.5
}

.video-grid {
  align-content:center;
  align-self:stretch;
  display:grid;
  gap:13px 16px;
  grid-template-columns:repeat(2,minmax(0,1fr));
  grid-template-rows:minmax(0,1fr) auto;
  margin:auto;
  max-width:900px;
  opacity:var(--scene-copy-opacity);
  transform:translateY(var(--scene-stage-y));
  transition:opacity .25s linear;
  width:min(70vw,900px);
  will-change:opacity,transform
}

.video-card--featured {
  align-self:center;
  grid-column:1/3;
  justify-self:center;
  margin:0;
  max-width:860px;
  width:100%
}

.video-card--featured .video-frame {
  border:1px solid rgba(255,255,255,.13);
  border-radius:20px;
  box-shadow:0 28px 90px rgba(0,0,0,.62),0 0 60px rgba(77,96,175,.1)
}

.video-card:not(.video-card--featured) {
  align-items:center;
  background:#1d1d1f;
  border:1px solid rgba(255,255,255,.11);
  border-radius:14px;
  display:grid;
  gap:14px;
  grid-template-columns:clamp(116px,12vw,164px) 1fr;
  justify-self:stretch;
  max-width:none;
  padding:8px;
  transition:background-color .25s,border-color .25s,transform .25s;
  width:100%
}

.video-card:not(.video-card--featured):nth-child(2),
.video-card:not(.video-card--featured):nth-child(3) {
  justify-self:stretch
}

.video-card:not(.video-card--featured):hover {
  background:#272729;
  border-color:rgba(255,255,255,.25);
  transform:translateY(-2px)
}

.video-card:not(.video-card--featured) .video-frame {
  border-radius:9px;
  box-shadow:none
}

.video-card:not(.video-card--featured):hover .video-frame {
  box-shadow:none;
  transform:none
}

.video-caption {
  color:#f5f5f7;
  padding:12px 4px 0
}

.video-card:not(.video-card--featured) .video-caption {
  padding:0 8px 0 0
}

.video-caption h3 {
  color:#f5f5f7;
  font-size:clamp(16px,1.25vw,20px)
}

.video-caption p,
.chapter--dark .video-caption p {
  color:#86868b
}

.video-card:not(.video-card--featured) .video-caption h3:after {
  color:#ff6b43;
  content:"  ↗"
}

.team,
.citation {
  background:#f5f5f7;
  color:#1d1d1f
}

.team {
  padding-top:100px
}

.citation {
  background:#0b0909;
  border-top:1px solid rgba(255,244,232,.12);
  color:#fff4e8;
  padding:90px max(3vw,24px) 120px
}

.citation pre {
  background:#111010;
  border:1px solid rgba(255,244,232,.12);
  box-shadow:none;
  color:#f5f5f2
}

.citation-grid {
  max-width:1320px;
  width:min(86vw,1320px)
}

.citation>.label {
  color:#86868b
}

.indomain-cases {
  background:#0b0909;
  color:#fff4e8;
  min-height:100vh;
  padding:112px max(3vw,24px) 136px;
  position:relative
}

.indomain-cases::before {
  background:radial-gradient(circle at 76% 5%,rgba(255,111,66,.1),transparent 30%);
  content:"";
  inset:0;
  pointer-events:none;
  position:absolute
}

.demos-label {
  color:#86868b;
  margin:0 auto;
  max-width:1320px;
  position:relative;
  text-align:center;
  width:min(86vw,1320px)
}

.model-selector {
  border-bottom:1px solid rgba(255,244,232,.14);
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  margin:42px auto 0;
  max-width:820px;
  width:min(72vw,820px)
}

.model-option {
  appearance:none;
  background:transparent;
  border:0;
  border-bottom:2px solid transparent;
  color:#777270;
  cursor:pointer;
  font:600 15px/1.2 Arial,Helvetica,sans-serif;
  margin-bottom:-1px;
  padding:15px 12px 16px;
  transition:border-color .24s ease,color .24s ease
}

.model-option:hover,
.model-option:focus-visible {
  color:#d8d3cd;
  outline:none
}

.model-option.is-active {
  border-color:#ff7650;
  color:#fff4e8
}

.model-coming-soon {
  border-top:1px solid rgba(255,244,232,.17);
  display:grid;
  margin:72px auto 0;
  min-height:420px;
  place-items:center;
  position:relative;
  text-align:center;
  width:min(86vw,1320px)
}

.model-coming-soon[hidden],
.model-demo-content[hidden],
.model-bidirectional-content[hidden] {
  display:none
}

.model-coming-soon span {
  color:#777270;
  display:block;
  font:500 12px/1.2 Arial,Helvetica,sans-serif;
  letter-spacing:.14em;
  margin-bottom:16px;
  text-transform:uppercase
}

.model-coming-soon strong {
  color:rgba(247,247,242,.72);
  display:block;
  font:500 18px/1.2 Arial,Helvetica,sans-serif;
  letter-spacing:.18em;
  text-transform:uppercase
}

.model-generation-note {
  color:#85807d;
  font:500 16px/1.5 Arial,Helvetica,sans-serif;
  letter-spacing:.01em;
  margin:34px auto -22px;
  text-align:center;
  width:min(86vw,1320px)
}

.bidirectional-case-chapter {
  border-top:0;
  margin-top:56px;
  padding-top:0
}

.bidirectional-case-chapter .case-video-grid {
  margin-top:0
}

.bidirectional-case-chapter .case-video-frame {
  aspect-ratio:3/2
}

.bidirectional-case-chapter .case-grid-video {
  object-fit:contain
}

.indomain-head,
.case-chapter {
  margin-left:auto;
  margin-right:auto;
  position:relative
}

.case-chapter-head h2 {
  color:rgba(247,247,242,.68);
  font-size:16px;
  font-weight:500;
  letter-spacing:.16em;
  line-height:1.3;
  margin:0;
  text-transform:uppercase
}

.indomain-head {
  max-width:1540px
}

.case-chapter {
  max-width:1320px;
  width:min(86vw,1320px)
}

.indomain-head {
  align-items:end;
  display:grid;
  gap:42px;
  grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr)
}

.indomain-head .label {
  color:#ff7650;
  margin-bottom:24px
}

.indomain-head h2 {
  color:#fff4e8;
  font-size:clamp(48px,5.8vw,84px);
  font-weight:560;
  letter-spacing:-.055em;
  line-height:.94
}

.indomain-head>p {
  color:#aaa39c;
  font-size:clamp(15px,1.35vw,19px);
  line-height:1.55;
  margin-bottom:4px
}

.case-chapter {
  border-top:1px solid rgba(255,244,232,.17);
  margin-top:72px;
  padding-top:24px
}

.case-chapter+.case-chapter {
  margin-top:108px
}

.case-chapter-head {
  display:block
}

.case-chapter-number {
  color:#ff7650;
  font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;
  font-size:12px;
  letter-spacing:.12em;
  padding-top:7px
}

.case-chapter-head p {
  color:#ff7650;
  font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;
  font-size:10px;
  letter-spacing:.13em;
  margin:0 0 17px
}

.case-chapter-head h3 {
  color:#fff4e8;
  font-size:clamp(34px,3.4vw,48px);
  font-weight:540;
  letter-spacing:-.035em;
  line-height:1
}

.case-chapter-head div>span {
  color:#99918a;
  display:block;
  font-size:14px;
  line-height:1.5;
  margin-top:16px;
  max-width:620px
}

.case-video-grid {
  display:grid;
  gap:46px 30px;
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin-top:42px
}

.case-video-card {
  min-width:0
}

.case-video-frame {
  aspect-ratio:9/5;
  background:#1e1513;
  border:1px solid rgba(255,154,122,.14);
  overflow:hidden;
  position:relative;
  transition:border-color .22s ease,transform .22s ease
}

.case-video-card:hover .case-video-frame {
  border-color:rgba(255,154,122,.5);
  transform:translateY(-2px)
}

.case-grid-video {
  background:#080707;
  display:block;
  height:100%;
  object-fit:contain;
  width:100%
}

.case-video-meta {
  align-items:center;
  color:#8f8883;
  display:flex;
  font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;
  font-size:9px;
  justify-content:space-between;
  letter-spacing:.11em;
  padding-top:12px
}

.case-video-meta span:last-child {
  color:#ff7650
}

/* Unified demo galleries: larger in-place players, continuously arranged. */
.demo-chapter,
.chapter--dark,
.chapter--paper,
.chapter--lavender,
.chapter--orange {
  min-height:auto;
  padding:112px max(3vw,24px) 126px
}

.chapter-gallery {
  margin:0 auto;
  max-width:1560px;
  position:relative;
  z-index:1
}

.chapter-gallery .chapter-head {
  align-items:end;
  gap:24px 42px;
  grid-template-columns:74px minmax(0,1fr) minmax(280px,.68fr);
  margin:0 0 66px;
  max-width:none;
  width:100%
}

.chapter-gallery .chapter-number {
  align-self:start;
  padding-top:7px
}

.chapter-gallery .chapter-head h2,
.chapter-gallery .chapter--dark .chapter-head h2,
.chapter-gallery .chapter--paper .chapter-head h2 {
  font-size:clamp(38px,4.25vw,64px);
  letter-spacing:-.045em;
  line-height:.96
}

.chapter-gallery .chapter-head p {
  font-size:15px;
  line-height:1.55;
  margin-bottom:3px
}

.chapter-video-grid {
  margin-top:0
}

.chapter-gallery .case-video-frame {
  border-color:rgba(255,255,255,.14)
}

.case-video-card {
  animation:gallery-card-in .42s cubic-bezier(.22,.8,.24,1) both;
  animation-delay:calc(var(--card-order,0) * 55ms)
}

.case-video-meta span:first-child {
  max-width:78%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}

.overview-section {
  background:linear-gradient(180deg,#000 0%,#030304 72%,#09090a 100%);
  min-height:auto;
  overflow:hidden;
  padding:92px max(5vw,24px) 112px;
  position:relative
}

.overview-section::after {
  display:none
}

.overview-content {
  margin:0 auto;
  max-width:1184px
}

.overview-content .overview-head {
  margin:0 auto 38px;
  max-width:1040px
}

.overview-content .showcase-video {
  margin:0 auto;
  max-height:none;
  transform:none;
  width:min(78vw,1040px)
}

.overview-carousel {
  margin:0 auto;
  max-width:1184px;
  outline:none;
  position:relative;
  width:100%
}

.overview-carousel-viewport {
  aspect-ratio:1.72/1;
  overflow:hidden;
  position:relative
}

.overview-carousel-track {
  height:100%;
  position:relative;
  width:100%
}

.overview-video-slide {
  left:50%;
  opacity:.3;
  position:absolute;
  top:50%;
  transform:translate3d(-50%,-50%,0) scale(.7);
  transition:opacity .72s ease,transform .84s cubic-bezier(.2,.72,.18,1),filter .72s ease;
  width:min(82%,1040px);
  will-change:opacity,transform;
  z-index:1
}

.overview-video-slide.is-active {
  filter:none;
  opacity:1;
  transform:translate3d(-50%,-50%,0) scale(1);
  z-index:3
}

.overview-video-slide.is-prev {
  filter:saturate(.62) brightness(.56);
  opacity:.48;
  transform:translate3d(-120%,-50%,0) scale(.82);
  z-index:1
}

.overview-video-slide.is-next {
  filter:saturate(.62) brightness(.56);
  opacity:.48;
  transform:translate3d(20%,-50%,0) scale(.82);
  z-index:2
}

.overview-video-slide:not(.is-active) {
  cursor:pointer
}

.overview-video-slide:not(.is-active) video {
  pointer-events:none
}

.overview-video-slide.is-active:hover {
  transform:translate3d(-50%,-50%,0) scale(1.035)
}

.overview-video-slide.is-prev:hover {
  filter:saturate(.78) brightness(.7);
  opacity:.68;
  transform:translate3d(-120%,-50%,0) scale(.86)
}

.overview-video-slide.is-next:hover {
  filter:saturate(.78) brightness(.7);
  opacity:.68;
  transform:translate3d(20%,-50%,0) scale(.86)
}

.overview-carousel .showcase-video,
.overview-content .overview-carousel .showcase-video {
  aspect-ratio:16/9;
  border-color:rgba(255,255,255,.16);
  border-radius:22px;
  margin:0;
  max-height:none;
  max-width:none;
  overflow:hidden;
  transform:none;
  transition:border-color .35s ease,box-shadow .45s ease;
  width:100%
}

.overview-carousel .overview-video-slide.is-active .showcase-video {
  box-shadow:0 34px 100px rgba(0,0,0,.7),0 0 90px rgba(72,87,155,.14)
}

.overview-carousel.is-playing .overview-video-slide.is-active .showcase-video {
  border-color:rgba(255,112,72,.72);
  box-shadow:0 34px 100px rgba(0,0,0,.7),0 0 0 1px rgba(255,112,72,.16),0 0 90px rgba(255,112,72,.12)
}

.overview-carousel .showcase-video video {
  background:#030304;
  object-fit:contain
}

.overview-video-caption {
  align-items:baseline;
  display:flex;
  gap:14px;
  margin:15px 4px 0;
  min-height:28px
}

.overview-video-caption span {
  color:#6e6e73;
  flex:0 0 auto;
  font:10px/1 monospace;
  letter-spacing:.14em
}

.overview-video-caption h3 {
  color:#f5f5f7;
  font-size:clamp(14px,1.35vw,19px);
  font-weight:520;
  letter-spacing:-.018em;
  line-height:1.25;
  margin:0
}

.overview-video-caption em {
  color:#86868b;
  font-style:normal;
  font-weight:430
}

.overview-carousel-controls {
  align-items:center;
  display:grid;
  gap:15px;
  grid-template-columns:42px auto 1fr 42px;
  margin:4px auto 0;
  max-width:min(82%,1040px)
}

.overview-carousel-arrow {
  align-items:center;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.14);
  border-radius:50%;
  color:#f5f5f7;
  cursor:pointer;
  display:flex;
  font-size:17px;
  height:42px;
  justify-content:center;
  padding:0;
  transition:background .2s ease,border-color .2s ease,transform .2s ease;
  width:42px
}

.overview-carousel-arrow:hover,
.overview-carousel-arrow:focus-visible {
  background:rgba(255,255,255,.15);
  border-color:rgba(255,255,255,.32);
  outline:none;
  transform:scale(1.06)
}

.overview-carousel-dots {
  align-items:center;
  display:flex;
  gap:7px
}

.overview-carousel-dot {
  background:#4b4b50;
  border:0;
  border-radius:999px;
  cursor:pointer;
  height:4px;
  padding:0;
  transition:background .25s ease,width .35s cubic-bezier(.2,.72,.18,1);
  width:18px
}

.overview-carousel-dot.is-active {
  background:#f5f5f7;
  width:42px
}

.overview-carousel-dot:focus-visible {
  outline:2px solid #ff7048;
  outline-offset:4px
}

.overview-carousel-status {
  color:#6e6e73;
  font:10px/1 monospace;
  letter-spacing:.13em;
  margin:0;
  text-align:right;
  text-transform:uppercase
}

.overview-carousel.is-playing .overview-carousel-status {
  color:#ff8a68
}


.overview-content .overview-copy {
  margin-top:38px;
  opacity:1;
  transform:none;
  will-change:auto
}

.overview-content .sound-prompt {
  align-items:center;
  display:flex;
  gap:10px;
  justify-content:center;
  max-width:1040px;
  padding:4px 0 0;
  text-align:left
}

.sound-prompt-icon {
  display:inline-block;
  filter:invert(95%) sepia(8%) saturate(563%) hue-rotate(327deg) brightness(109%) contrast(105%) drop-shadow(0 4px 8px rgba(0,0,0,.5));
  height:27px;
  object-fit:contain;
  width:27px
}

.sound-prompt p {
  color:#fffaf0;
  font-family:Arial,Helvetica,sans-serif;
  font-size:13px;
  font-weight:600;
  letter-spacing:.025em;
  line-height:1.35;
  margin:0;
  text-shadow:0 2px 12px rgba(0,0,0,.8)
}

.key-features {
  background:#09090a;
  color:#f7f7f2;
  padding:88px max(5vw,24px) 112px;
  scroll-margin-top:76px
}

.key-features-inner {
  margin:0 auto;
  max-width:1440px
}

.key-features-label {
  color:#a1a1a6;
  font:700 16px/1.2 Arial,Helvetica,sans-serif;
  letter-spacing:.24em;
  margin:0 0 58px
}

.key-features-grid {
  display:grid;
  gap:0 48px;
  grid-template-columns:repeat(3,minmax(0,1fr))
}

.key-feature {
  border-top:1px solid rgba(255,255,255,.16);
  padding:30px 0 14px
}

.key-feature>p {
  color:#a1a1a6;
  font:500 12px/1.25 Arial,Helvetica,sans-serif;
  letter-spacing:.18em;
  margin:0 0 17px
}

.key-feature h3 {
  color:#f7f7f2;
  font-size:clamp(25px,2vw,32px);
  font-weight:480;
  letter-spacing:-.045em;
  line-height:1.08;
  margin:0 0 18px
}

.key-feature>span {
  color:#a1a1a6;
  display:block;
  font-size:15px;
  line-height:1.58;
  max-width:410px
}

.key-feature-link {
  align-items:center;
  border-bottom:1px solid rgba(247,247,242,.38);
  color:#f7f7f2;
  display:inline-flex;
  font-size:13px;
  font-weight:600;
  gap:12px;
  letter-spacing:.01em;
  margin-top:27px;
  padding:0 0 8px;
  text-decoration:none;
  transition:border-color .25s ease,color .25s ease,gap .25s ease
}

.key-feature-links {
  align-items:center;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:27px
}

.key-feature-links-label {
  border-bottom:1px solid rgba(247,247,242,.38);
  color:#f7f7f2;
  font-size:13px;
  font-weight:600;
  letter-spacing:.01em;
  margin-right:4px;
  padding:0 0 8px
}

.key-feature-platform-link {
  align-items:center;
  border:1px solid rgba(247,247,242,.3);
  border-radius:50%;
  display:inline-flex;
  height:34px;
  justify-content:center;
  transition:border-color .25s ease,transform .25s ease;
  width:34px
}

.key-feature-platform-link img {
  height:19px;
  object-fit:contain;
  width:19px
}

.key-feature-platform-link:hover,
.key-feature-platform-link:focus-visible {
  border-color:#ff7147;
  transform:translateY(-2px)
}

.key-feature-link:hover,
.key-feature-link:focus-visible {
  border-color:#ff7147;
  color:#ff7147;
  gap:17px
}

.key-feature-link b {
  font-size:15px;
  font-weight:400
}

.demo-intro {
  --demo-glow-opacity:1;
  --demo-intro-opacity:1;
  --demo-intro-y:0px;
  background:linear-gradient(180deg,#09090a 0%,#121214 42%,#1d1d1f 100%);
  border-top:0;
  margin-top:-1px;
  overflow:hidden;
  position:relative
}

.demo-intro::before {
  background:radial-gradient(circle at 18% 10%,rgba(77,96,175,.2),transparent 38%);
  content:"";
  inset:0;
  opacity:var(--demo-glow-opacity);
  pointer-events:none;
  position:absolute
}

.demo-intro>.label,
.demo-intro-grid {
  opacity:1;
  position:relative;
  transform:none;
  z-index:1
}

@keyframes gallery-card-in {
  from {opacity:0;transform:translateY(10px)}
  to {opacity:1;transform:translateY(0)}
}

@media(max-width:900px), (max-height:740px) {
  .overview-section,
  .demo-chapter,
  .chapter--dark,
  .chapter--paper,
  .chapter--lavender,
  .chapter--orange {
    min-height:auto;
    padding:90px 5vw
  }
  .scene-sticky,
  .overview-sticky,
  .chapter-sticky {
    height:auto;
    opacity:1!important;
    padding:0;
    position:relative;
    top:auto;
    transform:none!important
  }
  .overview-sticky {
    display:block
  }
  .showcase-video {
    margin-top:34px;
    max-height:none;
    width:min(88vw,960px)
  }
  .overview-copy {
    opacity:1!important;
    transform:none!important
  }
  .chapter-sticky {
    display:block
  }
  .chapter-head {
    grid-template-columns:1fr;
    margin-bottom:36px
  }
  .video-grid {
    opacity:1!important;
    transform:none!important;
    width:100%
  }
  .indomain-cases {
    min-height:auto;
    padding:90px max(3vw,24px)
  }
  .demo-chapter,
  .chapter--dark,
  .chapter--paper,
  .chapter--lavender,
  .chapter--orange {
    padding:90px max(3vw,24px)
  }
}

@media(max-width:900px) {
  .key-features-grid {
    grid-template-columns:1fr
  }
  .key-feature {
    padding:28px 0 42px
  }
  .key-feature>span {
    max-width:680px
  }
}

@media(max-width:1100px) {
  .case-video-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
}

@media(max-width:900px) {
  .chapter-gallery .chapter-head {
    grid-template-columns:54px minmax(0,1fr);
  }
  .chapter-gallery .chapter-head p {
    grid-column:2
  }
}

@media(max-width:620px) {
  .story-dark::after {
    height:14vh;
    min-height:100px
  }
  .overview-section,
  .demo-chapter,
  .chapter--dark,
  .chapter--paper,
  .chapter--lavender,
  .chapter--orange {
    padding:78px 20px
  }
  .demo-intro {
    min-height:auto;
    padding:88px 20px
  }
  .key-features {
    padding:78px 20px 62px
  }
  .key-features-label {
    font-size:14px;
    margin-bottom:38px
  }
  .key-feature h3 {
    font-size:28px
  }
  .key-feature>span {
    font-size:14px
  }
  .model-selector {
    display:flex;
    margin-top:32px;
    overflow-x:auto;
    scrollbar-width:none;
    width:100%
  }
  .model-selector::-webkit-scrollbar {
    display:none
  }
  .model-option {
    flex:0 0 auto;
    min-width:128px
  }
  .model-coming-soon {
    margin-top:54px;
    min-height:300px;
    width:100%
  }
  .indomain-cases {
    padding:82px 20px 88px
  }
  .indomain-head {
    align-items:start;
    gap:22px;
    grid-template-columns:1fr
  }
  .indomain-head h2 {
    font-size:44px
  }
  .case-chapter {
    margin-top:54px;
    padding-top:20px
  }
  .case-chapter+.case-chapter {
    margin-top:76px
  }
  .case-chapter-head {
    display:block
  }
  .case-chapter-head h3 {
    font-size:34px
  }
  .case-video-grid {
    gap:36px;
    grid-template-columns:1fr;
    margin-top:30px
  }
  .case-video-meta {
    padding-top:10px
  }
  .chapter-gallery .chapter-head {
    gap:16px;
    grid-template-columns:44px minmax(0,1fr);
    margin-bottom:42px
  }
  .chapter-gallery .chapter-head h2 {
    font-size:40px
  }
  .demo-intro-grid h2 {
    font-size:44px
  }
  .showcase-video {
    border-radius:14px;
    width:100%
  }
  .overview-carousel-viewport {
    aspect-ratio:1.28/1
  }
  .overview-video-slide {
    width:92%
  }
  .overview-video-slide.is-prev {
    transform:translate3d(-128%,-50%,0) scale(.78)
  }
  .overview-video-slide.is-next {
    transform:translate3d(28%,-50%,0) scale(.78)
  }
  .overview-video-slide.is-active:hover {
    transform:translate3d(-50%,-50%,0) scale(1.015)
  }
  .overview-video-slide.is-prev:hover {
    transform:translate3d(-128%,-50%,0) scale(.81)
  }
  .overview-video-slide.is-next:hover {
    transform:translate3d(28%,-50%,0) scale(.81)
  }
  .overview-carousel .showcase-video,
  .overview-content .overview-carousel .showcase-video {
    border-radius:14px
  }
  .overview-video-caption {
    gap:10px;
    margin:11px 2px 0
  }
  .overview-video-caption h3 {
    font-size:13px
  }
  .overview-carousel-controls {
    gap:11px;
    grid-template-columns:36px auto 1fr 36px;
    max-width:92%
  }
  .overview-carousel-arrow {
    height:36px;
    width:36px
  }
  .overview-content .sound-prompt {
    gap:8px;
    padding-top:4px;
    text-align:center
  }
  .sound-prompt-icon {
    height:24px;
    width:24px
  }
  .sound-prompt p {
    font-size:12px
  }
  .video-grid {
    gap:12px;
    grid-template-columns:1fr
  }
  .video-card--featured {
    grid-column:1;
    margin-bottom:8px
  }
  .video-card:not(.video-card--featured) {
    grid-template-columns:112px 1fr
  }
  .video-card:not(.video-card--featured) .video-caption h3 {
    font-size:14px
  }
  .team {
    padding-top:78px
  }
}

@media(prefers-reduced-motion:reduce) {
  .scene-sticky,
  .overview-copy,
  .video-grid {
    opacity:1!important;
    transform:none!important
  }
  .case-video-card {
    animation:none
  }
}