/* smooth page-to-page transitions (browsers that support them; others load normally) */
  @view-transition { navigation: auto; }
  body > header { view-transition-name: sg-header; }
  ::view-transition-old(root) { animation: sgVtOut .16s ease-in both; }
  ::view-transition-new(root) { animation: sgVtIn .34s cubic-bezier(.2,.8,.2,1) both; }
  ::view-transition-group(sg-header) { animation-duration: 0s; }
  @keyframes sgVtOut { to { opacity: 0; } }
  @keyframes sgVtIn { from { opacity: 0; transform: translateY(10px); } }
  @media (prefers-reduced-motion: reduce) { @view-transition { navigation: none; } }