#xtrim-loader {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.5s ease, transform 0.5s ease;
    will-change: opacity, transform;
}

#xtrim-loader.xtrim-loader-hidden {
    pointer-events: none;
}

#xtrim-loader.exit-fadeout {
    opacity: 0;
}
#xtrim-loader.exit-slide-up {
    transform: translateY(-100%);
}
#xtrim-loader.exit-slide-down {
    transform: translateY(100%);
}
#xtrim-loader.exit-zoomout {
    opacity: 0;
    transform: scale(1.15);
}


.xtrim-loader-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 18px;
}


.xtrim-loader-logo img {
    width: 100%;
    height: auto;
    display: block;
}

.xtrim-loader-text {
    font-weight: 500;
    letter-spacing: 0.03em;
    text-align: center;
    font-family: inherit;
}


.xtrim-anim-spinner {
    width: var(--anim-size, 50px);
    height: var(--anim-size, 50px);
}
.xtrim-spinner {
    width: 100%;
    height: 100%;
    border: 4px solid rgba(0,0,0,0.08);
    border-top-color: var(--anim-color, #7c3aed);
    border-radius: 50%;
    animation: xtrim-spin 0.8s linear infinite;
}
@keyframes xtrim-spin {
    to { transform: rotate(360deg); }
}


.xtrim-anim-bar {
    width: 220px;
    height: auto;
}
.xtrim-bar-wrap {
    width: 220px;
    height: 5px;
    background: rgba(0,0,0,0.08);
    border-radius: 99px;
    overflow: hidden;
}
.xtrim-bar-fill {
    height: 100%;
    width: 0%;
    background: var(--anim-color, #7c3aed);
    border-radius: 99px;
    animation: xtrim-bar-anim 2s ease-in-out infinite;
}
@keyframes xtrim-bar-anim {
    0%   { width: 0%;   margin-right: 0; }
    50%  { width: 80%;  margin-right: 0; }
    100% { width: 0%;   margin-right: 100%; }
}


.xtrim-anim-pulse {
    width: auto;
    height: auto;
}
.xtrim-pulse {
    display: flex;
    align-items: center;
    gap: 8px;
}
.xtrim-pulse span {
    display: block;
    width: calc(var(--anim-size, 50px) / 4);
    height: calc(var(--anim-size, 50px) / 4);
    background: var(--anim-color, #7c3aed);
    border-radius: 50%;
    animation: xtrim-pulse-anim 1.2s ease-in-out infinite;
}
.xtrim-pulse span:nth-child(2) { animation-delay: 0.2s; }
.xtrim-pulse span:nth-child(3) { animation-delay: 0.4s; }

@keyframes xtrim-pulse-anim {
    0%, 80%, 100% { transform: scale(0.6); opacity: 0.4; }
    40%            { transform: scale(1);   opacity: 1;   }
}


.xtrim-anim-fade-logo {
    width: auto;
    height: auto;
}
.xtrim-fade-logo-anim {
    display: block;
    animation: xtrim-fade-logo-anim 1.6s ease-in-out infinite;
}
@keyframes xtrim-fade-logo-anim {
    0%, 100% { opacity: 0.3; transform: scale(0.95); }
    50%       { opacity: 1;   transform: scale(1);    }
}