/* First paint and Angular use the same loader to avoid a blank handover. */
html, body { background: #0c0c0e; }
.launch-screen { position: fixed; inset: 0; z-index: 100; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 28px; color: #f7f7f8; background: #0c0c0e; font-family: 'Segoe UI',Arial,sans-serif; padding-top: var(--safe-top,0px); padding-bottom: var(--safe-bottom,0px); }
.launch-emblem { position: relative; width: 164px; height: 164px; display: grid; place-items: center; }
.launch-emblem img { width: 144px; height: 144px; object-fit: cover; border-radius: 35px; box-shadow: 0 0 64px #f5222226; animation: emblem-breathe 2.4s ease-in-out infinite; }
.launch-orbit { position: absolute; inset: -4px; border: 1px solid #f5222217; border-radius: 50%; }
.launch-orbit::after { content: ''; position: absolute; inset: -1px; border: 2px solid transparent; border-top-color: #f52222; border-right-color: #f5222240; border-radius: 50%; animation: orbit 1.6s linear infinite; }
.launch-wordmark { font-size: 32px; font-weight: 750; letter-spacing: -1.5px; }
.launch-wordmark > span { color: #f52222; }
.launch-track { width: 104px; height: 2px; overflow: hidden; background: #2b2022; border-radius: 2px; }
.launch-track span { display: block; width: 45%; height: 100%; background: #f52222; animation: track 1.3s ease-in-out infinite; }
.launch-screen p { margin: 0; color: #9d9da6; font-size: 12px; letter-spacing: .5px; }
.launch-exit { animation: launch-out 220ms ease-out both; pointer-events: none; }
@keyframes orbit { to { transform: rotate(360deg); } }
@keyframes track { from { transform: translateX(-110%); } to { transform: translateX(330%); } }
@keyframes emblem-breathe { 50% { box-shadow: 0 0 80px #f522223c; } }
@keyframes launch-out { to { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .launch-screen *, .launch-screen *::after { animation: none !important; } .launch-track span { width: 100%; } }