:root {
    --rz-skeleton-bg: rgba(0,0,0,.11);
    --rz-skeleton-bg-dark: rgba(255,255,255,.12);
    --rz-skeleton-radius: 8px;
    --rz-skeleton-speed: 1.2s;
    --rz-skeleton-gap: 6px;
    --rz-skeleton-shimmer-from: rgba(255,255,255,.12);
    --rz-skeleton-shimmer-to:   rgba(255,255,255,0);
}

/* Базовый блок */
.rz-skeleton {
    position: relative;
    display: block;
    width: 100%;
    max-width: 100%;
    background-color: var(--rz-skeleton-bg);
    border-radius: var(--rz-skeleton-radius);
    overflow: hidden;
    transform: translateZ(0);
}

/* Варианты анимации */
.rz-skeleton--pulse {
    animation: rz-skeleton-pulse var(--rz-skeleton-speed) ease-in-out .2s infinite;
}

.rz-skeleton--shimmer::after {
    content: "";
    position: absolute;
    inset: 0;
    transform: translateX(-100%);
    background-image:
        linear-gradient(90deg,
        transparent 0%,
        var(--rz-skeleton-shimmer-from) 40%,
        var(--rz-skeleton-shimmer-from) 60%,
        var(--rz-skeleton-shimmer-to) 100%);
    animation: rz-skeleton-shimmer calc(var(--rz-skeleton-speed) + .3s) linear .15s infinite;
}

@media (prefers-reduced-motion: reduce) {
    .rz-skeleton--pulse { animation: none; }
    .rz-skeleton--shimmer::after { animation: none; background: none; }
}

/* Формы */
.rz-skeleton--rounded { border-radius: 12px; }
.rz-skeleton--pill    { border-radius: 999px; }
.rz-skeleton--circle  { border-radius: 50%; aspect-ratio: 1 / 1; }

/* Размеры */
.rz-skeleton.is-xs { height: 10px; }
.rz-skeleton.is-sm { height: 14px; }
.rz-skeleton.is-md { height: 20px; }
.rz-skeleton.is-lg { height: 28px; }
.rz-skeleton.is-xl { height: 40px; }

/* Текстовые наборы */
.rz-skeleton-text {
    display: grid;
    gap: var(--rz-skeleton-gap);
}
.rz-skeleton-text > .line {
    height: 12px;
    border-radius: 6px;
    background-color: var(--rz-skeleton-bg);
    overflow: hidden;
}
.rz-skeleton-text.rz-skeleton--shimmer > .line::after {
    content: "";
    position: absolute;
    inset: 0;
}

.rz-skeleton-text > .line:nth-last-child(1) { width: 60%; }
.rz-skeleton-text > .line:nth-last-child(2) { width: 80%; }

/* Карточка */
.rz-skeleton-card {
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 12px;
    align-items: center;
}
.rz-skeleton-card .avatar {
    width: 48px; height: 48px;
}

/* Анимации */
@keyframes rz-skeleton-pulse {
    0%, 100% { opacity: 1; }
    50%      { opacity: .45; }
}

@keyframes rz-skeleton-shimmer {
    100% { transform: translateX(100%); }
}

.rz-sr-only {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0,0,0,0);
    white-space: nowrap; border: 0;
}