.moving-chair {
  left: 33%;
  top: 58%;
  width: 4.6%;
  height: 9%;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  filter: drop-shadow(0 7px 7px #000a);
  transform: translateX(calc(var(--event-progress) * 10vw)) skew(-5deg);
}

.moving-chair::before {
  content: "";
  position: absolute;
  left: 13%;
  top: 0;
  width: 70%;
  height: 56%;
  border: 3px solid rgba(3, 6, 5, 0.8);
  border-radius: 8px 8px 2px 2px;
  background: rgba(3, 6, 5, 0.34);
}

.moving-chair::after {
  content: "";
  position: absolute;
  left: 4%;
  bottom: 0;
  width: 88%;
  height: 45%;
  border-left: 3px solid rgba(3, 6, 5, 0.86);
  border-right: 3px solid rgba(3, 6, 5, 0.86);
  border-top: 5px solid rgba(3, 6, 5, 0.86);
  transform: skew(-4deg);
}