/* All 13 stars are present from first paint. Longer loads fade each star
   through the same seam at twelve, without restarting the clockwise orbit. */
#page-loader{
  position:fixed;
  inset:0;
  z-index:100;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:radial-gradient(ellipse at 50% 46%, #24508c 0%, #16386c 38%, #0B2044 70%, #071024 100%);
  clip-path:inset(0 0 0 0);
}
#page-loader::before{
  content:"";
  position:absolute;
  inset:-12%;
  pointer-events:none;
  opacity:.42;
  mix-blend-mode:soft-light;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='0.55' numOctaves='3' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23g)'/></svg>");
}
#page-loader.is-exit{
  pointer-events:none;
  clip-path:inset(0 0 100% 0);
  transition:clip-path 700ms cubic-bezier(0.76, 0, 0.24, 1);
}
#page-loader.is-done{visibility:hidden;}
.page-ring{position:relative;width:min(84vw, 68vh, 420px);height:min(84vw, 68vh, 420px);}
#page-loader{--star-seam-alpha:1;}
#page-loader.is-long{--star-seam-alpha:0;}
.page-star{
  position:absolute;
  left:50%;
  top:50%;
  width:9.6%;
  height:9.6%;
  margin:-4.8% 0 0 -4.8%;
  transform:rotate(0deg) translateY(-400%) rotate(180deg);
  animation:star-march 3.2s linear infinite;
  animation-delay:calc(var(--i) * -3.2s / 13);
  filter:drop-shadow(0 2px 2px rgba(0,0,0,.38));
}
@keyframes star-march{
  0%{transform:rotate(0deg) translateY(-400%) rotate(180deg);opacity:var(--star-seam-alpha,0);}
  3%,97%{opacity:1;}
  100%{transform:rotate(360deg) translateY(-400%) rotate(180deg);opacity:var(--star-seam-alpha,0);}
}
@keyframes star-march-mini{
  0%{transform:rotate(0deg) translateY(-20px) rotate(180deg);opacity:0;}
  3%,97%{opacity:1;}
  100%{transform:rotate(360deg) translateY(-20px) rotate(180deg);opacity:0;}
}
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
@media (prefers-reduced-motion: reduce){
  .page-star{
    animation:none;
    opacity:1;
    transform:rotate(calc(var(--i) * 27.692deg)) translateY(-400%) rotate(180deg);
  }
  #page-loader.is-exit{
    clip-path:none;
    opacity:0;
    transition:opacity 200ms ease-out;
  }
}