.navbar {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 30px;
  width: 100vw;
  height: 100vh;
  background: #000010;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  overflow: hidden;
  flex-direction: row;
}

.navbar::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 1px;
  background: transparent;
  box-shadow:
    10px 20px #fff,
    50px 80px #fff,
    120px 150px #fff,
    200px 90px #fff,
    300px 200px #fff,
    400px 50px #fff,
    550px 180px #fff,
    600px 120px #fff,
    700px 250px #fff,
    30px 300px #fff,
    80px 400px #fff,
    150px 500px #fff,
    220px 450px #fff,
    330px 350px #fff,
    410px 420px #fff,
    480px 100px #fff,
    560px 330px #fff,
    640px 240px #fff,
    720px 380px #fff,
    800px 150px #fff,
    880px 220px #fff,
    950px 420px #fff,
    1020px 300px #fff,
    1100px 180px #fff,
    1180px 400px #fff,
    1250px 200px #fff,
    1320px 100px #fff,
    1400px 350px #fff,
    1480px 250px #fff,
    1550px 50px #fff,
    1620px 430px #fff,
    1700px 180px #fff,
    1780px 300px #fff,
    1850px 220px #fff,
    1920px 400px #fff,
    10px 500px #fff,
    100px 600px #fff,
    200px 550px #fff,
    300px 620px #fff,
    400px 580px #fff,
    500px 650px #fff,
    600px 700px #fff,
    700px 620px #fff,
    800px 680px #fff,
    900px 720px #fff,
    1000px 640px #fff,
    1100px 700px #fff,
    1200px 750px #fff,
    1300px 680px #fff,
    1400px 720px #fff,
    1500px 690px #fff,
    1600px 730px #fff,
    1700px 750px #fff,
    1800px 700px #fff,
    1900px 750px #fff,
    2000px 720px #fff;
  animation: twinkle1 5s linear infinite;
  pointer-events: none;
}

.navbar::after {
  content: '';
  position: absolute;
  width: 1px;
  height: 1px;
  box-shadow:
    1500px 50px #fff,
    1550px 80px #fff,
    1600px 100px #fff,
    1650px 60px #fff,
    1700px 90px #fff,
    1750px 40px #fff,
    1800px 120px #fff,
    1850px 70px #fff,
    1900px 90px #fff,
    1950px 50px #fff,
    2000px 100px #fff,
    2050px 80px #fff,
    2100px 60px #fff,
    2150px 110px #fff,
    2200px 40px #fff,
    2250px 90px #fff,
    2300px 70px #fff,
    2350px 50px #fff,
    2400px 100px #fff,
    10px 50px #fff,
    60px 120px #fff,
    140px 200px #fff,
    210px 80px #fff,
    320px 150px #fff,
    410px 60px #fff,
    520px 190px #fff,
    610px 130px #fff,
    710px 260px #fff,
    40px 320px #fff,
    90px 420px #fff,
    170px 510px #fff,
    230px 470px #fff,
    340px 360px #fff,
    420px 430px #fff,
    490px 120px #fff,
    570px 340px #fff,
    650px 250px #fff,
    730px 390px #fff,
    810px 160px #fff,
    890px 230px #fff,
    960px 410px #fff,
    1030px 310px #fff,
    1110px 190px #fff,
    1190px 410px #fff,
    1260px 210px #fff,
    1330px 120px #fff,
    1410px 360px #fff,
    1490px 260px #fff,
    1560px 60px #fff,
    1630px 440px #fff,
    1710px 190px #fff,
    1790px 310px #fff,
    1860px 230px #fff,
    1930px 410px #fff,
    20px 510px #fff,
    110px 610px #fff,
    210px 560px #fff,
    310px 630px #fff,
    410px 590px #fff,
    510px 660px #fff,
    610px 710px #fff,
    710px 630px #fff,
    810px 690px #fff,
    910px 730px #fff,
    1010px 650px #fff,
    1110px 710px #fff,
    1210px 760px #fff,
    1310px 690px #fff,
    1410px 730px #fff,
    1510px 700px #fff,
    1610px 740px #fff,
    1710px 760px #fff,
    1810px 710px #fff,
    1910px 760px #fff,
    2010px 730px #fff,
    1520px 20px #fff,
    1575px 35px #fff,
    1625px 10px #fff,
    1670px 50px #fff,
    1725px 25px #fff,
    1775px 60px #fff,
    1820px 15px #fff,
    1875px 45px #fff,
    1925px 30px #fff,
    1975px 55px #fff,
    2025px 20px #fff,
    2075px 40px #fff,
    2125px 15px #fff,
    2175px 60px #fff,
    2225px 25px #fff,
    2275px 50px #fff,
    2325px 35px #fff,
    2375px 10px #fff,
    2425px 45px #fff,
    2475px 20px #fff;
  animation: twinkle2 4s linear infinite;
}

@keyframes twinkle1 {
  0%, 100% { opacity: 0.8; }
  50% { opacity: 0.2; }
}

@keyframes twinkle2 {
  0%, 100% { opacity: 0.5; }
  50% { opacity: 0.3; }
}

.navbar a {
  padding: 12px 25px;
  text-decoration: none;
  font-weight: bold;
  color: white;
  border-radius: 12px;
  background: linear-gradient(45deg, #6a11cb, #2575fc);
  box-shadow: 0 0 10px rgba(255,255,255,0.6),
              0 0 20px rgba(106,17,203,0.5),
              0 0 30px rgba(37,117,252,0.4);
  transition: all 0.4s ease;
  position: relative;
  z-index: 1;
}

.navbar a:hover {
  transform: scale(1.2) rotate(-2deg);
  background: linear-gradient(45deg, #ff6ec4, #7873f5, #00ffff);
  box-shadow: 0 0 15px #fff,
              0 0 25px #ff6ec4,
              0 0 35px #00ffff,
              0 0 45px #7873f5;
  text-shadow: 0 0 5px #fff, 0 0 10px #00ffff;
}

.navbar a::after {
  content: '★';
  position: absolute;
  top: -8px;
  right: -8px;
  font-size: 10px;
  color: #fff;
  animation: orbit 2s linear infinite;
}

@keyframes orbit {
  0% { transform: rotate(0deg) translateX(5px) rotate(0deg); }
  100% { transform: rotate(360deg) translateX(5px) rotate(-360deg); }
}