/* Надпечатка · motion.css
   Требует tokens.css (--t-* и --e-*).
   Физика системы — сжатие и отдача, а не равномерный разгон. */
@keyframes op-spring{
  0%{transform:scaleY(1) scaleX(1)}
  22%{transform:scaleY(.5) scaleX(1.28)}
  38%{transform:scaleY(1.34) scaleX(.82)}
  58%{transform:scaleY(.88) scaleX(1.08)}
  76%{transform:scaleY(1.06) scaleX(.97)}
  100%{transform:scaleY(1) scaleX(1)}
}
@keyframes op-band{
  0%{transform:scaleX(0)}
  100%{transform:scaleX(1)}
}
@keyframes op-shuffle{
  0%{transform:rotate(0) translate(0,0)}
  30%{transform:rotate(-14deg) translate(-9px,7px)}
  62%{transform:rotate(9deg) translate(6px,-5px)}
  100%{transform:rotate(0) translate(0,0)}
}
@keyframes op-bloom{
  0%{transform:scale(.24) rotate(-26deg);opacity:0}
  55%{opacity:1}
  100%{transform:scale(1) rotate(0);opacity:1}
}
@keyframes op-eject{
  0%{transform:translate(0,0)}
  34%{transform:translate(64px,-64px)}
  35%{transform:translate(-64px,64px)}
  100%{transform:translate(0,0)}
}
@keyframes op-slide{
  0%{transform:translate(0,0)}
  40%{transform:translate(3.5px,-3.5px)}
  100%{transform:translate(0,0)}
}
@keyframes op-tape{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
@keyframes op-reveal{
  0%{transform:translateY(105%) skewY(4deg)}
  100%{transform:translateY(0) skewY(0)}
}
@keyframes op-stretch{
  0%,100%{transform:scaleX(1)}
  46%{transform:scaleX(1.62)}
}
@keyframes op-drift{
  0%{transform:translate3d(0,0,0) rotate(0)}
  100%{transform:translate3d(0,-26px,0) rotate(6deg)}
}

.play-spring{animation:op-spring var(--t-slow) var(--e-out) both}
.play-band::before{animation:op-band var(--t-base) var(--e-sharp) both}
.play-shuffle i{animation:op-shuffle var(--t-story) var(--e-spring) both}
.play-shuffle i:nth-child(2){animation-delay:60ms}
.play-shuffle i:nth-child(3){animation-delay:120ms}
.play-shuffle i:nth-child(4){animation-delay:180ms}
.play-shuffle i:nth-child(5){animation-delay:240ms}
.play-shuffle i:nth-child(6){animation-delay:300ms}
.play-bloom{animation:op-bloom var(--t-slow) var(--e-ink) both}
.play-eject svg{animation:op-eject var(--t-slow) var(--e-sharp) both}
.play-reveal b{animation:op-reveal var(--t-slow) var(--e-out) both}
.play-stretch path{animation:op-stretch var(--t-slow) var(--e-spring) both}
.play-slide .a{animation:op-slide var(--t-slow) var(--e-spring) both}
.tape__run{animation:op-tape 11s linear infinite}

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