.zoom-in-image-mask {
  position fixed
  top 0
  right 0
  bottom 0
  left 0
  z-index $z-index-8
  display flex
  align-items center
  justify-content center
  box-sizing border-box
  background rgba(0, 0, 0, 0)
  visibility hidden
  transition-t("visibility, background", "0, 0", "0.3, 0.3", "linear, linear")

  &.show {
    background rgba(0, 0, 0, 0.5)
    visibility visible

    .zoom-in-image {
      cursor zoom-out
    }
  }

  .zoom-in-image {
    position absolute
    z-index $z-index-9
    transform-origin center center
    will-change transform
    transition-t("transform", "0", "0.3", "linear")
  }
}