/* Navi loading SCENE (2026-09-28, Nick: loading scene only, no branded text, progress bar + "loading..." dots).
   Full-screen overlay: Navi mascot + an indeterminate teal progress bar + pulsing "loading..." dots. */
.navi-loading{position:fixed;inset:0;z-index:99999;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:18px;background:#0b1220}
.navi-loading .navi{filter:drop-shadow(0 8px 24px rgba(46,197,211,.18))}
.navi-bar{position:relative;width:min(200px,60vw);height:4px;border-radius:999px;
  background:rgba(255,255,255,.12);overflow:hidden}
.navi-bar i{position:absolute;top:0;left:-40%;height:100%;width:40%;border-radius:999px;
  background:linear-gradient(90deg,#1f8f9c,#2ec5d3);animation:naviBar 1.15s ease-in-out infinite}
/* determinate mode: add class "det" and set --p (0..1); the bar fills to that width instead of sweeping */
.navi-bar.det i{left:0;width:calc(var(--p,0)*100%);animation:none;transition:width .3s ease}
.navi-dots{font:600 13px/1 system-ui,-apple-system,sans-serif;letter-spacing:.14em;color:#8aa0b0}
.navi-dots b{font-weight:600;animation:naviDot 1.2s infinite}
.navi-dots b:nth-child(1){animation-delay:0s}
.navi-dots b:nth-child(2){animation-delay:.18s}
.navi-dots b:nth-child(3){animation-delay:.36s}
@keyframes naviBar{0%{left:-40%}100%{left:100%}}
@keyframes naviDot{0%,70%,100%{opacity:.2}35%{opacity:1}}
@media (prefers-reduced-motion:reduce){.navi-bar i,.navi-dots b{animation:none}}

/* repeat-visit anti-flash (Jesslyn 2026-09-28): head-guard sets .navi-seen on <html> before body renders */
.navi-seen .navi-loading{display:none!important}