/* Two real pages travel as one continuous surface. */
@view-transition{navigation:auto}
:root{
  --transit-duration:640ms;
  --transit-width:100vw;--transit-height:100svh;--transit-scrollbar:0px;
  --transit-ease:cubic-bezier(.4,0,.2,1);
  --transit-in-x:0%;--transit-in-y:var(--transit-height);
  --transit-out-x:0%;--transit-out-y:calc(var(--transit-height) * -1);
  --transit-fallback-x:0%;--transit-fallback-y:8svh
}
html[data-transit-direction="right"]{--transit-in-x:var(--transit-width);--transit-in-y:0%;--transit-out-x:calc(var(--transit-width) * -1);--transit-out-y:0%;--transit-fallback-x:10vw;--transit-fallback-y:0%}
html[data-transit-direction="left"]{--transit-in-x:calc(var(--transit-width) * -1);--transit-in-y:0%;--transit-out-x:var(--transit-width);--transit-out-y:0%;--transit-fallback-x:-10vw;--transit-fallback-y:0%}
html[data-transit-direction="down"]{--transit-in-x:0%;--transit-in-y:calc(var(--transit-height) * -1);--transit-out-x:0%;--transit-out-y:var(--transit-height);--transit-fallback-x:0%;--transit-fallback-y:-8svh}
::view-transition{pointer-events:none}
::view-transition-group(root){animation:none;overflow:clip;width:var(--transit-width);height:var(--transit-height)}
::view-transition-image-pair(root){isolation:isolate;width:100%;height:100%}
::view-transition-old(root),::view-transition-new(root){width:100%;height:100%;object-fit:none;object-position:left top;mix-blend-mode:normal;backface-visibility:hidden;animation-duration:var(--transit-duration);animation-timing-function:var(--transit-ease);animation-fill-mode:both}
::view-transition-old(root){animation-name:senator-page-out;z-index:1}
::view-transition-new(root){animation-name:senator-page-in;z-index:2}
@keyframes senator-page-out{from{transform:translate3d(0,0,0)}to{transform:translate3d(var(--transit-out-x),var(--transit-out-y),0)}}
@keyframes senator-page-in{from{transform:translate3d(var(--transit-in-x),var(--transit-in-y),0)}to{transform:translate3d(0,0,0)}}
/* The header travels with its page, without a separately resized snapshot. */
.nav{view-transition-name:none}
/* Unsupported snapshots use opacity only: transforms on main change the
   containing block of fixed heroes and make them jump at animation end. */
html[data-transit-engine="fallback"][data-transit-state="arriving"] body{animation:senator-content-in 280ms ease-out both}
@keyframes senator-content-in{from{opacity:0}to{opacity:1}}
@media(max-width:700px){:root{--transit-duration:580ms}}
@media(prefers-reduced-motion:reduce){
  @view-transition{navigation:none}
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
  .nav{view-transition-name:none}
  html[data-transit-engine] body{animation:none!important}
}