/* ── Cyclone ERP Splash Screen ───────────────────────────────── */
#app-loader {
    position: fixed; inset: 0; z-index: 5000;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(160deg,
        var(--app-loader-bg-start, #eef4f9) 0%,
        var(--app-loader-bg-end,   #f4f8ff) 100%);
    opacity: 1; visibility: visible;
    transition: opacity 0.22s ease, visibility 0.22s ease;
    overflow: hidden;
}
#app-loader.is-hidden { opacity: 0; visibility: hidden; pointer-events: none; }
#app-loader.is-complete .ldr-card {
    transform: translateY(-14px) scale(0.95); opacity: 0;
    transition: transform 0.22s cubic-bezier(.4,0,.2,1), opacity 0.2s ease;
}
.ldr-blob {
    position: absolute; border-radius: 50%; pointer-events: none; filter: blur(80px);
}
.ldr-blob-1 {
    top: -10%; right: -8%; width: min(55vw, 26rem); height: min(55vw, 26rem);
    background: radial-gradient(circle, rgba(var(--app-loader-accent-rgb,13,110,253),.22) 0%, transparent 65%);
}
.ldr-blob-2 {
    bottom: -12%; left: -6%; width: min(48vw, 22rem); height: min(48vw, 22rem);
    background: radial-gradient(circle, rgba(35,149,60,.2) 0%, transparent 65%);
}
.ldr-card {
    position: relative; width: min(100%, 21rem);
    padding: clamp(1.75rem, 5vw, 2.25rem);
    border-radius: 1.75rem;
    background: var(--app-loader-surface, rgba(255,255,255,.9));
    border: 1px solid var(--app-loader-border, rgba(16,32,54,.1));
    box-shadow: var(--app-loader-shadow, 0 24px 72px rgba(16,32,54,.15));
    backdrop-filter: blur(28px) saturate(1.5);
    -webkit-backdrop-filter: blur(28px) saturate(1.5);
    display: flex; flex-direction: column; align-items: center;
    gap: 0; text-align: center;
}
.ldr-logo-wrap {
    position: relative; width: 7rem; height: 7rem;
    display: flex; align-items: center; justify-content: center;
    margin-bottom: 1.2rem;
}
.ldr-glow {
    position: absolute; inset: -8px; border-radius: 50%;
    background: conic-gradient(
        rgba(35,149,60,.6) 0%,
        rgba(var(--app-loader-accent-rgb,13,110,253),.5) 35%,
        rgba(35,149,60,.35) 65%,
        rgba(var(--app-loader-accent-rgb,13,110,253),.6) 100%
    );
    filter: blur(16px);
    animation: ldrGlow 3.5s ease-in-out infinite;
}
@keyframes ldrGlow {
    0%, 100% { opacity: .45; transform: scale(.85); }
    50%       { opacity: 1;   transform: scale(1.08); }
}
.ldr-icon-bg {
    position: absolute; inset: 0; border-radius: 50%;
    background: var(--app-loader-surface-glow, rgba(255,255,255,.55));
    border: 1px solid rgba(255,255,255,.4);
    backdrop-filter: blur(8px);
    box-shadow: 0 6px 28px rgba(0,0,0,.08);
}
.ldr-cyclone {
    width: 4.6rem; height: 4.6rem;
    position: relative; z-index: 1;
    filter: drop-shadow(0 3px 10px rgba(35,149,60,.3));
}
.ldr-cyclone-spin {
    transform-origin: center;
    animation: ldrSpin 1.5s linear infinite;
}
@keyframes ldrSpin { to { transform: rotate(360deg); } }
.ldr-title {
    font-size: 1.3rem; font-weight: 800; letter-spacing: .12em;
    text-transform: uppercase; color: var(--app-loader-text, #102036);
    margin: 0 0 .3rem; line-height: 1;
}
.ldr-subtitle {
    font-size: .8rem; color: var(--app-loader-muted, rgba(16,32,54,.6));
    margin: 0 0 1.5rem; line-height: 1.5;
}
.ldr-progress { width: 100%; display: flex; flex-direction: column; gap: .45rem; }
.ldr-progress-row {
    display: flex; justify-content: space-between; align-items: center;
    font-size: .73rem; color: var(--app-loader-muted, rgba(16,32,54,.6));
}
#app-loader-percent {
    font-weight: 700; color: var(--app-loader-accent, #0d6efd);
    font-variant-numeric: tabular-nums; min-width: 2.4rem; text-align: right;
}
.ldr-track {
    height: .38rem; border-radius: 999px; overflow: hidden;
    background: var(--app-loader-track, rgba(16,32,54,.08)); position: relative;
}
#app-loader-progress-bar {
    position: absolute; inset: 0 auto 0 0; width: 4%;
    background: linear-gradient(90deg, rgba(35,149,60,.9), var(--app-loader-accent, #0d6efd));
    border-radius: inherit; transition: width .38s cubic-bezier(.16,1,.3,1);
}
#app-loader-progress-bar::after {
    content: ''; position: absolute; inset: 0;
    background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,.55) 50%, transparent 100%);
    animation: ldrShimmer 1.8s ease-in-out infinite;
}
@keyframes ldrShimmer { 0% { transform: translateX(-100%); } 100% { transform: translateX(100%); } }
@media (prefers-reduced-motion: reduce) {
    .ldr-cyclone-spin, #app-loader-progress-bar::after, .ldr-glow { animation: none !important; }
}