@media (max-width: 499px) and (prefers-reduced-motion: no-preference) {
  html.mobile-scroll-motion .hero {
    height: 220svh !important;
  }

  html.mobile-scroll-motion .hero__stage,
  html.mobile-scroll-motion .instrument-archive__stage,
  html.mobile-scroll-motion .crossing__sticky,
  html.mobile-scroll-motion .finale__sticky {
    position: sticky;
    top: 0;
  }

  html.mobile-scroll-motion .hero__media video,
  html.mobile-scroll-motion .instrument-panel__lightbox video,
  html.mobile-scroll-motion .crossing__media video {
    opacity: 1;
  }

  html.mobile-scroll-motion .hero__fog {
    opacity: 0.45;
  }

  html.mobile-scroll-motion .hero__traces {
    opacity: 0.7;
  }

  html.mobile-scroll-motion .instrument-archive {
    height: 180svh !important;
  }

  html.mobile-scroll-motion .crossing {
    height: 260svh !important;
  }

  html.mobile-scroll-motion .crossing__caption,
  html.mobile-scroll-motion .crossing__caption:first-child {
    display: block;
    opacity: 0;
    transform: translateY(26px);
  }

  html.mobile-scroll-motion .crossing__caption.is-active,
  html.mobile-scroll-motion .crossing__caption:first-child.is-active {
    opacity: 1;
    transform: translateY(0);
  }

  html.mobile-scroll-motion .crossing__meter {
    display: block;
  }

  html.mobile-scroll-motion .crossing__meta {
    top: 82px;
  }

  html.mobile-scroll-motion .rupture {
    height: 118svh !important;
  }

  html.mobile-scroll-motion .rupture__stage {
    position: relative;
    top: auto;
    touch-action: pan-y;
  }

  html.mobile-scroll-motion .rupture__canvas {
    pointer-events: none;
    touch-action: pan-y;
  }

  html.mobile-scroll-motion .rupture__label,
  html.mobile-scroll-motion .rupture__trace {
    will-change: transform, opacity;
  }

  html.mobile-scroll-motion .finale {
    height: 220svh !important;
  }
}