main {
    display: var(--display-desktop);
    height: 100%;
    width: 100%;
    z-index: var(--z-index-foreground);
}

main[mobile] { 
    display: var(--display-mobile);
    left: 0;
    position: fixed;
    top: 0;
}

main::after {
    background: radial-gradient(circle at 45.5% 12.5%, 
        rgb(255, 255, 255) 50px,
        var(--color-sun) 51px, 
        var(--color-sun) 70px,
        rgb(255, 255, 255, 0) 71px, 
        rgb(255, 255, 255, 0) 100%);
    background-position: 70% 70%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: '';
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    transform: rotate(var(--theme-sun-rotation));
    transition: transform var(--time-sky-transition);
    width: 100%;
    z-index: var(--z-index-background);
}

main::before {
    background: 
        radial-gradient(1px 1px at 20px 0px, rgb(255, 255, 255), transparent),
        radial-gradient(2px 2px at 140px 45px, rgb(255, 255, 255), transparent),
        radial-gradient(1px 1px at 50px 160px, rgb(255, 255, 255), transparent),
        radial-gradient(2px 2px at 70px 90px, rgb(255, 255, 255), transparent),
        radial-gradient(1px 1px at 120px 110px, rgb(255, 255, 255), transparent),
        radial-gradient(2px 2px at 25px 20px, rgb(255, 255, 255), transparent),
        radial-gradient(1px 1px at 80px 120px, rgb(255, 255, 255), transparent),
        radial-gradient(2px 2px at 140px 140px, rgb(255, 255, 255), transparent),
        radial-gradient(1px 1px at 25px 50px, rgb(255, 255, 255), transparent),
        radial-gradient(2px 2px at 55px 25px, rgb(255, 255, 255), transparent),
        radial-gradient(1px 1px at 50px 100px, rgb(255, 255, 255), transparent),
        radial-gradient(2px 2px at 25px 120px, rgb(255, 255, 255), transparent),
        radial-gradient(1px 1px at 85px 65px, rgb(255, 255, 255), transparent),
        radial-gradient(2px 2px at 60px 140px, rgb(255, 255, 255), transparent),
        radial-gradient(1px 1px at 160px 40px, rgb(255, 255, 255), transparent),
        radial-gradient(2px 2px at 145px 90px, rgb(255, 255, 255), transparent);
    background-repeat: repeat;
    background-size: 200px 200px;
    content: '';
    height: 100%;
    left: 0;
    opacity: var(--theme-star-opacity);
    position: fixed;
    top: 0;;
    transition: opacity var(--time-sky-transition);
    width: 100%;
    z-index: var(--z-index-background);
}