:root {
    --loading-primary: #087f72;
    --loading-primary-dark: #05665d;
    --loading-mint: #dff5f0;
    --loading-coral: #ef745f;
    --loading-ink: #17312d;
}

.vetos-loading {
    position: fixed;
    inset: 0;
    z-index: 2147483647;
    display: grid;
    place-items: center;
    overflow: hidden;
    padding: 24px;
    background: linear-gradient(145deg, #fffdf9 0%, #f3fbf8 48%, #edf8f5 100%);
    opacity: 1;
    visibility: visible;
    transition: opacity .38s ease, visibility .38s ease;
}

.vetos-loading.is-finished {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.vetos-loading__glow {
    position: absolute;
    width: min(52vw, 620px);
    aspect-ratio: 1;
    border-radius: 50%;
    filter: blur(8px);
    opacity: .58;
    animation: vetos-loading-float 6s ease-in-out infinite;
}

.vetos-loading__glow--one {
    top: -30%;
    right: -12%;
    background: radial-gradient(circle, rgba(8, 127, 114, .18), transparent 68%);
}

.vetos-loading__glow--two {
    bottom: -34%;
    left: -15%;
    background: radial-gradient(circle, rgba(239, 116, 95, .13), transparent 68%);
    animation-delay: -3s;
}

.vetos-loading__card {
    position: relative;
    display: flex;
    width: min(100%, 390px);
    flex-direction: column;
    align-items: center;
    padding: 44px 38px 38px;
    border: 1px solid rgba(8, 127, 114, .12);
    border-radius: 30px;
    background: rgba(255, 255, 255, .82);
    box-shadow: 0 28px 90px rgba(23, 49, 45, .13);
    backdrop-filter: blur(18px);
}

.vetos-loading__brand {
    position: relative;
    display: grid;
    width: 178px;
    height: 108px;
    place-items: center;
}

.vetos-loading__brand img {
    position: relative;
    z-index: 2;
    display: block;
    width: 148px;
    height: auto;
    filter: drop-shadow(0 9px 18px rgba(8, 127, 114, .12));
    animation: vetos-loading-breathe 2.2s ease-in-out infinite;
}

.vetos-loading__orbit {
    position: absolute;
    inset: -6px 27px;
    border: 1px solid rgba(8, 127, 114, .12);
    border-radius: 50%;
    animation: vetos-loading-spin 4.2s linear infinite;
}

.vetos-loading__orbit i {
    position: absolute;
    width: 9px;
    height: 9px;
    border: 2px solid #fff;
    border-radius: 50%;
    background: var(--loading-primary);
    box-shadow: 0 3px 10px rgba(8, 127, 114, .25);
}

.vetos-loading__orbit i:nth-child(1) { top: 6px; left: 13px; }
.vetos-loading__orbit i:nth-child(2) { top: 43%; right: -5px; background: var(--loading-coral); }
.vetos-loading__orbit i:nth-child(3) { bottom: 3px; left: 35%; width: 7px; height: 7px; }

.vetos-loading__title {
    margin: 10px 0 5px;
    color: var(--loading-ink);
    font: 700 1rem/1.4 'Inter', sans-serif;
    letter-spacing: -.01em;
    text-align: center;
}

.vetos-loading__subtitle {
    margin: 0;
    color: #6d827d;
    font: 500 .78rem/1.5 'Inter', sans-serif;
    text-align: center;
}

.vetos-loading__progress {
    position: relative;
    width: 150px;
    height: 4px;
    margin-top: 24px;
    overflow: hidden;
    border-radius: 99px;
    background: var(--loading-mint);
}

.vetos-loading__progress i {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(90deg, transparent, var(--loading-primary), var(--loading-coral), transparent);
    transform: translateX(-100%);
    animation: vetos-loading-progress 1.45s ease-in-out infinite;
}

@keyframes vetos-loading-spin { to { transform: rotate(360deg); } }

@keyframes vetos-loading-breathe {
    50% { transform: translateY(-3px) scale(1.025); }
}

@keyframes vetos-loading-progress {
    to { transform: translateX(100%); }
}

@keyframes vetos-loading-float {
    50% { transform: translate3d(0, 16px, 0) scale(1.05); }
}

@media (max-width: 480px) {
    .vetos-loading__card { padding: 38px 24px 32px; border-radius: 24px; }
}

@media (prefers-reduced-motion: reduce) {
    .vetos-loading *,
    .vetos-loading *::before,
    .vetos-loading *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}
