:root { color-scheme: light dark; }
html, body { margin: 0; padding: 0; min-height: 100%; background: #ffffff; }
body { color: #0f172a; font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; }
main { display: block; }
.app-preloader { display: grid; place-items: center; padding: 3rem 1rem; min-height: 40vh; }
.app-preloader-spinner {
  width: 32px; height: 32px; border-radius: 9999px;
  border: 3px solid rgba(255,255,255,0.4); border-top-color: rgba(255,255,255,0.9);
  animation: spin 1s linear infinite; margin: 0 auto 12px;
}
.app-preloader-title { margin: 0 0 4px; font-weight: 600; text-align: center; }
.app-preloader-subtitle { margin: 0; opacity: 0.8; text-align: center; font-size: 0.875rem; }
/* CSP-safe fade-out animation for preloader */
.fade-out { opacity: 0; transition: opacity 0.3s ease-out; }
@keyframes spin { to { transform: rotate(360deg); } }
@media (prefers-color-scheme: light) {
  html, body { background: #f8fafc; }
  body { color: #0f172a; }
}