/* eLuna shared animated star layer (twinkle) and utilities.
   Included on every page: <link rel="stylesheet" href="eluna-sky.css">
   Markup: <div class="lp-sky" aria-hidden="true"><i></i><i></i><i></i></div> */

@keyframes lp-twk { 0%,100% { opacity: .20; } 48% { opacity: 1; } }
@keyframes lp-twinkle { 0%,100% { opacity: .25; transform: scale(.7); } 50% { opacity: 1; transform: scale(1.18); } }
@keyframes lp-drift { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }

.lp-sky { position: fixed; left: 50%; transform: translateX(-50%); top: 0; width: 440px; max-width: 100vw; height: 100%; height: 100dvh; pointer-events: none; z-index: 0; overflow: hidden; }
.lp-sky i { position: absolute; top: 0; left: 0; width: 2px; height: 2px; border-radius: 50%; background: transparent; will-change: opacity; }
.lp-sky i:nth-child(1) { box-shadow: 280px 1594px 0 0 #fff,205px 138px 0 0 #fff,204px 1164px 0 0 #fff,27px 500px 0 0 #fff,58px 162px 0 0 #fff,337px 856px 0 0 #fff,296px 501px 0 0 #fff,210px 1433px 0 0 #fff,141px 276px 0 0 #fff,145px 1037px 0 0 #fff,316px 763px 0 0 #fff,190px 1292px 0 0 #fff,91px 90px 0 0 #fff,141px 1594px 0 0 #fff,74px 739px 0 0 #fff,194px 1518px 0 0 #fff,231px 1374px 0 0 #fff,404px 830px 0 0 #fff,277px 939px 0 0 #fff,237px 832px 0 0 #fff,438px 404px 0 0 #fff,384px 235px 0 0 #fff,398px 1111px 0 0 #fff,173px 476px 0 0 #fff,404px 693px 0 0 #fff,336px 1360px 0 0 #fff,267px 497px 0 0 #fff,335px 1343px 0 0 #fff,391px 750px 0 0 #fff,143px 68px 0 0 #fff,350px 1270px 0 0 #fff,134px 527px 0 0 #fff,162px 828px 0 0 #fff,197px 564px 0 0 #fff,120px 970px 0 0 #fff,437px 118px 0 0 #fff,11px 1411px 0 0 #fff,236px 1304px 0 0 #fff,329px 661px 0 0 #fff,140px 1390px 0 0 #fff,192px 1072px 0 0 #fff,125px 729px 0 0 #fff,177px 583px 0 0 #fff,209px 350px 0 0 #fff,419px 853px 0 0 #fff,304px 513px 0 0 #fff,432px 536px 0 0 #fff,27px 58px 0 0 #fff,311px 285px 0 0 #fff,240px 1104px 0 0 #fff,280px 607px 0 0 #fff,249px 466px 0 0 #fff,217px 478px 0 0 #fff,145px 1587px 0 0 #fff,74px 1406px 0 0 #fff,145px 1300px 0 0 #fff,122px 569px 0 0 #fff,174px 391px 0 0 #fff,43px 777px 0 0 #fff,294px 1037px 0 0 #fff,207px 1061px 0 0 #fff,52px 1396px 0 0 #fff,424px 337px 0 0 #fff,36px 1477px 0 0 #fff,214px 1202px 0 0 #fff,158px 1392px 0 0 #fff,35px 160px 0 0 #fff,332px 1585px 0 0 #fff,409px 1094px 0 0 #fff,348px 472px 0 0 #fff; animation: lp-twk 3.4s ease-in-out infinite; }
.lp-sky i:nth-child(2) { box-shadow: 140px 763px 0 0 #fff,356px 1251px 0 0 #fff,320px 1572px 0 0 #fff,221px 383px 0 0 #fff,327px 1511px 0 0 #fff,35px 875px 0 0 #fff,371px 1416px 0 0 #fff,213px 1400px 0 0 #fff,340px 803px 0 0 #fff,362px 120px 0 0 #fff,358px 330px 0 0 #fff,388px 937px 0 0 #fff,320px 945px 0 0 #fff,69px 10px 0 0 #fff,89px 526px 0 0 #fff,203px 592px 0 0 #fff,33px 1518px 0 0 #fff,251px 1525px 0 0 #fff,33px 982px 0 0 #fff,88px 993px 0 0 #fff,385px 1220px 0 0 #fff,304px 139px 0 0 #fff,354px 1200px 0 0 #fff,418px 1331px 0 0 #fff,374px 1132px 0 0 #fff,391px 1469px 0 0 #fff,93px 695px 0 0 #fff,138px 1064px 0 0 #fff,65px 460px 0 0 #fff,149px 1440px 0 0 #fff,66px 776px 0 0 #fff,175px 1236px 0 0 #fff,12px 318px 0 0 #fff,347px 1136px 0 0 #fff,82px 1352px 0 0 #fff,290px 343px 0 0 #fff,29px 1599px 0 0 #fff,315px 1393px 0 0 #fff,151px 150px 0 0 #fff,122px 1537px 0 0 #fff,234px 1209px 0 0 #fff,225px 552px 0 0 #fff,186px 1341px 0 0 #fff,216px 931px 0 0 #fff,68px 1070px 0 0 #fff,168px 342px 0 0 #fff; animation: lp-twk 4.9s ease-in-out 1.2s infinite; }
.lp-sky i:nth-child(3) { width: 2.6px; height: 2.6px; box-shadow: 157px 1148px 1px 0 #f5d98f,207px 187px 1px 0 #f5d98f,224px 1365px 1px 0 #f5d98f,334px 467px 1px 0 #f5d98f,134px 487px 1px 0 #f5d98f,128px 677px 1px 0 #f5d98f,354px 73px 1px 0 #f5d98f,142px 926px 1px 0 #f5d98f,198px 1383px 1px 0 #f5d98f,342px 37px 1px 0 #f5d98f,312px 742px 1px 0 #f5d98f,174px 1050px 1px 0 #f5d98f,210px 1075px 1px 0 #f5d98f,219px 568px 1px 0 #f5d98f,254px 322px 1px 0 #f5d98f,151px 789px 1px 0 #f5d98f,51px 1381px 1px 0 #f5d98f,379px 280px 1px 0 #f5d98f,44px 596px 1px 0 #f5d98f,223px 101px 1px 0 #f5d98f,228px 693px 1px 0 #f5d98f,328px 59px 1px 0 #f5d98f,192px 287px 1px 0 #f5d98f,38px 366px 1px 0 #f5d98f; animation: lp-twk 2.6s ease-in-out .5s infinite; }

@media (prefers-reduced-motion: reduce) { .lp-sky i { animation: none !important; opacity: .7 !important; } }

/* Smooth cross-page navigation. html keeps the app background so no white
   frame ever shows between page loads; browsers with cross-document view
   transitions get a native crossfade (the per-page JS fallback fades manually
   on older browsers). */
html { background: #0d0a24; }
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: eluna-vt-out .18s ease both; }
::view-transition-new(root) { animation: eluna-vt-in .26s ease both; }
@keyframes eluna-vt-out { to { opacity: 0; } }
@keyframes eluna-vt-in { from { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}
