.star-layer,
.twinkle-layer{
  position:absolute;
  inset:0;
  pointer-events:none;
}

.star-layer-1{
  background-image:
    radial-gradient(2px 2px at 15% 20%, rgba(255,255,255,.95), transparent 60%),
    radial-gradient(1.5px 1.5px at 75% 30%, rgba(240,207,136,.9), transparent 60%),
    radial-gradient(2px 2px at 35% 75%, rgba(255,255,255,.85), transparent 60%),
    radial-gradient(1.2px 1.2px at 85% 18%, rgba(255,255,255,.9), transparent 60%),
    radial-gradient(1.4px 1.4px at 8% 78%, rgba(240,207,136,.8), transparent 60%),
    radial-gradient(1.5px 1.5px at 60% 12%, rgba(255,255,255,.8), transparent 60%);
  opacity:.7;
  animation:starDrift1 42s linear infinite;
}

.star-layer-2{
  background-image:
    radial-gradient(1px 1px at 12% 66%, rgba(255,255,255,.7), transparent 60%),
    radial-gradient(1.2px 1.2px at 68% 70%, rgba(240,207,136,.7), transparent 60%),
    radial-gradient(1px 1px at 42% 24%, rgba(255,255,255,.75), transparent 60%),
    radial-gradient(1px 1px at 90% 52%, rgba(255,255,255,.65), transparent 60%),
    radial-gradient(1.3px 1.3px at 26% 44%, rgba(240,207,136,.65), transparent 60%);
  opacity:.45;
  animation:starDrift2 58s linear infinite reverse;
}

.twinkle-layer{
  background-image:
    radial-gradient(2px 2px at 22% 33%, rgba(255,255,255,1), transparent 60%),
    radial-gradient(2px 2px at 77% 61%, rgba(240,207,136,1), transparent 60%),
    radial-gradient(1.8px 1.8px at 48% 19%, rgba(255,255,255,1), transparent 60%);
  opacity:.18;
  animation:twinkle 7s ease-in-out infinite;
}