::view-transition {
  perspective: 1000px;
  background: #000;
  inset: 0;
}

::view-transition-group(root),
::view-transition-image-pair(root) {
  transform-style: preserve-3d;
  isolation: auto;
}

::view-transition-old(root),
::view-transition-new(root) {
  mix-blend-mode: normal;
  backface-visibility: hidden;
  animation: none;
}

@keyframes group-rotate {
  0% {
    transform: rotateY(0);
  }
  100% {
    transform: rotateY(-90deg);
  }
}

::view-transition-group(root) {
  transform-origin: 50% 50% -50vw;
  animation: 300ms ease forwards group-rotate;
}

::view-transition-new(root) {
  transform-origin: 0 0;
  transform: rotateY(90deg);
  inset: 0 auto 0 100%;
}