.mobile-like-motion-graphic {
  position: relative;
  display: block;
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  overflow: visible;
}

[data-mobile-like-motion] .mobile-like-motion-frame {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 40px;
  height: 40px;
  max-width: none;
  pointer-events: none;
  transform: translate(-50%, -50%);
  transition: none;
}

[data-mobile-like-motion] .mobile-like-motion-frame[data-mobile-like-frame="1"],
[data-mobile-like-motion] .mobile-like-motion-frame[data-mobile-like-frame="2"] {
  height: 44px;
}

/* Figma frames 0-3 place the foreground 10px above the fixed canvas center. */
[data-mobile-like-motion] .mobile-like-motion-frame[data-mobile-like-frame="0"],
[data-mobile-like-motion] .mobile-like-motion-frame[data-mobile-like-frame="1"],
[data-mobile-like-motion] .mobile-like-motion-frame[data-mobile-like-frame="2"],
[data-mobile-like-motion] .mobile-like-motion-frame[data-mobile-like-frame="3"] {
  transform: translate(-50%, calc(-50% + 10px));
}

@media (prefers-reduced-motion: reduce) {
  [data-mobile-like-motion] .mobile-like-motion-frame {
    transition: none;
  }
}