.obs-area{position:absolute;overflow:hidden;pointer-events:none;box-sizing:border-box}
.obs-actor{position:absolute;bottom:0;pointer-events:none;will-change:transform}
.obs-media{position:absolute;left:0;bottom:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;opacity:0;pointer-events:none;will-change:transform,opacity}
.obs-video.is-playing{opacity:1}
.obs-image.is-playing{animation-duration:4s;animation-timing-function:ease-in-out;animation-fill-mode:both}
.obs-actor.obs-pop .obs-image.is-playing{animation-name:obs-edge-pop}
.obs-actor.obs-bottom .obs-image.is-playing{animation-name:obs-bottom-peek}
.obs-actor.obs-hop .obs-image.is-playing{animation-name:obs-center-hop}
@keyframes obs-edge-pop{
  0%,7%,100%{opacity:1;transform:translateX(115%)}
  19%{opacity:1;transform:translateX(26%)}
  26%,72%{opacity:1;transform:translateX(18%)}
  81%{opacity:1;transform:translateX(24%)}
  93%{opacity:1;transform:translateX(115%)}
}
@keyframes obs-bottom-peek{
  0%,100%{opacity:1;transform:translateY(108%)}
  25%,72%{opacity:1;transform:translateY(14%)}
}
@keyframes obs-center-hop{
  0%,100%{opacity:0;transform:translateY(35%)}
  24%,70%{opacity:1;transform:translateY(0)}
  45%{opacity:1;transform:translateY(-9%)}
}