@media (prefers-reduced-motion: no-preference) {
  @view-transition {
    navigation: auto;
  }

  /* The page background is propagated to the canvas, so it is painted outside
     the root element and never lands in the `root` snapshot. Anything the
     snapshots leave transparent therefore falls through the pseudo tree to
     whatever the compositor has behind it, which is not the page. The UA
     cross-fade hides that — `plus-lighter` is chosen precisely so the outgoing
     and incoming alphas sum back to one — but only while it is running.
     Painting the page color on the overlay itself removes the dependency, so a
     browser whose blend arrives late, or a transition that is skipped partway,
     still has the page color behind it rather than a black or white gap. */
  ::view-transition {
    background-color: var(--octc-color-bg);
  }
}