.site-starfield {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
    background: radial-gradient(ellipse at bottom, #142234 0%, #070b12 100%);
}

.site-starfield-glow {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 20% 15%, rgba(118, 182, 255, 0.08), transparent 22%),
        radial-gradient(circle at 75% 0%, rgba(212, 175, 55, 0.08), transparent 20%),
        radial-gradient(circle at 50% 100%, rgba(255, 95, 109, 0.06), transparent 24%);
}

#stars,
#stars2,
#stars3 {
    position: absolute;
    inset: 0;
    background: transparent;
}

#stars {
    width: 1px;
    height: 1px;
    box-shadow:
        42px 128px #fff, 88px 342px #fff, 125px 968px #fff, 162px 1455px #fff, 208px 613px #fff,
        255px 1788px #fff, 301px 420px #fff, 344px 1224px #fff, 391px 1738px #fff, 438px 242px #fff,
        477px 835px #fff, 518px 1501px #fff, 563px 1120px #fff, 621px 301px #fff, 659px 1879px #fff,
        712px 642px #fff, 748px 1328px #fff, 809px 211px #fff, 854px 903px #fff, 892px 1645px #fff,
        944px 511px #fff, 988px 1261px #fff, 1042px 1820px #fff, 1097px 267px #fff, 1145px 730px #fff,
        1192px 1488px #fff, 1234px 1099px #fff, 1291px 387px #fff, 1338px 1764px #fff, 1394px 862px #fff,
        1441px 120px #fff, 1498px 1581px #fff, 1536px 1014px #fff, 1582px 522px #fff, 1630px 1886px #fff,
        1684px 716px #fff, 1738px 1361px #fff, 1794px 302px #fff, 1848px 972px #fff, 1895px 1706px #fff,
        1948px 438px #fff, 1986px 1184px #fff, 76px 1874px #fff, 146px 87px #fff, 229px 934px #fff,
        287px 1542px #fff, 366px 695px #fff, 426px 1298px #fff, 502px 53px #fff, 578px 1715px #fff,
        645px 851px #fff, 726px 1432px #fff, 786px 412px #fff, 867px 1191px #fff, 936px 1966px #fff,
        1012px 611px #fff, 1089px 1560px #fff, 1168px 338px #fff, 1252px 868px #fff, 1329px 1944px #fff,
        1418px 597px #fff, 1490px 1378px #fff, 1569px 258px #fff, 1662px 824px #fff, 1740px 1808px #fff,
        1833px 545px #fff, 1918px 1304px #fff;
    animation: starDrift 70s linear infinite;
}

#stars::after {
    content: "";
    position: absolute;
    top: 2000px;
    width: 1px;
    height: 1px;
    box-shadow: inherit;
}

#stars2 {
    width: 2px;
    height: 2px;
    box-shadow:
        118px 520px #fff, 246px 1394px #fff, 381px 1042px #fff, 504px 232px #fff, 628px 1766px #fff,
        761px 874px #fff, 894px 1462px #fff, 1016px 332px #fff, 1148px 1179px #fff, 1286px 1868px #fff,
        1405px 642px #fff, 1542px 1245px #fff, 1670px 412px #fff, 1798px 981px #fff, 1912px 1654px #fff,
        94px 1138px #fff, 224px 304px #fff, 353px 1902px #fff, 489px 780px #fff, 604px 1514px #fff,
        733px 98px #fff, 871px 1280px #fff, 997px 565px #fff, 1121px 1740px #fff, 1258px 723px #fff,
        1388px 1418px #fff, 1524px 271px #fff, 1656px 1032px #fff, 1774px 1526px #fff, 1899px 459px #fff;
    animation: starDrift 110s linear infinite;
}

#stars2::after {
    content: "";
    position: absolute;
    top: 2000px;
    width: 2px;
    height: 2px;
    box-shadow: inherit;
}

#stars3 {
    width: 3px;
    height: 3px;
    box-shadow:
        182px 867px #fff, 524px 1438px #fff, 807px 334px #fff, 1098px 1222px #fff, 1366px 662px #fff,
        1635px 1729px #fff, 1904px 1044px #fff, 273px 1789px #fff, 692px 968px #fff, 956px 245px #fff,
        1244px 1576px #fff, 1512px 488px #fff, 1781px 1334px #fff, 340px 562px #fff, 620px 1882px #fff,
        914px 1468px #fff, 1180px 795px #fff, 1472px 109px #fff;
    animation: starDrift 150s linear infinite;
}

#stars3::after {
    content: "";
    position: absolute;
    top: 2000px;
    width: 3px;
    height: 3px;
    box-shadow: inherit;
}

body > *:not(.site-starfield) {
    position: relative;
    z-index: 1;
}

@keyframes starDrift {
    from {
        transform: translateY(0);
    }
    to {
        transform: translateY(-2000px);
    }
}