/* ========================================
   LOADER
   branded loading overlay with real
   progress (driven by js/loader.js).
   Paints first: keep this file light and
   self-sufficient (no dependencies).
   ======================================== */

        .loader {
            position: fixed;

            inset: 0;

            z-index: 200;

            display: flex;

            align-items: center;

            justify-content: center;

            background: #111111;

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

        .loader-done {
            opacity: 0;

            visibility: hidden;

            pointer-events: none;
        }

        .loader-inner {
            text-align: center;

            padding: 0 1.5rem;
        }

        .loader-kicker {
            margin:
                0 0 .25rem;

            color: #ffffff;

            font-family:
                'League Spartan',
                sans-serif;

            font-size:
                clamp(14px, 2vw, 20px);

            font-weight: 900;

            letter-spacing: 1px;
        }

        .loader-title {
            margin:
                0 0 1.5rem;

            color: #ffffff;

            font-family:
                'League Spartan',
                sans-serif;

            font-size:
                clamp(28px, 6vw, 64px);

            font-weight: 900;

            letter-spacing: 2px;
        }

        .loader-bar {
            width:
                min(240px, 60vw);

            height: 4px;

            margin:
                0 auto;

            border-radius: 999px;

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

            overflow: hidden;
        }

        .loader-fill {
            display: block;

            width: 0;

            height: 100%;

            border-radius: 999px;

            background: #38bdf8;

            transition:
                width .3s ease;
        }


        @media (prefers-reduced-motion: reduce) {

            .loader {
                transition: none;
            }

            .loader-fill {
                transition: none;
            }
        }
