.sky {
    position: fixed;
    inset: 0;
    background: linear-gradient(to top, #050008, #1b0033);
    animation: dayNight 30s infinite alternate;
    z-index: -3;
}

.city {
    position: fixed;
    inset: 0;
    background:
        linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.6)),
        url("https://images.unsplash.com/photo-1494526585095-c41746248156");
    background-size: cover;
    background-position: center;
    animation: cityLight 30s infinite alternate;
    z-index: -2;
}

@keyframes dayNight {
    0% {
        background: linear-gradient(to top, #050008, #1b0033);
    }
    100% {
        background: linear-gradient(to top, #5e2b97, #c77dff);
    }
}

@keyframes cityLight {
    0% {
        filter: brightness(0.6) saturate(1.2);
    }
    100% {
        filter: brightness(1) saturate(1);
    }
}
