/* ============================================================
   Cross-document View Transitions — one opt-in covers every
   same-origin full-page navigation (Chrome/Edge 126+, Safari 18.2+).
   Unsupported browsers drop the at-rule and keep instant jumps;
   nothing here can break them.

   Layered on top of the inline html{background:#0a0810} paint fix
   in base.html: during an opted-in navigation the OLD page's paint
   is held until the NEW document is ready to capture, which also
   closes any remaining gap where the held document would flip.
   ============================================================ */

@view-transition {
  navigation: auto;
}

/* Shared chrome continuity: the sticky topbar exists pixel-stable on
   nearly every page, so give it its own transition layer instead of
   letting it blink inside the root cross-fade. Same name must resolve
   on both pages of a pair (navbar partial via base.html AND the
   standalone templates below link this same stylesheet). Pages that
   override {% block nav %} (feed, login, ...) simply have no such
   element; the absent/present pair falls back to the default
   enter/exit fade for that group. */
#nxNav > .topbar {
  view-transition-name: nx-topbar;
}

/* Tune the whole-page swap: quick fade-out, then a short gentle
   rise-and-fade-in. Transform+opacity only => stays on the compositor.
   Modest durations so back-to-back nav clicks never feel floaty. */
::view-transition-old(root) {
  animation-duration: .18s;
  animation-timing-function: ease-in;
}
::view-transition-new(root) {
  animation-name: nx-vt-in;
  animation-duration: .32s;
  animation-timing-function: cubic-bezier(.22, .9, .26, 1);
}
@keyframes nx-vt-in {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: none; }
}

/* Reduced motion: honor it by collapsing every transition layer to a
   near-instant swap instead of animated fades/slides. */
@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(*),
  ::view-transition-image-pair(*),
  ::view-transition-old(*),
  ::view-transition-new(*) {
    animation-duration: 1ms !important;
  }
}
