/* One viewport, closing to the centre while the destination stays full size. */
html.rawas-route-active { background: #f4f3dc; isolation: isolate; }
html.rawas-route-active > body { position: relative; z-index: 1; pointer-events: none; }
.rawas-route-preview {
  position: fixed;
  z-index: 0;
  inset: 0;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  display: block;
  visibility: hidden;
  margin: 0;
  border: 0;
  background: #f4f3dc;
  pointer-events: none;
}
/* GSAP scenes can explicitly set visibility: visible on their copy. Hide the
   outgoing body as one composited layer so it cannot enter the new snapshot. */
html.rawas-route-swapped > body { opacity: 0; visibility: hidden; }
html.rawas-route-swapped > .rawas-route-preview { visibility: visible; }
html.rawas-route-snapshot::view-transition-group(root) { animation: none; }
html.rawas-route-snapshot::view-transition-image-pair(root) { isolation: isolate; }
html.rawas-route-snapshot::view-transition-old(root),
html.rawas-route-snapshot::view-transition-new(root) {
  animation: none;
  mix-blend-mode: normal;
  transform-origin: center;
}
html.rawas-route-snapshot::view-transition-old(root) { z-index: 2; }
html.rawas-route-snapshot::view-transition-new(root) { z-index: 1; }
@media (prefers-reduced-motion: reduce) {
  html.rawas-route-snapshot::view-transition-old(root),
  html.rawas-route-snapshot::view-transition-new(root) { animation: none; }
}