/* Cookie banner (inc/analytics.php, assets/js/consent.js). Same vocabulary as the story and space cards:
   blue surface, large radius, tight serif title, slight tilt, no outline, black pill buttons. Blue (not paper) keeps it apart from the
   paper page without a border. Bottom left on desktop, full width on small screens. */
.lf-consent {
	position: fixed;
	left: clamp(12px, 2.4vw, 32px);
	bottom: clamp(12px, 2.4vw, 32px);
	margin-bottom: env(safe-area-inset-bottom, 0px);
	z-index: 90;
	box-sizing: border-box;
	width: min(420px, calc(100vw - 24px));
	padding: 32px;
	background: var(--blue, #D3E9FC);
	color: var(--text, #000);
	border: 0;
	border-radius: 32px;
	font-family: var(--sans, "Satoshi", -apple-system, "Helvetica Neue", Arial, sans-serif);
	font-size: 16px;
	line-height: 1.5;
}
.lf-consent[hidden] { display: none; }
.lf-consent__title {
	margin: 0 0 14px;
	font-family: var(--serif, "Gambetta", Georgia, serif);
	font-size: clamp(2.6rem, 1rem + 3vw, 3.2rem);
	font-weight: 400;
	line-height: .9;
	letter-spacing: -.04em;
}
.lf-consent__text { margin: 0 0 24px; }
.lf-consent__text a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.lf-consent__actions { display: flex; gap: 10px; }
.lf-consent__btn {
	flex: 1 1 0;
	min-height: 52px;
	padding: 12px 22px;
	border: 2px solid var(--text, #000);
	border-radius: 999px;
	background: var(--text, #000);
	color: var(--paper, #F5F1EA);
	font: inherit;
	font-weight: 500;
	cursor: pointer;
}
.lf-consent__btn:hover,
.lf-consent__btn:focus-visible {
	background: var(--yellow, #FFFB4D);
	color: var(--text, #000);
}
.lf-consent a:focus-visible,
.lf-consent__btn:focus-visible { outline: 2px solid var(--text, #000); outline-offset: 3px; }
@media (min-width: 721px) {
	.lf-consent { rotate: -1.2deg; } /* the same slight tilt as the small story card */
}
@media (max-width: 720px) {
	.lf-consent { left: 12px; right: 12px; bottom: 12px; width: auto; padding: 24px; border-radius: 26px; }
}
@media (prefers-reduced-motion: no-preference) {
	.lf-consent { opacity: 0; transform: translateY(8px); transition: opacity 220ms var(--ease, ease), transform 220ms var(--ease, ease); }
	.lf-consent.is-in { opacity: 1; transform: none; }
}
