/* Shared palette for all public surfaces. The photograph hero stays cinematic. */
:root,
html[data-dkj-color-mode="light"] {
	--dkj-mode-scheme: light;
	--dkj-mode-solid: #71354c;
	--dkj-mode-bg: #faf8f6;
	--dkj-mode-surface: #ffffff;
	--dkj-mode-surface-alt: #f3edf1;
	--dkj-mode-text: #29232a;
	--dkj-mode-text-rgb: 41, 35, 42;
	--dkj-mode-muted: #675b64;
	--dkj-mode-border: rgba(66, 37, 50, .17);
	--dkj-mode-accent: #a02f59;
	--dkj-mode-accent-soft: #f8e8ef;
	--dkj-mode-header: rgba(255, 255, 255, .72);
	--dkj-mode-header-scrolled: rgba(255, 255, 255, .86);
	--dkj-mode-shadow: 0 18px 46px rgba(66, 37, 50, .08);
	--rx3-bg: var(--dkj-mode-bg);
	--rx3-bg-soft: var(--dkj-mode-surface-alt);
	--rx3-panel: var(--dkj-mode-surface);
	--rx3-panel-2: var(--dkj-mode-surface-alt);
	--rx3-paper: var(--dkj-mode-surface-alt);
	--rx3-paper-2: var(--dkj-mode-surface);
	--rx3-paper-rose: var(--dkj-mode-surface-alt);
	--rx3-text: var(--dkj-mode-text);
	--rx3-text-dim: var(--dkj-mode-muted);
	--rx3-ink: var(--dkj-mode-text);
	--rx3-ink-dim: var(--dkj-mode-muted);
	--rx3-line: var(--dkj-mode-border);
	--rx3-line-dark: var(--dkj-mode-border);
	--rx3-burgundy: var(--dkj-mode-text);
	--rx3-burgundy-soft: var(--dkj-mode-text);
	--rx3-rose-gray: var(--dkj-mode-muted);
	--rx3-rose-dark: var(--dkj-mode-accent);
	--rx3-accent: var(--dkj-mode-accent);
	--rx3-accent-2: var(--dkj-mode-accent);
	--rx3-gold: #855c20;
	--rx3-green: #276c40;
	--rx3-shadow: var(--dkj-mode-shadow);
}
html[data-dkj-color-mode="dark"] {
	--dkj-mode-scheme: dark;
	--dkj-mode-bg: #101014;
	--dkj-mode-surface: #1a1920;
	--dkj-mode-surface-alt: #24222b;
	--dkj-mode-text: #f5f1f3;
	--dkj-mode-text-rgb: 245, 241, 243;
	--dkj-mode-muted: #bfb3bc;
	--dkj-mode-border: rgba(246, 219, 231, .19);
	--dkj-mode-accent: #f7a9c4;
	--dkj-mode-accent-soft: #30222c;
	--dkj-mode-header: rgba(26, 25, 32, .64);
	--dkj-mode-header-scrolled: rgba(26, 25, 32, .84);
	--dkj-mode-shadow: 0 18px 46px rgba(0, 0, 0, .24);
	--rx3-gold: #dfb56f;
	--rx3-green: #94d4a4;
}
html[data-dkj-color-mode] {
	background: var(--dkj-mode-bg);
	color-scheme: var(--dkj-mode-scheme);
}

