/* "Loading your algorithms" after a desktop login (login_loading.js, al-load-). The ring echoes the portal's blue
   glow; the title uses the welcome title's font (Oxanium, loaded by welcome_hero.css). */
.al-load { position: fixed; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center;
           gap: 14px; pointer-events: none; color: #e8e8e8; text-align: center; padding: 0 16px;
           background: radial-gradient(circle at 50% 46%, rgba(20, 40, 60, 0.95) 0%, rgb(0, 0, 0) 62%);
           opacity: 1; transition: opacity 380ms ease; }
.al-load.out { opacity: 0; }
.al-load-ring { position: relative; width: 92px; height: 92px; margin-bottom: 8px; }
.al-load-ring i { position: absolute; inset: 0; border-radius: 50%; border: 2px solid transparent; }
.al-load-ring i:first-child { border-top-color: #4be9fa; border-right-color: rgba(75, 233, 250, 0.35);
                              box-shadow: 0 0 22px rgba(75, 233, 250, 0.25); animation: al-load-spin 1.1s linear infinite; }
.al-load-ring i:last-child { inset: 14px; border-bottom-color: #6f7cff; border-left-color: rgba(111, 124, 255, 0.35);
                             animation: al-load-spin 1.7s linear infinite reverse; }
.al-load-t { font-family: 'Oxanium', 'Segoe UI', sans-serif; font-size: 1.35rem; letter-spacing: .6px; color: #cfefff;
             text-shadow: 0 0 18px rgba(75, 233, 250, 0.35); }
.al-load-s { font-size: .86rem; color: #9fb3c8; animation: al-load-breathe 2.4s ease-in-out infinite; }
@keyframes al-load-spin { to { transform: rotate(360deg); } }
@keyframes al-load-breathe { 0%, 100% { opacity: .55; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .al-load-ring i, .al-load-s { animation: none; }
}