.navsky{
    position:fixed; inset:0; z-index:0; overflow:hidden; pointer-events:none;
    contain:layout paint style;
    background:
      radial-gradient(128% 86% at 50% 42%, transparent 46%, rgba(0,0,0,.30) 78%, rgba(0,0,0,.62) 100%),
      radial-gradient(120% 72% at 14% -16%, rgba(66,112,214,.28), transparent 62%),
      radial-gradient(104% 62% at 90% 0%, rgba(126,86,204,.24), transparent 60%),
      radial-gradient(160% 92% at 50% 124%, rgba(24,58,124,.46), transparent 64%),
      linear-gradient(180deg,#070e1e,#060b18 46%,#03050d);
  }
  .navsky .neb{
    position:absolute; inset:-18%; will-change:transform;
    background:
      radial-gradient(40% 32% at 24% 20%, rgba(70,124,226,.26), transparent 72%),
      radial-gradient(34% 28% at 78% 28%, rgba(132,88,212,.22), transparent 72%),
      radial-gradient(32% 26% at 60% 76%, rgba(38,102,176,.20), transparent 72%);
    animation:nskyNeb 280s ease-in-out infinite alternate;
  }
  .navsky .way{
    position:absolute; inset:-30% -12%; filter:blur(20px);
    background:linear-gradient(105deg, transparent 31%, rgba(150,182,255,.07) 42%,
      rgba(206,188,255,.13) 49.5%, rgba(150,182,255,.06) 57%, transparent 67%);
  }
  .navsky .lay{position:absolute; left:0; right:0; background-repeat:repeat; will-change:transform}
  .navsky .l1{
    top:-320px; height:calc(100% + 320px); background-size:320px 320px;
    animation:nskyDrift1 300s linear infinite;
    background-image:
      radial-gradient(0.8px 0.8px at 93.0% 38.2%, rgba(198,214,242,.62), transparent),
      radial-gradient(0.9px 0.9px at 81.3% 43.4%, rgba(222,232,250,.52), transparent),
      radial-gradient(1.0px 1.0px at 4.1% 90.2%, rgba(176,198,234,.46), transparent),
      radial-gradient(0.8px 0.8px at 33.1% 25.2%, rgba(198,214,242,.62), transparent),
      radial-gradient(0.9px 0.9px at 19.0% 5.4%, rgba(222,232,250,.52), transparent),
      radial-gradient(1.0px 1.0px at 19.4% 44.6%, rgba(176,198,234,.46), transparent),
      radial-gradient(0.8px 0.8px at 81.0% 85.3%, rgba(198,214,242,.62), transparent),
      radial-gradient(0.9px 0.9px at 32.7% 44.6%, rgba(222,232,250,.52), transparent),
      radial-gradient(1.0px 1.0px at 28.4% 88.6%, rgba(176,198,234,.46), transparent),
      radial-gradient(0.8px 0.8px at 59.0% 78.6%, rgba(198,214,242,.62), transparent),
      radial-gradient(0.9px 0.9px at 62.5% 50.3%, rgba(222,232,250,.52), transparent),
      radial-gradient(1.0px 1.0px at 66.8% 93.0%, rgba(176,198,234,.46), transparent),
      radial-gradient(0.8px 0.8px at 59.0% 10.2%, rgba(198,214,242,.62), transparent),
      radial-gradient(0.9px 0.9px at 33.8% 96.2%, rgba(222,232,250,.52), transparent),
      radial-gradient(1.0px 1.0px at 22.4% 27.3%, rgba(176,198,234,.46), transparent),
      radial-gradient(0.8px 0.8px at 76.6% 7.6%, rgba(198,214,242,.62), transparent),
      radial-gradient(0.9px 0.9px at 95.0% 50.4%, rgba(222,232,250,.52), transparent),
      radial-gradient(1.0px 1.0px at 33.4% 82.7%, rgba(176,198,234,.46), transparent),
      radial-gradient(0.8px 0.8px at 5.5% 45.8%, rgba(198,214,242,.62), transparent),
      radial-gradient(0.9px 0.9px at 14.6% 91.7%, rgba(222,232,250,.52), transparent),
      radial-gradient(1.0px 1.0px at 15.7% 61.8%, rgba(176,198,234,.46), transparent),
      radial-gradient(0.8px 0.8px at 56.7% 18.3%, rgba(198,214,242,.62), transparent),
      radial-gradient(0.9px 0.9px at 88.7% 43.7%, rgba(222,232,250,.52), transparent),
      radial-gradient(1.0px 1.0px at 81.3% 97.0%, rgba(176,198,234,.46), transparent),
      radial-gradient(0.8px 0.8px at 88.2% 31.0%, rgba(198,214,242,.62), transparent),
      radial-gradient(0.9px 0.9px at 53.5% 7.8%, rgba(222,232,250,.52), transparent),
      radial-gradient(1.0px 1.0px at 52.4% 55.9%, rgba(176,198,234,.46), transparent),
      radial-gradient(0.8px 0.8px at 88.5% 86.6%, rgba(198,214,242,.62), transparent),
      radial-gradient(0.9px 0.9px at 25.0% 12.1%, rgba(222,232,250,.52), transparent),
      radial-gradient(1.0px 1.0px at 73.6% 69.5%, rgba(176,198,234,.46), transparent),
      radial-gradient(0.8px 0.8px at 77.9% 58.1%, rgba(198,214,242,.62), transparent),
      radial-gradient(0.9px 0.9px at 72.4% 13.9%, rgba(222,232,250,.52), transparent),
      radial-gradient(1.0px 1.0px at 72.1% 32.6%, rgba(176,198,234,.46), transparent),
      radial-gradient(0.8px 0.8px at 26.0% 21.3%, rgba(198,214,242,.62), transparent),
      radial-gradient(0.9px 0.9px at 44.3% 69.7%, rgba(222,232,250,.52), transparent),
      radial-gradient(1.0px 1.0px at 60.4% 68.1%, rgba(176,198,234,.46), transparent),
      radial-gradient(0.8px 0.8px at 65.7% 4.7%, rgba(198,214,242,.62), transparent),
      radial-gradient(0.9px 0.9px at 66.2% 79.4%, rgba(222,232,250,.52), transparent),
      radial-gradient(1.0px 1.0px at 66.3% 65.3%, rgba(176,198,234,.46), transparent),
      radial-gradient(0.8px 0.8px at 40.6% 64.2%, rgba(198,214,242,.62), transparent),
      radial-gradient(0.9px 0.9px at 61.2% 58.7%, rgba(222,232,250,.52), transparent),
      radial-gradient(1.0px 1.0px at 17.8% 15.9%, rgba(176,198,234,.46), transparent);
  }
  .navsky .l2{
    top:-460px; height:calc(100% + 460px); background-size:460px 460px;
    animation:nskyDrift2 210s linear infinite;
    background-image:
      radial-gradient(1.1px 1.1px at 28.1% 55.3%, rgba(226,238,255,.78), transparent),
      radial-gradient(1.3px 1.3px at 70.3% 44.9%, rgba(206,224,250,.68), transparent),
      radial-gradient(1.2px 1.2px at 61.4% 37.3%, rgba(232,238,250,.62), transparent),
      radial-gradient(1.1px 1.1px at 11.0% 25.2%, rgba(226,238,255,.78), transparent),
      radial-gradient(1.3px 1.3px at 30.5% 22.0%, rgba(206,224,250,.68), transparent),
      radial-gradient(1.2px 1.2px at 51.6% 50.1%, rgba(232,238,250,.62), transparent),
      radial-gradient(1.1px 1.1px at 79.0% 91.7%, rgba(226,238,255,.78), transparent),
      radial-gradient(1.3px 1.3px at 12.7% 44.9%, rgba(206,224,250,.68), transparent),
      radial-gradient(1.2px 1.2px at 56.5% 11.5%, rgba(232,238,250,.62), transparent),
      radial-gradient(1.1px 1.1px at 81.1% 70.3%, rgba(226,238,255,.78), transparent),
      radial-gradient(1.3px 1.3px at 90.7% 16.1%, rgba(206,224,250,.68), transparent),
      radial-gradient(1.2px 1.2px at 39.5% 47.4%, rgba(232,238,250,.62), transparent),
      radial-gradient(1.1px 1.1px at 59.2% 77.6%, rgba(226,238,255,.78), transparent),
      radial-gradient(1.3px 1.3px at 87.0% 45.1%, rgba(206,224,250,.68), transparent),
      radial-gradient(1.2px 1.2px at 86.7% 86.5%, rgba(232,238,250,.62), transparent),
      radial-gradient(1.1px 1.1px at 4.3% 91.4%, rgba(226,238,255,.78), transparent),
      radial-gradient(1.3px 1.3px at 72.9% 75.9%, rgba(206,224,250,.68), transparent),
      radial-gradient(1.2px 1.2px at 60.8% 53.3%, rgba(232,238,250,.62), transparent),
      radial-gradient(1.1px 1.1px at 23.0% 64.3%, rgba(226,238,255,.78), transparent),
      radial-gradient(1.3px 1.3px at 92.2% 53.8%, rgba(206,224,250,.68), transparent),
      radial-gradient(1.2px 1.2px at 23.6% 43.0%, rgba(232,238,250,.62), transparent),
      radial-gradient(1.1px 1.1px at 25.5% 87.1%, rgba(226,238,255,.78), transparent);
  }
  .navsky .l3{
    top:-620px; height:calc(100% + 620px); background-size:620px 620px;
    animation:nskyDrift3 150s linear infinite;
    background-image:
      radial-gradient(1.6px 1.6px at 9.4% 15.7%, rgba(242,248,255,.92), transparent),
      radial-gradient(1.9px 1.9px at 55.4% 8.9%, rgba(246,249,255,.82), transparent),
      radial-gradient(1.6px 1.6px at 85.7% 56.6%, rgba(242,248,255,.92), transparent),
      radial-gradient(1.9px 1.9px at 81.5% 91.1%, rgba(246,249,255,.82), transparent),
      radial-gradient(1.6px 1.6px at 74.9% 5.9%, rgba(242,248,255,.92), transparent),
      radial-gradient(1.9px 1.9px at 41.6% 13.7%, rgba(246,249,255,.82), transparent),
      radial-gradient(1.6px 1.6px at 54.6% 94.3%, rgba(242,248,255,.92), transparent),
      radial-gradient(1.9px 1.9px at 38.8% 41.8%, rgba(246,249,255,.82), transparent),
      radial-gradient(1.6px 1.6px at 96.4% 19.5%, rgba(242,248,255,.92), transparent),
      radial-gradient(1.9px 1.9px at 60.2% 21.9%, rgba(246,249,255,.82), transparent);
  }
  .navsky .tw{
    position:absolute; width:2.2px; height:2.2px; border-radius:50%; background:#fff;
    box-shadow:0 0 8px 2px rgba(214,232,255,.55); opacity:.3;
    animation:nskyTwinkle 7s ease-in-out infinite;
  }
  .navsky .tw.a{left:17%; top:23%; animation-duration:6.5s}
  .navsky .tw.b{left:73%; top:13%; width:3px; height:3px; animation-duration:9s; animation-delay:-3s;
                    box-shadow:0 0 11px 2.5px rgba(214,232,255,.5)}
  .navsky .tw.c{left:37%; top:61%; animation-duration:8s; animation-delay:-5s}
  .navsky .tw.d{left:86%; top:76%; animation-duration:7.5s; animation-delay:-1.5s}
  .navsky .tw.e{left:8%; top:47%; width:2.6px; height:2.6px; animation-duration:10s; animation-delay:-7s}
  .navsky .shoot{
    position:absolute; top:13%; left:-18%; width:170px; height:1.6px; border-radius:2px; opacity:0;
    background:linear-gradient(90deg, rgba(226,238,255,0), rgba(232,242,255,.55) 55%, #f6faff 88%, rgba(232,242,255,0));
    animation:nskyShoot 42s linear infinite;
  }
  @keyframes nskyNeb{from{transform:translate3d(-2%,0,0) scale(1)} to{transform:translate3d(2%,-1.5%,0) scale(1.07)}}
  @keyframes nskyDrift1{from{transform:translate3d(0,0,0)} to{transform:translate3d(0,320px,0)}}
  @keyframes nskyDrift2{from{transform:translate3d(0,0,0)} to{transform:translate3d(0,460px,0)}}
  @keyframes nskyDrift3{from{transform:translate3d(0,0,0)} to{transform:translate3d(0,620px,0)}}
  @keyframes nskyTwinkle{0%,100%{opacity:.22; transform:scale(.9)} 50%{opacity:.95; transform:scale(1.15)}}
  @keyframes nskyShoot{
    0%{opacity:0; transform:translate3d(0,0,0) rotate(15deg)}
    1.1%{opacity:1}
    3.4%{opacity:.85}
    4.4%{opacity:0; transform:translate3d(78vw,21vh,0) rotate(15deg)}
    100%{opacity:0; transform:translate3d(78vw,21vh,0) rotate(15deg)}
  }
html.nsky-paused .navsky, html.nsky-paused .navsky * { animation-play-state: paused !important; }
@media (prefers-reduced-motion: reduce) { .navsky * { animation: none !important; } .navsky .shoot { display: none; } }
@media (forced-colors: active) { .navsky { display: none; } }
.simple { background: #03050d; }
.navsky {
  background:
    radial-gradient(128% 86% at 50% 42%, transparent 40%, rgba(0,0,0,.40) 76%, rgba(0,0,0,.72) 100%),
    radial-gradient(120% 72% at 14% -16%, rgba(66,112,214,.17), transparent 62%),
    radial-gradient(104% 62% at 90% 0%, rgba(126,86,204,.14), transparent 60%),
    radial-gradient(160% 92% at 50% 124%, rgba(24,58,124,.27), transparent 64%),
    linear-gradient(180deg, #050a16, #040812 46%, #020309);
}
.navsky .neb { opacity: .6; }
.navsky .way { opacity: .62; }
.simple { background: #020309; }
