/* Shared slow-moving starfield from pricing through checkout and chart analysis. */
.account-stars,
.checkout-stars,
.success-stars,
.upi-demo-stars,
.analyzer-stars,
.pricing-page::before {
  background-repeat: repeat;
  animation: starfield-drift 72s linear infinite, starfield-twinkle 8s ease-in-out infinite alternate;
  will-change: background-position, opacity;
}

.space-stars,
.transition-stars,
.how-stars {
  background-repeat: repeat;
  animation: starfield-drift 88s linear infinite, starfield-twinkle 8s ease-in-out infinite alternate;
  will-change: background-position, opacity;
}

.space-stars::before,
.space-stars::after,
.how-page::before,
.transition-stars {
  animation: starfield-layer-drift 100s linear infinite, starfield-twinkle 7s ease-in-out infinite alternate;
  will-change: background-position, opacity;
}

.how-stars { z-index: -2; }

.pricing-page::after {
  position: absolute;
  z-index: -2;
  inset: -3%;
  content: "";
  pointer-events: none;
  opacity: .4;
  background-image:
    radial-gradient(1px 1px at 23px 45px, rgba(255,255,255,.95) 99%, transparent),
    radial-gradient(1px 1px at 157px 113px, rgba(163,213,255,.9) 99%, transparent),
    radial-gradient(1.5px 1.5px at 287px 24px, rgba(224,221,255,.9) 99%, transparent),
    radial-gradient(1px 1px at 411px 171px, rgba(153,234,255,.9) 99%, transparent),
    radial-gradient(1px 1px at 523px 77px, rgba(255,255,255,.88) 99%, transparent);
  background-size: 570px 210px;
  background-repeat: repeat;
  animation: starfield-layer-drift 104s linear infinite, starfield-twinkle 7s ease-in-out infinite alternate;
}

/* Add finer, distant stars to pricing and each later account/payment/analyzer page. */
.account-stars::before,
.checkout-stars::before,
.success-stars::before,
.upi-demo-stars::before,
.analyzer-stars::before {
  position: absolute;
  inset: -4%;
  content: "";
  pointer-events: none;
  opacity: .4;
  background-image:
    radial-gradient(1px 1px at 18px 31px, rgba(255,255,255,.95) 99%, transparent),
    radial-gradient(1px 1px at 103px 87px, rgba(170,220,255,.9) 99%, transparent),
    radial-gradient(1.5px 1.5px at 211px 54px, rgba(222,215,255,.9) 99%, transparent),
    radial-gradient(1px 1px at 294px 139px, rgba(160,233,255,.9) 99%, transparent),
    radial-gradient(1px 1px at 364px 21px, rgba(255,255,255,.88) 99%, transparent);
  background-size: 390px 190px;
  background-repeat: repeat;
  animation: starfield-layer-drift 96s linear infinite, starfield-twinkle 6.5s ease-in-out infinite alternate;
}

@keyframes starfield-drift {
  from { background-position: 0 0; }
  to { background-position: 420px 230px; }
}

@keyframes starfield-layer-drift {
  from { background-position: 0 0; }
  to { background-position: -360px 240px; }
}

@keyframes starfield-twinkle {
  from { opacity: .72; }
  to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .account-stars,
  .account-stars::before,
  .checkout-stars,
  .checkout-stars::before,
  .success-stars,
  .success-stars::before,
  .upi-demo-stars,
  .upi-demo-stars::before,
  .analyzer-stars,
  .analyzer-stars::before,
  .pricing-page::before {
    animation: none !important;
    will-change: auto;
  }
  .pricing-page::after { animation: none !important; will-change: auto; }
  .space-stars,
  .space-stars::before,
  .space-stars::after,
  .transition-stars,
  .how-stars,
  .how-page::before {
    animation: none !important;
    will-change: auto;
  }
}
