:root {
  --g-audio-bass: 0;
  --g-audio-mid: 0;
  --g-audio-high: 0;
  --g-audio-level: 0;
  --g-audio-transient: 0;
}

body.audio-responsive :is(
  .brand-transmission.g-audio-in-view,
  .resonance-meditation.g-audio-in-view,
  .systems-atlas.g-audio-in-view,
  .mutation-lab.g-audio-in-view,
  .mirrors-chamber.g-audio-in-view
) {
  filter:
    brightness(calc(1 + var(--g-audio-level) * .09))
    saturate(calc(1 + var(--g-audio-high) * .12));
}

body.audio-responsive :is(
  .brand-transmission.g-audio-in-view,
  .resonance-meditation.g-audio-in-view,
  .systems-atlas.g-audio-in-view,
  .mutation-lab.g-audio-in-view,
  .mirrors-chamber.g-audio-in-view
) :is(h1, h2) {
  text-shadow:
    0 0 calc(3px + var(--g-audio-high) * 12px) rgba(104, 245, 232, calc(.06 + var(--g-audio-high) * .22)),
    0 0 calc(5px + var(--g-audio-mid) * 15px) rgba(223, 186, 105, calc(.03 + var(--g-audio-mid) * .12));
}

body.audio-responsive :is(.ambient-loop.g-audio-in-view, .tongue-bell-transition.g-audio-in-view) video {
  filter:
    brightness(calc(1 + var(--g-audio-bass) * .08))
    contrast(calc(1 + var(--g-audio-mid) * .06));
}

@media (prefers-reduced-motion: reduce) {
  body.audio-responsive :is(
    .brand-transmission,
    .resonance-meditation,
    .systems-atlas,
    .mutation-lab,
    .mirrors-chamber,
    .ambient-loop video,
    .tongue-bell-transition video
  ) {
    filter: none;
  }
}
