:root{
    --subbowert-loader-bg:#07111d;
    --subbowert-loader-panel:#0b1928;
    --subbowert-loader-border:#1e3d59;
    --subbowert-loader-blue:#4ca9f4;
}

.subbowert-page-loader{
    position:fixed;
    z-index:2147483000;
    inset:0;
    display:grid;
    place-items:center;
    padding:24px;
    background:
        radial-gradient(circle at 50% 40%,rgba(45,126,196,.14),transparent 30%),
        linear-gradient(180deg,#091522 0%,var(--subbowert-loader-bg) 100%);
    opacity:1;
    visibility:visible;
    pointer-events:all;
    transition:opacity .28s ease,visibility .28s ease;
}

.subbowert-page-loader::before{
    content:"";
    position:absolute;
    inset:0;
    opacity:.16;
    background-image:
        linear-gradient(rgba(91,156,207,.08) 1px,transparent 1px),
        linear-gradient(90deg,rgba(91,156,207,.08) 1px,transparent 1px);
    background-size:32px 32px;
    mask-image:radial-gradient(circle at center,#000 0%,transparent 72%);
}

.subbowert-page-loader.is-hidden{
    opacity:0;
    visibility:hidden;
    pointer-events:none;
}

.subbowert-page-loader.is-leaving{
    opacity:1;
    visibility:visible;
    pointer-events:all;
}

.subbowert-page-loader-inner{
    position:relative;
    width:min(390px,100%);
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:14px;
    padding:25px 25px 22px;
    border:1px solid var(--subbowert-loader-border);
    border-radius:16px;
    background:linear-gradient(180deg,rgba(13,29,46,.95),rgba(8,20,33,.95));
    box-shadow:0 24px 70px rgba(0,0,0,.38),inset 0 1px rgba(255,255,255,.025);
}

.subbowert-page-loader-logo{
    display:flex;
    align-items:baseline;
    color:#f3f8ff;
    font-size:30px;
    font-weight:950;
    letter-spacing:-.055em;
    line-height:1;
    text-shadow:0 5px 22px rgba(0,0,0,.3);
}

.subbowert-page-loader-logo strong{
    color:var(--subbowert-loader-blue);
    font:inherit;
}

.subbowert-page-loader-track{
    width:min(230px,80%);
    height:6px;
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:5px;
    margin:3px 0 0;
}

.subbowert-page-loader-track i{
    display:block;
    border-radius:2px;
    background:#17324a;
    animation:subbowert-loader-pulse 1.05s infinite ease-in-out;
}

.subbowert-page-loader-track i:nth-child(2){animation-delay:.1s}
.subbowert-page-loader-track i:nth-child(3){animation-delay:.2s}
.subbowert-page-loader-track i:nth-child(4){animation-delay:.3s}
.subbowert-page-loader-track i:nth-child(5){animation-delay:.4s}

.subbowert-page-loader-copy{
    display:grid;
    gap:3px;
    text-align:center;
}

.subbowert-page-loader-copy strong{
    color:#dcecff;
    font-size:11px;
    font-weight:850;
}

.subbowert-page-loader-copy span{
    color:#70859d;
    font-size:8px;
    font-weight:650;
    letter-spacing:.02em;
}

@keyframes subbowert-loader-pulse{
    0%,100%{background:#17324a;transform:scaleY(.72);opacity:.55}
    48%{background:var(--subbowert-loader-blue);transform:scaleY(1);opacity:1;box-shadow:0 0 12px rgba(76,169,244,.35)}
}

@media(max-width:520px){
    .subbowert-page-loader-inner{padding:22px 18px 20px;border-radius:13px}
    .subbowert-page-loader-logo{font-size:27px}
}

@media(prefers-reduced-motion:reduce){
    .subbowert-page-loader,
    .subbowert-page-loader-track i{
        transition:none!important;
        animation:none!important;
    }
    .subbowert-page-loader-track i:nth-child(3){background:var(--subbowert-loader-blue);opacity:1}
}
