/* Bootstrap owns loading and updates; this file only styles its loading UI. */
:root {
  --mapflow-background: #05030b;
  --mapflow-foreground: #f8eeff;
  --mapflow-accent: #ff2d75;
  --mapflow-track: #3b304b;
  --mapflow-loader-size: min(360px, 94vw);
}
html, body { background: var(--mapflow-background); color: var(--mapflow-foreground); min-height: 100%; margin: 0; }
#sw-loading { background: var(--mapflow-background) !important; color: var(--mapflow-foreground) !important; }
#sw-loading .sw-logo-container { width: var(--mapflow-loader-size) !important; height: var(--mapflow-loader-size) !important; margin-bottom: 24px !important; }
#sw-loading .sw-logo-image { width: 100% !important; height: 100% !important; border-radius: 0 !important; box-shadow: none !important; }
/* Keep the native ring as the source of genuine bootstrap progress. */
#sw-loading .sw-progress-ring { visibility: hidden; }
#sw-loading .sw-title, #sw-loading .sw-percentage { display: none; }
/* Loading stays visual-only; retain explicit failures and the native retry. */
#sw-loading .sw-status { display: none !important; }
#sw-loading .sw-status:has(span[style*="color"]) { display: block !important; color: var(--mapflow-foreground); margin-top: 16px; font-size: 13px; text-align: center; max-width: 85vw; }
.vector-progress { width: var(--mapflow-loader-size); height: 3px; background: var(--mapflow-track); overflow: hidden; border-radius: 3px; }
.vector-progress-fill { display: block; height: 100%; width: 100%; background: var(--mapflow-accent); transform: scaleX(0); transform-origin: left; transition: transform 240ms ease; }
@media (prefers-reduced-motion: reduce) { #sw-loading, #sw-loading * { animation: none !important; transition: none !important; } }