/* Smooth page changes without a single-page rewrite: cross-document View Transitions
   (Safari 18.2+, Chrome 126+). The tab bar keeps its own name so it stays put while the page
   content slides; browsers without support simply navigate as before. */

@view-transition {
  navigation: auto;
}

.rh-shell-tabbar {
  view-transition-name: rh-tabbar;
}

::view-transition-old(root) {
  animation: rh-vt-out 0.18s ease-in both;
}

::view-transition-new(root) {
  animation: rh-vt-in 0.3s cubic-bezier(0.2, 0.8, 0.2, 1) both;
}

@keyframes rh-vt-out {
  to {
    opacity: 0;
    transform: translateX(-10px);
  }
}

@keyframes rh-vt-in {
  from {
    opacity: 0;
    transform: translateX(18px);
  }
}

@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(root),
  ::view-transition-new(root) {
    animation: none;
  }
}