.cartoon {
  width: 80vmin;
  height: 80vmin;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.wheel {
  position: absolute;
  width: 40%;
  height: 40%;
  border-radius: 50%;
  background: #ddd;
  top: 50%;
  left: 0;
  background: conic-gradient(from 26.5deg, white, black);
}

.wheel::before,
.wheel::after {
  content:"";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  background: #ddd;
  border-radius: 50%;
  left: 150%;
  background: conic-gradient(from -26.5deg, white, black)
}

.wheel::before {
  width: 30%;
  height: 30%;
  top: 35%;
  left: 110%;
}

.frame {
  position: absolute;
  height: 30%;
  width: 30%;
  top: 40%;
  left: 20%;
  transform-origin: bottom right;
  transform: skewX(-26.5deg);
  box-shadow: inset -10vmin 0 9vmin -12vmin;
}

.frame::after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: -100%;
  box-shadow: inset -10vmin 0 9vmin -12vmin;
}

.frame-2 {
  position: absolute;
  height: 35%;
  width: 30%;
  top: 35%;
  left: 50%;
  transform-origin: bottom right;
  transform: skewX(26.5deg);
  box-shadow: inset -10vmin 0 9vmin -12vmin;
}

.handlebar {
  position: absolute;
  width: 15%;
  height: 2.5%;
  border-radius: 5vmin;
  top: 32.5%;
  left: 52%;
  box-shadow: inset -10vmin 0 9vmin -12vmin;
}

.handlebar::after {
  content: "";
  display: block;
  position: absolute;
  width: 150%;
  height: 100%;
  border-radius: 5vmin;
  left: -240%;
  box-shadow: inset -13vmin 0 9vmin -12vmin;
}