.bga-03,
.bga-03 *,
.bga-03 *::before,
.bga-03 *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.bga-03 {
    width: 100%;
    height: 100%;

    position: absolute;

    display: grid;
    place-items: stretch;
}

.bga-03__scene {
    overflow: hidden;
    top: 0;
    left: 0;
}

.bga-03__stars,
.bga-03__stars2,
.bga-03__stars3 {
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 1px;
    background: transparent;
    border-radius: 50%;
}

.bga-03__stars {
    box-shadow: 120px 340px #F1E0C5, 700px 120px #F1E0C5, 300px 560px #F1E0C5, 980px 410px #F1E0C5, 540px 80px #F1E0C5, 1300px 300px #F1E0C5, 220px 760px #F1E0C5, 860px 640px #F1E0C5, 1500px 540px #F1E0C5, 60px 200px #F1E0C5, 1100px 700px #F1E0C5, 400px 250px #F1E0C5, 760px 480px #F1E0C5, 1700px 180px #F1E0C5, 1000px 60px #F1E0C5;
    animation: bga-03-twinkle 4s ease-in-out infinite alternate, bga-03-scrollUp 90s linear infinite;
}

.bga-03__stars2 {
    box-shadow: 200px 500px #F1E0C5, 640px 300px #F1E0C5, 1200px 150px #F1E0C5, 480px 700px #F1E0C5, 900px 520px #F1E0C5, 1450px 380px #F1E0C5, 100px 640px #F1E0C5, 1600px 700px #F1E0C5, 340px 120px #F1E0C5, 1050px 440px #F1E0C5;
    width: 2px;
    height: 2px;
    animation: bga-03-twinkle 6s ease-in-out infinite alternate, bga-03-scrollUp 130s linear infinite;
}

.bga-03__stars3 {
    box-shadow: 420px 360px #F1E0C5, 880px 200px #F1E0C5, 1350px 600px #F1E0C5, 160px 80px #F1E0C5, 1550px 280px #F1E0C5, 720px 700px #F1E0C5, 60px 460px #F1E0C5;
    width: 3px;
    height: 3px;
    animation: bga-03-twinkle 5s ease-in-out infinite alternate, bga-03-scrollUp 180s linear infinite;
}

.bga-03__nebula {
    position: absolute;
    inset: -10%;
    background: radial-gradient(35% 40% at 25% 30%, #6108a539, transparent 60%), radial-gradient(40% 45% at 75% 40%, #a5083f27, transparent 60%), radial-gradient(30% 30% at 40% 80%, #080da53c, transparent 60%);
    filter: blur(20px);
    animation: bga-03-nebulaShift 40s ease-in-out infinite alternate;
}

@keyframes bga-03-twinkle {
    0% {
        opacity: 0.3;
    }

    100% {
        opacity: 1;
    }
}

@keyframes bga-03-scrollUp {
  from {
    transform: translateY(0);
  }

  to {
    transform: translateY(-800px);
  }
}

@keyframes bga-03-nebulaShift {
  0% {
    transform: translate(-2%, -1%) scale(1.05);
  }

  100% {
    transform: translate(2%, 2%) scale(1.15);
  }
}

@media (prefers-reduced-motion: reduce) {
    .bga-03__stars,
    .bga-03__stars2,
    .bga-03__stars3,
    .bga-03__nebula {
    animation: none !important;
  }
}