/* ================= SPLASH / LOADER ================= */
#appSplash {
    position: fixed; inset: 0; z-index: 99999;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    color: #fff; font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    background:
        radial-gradient(520px 420px at 50% 38%, rgba(47, 165, 107, .38), transparent 70%),
        radial-gradient(700px 500px at 100% 100%, rgba(212, 175, 55, .10), transparent 60%),
        linear-gradient(160deg, #0f5a39 0%, #0b3d2a 55%, #062b1c 100%);
    transition: opacity .55s ease, visibility .55s ease, transform .55s ease;
    animation: spAutoHide .5s ease 6s forwards;
}
#appSplash::before {
    content: ""; position: absolute; inset: 0; opacity: .08; pointer-events: none;
    background-image:
        repeating-linear-gradient(45deg, #fff 0 1px, transparent 1px 26px),
        repeating-linear-gradient(-45deg, #fff 0 1px, transparent 1px 26px);
    -webkit-mask-image: radial-gradient(circle at 50% 40%, #000 0, transparent 72%);
            mask-image: radial-gradient(circle at 50% 40%, #000 0, transparent 72%);
}
#appSplash.is-hide { opacity: 0; visibility: hidden; transform: scale(1.03); }

.sp-center { position: relative; display: flex; flex-direction: column; align-items: center; padding: 0 24px; text-align: center; }

.sp-logo { position: relative; width: 120px; height: 120px; margin-bottom: 28px; animation: spUp .7s ease both; }
.sp-logo img {
    position: relative; z-index: 2; width: 100%; height: 100%; object-fit: contain;
    background: #fff; border-radius: 50%; padding: 7px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, .38);
    animation: spFloat 3s ease-in-out infinite;
}
.sp-ring {
    position: absolute; inset: -10px; border-radius: 50%; z-index: 1;
    background: conic-gradient(from 0deg, #d4af37, rgba(212, 175, 55, .06) 38%, #f3dc82 60%, rgba(212, 175, 55, .06) 85%, #d4af37);
    -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2.5px));
            mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2.5px));
    animation: spSpin 3.2s linear infinite;
}
.sp-halo {
    position: absolute; inset: -10px; border-radius: 50%; z-index: 0;
    border: 1.5px solid rgba(212, 175, 55, .55);
    animation: spPulse 2.4s ease-out infinite;
}

.sp-name {
    font-size: 1.12rem; font-weight: 800; letter-spacing: .02em; line-height: 1.3; max-width: 320px;
    animation: spUp .7s ease .12s both;
}
.sp-sub {
    margin-top: 8px; font-size: .72rem; font-weight: 700; letter-spacing: .26em; text-transform: uppercase;
    color: #e6c65a; animation: spUp .7s ease .24s both;
}
.sp-bar {
    width: 150px; height: 3px; margin-top: 30px; border-radius: 3px; overflow: hidden;
    background: rgba(255, 255, 255, .16); animation: spUp .7s ease .36s both;
}
.sp-bar i {
    display: block; width: 42%; height: 100%; border-radius: 3px;
    background: linear-gradient(90deg, transparent, #f3dc82, #d4af37, transparent);
    animation: spSlide 1.3s ease-in-out infinite;
}
.sp-foot {
    position: absolute; left: 0; right: 0; text-align: center;
    bottom: max(28px, env(safe-area-inset-bottom));
    font-size: .68rem; letter-spacing: .18em; text-transform: uppercase; color: rgba(255, 255, 255, .5);
}

@keyframes spUp    { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes spFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@keyframes spSpin  { to { transform: rotate(360deg); } }
@keyframes spPulse { 0% { transform: scale(1); opacity: .7; } 100% { transform: scale(1.5); opacity: 0; } }
@keyframes spSlide { 0% { transform: translateX(-110%); } 100% { transform: translateX(260%); } }
@keyframes spAutoHide { to { opacity: 0; visibility: hidden; pointer-events: none; } }

@media (prefers-reduced-motion: reduce) { #appSplash * { animation: none !important; } }
@media print { #appSplash { display: none !important; } }
/* ================= END SPLASH ================= */