/* vip-bounce.css - пружинные анимации VIP-кабинета nelvoicard.com (11.09.2026), по образцу css/dashboard-bounce.css.
   Ничего не скрыто по умолчанию: входные анимации работают только при body.izi-anim (ставит js/vip-bounce.js),
   стартовое opacity:0 живёт внутри keyframe. Без JS или при reduced-motion кабинет выглядит как раньше. */
:root{--izi-spring:cubic-bezier(.34,1.56,.64,1);--izi-spring-hard:cubic-bezier(.2,1.9,.5,1);--izi-spring-soft:cubic-bezier(.22,1.25,.36,1)}

/* 1. Кнопки и плитки: сжатие при нажатии, пружина с перелётом при отпускании */
.btn,.tile,.cardt,.actions a .c{transition:transform .55s var(--izi-spring-hard),background-color .2s,color .2s,opacity .2s;will-change:transform}
.btn:active,.tile:active,.cardt:active{transform:scale(.92);transition:transform .09s ease-out}
.actions a:active .c{transform:scale(.86) rotate(-10deg);transition:transform .09s ease-out}
.izi-release{animation:iziBtnBounce .7s var(--izi-spring-hard)}
@keyframes iziBtnBounce{0%{transform:scale(.92)}35%{transform:scale(1.07)}60%{transform:scale(.97)}80%{transform:scale(1.02)}100%{transform:scale(1)}}

/* 2. Панели: всплывают снизу по очереди (мягко, без отскоков) */
.izi-anim .panel{animation:iziFadeUp .7s var(--izi-spring-soft) both}
.izi-anim .col>.panel:nth-child(2){animation-delay:.08s}
.izi-anim .col>.panel:nth-child(3){animation-delay:.16s}
.izi-anim .col:nth-child(2)>.panel:nth-child(1){animation-delay:.12s}
.izi-anim .col:nth-child(2)>.panel:nth-child(2){animation-delay:.2s}
@keyframes iziFadeUp{0%{opacity:0;transform:translateY(18px) scale(.985)}100%{opacity:1;transform:none}}

/* 3. Баланс: появляется с лёгким увеличением, при обновлении подпрыгивает */
.izi-anim .hero .big{animation:iziBalIn .8s .1s var(--izi-spring) both;display:inline-block}
@keyframes iziBalIn{0%{opacity:0;transform:translateY(10px) scale(.94)}100%{opacity:1;transform:none}}
.izi-bump{animation:iziBump .6s var(--izi-spring-hard)}
@keyframes iziBump{0%{transform:scale(1)}30%{transform:scale(1.08) translateY(-3px)}60%{transform:scale(.98)}100%{transform:scale(1)}}

/* 4. Быстрые действия: выпрыгивают по очереди с перелётом */
.izi-anim .actions a{animation:iziActIn .75s var(--izi-spring-hard) both}
.izi-anim .actions a:nth-child(2){animation-delay:.07s}.izi-anim .actions a:nth-child(3){animation-delay:.14s}.izi-anim .actions a:nth-child(4){animation-delay:.21s}
@keyframes iziActIn{0%{opacity:0;transform:translateY(22px) scale(.6)}60%{opacity:1;transform:translateY(-5px) scale(1.06)}100%{opacity:1;transform:none}}

/* 5. Строки операций и пары ключ-значение: слева одна за другой */
.izi-anim .list .row,.izi-anim .panel .kv{animation:iziRowIn .65s var(--izi-spring-hard) both;transform-origin:left center}
.izi-anim .list .row:nth-child(2),.izi-anim .panel .kv:nth-child(2){animation-delay:.07s}
.izi-anim .list .row:nth-child(3),.izi-anim .panel .kv:nth-child(3){animation-delay:.14s}
.izi-anim .list .row:nth-child(4),.izi-anim .panel .kv:nth-child(4){animation-delay:.21s}
.izi-anim .list .row:nth-child(5),.izi-anim .panel .kv:nth-child(5){animation-delay:.28s}
.izi-anim .list .row:nth-child(n+6){animation-delay:.35s}
@keyframes iziRowIn{0%{opacity:0;transform:translateX(-26px) scale(.96)}55%{opacity:1;transform:translateX(6px) scale(1.01)}80%{transform:translateX(-2px)}100%{opacity:1;transform:none}}
.izi-anim .list .row .ic{animation:iziIcPop .6s .12s var(--izi-spring-hard) both}
@keyframes iziIcPop{0%{transform:scale(0)}60%{transform:scale(1.2)}100%{transform:scale(1)}}

/* 6. Плитки карт в правой панели: лопаются по очереди */
.izi-anim .cards .cardt{animation:iziCardPop .7s var(--izi-spring-hard) both}
.izi-anim .cards .cardt:nth-child(2){animation-delay:.08s}.izi-anim .cards .cardt:nth-child(3){animation-delay:.16s}.izi-anim .cards .cardt:nth-child(4){animation-delay:.24s}
@keyframes iziCardPop{0%{opacity:0;transform:translateY(16px) scale(.85)}60%{opacity:1;transform:translateY(-3px) scale(1.04)}100%{opacity:1;transform:none}}

/* 7. Баннер проверки личности и сообщения: падают сверху с пружиной */
.izi-anim .panel.verify{animation:iziToastIn .8s var(--izi-spring-hard) both}
.izi-anim .msg.ok,.izi-anim .msg.err{animation:iziToastIn .7s var(--izi-spring-hard) both}
@keyframes iziToastIn{0%{opacity:0;transform:translateY(-26px) scale(.97)}60%{opacity:1;transform:translateY(4px) scale(1.01)}100%{opacity:1;transform:none}}

/* 8. Мобильные вкладки: активная слегка подпрыгивает при загрузке */
.izi-anim .mobile-nav a.active i{animation:iziIcPop .7s .3s var(--izi-spring-hard) both}

@media (prefers-reduced-motion:reduce){
  .izi-anim *,.btn,.tile,.cardt,.actions a .c{animation:none!important;transition:none!important}
}