/**
 * FinXP — Cross-document View Transitions (Wave 6c, layer 2).
 *
 * Pure CSS progressive enhancement, deliberately kept out of style.css
 * (separate concern, separate owner). Browsers without support (Firefox,
 * pre-18.2 Safari) simply never parse `@view-transition` or the
 * `::view-transition-*` pseudo-elements — this file has zero effect there.
 * Supported: Chrome/Edge 126+, Safari 18.2+.
 *
 * `navigation: auto` opts every same-origin document navigation on the site
 * into the cross-document View Transitions flow (no JS required — this is
 * the CSS-only opt-in the spec provides for MPAs).
 */

@view-transition {
	navigation: auto;
}

/*
 * Persistent header: give it its own named transition group so the OLD
 * page's header and the NEW page's header are treated as the same element
 * rather than cross-fading against each other — it just stays put while the
 * rest of the page transitions underneath it. `.site-header` is the fixed
 * wrapper in header.php, present and structurally identical on every page.
 */
.site-header {
	view-transition-name: site-header;
}

/*
 * No cross-fade on the header group — instant swap (2026-08-11, Benn's
 * live feedback: header "flashed" on fast menu-to-menu navigation).
 * Root cause: the header is frosted glass (backdrop-filter: blur(14px),
 * style.css) and View Transitions animate FLAT SNAPSHOTS — each page's
 * header snapshot has that page's own content baked into the blur, so the
 * group's default cross-fade shimmers between two different frosted strips
 * even though the header chrome itself is pixel-identical. Killing the
 * animation shows the NEW header snapshot from the first frame: the
 * identical chrome swaps invisibly, the blurred strip switches in one
 * frame instead of shimmering, and the page still fades underneath.
 * (Rapid re-clicks mid-transition abort the running transition — a hard
 * cut per spec, unavoidable — but with no header fade there's no longer a
 * half-faded header to cut from.)
 */
::view-transition-group(site-header),
::view-transition-image-pair(site-header),
::view-transition-old(site-header),
::view-transition-new(site-header) {
	animation: none;
}

/*
 * Reduced-motion off-switch: disable the animation on every transition
 * group (root cross-fade AND the named .site-header group) so navigation
 * becomes an instant swap instead — the same end state a browser with no
 * View Transitions support already gets, just made explicit here rather
 * than left to whatever the UA default duration happens to be.
 */
@media (prefers-reduced-motion: reduce) {
	::view-transition-group(*),
	::view-transition-image-pair(*),
	::view-transition-old(*),
	::view-transition-new(*) {
		animation: none !important;
	}
}

/*
 * Default cross-fade: subtle and quick, only when motion is allowed. Scoped
 * to the root group only — .site-header has no animation of its own here,
 * so it persists across the nav with no fade at all (the whole point of
 * naming it above).
 */
@media (prefers-reduced-motion: no-preference) {
	::view-transition-old(root),
	::view-transition-new(root) {
		animation-duration: 0.22s;
		animation-timing-function: ease-out;
	}
}