@keyframes move {
  100% {
    transform: translate3d(0, 0, 1px) rotate(360deg);
  }
}

@keyframes pulse {
  0%, 100% {
    transform: scale(1);
    opacity: 0.8;
  }
  50% {
    transform: scale(1.2);
    opacity: 1;
  }
}

.background {
  position: fixed;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
  background: radial-gradient(ellipse at center, #050510 0%, #000000 100%);
  overflow: hidden;
  z-index: -1;
}

.background span {
  width: 40vmin;
  height: 40vmin;
  border-radius: 50%;
  position: absolute;
  animation: move infinite linear, pulse 6s ease-in-out infinite;
  mix-blend-mode: screen;
  filter: blur(0.4vmin);
}

.background span:nth-child(odd) {
  background: rgba(0, 255, 255, 0.15); /* Cyan Glow */
  box-shadow: 0 0 12vmin rgba(0, 255, 255, 0.6);
}

.background span:nth-child(even) {
  background: rgba(255, 0, 255, 0.1); /* Magenta Glow */
  box-shadow: 0 0 12vmin rgba(255, 0, 255, 0.5);
}

/* Optional: ein paar spezielle Farben für mehr Kontrast */
.background span:nth-child(3n) {
  background: rgba(0, 255, 100, 0.1); /* Lime Glow */
  box-shadow: 0 0 10vmin rgba(0, 255, 100, 0.6);
}
.background span:nth-child(5n) {
  background: rgba(0, 100, 255, 0.15); /* Electric Blue */
  box-shadow: 0 0 14vmin rgba(0, 100, 255, 0.7);
}
@keyframes move {
    100% {
        transform: translate3d(0, 0, 1px) rotate(360deg);
    }
}

.background {
    position: fixed;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
    background: #14012d;
    overflow: hidden;
}

.background span {
    width: 50vmin;
    height: 50vmin;
    border-radius: 50vmin;
    backface-visibility: hidden;
    position: absolute;
    animation: move;
    animation-duration: 26;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}


.background span:nth-child(0) {
    color: #3f0665;
    top: 22%;
    left: 10%;
    animation-duration: 49s;
    animation-delay: -163s;
    transform-origin: -11vw 17vh;
    box-shadow: 100vmin 0 13.289079708561928vmin currentColor;
}
.background span:nth-child(1) {
    color: #1b0245;
    top: 18%;
    left: 47%;
    animation-duration: 100s;
    animation-delay: -134s;
    transform-origin: 3vw 10vh;
    box-shadow: -100vmin 0 12.817292265392808vmin currentColor;
}
.background span:nth-child(2) {
    color: #1b0245;
    top: 87%;
    left: 25%;
    animation-duration: 108s;
    animation-delay: -213s;
    transform-origin: 2vw 2vh;
    box-shadow: 100vmin 0 12.570544971911943vmin currentColor;
}
.background span:nth-child(3) {
    color: #E45A84;
    top: 47%;
    left: 61%;
    animation-duration: 165s;
    animation-delay: -212s;
    transform-origin: 2vw 10vh;
    box-shadow: -100vmin 0 12.83893841474773vmin currentColor;
}
.background span:nth-child(4) {
    color: #3f0665;
    top: 26%;
    left: 69%;
    animation-duration: 31s;
    animation-delay: -71s;
    transform-origin: -22vw 17vh;
    box-shadow: -100vmin 0 13.37906089276755vmin currentColor;
}
.background span:nth-child(5) {
    color: #E45A84;
    top: 64%;
    left: 88%;
    animation-duration: 149s;
    animation-delay: -68s;
    transform-origin: -10vw -16vh;
    box-shadow: 100vmin 0 12.749852582354036vmin currentColor;
}
.background span:nth-child(6) {
    color: #3f0665;
    top: 75%;
    left: 54%;
    animation-duration: 69s;
    animation-delay: -220s;
    transform-origin: -6vw 10vh;
    box-shadow: -100vmin 0 12.629325965044353vmin currentColor;
}
.background span:nth-child(7) {
    color: #E45A84;
    top: 54%;
    left: 71%;
    animation-duration: 83s;
    animation-delay: -92s;
    transform-origin: -5vw 15vh;
    box-shadow: -100vmin 0 13.048864740470624vmin currentColor;
}
.background span:nth-child(8) {
    color: #E45A84;
    top: 60%;
    left: 17%;
    animation-duration: 160s;
    animation-delay: -80s;
    transform-origin: -23vw -17vh;
    box-shadow: 100vmin 0 13.443576797223736vmin currentColor;
}
.background span:nth-child(9) {
    color: #1b0245;
    top: 69%;
    left: 14%;
    animation-duration: 39s;
    animation-delay: -14s;
    transform-origin: -13vw 10vh;
    box-shadow: 100vmin 0 12.799989204902396vmin currentColor;
}
.background span:nth-child(10) {
    color: #1b0245;
    top: 42%;
    left: 12%;
    animation-duration: 132s;
    animation-delay: -48s;
    transform-origin: -2vw 15vh;
    box-shadow: 100vmin 0 13.3512213692514vmin currentColor;
}
.background span:nth-child(11) {
    color: #3f0665;
    top: 58%;
    left: 91%;
    animation-duration: 212s;
    animation-delay: -201s;
    transform-origin: -8vw 14vh;
    box-shadow: 100vmin 0 12.830973239837618vmin currentColor;
}
.background span:nth-child(12) {
    color: #3f0665;
    top: 38%;
    left: 99%;
    animation-duration: 145s;
    animation-delay: -9s;
    transform-origin: -13vw -23vh;
    box-shadow: 100vmin 0 13.3117881995398vmin currentColor;
}
.background span:nth-child(13) {
    color: #1b0245;
    top: 95%;
    left: 89%;
    animation-duration: 84s;
    animation-delay: -160s;
    transform-origin: 15vw 21vh;
    box-shadow: -100vmin 0 13.116111480748726vmin currentColor;
}
.background span:nth-child(14) {
    color: #E45A84;
    top: 46%;
    left: 30%;
    animation-duration: 123s;
    animation-delay: -203s;
    transform-origin: 10vw -16vh;
    box-shadow: 100vmin 0 12.618026806803046vmin currentColor;
}
.background span:nth-child(15) {
    color: #E45A84;
    top: 44%;
    left: 18%;
    animation-duration: 101s;
    animation-delay: -187s;
    transform-origin: -11vw -3vh;
    box-shadow: -100vmin 0 13.100753747074886vmin currentColor;
}
.background span:nth-child(16) {
    color: #3f0665;
    top: 14%;
    left: 8%;
    animation-duration: 59s;
    animation-delay: -104s;
    transform-origin: 17vw 25vh;
    box-shadow: -100vmin 0 13.354879491431328vmin currentColor;
}
.background span:nth-child(17) {
    color: #E45A84;
    top: 34%;
    left: 18%;
    animation-duration: 16s;
    animation-delay: -201s;
    transform-origin: 19vw -14vh;
    box-shadow: 100vmin 0 13.21836356743373vmin currentColor;
}
.background span:nth-child(18) {
    color: #E45A84;
    top: 96%;
    left: 50%;
    animation-duration: 181s;
    animation-delay: -139s;
    transform-origin: 12vw -3vh;
    box-shadow: -100vmin 0 12.526344516840458vmin currentColor;
}
.background span:nth-child(19) {
    color: #1b0245;
    top: 54%;
    left: 5%;
    animation-duration: 74s;
    animation-delay: -45s;
    transform-origin: 21vw -2vh;
    box-shadow: 100vmin 0 12.745357710403608vmin currentColor;
}
.background span:nth-child(20) {
    color: #3f0665;
    top: 65%;
    left: 26%;
    animation-duration: 57s;
    animation-delay: -177s;
    transform-origin: 12vw 16vh;
    box-shadow: -100vmin 0 13.157556982087264vmin currentColor;
}
.background span:nth-child(21) {
    color: #E45A84;
    top: 59%;
    left: 32%;
    animation-duration: 107s;
    animation-delay: -163s;
    transform-origin: -7vw -1vh;
    box-shadow: 100vmin 0 12.898299487766495vmin currentColor;
}
.background span:nth-child(22) {
    color: #3f0665;
    top: 36%;
    left: 49%;
    animation-duration: 10s;
    animation-delay: -69s;
    transform-origin: -17vw 16vh;
    box-shadow: -100vmin 0 12.544559345204329vmin currentColor;
}
.background span:nth-child(23) {
    color: #E45A84;
    top: 55%;
    left: 72%;
    animation-duration: 233s;
    animation-delay: -121s;
    transform-origin: 13vw -16vh;
    box-shadow: -100vmin 0 12.90379082782701vmin currentColor;
}
.background span:nth-child(24) {
    color: #E45A84;
    top: 39%;
    left: 40%;
    animation-duration: 155s;
    animation-delay: -153s;
    transform-origin: 13vw -24vh;
    box-shadow: -100vmin 0 13.047977922576392vmin currentColor;
}
.background span:nth-child(25) {
    color: #E45A84;
    top: 83%;
    left: 77%;
    animation-duration: 66s;
    animation-delay: -23s;
    transform-origin: 10vw 7vh;
    box-shadow: 100vmin 0 13.145273531587057vmin currentColor;
}
.background span:nth-child(26) {
    color: #3f0665;
    top: 15%;
    left: 24%;
    animation-duration: 152s;
    animation-delay: -63s;
    transform-origin: -20vw -16vh;
    box-shadow: -100vmin 0 12.65531445838948vmin currentColor;
}
.background span:nth-child(27) {
    color: #3f0665;
    top: 90%;
    left: 60%;
    animation-duration: 232s;
    animation-delay: -144s;
    transform-origin: -7vw -1vh;
    box-shadow: 100vmin 0 12.644431355679588vmin currentColor;
}
.background span:nth-child(28) {
    color: #3f0665;
    top: 81%;
    left: 79%;
    animation-duration: 211s;
    animation-delay: -186s;
    transform-origin: 4vw 8vh;
    box-shadow: 100vmin 0 12.555553821951957vmin currentColor;
}
.background span:nth-child(29) {
    color: #1b0245;
    top: 96%;
    left: 54%;
    animation-duration: 133s;
    animation-delay: -40s;
    transform-origin: 10vw 20vh;
    box-shadow: 100vmin 0 13.463730888384966vmin currentColor;
}
.background span:nth-child(30) {
    color: #1b0245;
    top: 24%;
    left: 74%;
    animation-duration: 167s;
    animation-delay: -27s;
    transform-origin: 0vw 16vh;
    box-shadow: -100vmin 0 13.419635813754894vmin currentColor;
}
.background span:nth-child(31) {
    color: #E45A84;
    top: 9%;
    left: 52%;
    animation-duration: 15s;
    animation-delay: -46s;
    transform-origin: -11vw -5vh;
    box-shadow: -100vmin 0 13.158741888400149vmin currentColor;
}
.background span:nth-child(32) {
    color: #3f0665;
    top: 55%;
    left: 76%;
    animation-duration: 168s;
    animation-delay: -141s;
    transform-origin: -14vw 12vh;
    box-shadow: -100vmin 0 13.214970257138376vmin currentColor;
}