/* Host-specific styling only (the loading splash shown while the WebAssembly runtime downloads).
   Colours come from the design tokens set by theme.js, so the splash matches the chosen light/dark theme. */
body { background: var(--fe-bg, #0b1118); }

.loading-progress { position: relative; display: block; width: 7rem; height: 7rem; margin: 22vh auto 1rem auto; }
.loading-progress circle { fill: none; stroke: var(--fe-border, #1e293b); stroke-width: 0.5rem; transform-origin: 50% 50%; transform: rotate(-90deg); }
.loading-progress circle:last-child { stroke: var(--fe-primary, #10b981); stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%; transition: stroke-dasharray 0.05s ease-in-out; }
.loading-progress-text { position: absolute; text-align: center; font-weight: 700; font-family: system-ui, sans-serif; color: var(--fe-muted, #94a3b8); inset: calc(22vh + 2.9rem) 0 auto 0.2rem; }
.loading-progress-text:after { content: var(--blazor-load-percentage-text, "Loading"); }