/* Critical startup styles load before React and the application theme. */
html.crm-starting, html.crm-starting body { background: #000 !important; overflow: hidden !important; }
#crm-startup { display: none; }
.crm-starting #crm-startup { display: flex; }
.crm-starting #root { visibility: hidden; }
#crm-startup {
    position: fixed; inset: 0; z-index: 10000; height: 100vh; height: 100dvh;
    box-sizing: border-box; background: #000; color: #D6A514;
    align-items: center; justify-content: center; flex-direction: column;
    padding: max(24px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left));
    font-family: "Segoe UI", sans-serif; opacity: 1; transition: opacity 180ms ease;
}
#crm-startup img { width: min(70vw, 460px); max-height: 45vh; object-fit: contain; animation: crm-logo-in 500ms ease both; }
#crm-startup .startup-brand { position: absolute; bottom: max(28px, env(safe-area-inset-bottom)); text-align: center; line-height: 1.7; }
#crm-startup strong { display: block; letter-spacing: .18em; font-size: 12px; }
#crm-startup small { color: #D8D0BA; font-size: 11px; }
#crm-startup.crm-startup-leaving { opacity: 0; pointer-events: none; }
#crm-startup .startup-failure { display: none; text-align: center; max-width: 28rem; padding: 24px; color: #FFF; }
#crm-startup a { color: #F5D975; }
#crm-startup a:focus-visible { outline: 2px solid #D6A514; outline-offset: 4px; }
#crm-startup.crm-startup-failed img, #crm-startup.crm-startup-failed .startup-brand { display: none; }
#crm-startup.crm-startup-failed .startup-failure { display: block; }
@keyframes crm-logo-in { from { opacity: 0; transform: scale(.97); } to { opacity: 1; transform: scale(1); } }
@media (prefers-reduced-motion: reduce) {
    #crm-startup img { animation: none; }
    #crm-startup { transition-duration: 1ms; }
}