/* TJ Consent — uses Tape Journal tokens with fallbacks, so it also works with any theme. */
.tj-consent {
	--tjc-paper: var(--tj-paper, #f4efe5);
	--tjc-card: #fffdf8;
	--tjc-ink: var(--tj-ink, #17120f);
	--tjc-soft: var(--tj-ink-soft, #4f4741);
	--tjc-brown: var(--tj-brown, #321200);
	--tjc-espresso: var(--tj-espresso, #1b0b06);
	--tjc-kraft: var(--tj-kraft, #a97a4b);
	--tjc-rule: var(--tj-rule, rgba(50, 18, 0, .24));
	--tjc-display: var(--tj-font-display, Georgia, serif);
	--tjc-body: var(--tj-font-body, Arial, sans-serif);
	--tjc-data: var(--tj-font-data, "Courier New", monospace);
	font-family: var(--tjc-body);
	color: var(--tjc-ink);
}
.tj-consent[hidden],
.tj-consent [hidden] { display: none !important; }
.tj-consent *,
.tj-consent *::before,
.tj-consent *::after { box-sizing: border-box; }

/* Banner */
.tj-consent__banner {
	position: fixed;
	z-index: 99990;
	right: max(1rem, env(safe-area-inset-right));
	bottom: max(1rem, env(safe-area-inset-bottom));
	left: max(1rem, env(safe-area-inset-left));
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: end;
	gap: 1.25rem 2.5rem;
	max-width: 77.5rem;
	margin-inline: auto;
	padding: 1.5rem 1.75rem;
	border: 1px solid var(--tjc-rule);
	border-top: 3px solid var(--tjc-brown);
	background: var(--tjc-card);
	box-shadow: 0 18px 50px rgba(27, 11, 6, .18);
}
.tj-consent__text { min-width: 0; }
.tj-consent__eyebrow {
	margin: 0 0 .4rem;
	color: var(--tjc-kraft);
	font-family: var(--tjc-data);
	font-size: .6875rem;
	letter-spacing: .11em;
	text-transform: uppercase;
}
.tj-consent__title {
	margin: 0 0 .55rem;
	color: var(--tjc-brown);
	font-family: var(--tjc-display);
	font-size: 1.6rem;
	font-weight: 500;
	letter-spacing: -.02em;
	line-height: 1.1;
}
.tj-consent__text > p:last-child {
	max-width: 78ch;
	margin: 0;
	color: var(--tjc-soft);
	font-size: .86rem;
	line-height: 1.65;
}
.tj-consent a { color: var(--tjc-brown); text-decoration: underline; text-underline-offset: .15em; }

.tj-consent__actions { display: flex; flex-wrap: wrap; gap: .6rem; justify-content: flex-end; }
.tj-consent__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 2.9rem;
	padding: .75rem 1.3rem;
	border: 1px solid var(--tjc-brown);
	border-radius: 0;
	background: var(--tjc-brown);
	color: var(--tjc-paper);
	cursor: pointer;
	font-family: var(--tjc-data);
	font-size: .6875rem;
	font-weight: 500;
	letter-spacing: .09em;
	line-height: 1.2;
	text-transform: uppercase;
	white-space: nowrap;
	transition: background-color 160ms ease, color 160ms ease;
}
.tj-consent__btn:hover { background: var(--tjc-espresso); border-color: var(--tjc-espresso); }
.tj-consent__btn--ghost { background: transparent; color: var(--tjc-brown); }
.tj-consent__btn--ghost:hover { background: var(--tjc-brown); color: var(--tjc-paper); }
.tj-consent__btn:focus-visible,
.tj-consent__close:focus-visible,
.tj-consent__switch input:focus-visible + span { outline: .125rem solid var(--tjc-kraft); outline-offset: .2rem; }

/* Settings modal */
.tj-consent-lock { overflow: hidden; }
.tj-consent__overlay {
	position: fixed;
	z-index: 99999;
	inset: 0;
	display: grid;
	place-items: center;
	padding: 1rem;
	background: rgba(23, 18, 15, .45);
}
.tj-consent__modal {
	width: min(100%, 38rem);
	max-height: calc(100vh - 2rem);
	overflow-y: auto;
	padding: clamp(1.25rem, 4vw, 2rem);
	border-top: 3px solid var(--tjc-brown);
	background: var(--tjc-card);
	box-shadow: 0 24px 60px rgba(27, 11, 6, .25);
}
.tj-consent__modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.tj-consent__close {
	flex: none;
	width: 2.5rem;
	height: 2.5rem;
	border: 1px solid var(--tjc-rule);
	background: transparent;
	color: var(--tjc-brown);
	cursor: pointer;
	font-size: 1.35rem;
	line-height: 1;
}
.tj-consent__cats { border-top: 1px solid var(--tjc-rule); }
.tj-consent__cat { padding: 1rem 0; border-bottom: 1px solid var(--tjc-rule); }
.tj-consent__cat-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.tj-consent__cat h3 { margin: 0; color: var(--tjc-ink); font-family: var(--tjc-body); font-size: 1rem; font-weight: 600; }
.tj-consent__cat h3 label { cursor: pointer; }
.tj-consent__cat p { margin: .4rem 0 0; color: var(--tjc-soft); font-size: .85rem; line-height: 1.6; }
.tj-consent__always { color: var(--tjc-kraft); font-family: var(--tjc-data); font-size: .625rem; letter-spacing: .08em; text-transform: uppercase; }

.tj-consent__switch { position: relative; display: inline-flex; flex: none; width: 2.9rem; height: 1.6rem; }
.tj-consent__switch input { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.tj-consent__switch span { position: absolute; inset: 0; border: 1px solid var(--tjc-rule); border-radius: 999px; background: var(--tjc-paper); transition: background-color 160ms ease, border-color 160ms ease; }
.tj-consent__switch span::after { content: ""; position: absolute; top: .18rem; left: .2rem; width: 1.12rem; height: 1.12rem; border-radius: 50%; background: var(--tjc-soft); transition: transform 160ms ease, background-color 160ms ease; }
.tj-consent__switch input:checked + span { border-color: var(--tjc-brown); background: var(--tjc-brown); }
.tj-consent__switch input:checked + span::after { transform: translateX(1.25rem); background: var(--tjc-paper); }

.tj-consent__modal-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .6rem; margin-top: 1.25rem; }

@media (max-width: 860px) {
	.tj-consent__banner { grid-template-columns: minmax(0, 1fr); align-items: stretch; padding: 1.25rem; }
	.tj-consent__actions { display: grid; grid-template-columns: 1fr 1fr; }
	.tj-consent__actions [data-tj-consent-settings] { grid-column: 1 / -1; order: 1; }
	.tj-consent__title { font-size: 1.35rem; }
}
@media (max-width: 420px) {
	.tj-consent__btn { white-space: normal; }
	.tj-consent__modal-actions { display: grid; grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
	.tj-consent * { transition: none !important; }
}