.lilith-loader {
  position: relative;
  display: inline-grid;
  place-items: center;
  flex-shrink: 0;
  width: 72px;
  height: 72px;
  vertical-align: middle;
}
.lilith-loader--compact { width: 24px; height: 24px; }
.lilith-loader__viewport { display: block; width: 100%; aspect-ratio: 12 / 11; overflow: hidden; opacity: 0; }
.lilith-loader__frames {
  display: block;
  width: 800%;
  max-width: none;
  height: 100%;
  animation: lilith-running 0.8s steps(8, end) infinite;
}
.lilith-loader__fallback {
  position: absolute;
  box-sizing: border-box;
  width: 45%;
  height: 45%;
  border: 2px solid #ad5335;
  border-right-color: transparent;
  border-radius: 50%;
  animation: lilith-fallback-spin 0.8s linear infinite;
}
.lilith-loader[data-ready="true"] .lilith-loader__viewport { opacity: 1; }
.lilith-loader[data-ready="true"] .lilith-loader__fallback { display: none; }
.lilith-loading-screen { min-height: 100vh; min-height: 100dvh; display: grid; place-items: center; }
@keyframes lilith-running { to { transform: translateX(-100%); } }
@keyframes lilith-fallback-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .lilith-loader__frames, .lilith-loader__fallback { animation: none; }
}
@media print { .lilith-loader { display: none; } }
