/* Loading screen (shown while the app starts). Always dark so it never flashes white. */
#boot { position: fixed; inset: 0; z-index: 99999; display: grid; place-items: center; background: #1e1f22; color: #dbdee1; transition: opacity .4s ease; font-family: "Inter", "Noto Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; }
#boot.out { opacity: 0; pointer-events: none; }
.boot-box { display: grid; justify-items: center; gap: 30px; padding: 24px; max-width: 420px; text-align: center; }
.boot-logo { width: 96px; height: 96px; filter: drop-shadow(0 0 18px rgba(61, 220, 132, .55)); animation: boot-bob 1.6s ease-in-out infinite; }
.boot-logo img { display: block; width: 100%; height: 100%; }
.boot-word { margin-top: -10px; font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace; font-size: 28px; font-weight: 700; letter-spacing: .02em; color: #f2f3f5; }
.boot-word b { color: #3ddc84; font-weight: 700; margin: 0 4px; }
.boot-dots { display: flex; gap: 9px; }
.boot-dots i { width: 10px; height: 10px; border-radius: 50%; background: #3ddc84; animation: boot-dot 1.2s ease-in-out infinite; }
.boot-dots i:nth-child(2) { animation-delay: .15s; }
.boot-dots i:nth-child(3) { animation-delay: .3s; }
.boot-tip b { display: block; margin-bottom: 6px; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #b5bac1; }
.boot-tip span { font-size: 15px; line-height: 1.45; color: #dbdee1; }
@keyframes boot-bob { 0%, 100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-12px) scale(1.07); } }
@keyframes boot-dot { 0%, 80%, 100% { transform: scale(.55); opacity: .4; } 40% { transform: scale(1); opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .boot-logo, .boot-dots i { animation: none; } }