.pm-scene {
  position: relative;
  perspective: var(--pm-perspective, 2200px);
  perspective-origin: center center;
}
.pm-scene .pm-card:hover,
.pm-scene .pm-card:active,
.pm-scene .pm-card {
  position: relative;
  transform-style: preserve-3d;
  will-change: transform;
  transform:
    scale(var(--pm-shift-z, 1))
    rotate3d(
      var(--pm-rotate-3d-x, 0),
      var(--pm-rotate-3d-y, 0),
      var(--pm-rotate-3d-z, 1),
      var(--pm-rotate-3d-angle, 0deg)
    );
  backface-visibility: hidden;
}
.pm-scene * {
  transform-style: preserve-3d;
}
.pm-card :is(
  .pm-tier-0,
  .pm-tier-off,
  .pm-tier-image,
  .pm-tier-1,
  .pm-tier-header,
  .pm-tier-2,
  .pm-tier-tag,
  .pm-tier-3,
  .pm-tier-body
) {
  position: relative;
  transform-style: preserve-3d;
  transform-origin: var(--pm-origin-x, 50%) var(--pm-origin-y, 50%);
  transform: translateZ(var(--pm-layer-z, 0px)) scale(var(--pm-layer-scale, 1));
  opacity: var(--pm-layer-opacity, 1);
  backface-visibility: hidden;
  will-change: transform;
}
.pm-tier-1,
.pm-tier-header {
  --pm-layer-z: var(--pm-tier-1-depth, 150px);
  z-index: 3;
}
.pm-tier-2,
.pm-tier-tag {
  --pm-layer-z: var(--pm-tier-2-depth, 110px);
  z-index: 2;
}
.pm-tier-3,
.pm-tier-body {
  --pm-layer-z: var(--pm-tier-3-depth, 72px);
  z-index: 1;
}
.pm-tier-0,
.pm-tier-off,
.pm-tier-image {
  --pm-layer-z: 0px;
  z-index: -1;
}