/* Safari's toolbar changes the visible height while scrolling. Size the
   artwork to that height; keep animation travel in stable small-viewport units
   so revealing the toolbar does not scrub the animation backwards. */
@supports (height: 100dvh) {
  .hero,
  .intro-sequence__stage,
  .thermal .thermal__stage,
  .robot-stage,
  .material-archive__stage {
    height: 100dvh;
    min-height: 0;
  }
  .hero .sequence-stage { height: 100%; }
  .thermal__monitor { height: 100dvh; }

  .intro-sequence { height: calc(100dvh + 600svh); }
  .prologue { height: calc(100dvh + var(--finale-run)); }
  .thermal { height: calc(100dvh + 340svh); }
  #robot-story { height: calc(100dvh + 500svh); }
  .material-archive { height: calc(100dvh + 560svh); }

  @media (max-width: 700px) {
    .thermal { height: calc(100dvh + 280svh); }
    .material-archive { height: calc(100dvh + 480svh); }
  }
  @media (max-width: 1366px), (pointer: coarse) {
    .swarm { height: 100dvh; min-height: 0; max-height: none; }
  }
  @media (prefers-reduced-motion: reduce) {
    .intro-sequence { height: calc(100dvh + 100svh); }
    .thermal { height: calc(100dvh + 150svh); }
  }
  [data-scroll-sequence][data-sequence-unavailable] { height: 100dvh; }
}