/* Shared depth joins the independently generated films. All movement follows
   an explicit play choice; a star approach leaves the hit targets fixed. */
#stellar-wave[data-hero-immersive="true"] .sh-experience .sh-cosmos.era-cinema {
  transform-origin: var(--sh-node-focus-x, 65%) var(--sh-node-focus-y, 40%);
  transform: scale(calc(1 + var(--sh-node-approach, 0) * .11 + var(--sh-passage-depth, 0) * .045));
  transition: none;
}
#stellar-wave[data-hero-immersive="true"] .sh-voyage {
  display: block;
  z-index: 5;
  opacity: .24;
  transform-origin: var(--sh-node-focus-x, 65%) var(--sh-node-focus-y, 40%);
  transform: scale(calc(1 + var(--sh-node-approach, 0) * .17));
  transition: opacity .35s ease;
  pointer-events: none;
}
#stellar-wave .sh-cosmos .ch-hero-film.sh-film-departing { transition: opacity .65s ease-in-out; }
#stellar-wave[data-hero-immersive="true"][data-hero-travel="true"] .sh-voyage { opacity: .76; }
#stellar-wave[data-hero-immersive="true"][data-hero-artifact-open="true"] .sh-voyage { opacity: .06; }
#stellar-wave[data-hero-immersive="true"] .sh-experience::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 4;
  background: radial-gradient(ellipse at 67% 44%, #04090f20, #02060c9c 88%);
  opacity: calc(var(--sh-passage-depth, 0) * .38);
  pointer-events: none;
}
#stellar-wave[data-hero-immersive="true"] .sh-experience[data-node-approach="true"] .sh-copy {
  opacity: calc(1 - var(--sh-node-approach, 0) * .65);
}
#stellar-wave[data-hero-immersive="true"] .sh-experience[data-node-approach="true"] .sh-story:not([data-sc-selected="true"]) {
  opacity: calc(1 - var(--sh-node-approach, 0) * .65);
}
#stellar-wave[data-hero-immersive="true"] .sh-experience[data-node-approach="true"] .sc-node[data-sc-selected="true"]::before {
  box-shadow: 0 0 4px #fff, 0 0 18px var(--immersion-accent), 0 0 45px var(--immersion-light);
}
#stellar-wave[data-hero-immersive="true"] .sh-passage-caption {
  color: #e4e9e8;
  text-shadow: 0 1px 8px #000, 0 3px 28px #000;
}
#stellar-wave[data-hero-immersive="true"] .sh-passage-caption strong { font-weight: 300; }
@media (prefers-reduced-motion: reduce) {
  #stellar-wave[data-hero-immersive="true"] .sh-experience .sh-cosmos.era-cinema,
  #stellar-wave[data-hero-immersive="true"] .sh-voyage { transform: none; transition: none; }
}
