:root {
    --rekover-loader-blue: #1769e0;
    --rekover-loader-cyan: #20b8d9;
    --rekover-loader-ink: #13223a;
}

.rekover-page-loader {
    position: fixed !important;
    inset: 0;
    z-index: 10050 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 24px;
    background:
        radial-gradient(circle at 50% 43%, rgba(39, 190, 221, .28), transparent 29%),
        linear-gradient(145deg, rgba(240, 247, 255, .98), rgba(255, 255, 255, .98)) !important;
    opacity: 1 !important;
    backdrop-filter: blur(8px);
    transition: opacity .18s ease, visibility .18s ease;
}

.rekover-page-loader.is-leaving {
    opacity: 1 !important;
    visibility: visible !important;
}

.rekover-page-loader.is-hidden {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none;
}

.rekover-loader-card {
    width: min(370px, 88vw);
    padding: 34px 28px 30px;
    border: 1px solid rgba(23, 105, 224, .12);
    border-radius: 28px;
    background: rgba(255, 255, 255, .88);
    box-shadow: 0 28px 70px rgba(25, 72, 137, .18);
    text-align: center;
    color: var(--rekover-loader-ink);
}

.rekover-loader-mark {
    position: relative;
    display: grid;
    place-items: center;
    width: 164px;
    height: 164px;
    margin: 0 auto 20px;
}

.rekover-loader-mark::before {
    position: absolute;
    inset: 25px;
    border-radius: 34px;
    background: #fff;
    box-shadow: 0 16px 40px rgba(28, 85, 164, .18);
    content: '';
    transform: rotate(45deg);
    animation: rekover-card-breathe 1.35s ease-in-out infinite;
}

.rekover-loader-mark img {
    position: relative;
    z-index: 2;
    width: 104px;
    height: 104px;
    image-rendering: auto;
    object-fit: contain;
    filter: drop-shadow(0 6px 10px rgba(19, 64, 126, .12));
    animation: rekover-logo-float 1.35s ease-in-out infinite;
}

.rekover-loader-orbit {
    position: absolute;
    inset: 3px;
    border: 4px solid rgba(23, 105, 224, .13);
    border-top-color: var(--rekover-loader-blue);
    border-right-color: var(--rekover-loader-cyan);
    border-radius: 50%;
    animation: rekover-orbit .85s linear infinite;
}

.rekover-loader-brand {
    font-size: 1.5rem;
    font-weight: 800;
    letter-spacing: .24em;
    text-indent: .24em;
}

.rekover-loader-caption {
    margin-top: 7px;
    color: #718096;
    font-size: .88rem;
    font-weight: 600;
}

.rekover-loader-progress {
    width: 205px;
    height: 5px;
    margin: 19px auto 0;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(23, 105, 224, .11);
}

.rekover-loader-progress span {
    display: block;
    width: 45%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--rekover-loader-blue), var(--rekover-loader-cyan));
    animation: rekover-progress 1s ease-in-out infinite;
}

@keyframes rekover-orbit { to { transform: rotate(360deg); } }
@keyframes rekover-logo-float { 50% { transform: translateY(-3px) scale(1.025); } }
@keyframes rekover-card-breathe { 50% { box-shadow: 0 20px 46px rgba(28, 85, 164, .24); } }
@keyframes rekover-progress {
    from { transform: translateX(-110%); }
    to { transform: translateX(225%); }
}

@media (prefers-reduced-motion: reduce) {
    .rekover-loader-mark::before,
    .rekover-loader-mark img,
    .rekover-loader-orbit,
    .rekover-loader-progress span {
        animation-duration: 2.5s;
    }
}