/* ===== Base skeletons (card/blocks) */
.lk-skeleton {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    min-height: 84px;
    background: #eef2f7;
}
body.dark-version .lk-skeleton { background: #2a2f3a; }

.lk-skel-sm { min-height: 56px; }
.lk-skel-md { min-height: 84px; }
.lk-skel-lg { min-height: 140px; }

.lk-skel-line {
    height: 14px;
    border-radius: 6px;
    background: #fff;
    opacity: .5;
    margin-bottom: 10px;
}
.lk-skel-line:last-child { margin-bottom: 0; }

.lk-skel-avatar {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #fff;
    opacity: .5;
}
body.dark-version .lk-skel-line,
body.dark-version .lk-skel-avatar {
    background: rgba(255,255,255,.08);
}

/* shimmer */
.lk-skel--shimmer::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,.6) 50%, transparent 100%);
    transform: translateX(-100%);
    animation: lk-shimmer 1.25s infinite;
}
@keyframes lk-shimmer { 100% { transform: translateX(100%); } }

/* diagonal wave */
.lk-skel--diag::before {
    content: "";
    position: absolute;
    inset: -40%;
    background: repeating-linear-gradient(135deg, rgba(255,255,255,.05) 0 24px, rgba(255,255,255,.1) 24px 48px);
    animation: lk-diag 1.3s linear infinite;
}
@keyframes lk-diag { 100% { transform: translateX(60px); } }

/* pulse */
.lk-skel--pulse { animation: lk-pulse 1.3s ease-in-out infinite; }
@keyframes lk-pulse { 0%,100% { opacity:.55 } 50% { opacity:.9 } }

/* gradient breath */
.lk-skel--breath {
    background: linear-gradient(120deg, #eef2f7, #e7edf5, #eef2f7);
    background-size: 200% 200%;
    animation: lk-breath 2.2s ease-in-out infinite;
}
body.dark-version .lk-skel--breath {
    background: linear-gradient(120deg, #202838, #1b2231, #202838);
}
@keyframes lk-breath {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* ===== Spinners */
.lk-spinner { display:grid;place-items:center;min-height:84px; }
.lk-dot {
    width:10px;height:10px;border-radius:50%;
    background:currentColor;margin:0 3px;animation:lk-dot .9s infinite;
}
.lk-dot:nth-child(2){animation-delay:.15s}
.lk-dot:nth-child(3){animation-delay:.3s}
@keyframes lk-dot{0%,80%,100%{transform:scale(0)}40%{transform:scale(1)}}

.lk-bars{display:flex;gap:6px;min-height:84px;align-items:center;justify-content:center}
.lk-bar{width:6px;height:26px;border-radius:3px;background:currentColor;animation:lk-bars .9s ease-in-out infinite}
.lk-bar:nth-child(2){animation-delay:.1s}.lk-bar:nth-child(3){animation-delay:.2s}
@keyframes lk-bars{0%,100%{transform:scaleY(.4)}50%{transform:scaleY(1)}}

.lk-ring{
    width:38px;height:38px;border-radius:50%;
    border:4px solid rgba(0,0,0,.08);
    border-top-color:currentColor;
    animation:lk-rot 1s linear infinite;
}
body.dark-version .lk-ring{border-color:rgba(255,255,255,.15)}
@keyframes lk-rot{to{transform:rotate(360deg)}}

/* ===== Reduced motion */
@media (prefers-reduced-motion:reduce){
    .lk-skel--shimmer::after,.lk-skel--diag::before{animation:none}
    .lk-skel--pulse,.lk-skel--breath,.lk-dot,.lk-bar,.lk-ring{animation:none}
}

/* ===== Inline placeholders (числа/текст в строке) */
.lk-skel-inline { display:inline-block; vertical-align:baseline; }

/* Inline lazy placeholder (фикс shimmer overflow) */
.lk-amount-inline {
    display:inline-block;
    vertical-align:baseline;
    line-height:1.15;
    min-height:1.15em;
    padding-bottom:.04em;
    position:relative;
    overflow:hidden;          /* чтобы shimmer не вылазил */
    border-radius:.25em;
}
.lk-amount-inline::before {
    content:"";
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.08);
    pointer-events:none;
}
body.dark-version .lk-amount-inline::before {
    background:rgba(255,255,255,.10);
}

/* SHIMMER: движем background-position */
.lk-amount-inline.lk-skel--shimmer::before {
    background-image:linear-gradient(90deg, transparent 0%, rgba(255,255,255,.6) 50%, transparent 100%);
    background-size:200% 100%;
    background-repeat:no-repeat;
    animation:lk-shimmer-pos 1.25s linear infinite;
    will-change:background-position;
}
body.dark-version .lk-amount-inline.lk-skel--shimmer::before {
    background-image:linear-gradient(90deg, transparent 0%, rgba(255,255,255,.35) 50%, transparent 100%);
}
@keyframes lk-shimmer-pos {
    0%   { background-position:-100% 0; }
    100% { background-position:200% 0; }
}

/* DIAGONAL WAVE: тоже внутри блока */
.lk-amount-inline.lk-skel--diag::before {
    background-image:repeating-linear-gradient(135deg, rgba(255,255,255,.10) 0 24px, rgba(255,255,255,.16) 24px 48px);
    background-repeat:repeat;
    animation:lk-diag-pos 1.3s linear infinite;
    will-change:background-position;
}
body.dark-version .lk-amount-inline.lk-skel--diag::before {
    background-image:repeating-linear-gradient(135deg, rgba(255,255,255,.12) 0 24px, rgba(255,255,255,.18) 24px 48px);
}
@keyframes lk-diag-pos {
    0%   { background-position:0 0; }
    100% { background-position:60px 0; }
}

/* Pulse / Breath */
.lk-amount-inline.lk-skel--pulse::before { animation:lk-pulse 1.3s ease-in-out infinite; }
.lk-amount-inline.lk-skel--breath::before {
    background-image:linear-gradient(120deg, rgba(0,0,0,.08), rgba(0,0,0,.12), rgba(0,0,0,.08));
    background-size:200% 200%;
    animation:lk-breath 2.2s ease-in-out infinite;
}
body.dark-version .lk-amount-inline.lk-skel--breath::before {
    background-image:linear-gradient(120deg, rgba(255,255,255,.10), rgba(255,255,255,.14), rgba(255,255,255,.10));
}

/* Скрываем фон после загрузки */
.lk-amount-inline.is-ready::before {
    opacity:0;
    transition:opacity .2s ease;
}

/* Текст */
.lk-amount-text {
    font-weight:700;
    font-variant-numeric:tabular-nums;
    white-space:nowrap;
}
@keyframes lk-fade-in-up {
    0% { opacity:0; transform:translateY(6px) scale(.98); }
    100% { opacity:1; transform:translateY(0) scale(1); }
}
.lk-amount-text.fade-in-up {
    animation:lk-fade-in-up .35s ease-out both;
}

/* Точный базис для инлайнового числа: без сдвига и с line-height как у текста */
.lk-amount-inline--tight{
    line-height: 1;         /* ровно по строке */
    min-height: 1em;        /* высота строки */
    transform: none;        /* убираем сдвиг вниз */
    /*vertical-align: baseline; !* чёткая базовая линия *!*/
    vertical-align: -0.16em;
}
/* подложку тоже чуть «ужмём», чтобы не касалась границ и не резала глифы */
.lk-amount-inline--tight::before{
    top: .08em;
    bottom: .08em;
    left: 0;
    right: 0;
    border-radius: .2em;
}

/* выравнивание заголовков внутри .numbers */
.numbers h5 {
    line-height: 0.9 !important;
}

