.circle {
    z-index: 999999;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    pointer-events: none;
    animation: colors 5s infinite;
    position: fixed;
    transform: translate(-50%, -50%);
}

.circle::before {
    content: "";
    position: fixed;
    width: 50px;
    height: 50px;
    opacity: 0.2;
    transform: translate(-30%, -30%);
    border-radius: 50%;
}

.dark-mode .circle {
    animation: darkColors 5s infinite;
    transform: translate(-50%, -50%);
}

@keyframes darkColors {
    0% {
        background-color: #ff69b4;
    }

    20% {
        background-color: #f65787;
    }

    40% {
        background-color: #f12771;
    }

    60% {
        background-color: #f51659;
    }

    100% {
        background-color: #f9055a;
    }
}