/* SIAPMANG shared premium loader — L01-G */
        /* ===== PREMIUM LOADING OVERLAY ===== */

        .siapmang-premium-loader {
            position: fixed;
            inset: 0;
            z-index: 99999;

            display: flex;
            align-items: center;
            justify-content: center;

            background:
                radial-gradient(circle at 18% 24%, rgba(59, 130, 246, .16), transparent 28%),
                radial-gradient(circle at 88% 72%, rgba(45, 212, 191, .18), transparent 30%),
                linear-gradient(135deg, rgba(238,248,255,.88), rgba(251,250,247,.90), rgba(237,255,247,.88));

            backdrop-filter: blur(18px);
            -webkit-backdrop-filter: blur(18px);

            transition: opacity .35s ease, visibility .35s ease;
        }

        .siapmang-loader-card {
            width: 310px;
            min-height: 265px;
            padding: 30px 26px 26px;

            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;

            border-radius: 30px;

            background:
                linear-gradient(135deg, rgba(255,255,255,.82), rgba(236,253,245,.66));

            border: 1px solid rgba(255,255,255,.92);

            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.95),
                0 28px 70px rgba(15,23,42,.14);
        }

        .siapmang-loader-orbit {
            position: relative;

            width: 108px;
            height: 108px;

            display: grid;
            place-items: center;

            margin-bottom: 18px;
        }

        .siapmang-loader-ring {
            position: absolute;
            inset: 0;

            border-radius: 999px;

            background:
                conic-gradient(
                    from 0deg,
                    #2563eb,
                    #06b6d4,
                    #10b981,
                    #bfdbfe,
                    #2563eb
                );

            animation: siapmangLoaderSpin 1.05s linear infinite;
        }

        .siapmang-loader-ring::after {
            content: "";
            position: absolute;
            inset: 7px;

            border-radius: inherit;

            background:
                linear-gradient(135deg, rgba(255,255,255,.96), rgba(236,253,245,.90));
        }

        .siapmang-loader-logo {
            position: relative;
            z-index: 2;

            width: 72px;
            height: 72px;

            display: grid;
            place-items: center;

            border-radius: 24px;

            background: rgba(255,255,255,.88);

            border: 1px solid rgba(226,232,240,.82);

            box-shadow:
                0 12px 28px rgba(37,99,235,.12);
        }

        .siapmang-loader-logo img {
            width: 48px;
            height: 48px;
            object-fit: contain;
        }

        .siapmang-loader-title {
            font-size: 18px;
            font-weight: 850;
            letter-spacing: -.02em;
            color: #0f172a;
        }

        .siapmang-loader-subtitle {
            margin-top: 7px;

            max-width: 230px;

            text-align: center;

            font-size: 13px;
            line-height: 1.45;
            font-weight: 600;

            color: #64748b;
        }

        .siapmang-loader-dots {
            display: flex;
            align-items: center;
            gap: 7px;

            margin-top: 18px;
        }

        .siapmang-loader-dots span {
            width: 8px;
            height: 8px;

            border-radius: 999px;

            background: linear-gradient(135deg, #0ea5e9, #14b8a6);

            animation: siapmangLoaderDot 1s ease-in-out infinite;
        }

        .siapmang-loader-dots span:nth-child(2) {
            animation-delay: .15s;
        }

        .siapmang-loader-dots span:nth-child(3) {
            animation-delay: .3s;
        }

        @keyframes siapmangLoaderSpin {
            to {
                transform: rotate(360deg);
            }
        }

        @keyframes siapmangLoaderDot {
            0%, 100% {
                transform: translateY(0);
                opacity: .45;
            }

            50% {
                transform: translateY(-5px);
                opacity: 1;
            }
        }

        /* state kalau nanti JS memberi class hidden */
        .siapmang-premium-loader.is-hidden {
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
        }

        @media (max-width: 768px) {
            .siapmang-loader-card {
                width: 280px;
                min-height: 245px;
                padding: 26px 22px;
                border-radius: 26px;
            }

            .siapmang-loader-orbit {
                width: 96px;
                height: 96px;
            }

            .siapmang-loader-logo {
                width: 66px;
                height: 66px;
                border-radius: 22px;
            }

            .siapmang-loader-logo img {
                width: 44px;
                height: 44px;
            }
        }

        /* matikan pattern loader lama */

        #pace-cover::before,
        #pace-cover::after,
        .siapmang-premium-loader::before,
        .siapmang-premium-loader::after {
            background-image: none !important;
            content: none !important;
        }