/* Core's article situation card shares the same palette as the article. */
html[data-dkj-color-mode] .dkj-situation-card {
	--dkj-situation-rose: var(--dkj-mode-accent);
	--dkj-situation-ink: var(--dkj-mode-text);
	--dkj-situation-line: var(--dkj-mode-border);
	background: var(--dkj-mode-surface);
	color: var(--dkj-mode-text);
	border-color: var(--dkj-mode-border);
	box-shadow: var(--dkj-mode-shadow);
}
html[data-dkj-color-mode] .dkj-situation-card > header h2,
html[data-dkj-color-mode] .dkj-situation-card__term > a,
html[data-dkj-color-mode] .dkj-situation-card__term > span {
	color: var(--dkj-mode-text);
}
html[data-dkj-color-mode] .dkj-situation-card__group {
	--situation-group-accent: var(--dkj-mode-accent);
	background: var(--dkj-mode-surface);
	border-color: var(--dkj-mode-border);
	box-shadow: none;
}
html[data-dkj-color-mode] .dkj-situation-card__group-title {
	background: var(--dkj-mode-surface-alt);
	color: var(--dkj-mode-text);
	border-color: var(--dkj-mode-border);
}
html[data-dkj-color-mode] .dkj-situation-card__term {
	border-bottom-color: var(--dkj-mode-border);
}
html[data-dkj-color-mode] .dkj-situation-card__term > a:hover,
html[data-dkj-color-mode] .dkj-situation-card__term > a:focus-visible {
	color: var(--dkj-mode-accent);
}
html[data-dkj-color-mode] body.review-v3 {
	background: var(--dkj-mode-bg);
	color: var(--dkj-mode-text);
	--dkj-ink: var(--dkj-mode-text);
	--dkj-muted: var(--dkj-mode-muted);
	--dkj-paper: var(--dkj-mode-surface-alt);
	--dkj-accent: var(--dkj-mode-accent);
	--dkj-line: var(--dkj-mode-border);
}

/* Home hero variables are local, so switching the surrounding page cannot alter it. */
html[data-dkj-color-mode] body.review-v3 .rx3-hero {
	--rx3-bg: #0b0b0d;
	--rx3-bg-soft: #121216;
	--rx3-panel: #17171c;
	--rx3-panel-2: #202027;
	--rx3-paper: #f1eee8;
	--rx3-paper-2: #faf8f4;
	--rx3-text: #f7f4ee;
	--rx3-text-dim: rgba(247, 244, 238, .64);
	--rx3-line: rgba(255,255,255,.11);
	--rx3-accent: #ed5b91;
	--rx3-accent-2: #ffb2c9;
	--rx3-gold: #dfb56f;
	color: #f7f4ee;
	color-scheme: dark;
}

html[data-dkj-color-mode] body.review-v3 .site-header.rx3-site-header,
html[data-dkj-color-mode] body.review-v3 .site-header.rx3-site-header.is-scrolled {
	background: transparent;
	border-bottom: 1px solid var(--dkj-mode-border);
	box-shadow: 0 4px 24px rgba(0,0,0,.05);
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
	color: var(--dkj-mode-text);
}
/* Blur the decorative layer only. A filter on the header itself traps its fixed menu.
 * The header's existing z-index keeps this layer behind its content. */
html[data-dkj-color-mode] body.review-v3 .site-header.rx3-site-header::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: var(--dkj-mode-header);
	-webkit-backdrop-filter: blur(18px) saturate(130%);
	backdrop-filter: blur(18px) saturate(130%);
	pointer-events: none;
	transition: background .28s ease;
}
html[data-dkj-color-mode] body.review-v3 .site-header.rx3-site-header.is-scrolled::before {
	background: var(--dkj-mode-header-scrolled);
}
html[data-dkj-color-mode] body.review-v3 .rx3-nav a,
html[data-dkj-color-mode] body.review-v3 .rx3-header__index,
html[data-dkj-color-mode] body.review-v3 .menu-toggle,
html[data-dkj-color-mode] body.review-v3 .rx3-brand__fallback {
	color: var(--dkj-mode-text);
	border-color: var(--dkj-mode-border);
}
html[data-dkj-color-mode] body.review-v3 .rx3-nav a:hover,
html[data-dkj-color-mode] body.review-v3 .rx3-nav a:focus-visible {
	color: var(--dkj-mode-accent);
}
html[data-dkj-color-mode] body.review-v3 .rx3-mobile-menu__panel {
	background-color: var(--dkj-mode-surface);
	background-image: none;
	color: var(--dkj-mode-text);
}
html[data-dkj-color-mode] body.review-v3 .rx3-mobile-menu__group > button {
	background: transparent;
	color: var(--dkj-mode-text);
	box-shadow: none;
}
html[data-dkj-color-mode] body.review-v3 .rx3-mobile-menu__group > button:hover,
html[data-dkj-color-mode] body.review-v3 .rx3-mobile-menu__group > button:focus-visible {
	color: var(--dkj-mode-accent);
}
html[data-dkj-color-mode] body.review-v3 :where(input, select, textarea) {
	color-scheme: var(--dkj-mode-scheme);
}
html[data-dkj-color-mode] body.review-v3 :where(input, textarea)::placeholder {
	color: var(--dkj-mode-muted);
	opacity: 1;
}
html[data-dkj-color-mode] body.review-v3 .dkj-age-gate {
	background: rgba(19, 10, 16, .94);
}
html[data-dkj-color-mode] body.review-v3 .dkj-age-gate__button--accept,
html[data-dkj-color-mode] body.review-v3 .dkj-age-gate__button--accept:hover {
	background: #71354c;
	border-color: #71354c;
	color: #fff;
}

