/* Stable first-paint branding, independent of the customer's saved theme. */
:root {
  --loading-background: 0 0% 0%;
  --loading-foreground: 0 0% 100%;
}
html.customer-boot body { background: hsl(var(--loading-background)); }
.customer-loading {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  padding: 24px;
  background: hsl(var(--loading-background));
  color: hsl(var(--loading-foreground));
  opacity: 1;
  transition: opacity 240ms ease;
}
html:not(.customer-boot) .customer-loading { display: none; }
.customer-loading.is-leaving { opacity: 0; pointer-events: none; }
.customer-loading-content { display: flex; align-items: center; justify-content: center; gap: 10px; width: 50px; height: 32px; }
.customer-loading-dot { display: block; flex: 0 0 10px; width: 10px; height: 10px; border-radius: 50%; background: hsl(var(--loading-foreground)); animation: loading-ui-bouncing-dots 1.4s ease-in-out infinite; }
.customer-loading-dot:nth-child(2) { animation-delay: .2s; }
.customer-loading-dot:nth-child(3) { animation-delay: .4s; }
@keyframes loading-ui-bouncing-dots {
  0%, 100% { transform: translateY(0) scale(.8); opacity: .5; }
  50% { transform: translateY(-5px) scale(1.2); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .customer-loading, .customer-loading-dot { animation: none; transition: none; }
}
@media print { .customer-loading { display: none !important; } }