/* Mirror customisation — the Frame logo animation stands in for the site's
   own wordmarks. The originals stay in the DOM (they hold the layout slot)
   but are never painted. */

.frame-logo {
	position: relative;
}

/* nav wordmark and the big footer mark */
a.n-logo > svg,
.frame-logo-host > svg.f-logo {
	visibility: hidden;
}

/* the footer mark is wrapped at runtime; the wrapper has to behave exactly
   like the svg it replaced in the layout */
.frame-logo-host {
	display: block;
	width: 100%;
}

.frame-logo .frame-logo-lottie {
	position: absolute;
	display: block;
	pointer-events: none;
}
.frame-logo .frame-logo-lottie svg {
	display: block;
	width: 100%;
	height: 100%;
}

/* The nav's own rule (.nav svg path { fill: var(--navColor) }) recolours the
   lettering with each section's theme, which is what keeps it legible on both
   light and dark stretches. The blue mark opts out of that in logo-lottie.js.
   Outside the nav there is no such rule, so the footer mark keeps the
   animation's own white-on-dark colours. */