/* Native button supports pointer, Enter and Space, with a 44 px touch target. */
body.review-v3 .dkj-color-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 44px;
	width: 44px;
	height: 44px;
	min-height: 44px;
	padding: 0;
	border: 1px solid var(--dkj-mode-border);
	border-radius: 50%;
	background: var(--dkj-mode-surface);
	color: var(--dkj-mode-text);
	box-shadow: none;
	cursor: pointer;
	touch-action: manipulation;
	transition: transform 160ms ease, border-color 160ms ease;
}
body.review-v3 .dkj-color-toggle[hidden] { display: none; }
body.review-v3 .dkj-color-toggle svg { display: block; width: 21px; height: 21px; }
body.review-v3 .dkj-color-toggle:hover { border-color: var(--dkj-mode-accent); }
body.review-v3 .dkj-color-toggle:active { transform: scale(.93); }
body.review-v3 .dkj-color-toggle:focus-visible { outline: 3px solid var(--dkj-mode-accent); outline-offset: 3px; }
html[data-dkj-color-mode="light"] .dkj-color-toggle__sun,
html[data-dkj-color-mode="dark"] .dkj-color-toggle__moon { display: none !important; }

@media (max-width: 1100px) {
	body.review-v3 .rx3-header__aside { gap: .5rem; }
	body.review-v3 .rx3-brand__edition { display: none; }
}
@media (max-width: 380px) {
	body.review-v3 .rx3-site-header__inner { width: calc(100% - 1.5rem); gap: .5rem; }
	body.review-v3 .rx3-brand .custom-logo { max-width: 36vw; }
}
@media (prefers-reduced-motion: reduce) {
	body.review-v3 .dkj-color-toggle { transition: none; }
}

/* Members/Favorites is a separate plugin; keep its controls and dialogs readable. */
html[data-dkj-color-mode] body.review-v3 .dkjmf-favorite,
html[data-dkj-color-mode] body.review-v3 .dkjmf-watch-later,
html[data-dkj-color-mode] body.review-v3 .dkjmf-guest-prompt__panel,
html[data-dkj-color-mode] body.review-v3 .dkjmf-guest-prompt__actions a {
	background: var(--dkj-mode-surface);
	border-color: var(--dkj-mode-border);
	color: var(--dkj-mode-accent);
}
html[data-dkj-color-mode] body.review-v3 .dkjmf-favorite.is-active,
html[data-dkj-color-mode] body.review-v3 .dkjmf-watch-later.is-active {
	background: var(--dkj-mode-accent-soft);
	color: var(--dkj-mode-accent);
}
html[data-dkj-color-mode] body.review-v3 .dkjmf-guest-prompt__panel {
	color: var(--dkj-mode-text);
}
html[data-dkj-color-mode] body.review-v3 .dkjmf-guest-prompt__panel > p,
html[data-dkj-color-mode] body.review-v3 .dkjmf-guest-prompt__close {
	color: var(--dkj-mode-muted);
}
html[data-dkj-color-mode] body.review-v3 .dkjmf-guest-prompt__actions .is-primary {
	background: #a83f63;
	color: #fff;
}
html[data-dkj-color-mode] body.review-v3 .dkjmf-toast {
	background: var(--dkj-mode-text);
	color: var(--dkj-mode-surface);
}
