/* The constellation sits behind the original centered hero layout. */
.hero__particles {
  position: absolute; inset: 0;
  pointer-events: none; contain: strict; z-index: -1;
  background: #000;
}
.hero__particles canvas { display: block; width: 100%; height: 100%; opacity: 1; }
.hero__particles.is-ready::after {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(ellipse at 50% 48%, #0808098a 0%, #08080945 28%, transparent 62%),
    linear-gradient(transparent 70%, var(--bg));
}

/* Static information in the former ticker position. */
.hero > .hero__factoid--footer {
  position: absolute;
  inset-inline: var(--pad-x);
  bottom: max(18px, env(safe-area-inset-bottom));
  margin: 0;
  max-width: none;
  display: flex;
  justify-content: center;
  text-align: center;
  z-index: 1;
}