/* V33: bidirectional cross-document page turns, 610ms. */
@view-transition { navigation: auto; }
html { background:#0d0918; scroll-behavior:auto !important; }
body { animation:none !important; }
@media (prefers-reduced-motion: no-preference) {
  ::view-transition { background:#0d0918; }
  ::view-transition-old(root), ::view-transition-new(root) {
    animation-duration:610ms !important;
    animation-timing-function:cubic-bezier(.42,0,.18,1) !important;
    animation-fill-mode:both !important;
    mix-blend-mode:normal;
  }
  /* Forward: old goes left, new arrives from right. */
  ::view-transition-old(root) { animation-name:ab-v33-out-left !important; z-index:1; }
  ::view-transition-new(root) { animation-name:ab-v33-in-right !important; z-index:2; }
  /* Reverse: applied to BOTH the outgoing and incoming document. */
  html[data-ab-direction="back"]::view-transition-old(root),
  :root:active-view-transition-type(ab-back)::view-transition-old(root) {
    animation-name:ab-v33-out-right !important;
  }
  html[data-ab-direction="back"]::view-transition-new(root),
  :root:active-view-transition-type(ab-back)::view-transition-new(root) {
    animation-name:ab-v33-in-left !important;
  }
  @keyframes ab-v33-out-left { from {transform:translateX(0)} to {transform:translateX(-28%)} }
  @keyframes ab-v33-in-right { from {transform:translateX(100%)} to {transform:translateX(0)} }
  @keyframes ab-v33-out-right { from {transform:translateX(0)} to {transform:translateX(28%)} }
  @keyframes ab-v33-in-left { from {transform:translateX(-100%)} to {transform:translateX(0)} }
}
@media (prefers-reduced-motion:reduce) {
  ::view-transition-old(root),::view-transition-new(root){animation:none !important}
}