.splash {
  min-height:100svh;
  display:grid;
  align-content:center;
  justify-items:center;
  gap:17px;
  position:relative;
  background:radial-gradient(ellipse at 50% 42%,rgba(160,120,255,.22),transparent 36%),var(--bg,#121318);
  color:var(--ink,#f8f6ff)
}
html[data-theme="light"] .splash {
  background:radial-gradient(ellipse at 50% 42%,rgba(109,59,215,.14),transparent 36%),#f3f0fa
}
.loader-mark {
  position:relative;
  width:96px;
  height:96px;
  display:grid;
  place-items:center
}
.loader-ring {
  position:absolute;
  inset:0;
  border-radius:50%;
  border:2px solid color-mix(in srgb, var(--line) 80%, transparent);
  border-top-color:#a078ff;
  border-right-color:#4cd7f6;
  animation:loaderSpin 1s linear infinite
}
.loader-letter {
  width:64px;
  height:64px;
  display:grid;
  place-items:center
}
.loader-letter img { width:58px; height:58px; object-fit:contain }
.loader-caption {
  font-size:11px;
  font-weight:600;
  letter-spacing:.4px;
  color:var(--muted,#8a8174)
}
.splash p {
  color:var(--muted2);
  font-size:9px;
  font-weight:800;
  letter-spacing:2.2px
}
@keyframes splashDrop {
  0% {
    opacity:0;
    transform:translateY(-34px) rotate(-12deg)
  }
  70% {
    transform:translateY(4px) rotate(3deg)
  }
  100% {
    opacity:1;
    transform:translateY(0) rotate(0)
  }
}
@media(prefers-reduced-motion:reduce) {
  .loader-ring {
    animation:none
  }
}