/* One small, shared CSS animation for bootstrap, navigation and content loading. */
:root { --koi-surface: #f5f8ff; --koi-ink: #18304b; --koi-muted: #536881; }
html[data-site-theme="dark"] { --koi-surface: #0b0e13; --koi-ink: #edf4ff; --koi-muted: #b0bed0; }
.koi-preloader { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; min-height: 260px; padding: 32px 20px; text-align: center; color: inherit; box-sizing: border-box; }
.koi-preloader--page { min-height: 100dvh; background: var(--home-bg, var(--koi-surface)); color: var(--home-ink, var(--koi-ink)); }
.koi-preloader--compact { min-height: 160px; padding: 20px 12px; gap: 10px; }
.koi-preloader__status { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.koi-preloader__fish { display: block; width: 144px; height: 144px; animation: koi-orbit 8s linear infinite; }
.koi-preloader--compact .koi-preloader__fish { width: 88px; height: 88px; }
.koi-preloader__label { margin: 0; font: 500 14px/1.6 var(--font-sans, sans-serif); }
.koi-preloader__help { max-width: 360px; font: 400 13px/1.7 var(--font-sans, sans-serif); color: inherit; }
.koi-preloader__help[hidden] { display: none; }
.koi-preloader__help p { margin: 0 0 12px; }
.koi-preloader__retry { font: inherit; cursor: pointer; padding: 9px 16px; border: 1px solid currentColor; border-radius: 8px; background: transparent; color: inherit; }
.koi-preloader__retry:focus-visible { outline: 3px solid #3689ef; outline-offset: 4px; }
.koi-preloader[data-error="true"] .koi-preloader__fish { animation: none; }
@keyframes koi-orbit { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .koi-preloader__fish { animation: none; } }