[data-hero-stars] {
  position: absolute;
  overflow: hidden;
  pointer-events: none;
  opacity: 0;
  /* Fade safely before the bright atmospheric rim. */
  -webkit-mask-image: linear-gradient(#000 0%, #000 55%, transparent 100%);
  mask-image: linear-gradient(#000 0%, #000 55%, transparent 100%);
}
.aps-star-sky { position: absolute; inset: 0; transition: transform 350ms ease-out; }
.aps-shooting-star {
  position: absolute; left: 18%; top: 26%;
  width: clamp(42px, 6vw, 100px); height: 1px;
  border-radius: 100%; opacity: 0;
  background: linear-gradient(90deg, transparent, rgba(198,218,241,.25) 45%, rgba(237,246,255,.8) 90%, #fff);
  transform-origin: right center;
  animation: aps-shooting-star 14s linear infinite both;
  animation-delay: 2.5s;
  animation-play-state: paused;
}
.aps-shooting-star::after {
  content: ''; position: absolute; right: -1px; top: -.5px;
  width: 2px; height: 2px; border-radius: 50%; background: #edf6ff;
  box-shadow: 0 0 5px 1px rgba(202,227,255,.3);
}
.aps-shooting-star:nth-child(2) { left: 60%; top: 14%; width: clamp(32px, 4vw, 70px); animation-delay: 7s; }
.aps-shooting-star:nth-child(3) { left: 35%; top: 40%; width: clamp(36px, 5vw, 86px); animation-delay: 11.5s; }
[data-hero-stars][data-active] .aps-shooting-star { animation-play-state: running; }
@keyframes aps-shooting-star {
  0%, 1% { opacity: 0; transform: translate3d(-65px,-10px,0) rotate(8deg) scaleX(.35); }
  2% { opacity: .7; transform: translate3d(-25px,-5px,0) rotate(8deg) scaleX(1); }
  5.5% { opacity: .55; transform: translate3d(85px,10px,0) rotate(8deg) scaleX(.8); }
  7.5%, 100% { opacity: 0; transform: translate3d(145px,18px,0) rotate(8deg) scaleX(.2); }
}
@media (prefers-reduced-motion: reduce) {
  [data-hero-stars] { display: none !important; }
  .aps-shooting-star { animation: none; }
}