/* Белка: меньше + цикл частей тела (спрайт 4 кадра). */
.squirrelTrack {
  z-index: 65;
  pointer-events: none;
  height: 132px;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  overflow: hidden;
}

.squirrelRunner {
  will-change: transform;
  width: 158px;
  height: 124px;
  animation: 18s linear infinite squirrel-route;
  position: absolute;
  bottom: 2px;
  left: -170px;
}

.squirrelStride {
  width: 100%;
  height: 100%;
  position: relative;
  transform-origin: 55% 88%;
  animation: 0.44s ease-in-out infinite sq-bob;
}

.squirrelPaint {
  display: block;
  width: 158px;
  height: 124px;
  background: url("/images/squirrel-run-sprite.webp?v=1") 0 0 no-repeat;
  background-size: 632px 124px;
  animation: 0.44s steps(4) infinite sq-run;
  filter: drop-shadow(0 6px 5px rgba(23, 34, 27, 0.26));
}

@keyframes sq-run {
  from {
    background-position: 0 0;
  }
  to {
    background-position: -632px 0;
  }
}

@keyframes sq-bob {
  0%,
  100% {
    transform: translateY(2px) rotate(-3deg);
  }
  50% {
    transform: translateY(-5px) rotate(-6deg);
  }
}

@media (max-width: 767px) {
  .squirrelTrack {
    height: 96px;
  }
  .squirrelRunner {
    width: 112px;
    height: 88px;
    animation-duration: 15s;
    left: -120px;
  }
  .squirrelPaint {
    width: 112px;
    height: 88px;
    background-size: 448px 88px;
    animation-name: sq-run-m;
  }
}

@keyframes sq-run-m {
  from {
    background-position: 0 0;
  }
  to {
    background-position: -448px 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .squirrelTrack {
    display: none;
  }
}