.hero-red-dwarf__night-sky {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.hero-red-dwarf__night-sky .star {
  transform-origin: center;
  transform-box: fill-box;
}

.hero-red-dwarf__night-sky .star--twinkle-1 {
  animation: star-blink-1 2.8s ease-in-out infinite;
}
.hero-red-dwarf__night-sky .star--twinkle-2 {
  animation: star-blink-2 4.1s ease-in-out infinite 0.75s;
}
.hero-red-dwarf__night-sky .star--twinkle-3 {
  animation: star-blink-3 3.4s ease-in-out infinite 1.4s;
}
.hero-red-dwarf__night-sky .star--twinkle-4 {
  animation: star-blink-4 5.2s ease-in-out infinite 2.2s;
}
.hero-red-dwarf__night-sky .star--beacon {
  animation: star-beacon-pulse 4.6s ease-in-out infinite;
}

@keyframes star-blink-1 {
  0%, 100% { opacity: 0.20; transform: scale(0.75); }
  35% { opacity: 0.95; transform: scale(1.18); }
  52% { opacity: 0.32; transform: scale(0.85); }
  72% { opacity: 0.88; transform: scale(1.06); }
}
@keyframes star-blink-2 {
  0%, 100% { opacity: 0.78; transform: scale(1.02); }
  28% { opacity: 0.16; transform: scale(0.72); }
  62% { opacity: 1.0; transform: scale(1.22); }
  82% { opacity: 0.38; transform: scale(0.85); }
}
@keyframes star-blink-3 {
  0%, 100% { opacity: 0.22; transform: scale(0.8); }
  45% { opacity: 0.92; transform: scale(1.12); }
  60% { opacity: 0.28; transform: scale(0.82); }
  85% { opacity: 0.82; transform: scale(1.04); }
}
@keyframes star-blink-4 {
  0%, 100% { opacity: 0.35; transform: scale(0.85); }
  22% { opacity: 0.96; transform: scale(1.16); }
  42% { opacity: 0.22; transform: scale(0.78); }
  68% { opacity: 0.88; transform: scale(1.08); }
  84% { opacity: 0.18; transform: scale(0.72); }
}
@keyframes star-beacon-pulse {
  0%, 100% { opacity: 0.42; filter: drop-shadow(0 0 2px rgba(255, 240, 220, 0.45)); transform: scale(0.88); }
  50% { opacity: 1.0; filter: drop-shadow(0 0 5px rgba(255, 240, 220, 0.95)) drop-shadow(0 0 11px rgba(255, 185, 130, 0.5)); transform: scale(1.18); }
}
