.modal.app-loading-modal { align-items: center; justify-content: center; padding: 16px; background: radial-gradient(ellipse at 50% 45%, color-mix(in srgb, var(--accent) 5%, transparent), transparent 65%), var(--bg, #07140f); z-index: 1100; }
.app-loading-modal .app-loading-card { width: min(440px, 100%); max-height: calc(var(--visible-height, 100dvh) - 32px); overflow-y: auto; padding: 40px 24px; border: 0; background: transparent; box-shadow: none; }
.app-loading-card { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 28px 18px; width: 100%; text-align: center; color: var(--text); }
.app-loading-logo { width: 64px; height: 64px; display: grid; place-items: center; color: var(--accent-ink); background: var(--accent); border-radius: 22px; box-shadow: 0 12px 60px color-mix(in srgb, var(--accent) 12%, transparent); }
.app-loading-logo svg { width: 32px; height: 32px; }
.app-loading-brand { font-size: 11px; letter-spacing: .2em; font-weight: 750; color: var(--accent); }
.app-loading-card h2 { margin: 6px 0 0; padding: 0; font-size: clamp(22px, 4vw, 30px); letter-spacing: -.035em; line-height: 1.2; }
.app-loading-card .app-loading-copy { color: var(--muted); font-size: 13px; line-height: 1.7; max-width: 300px; margin: 0; }
.app-loading-track { height: 4px; width: min(180px, 75%); background: var(--line); border-radius: 4px; overflow: hidden; margin: 8px 0; }
.app-loading-track span { display: block; width: 40%; height: 100%; background: var(--accent); border-radius: inherit; animation: app-loading-travel 1.5s ease-in-out infinite alternate; }
.app-loading-card.has-error .app-loading-track { display: none; }
.app-loading-retry { min-height: 44px; }
.app-loading-card [hidden] { display: none !important; }
.app-loading-skip { min-height: 44px; padding: 8px 18px; background: transparent; color: var(--muted); border: 1px solid var(--line); border-radius: 12px; font-size: 13px; }
.app-loading-compact { gap: 7px; padding: 16px 10px; margin-bottom: 10px; background: var(--surface); border: 1px solid var(--line); border-radius: 16px; }
.app-loading-compact .app-loading-logo, .app-loading-compact .app-loading-brand { display: none; }
.app-loading-compact h2 { font-size: 14px; }
.app-loading-compact .app-loading-copy { font-size: 11px; }
@keyframes app-loading-travel { from { transform: translateX(0); } to { transform: translateX(150%); } }
@media (prefers-reduced-motion: reduce) { .app-loading-track span { animation: none; margin-inline: auto; } }
@media (max-height: 450px) { .app-loading-modal .app-loading-card { padding: 16px; gap: 8px; } .app-loading-modal .app-loading-logo { width: 44px; height: 44px; border-radius: 15px; } }
