/**
 * Independent reading themes and accent palettes — contrast-audited in 2.5.0.
 * Loaded on Smart Blog single layouts and managed editorial archives. Every selector is scoped.
 */

body.sblp-layout-active {
	--sblp-bg: #f6f7f9;
	--sblp-theme-bg: #f6f7f9;
	--sblp-surface: #ffffff;
	--sblp-theme-surface: #ffffff;
	--sblp-surface-soft: #f0f2f5;
	--sblp-theme-surface-soft: #f0f2f5;
	--sblp-text: #1f2933;
	--sblp-theme-text: #1f2933;
	--sblp-muted: #606978;
	--sblp-theme-muted: #606978;
	--sblp-border: #86909c;
	--sblp-theme-border: #86909c;
	--sblp-accent: #4f6f8f;
	--sblp-palette-accent: #4f6f8f;
	--sblp-accent-strong: #35556f;
	--sblp-palette-accent-strong: #35556f;
	/* accent-strong is the solid-action background. Editorial foregrounds use
	 * the audited link token and only fall back to the legacy strong accent. */
	--sblp-accent-foreground: var(--sblp-design-link, var(--sblp-link, var(--sblp-accent-strong)));
	--sblp-accent-soft: #e7eef4;
	--sblp-palette-accent-soft: #e7eef4;
	--sblp-link: #355f83;
	--sblp-palette-link: #355f83;
	--sblp-focus: #4f6f8f;
	--sblp-palette-focus: #4f6f8f;
	--sblp-on-accent: #ffffff;
	--sblp-palette-on-accent: #ffffff;
	--sblp-on-accent-hover: #ffffff;
	--sblp-theme-shadow: 0 18px 48px rgba(15, 23, 42, 0.08);
	color-scheme: light;
}

/* Reading theme: only page surfaces, text contrast and neutral borders. */
body.sblp-layout-active.sblp-theme-light,
body.sblp-layout-active.sblp-theme-system {
	--sblp-bg: #f6f7f9;
	--sblp-theme-bg: #f6f7f9;
	--sblp-surface: #ffffff;
	--sblp-theme-surface: #ffffff;
	--sblp-surface-soft: #f0f2f5;
	--sblp-theme-surface-soft: #f0f2f5;
	--sblp-text: #1f2933;
	--sblp-theme-text: #1f2933;
	--sblp-muted: #606978;
	--sblp-theme-muted: #606978;
	--sblp-border: #86909c;
	--sblp-theme-border: #86909c;
	--sblp-on-accent-hover: #ffffff;
	--sblp-theme-shadow: 0 18px 48px rgba(15, 23, 42, 0.08);
	color-scheme: light;
}

body.sblp-layout-active.sblp-theme-dark {
	--sblp-bg: #11151b;
	--sblp-theme-bg: #11151b;
	--sblp-surface: #181e26;
	--sblp-theme-surface: #181e26;
	--sblp-surface-soft: #222a35;
	--sblp-theme-surface-soft: #222a35;
	--sblp-text: #edf1f5;
	--sblp-theme-text: #edf1f5;
	--sblp-muted: #a9b3bf;
	--sblp-theme-muted: #a9b3bf;
	--sblp-border: #5d6a79;
	--sblp-theme-border: #5d6a79;
	--sblp-accent-foreground: var(--sblp-link);
	--sblp-on-accent-hover: #101820;
	--sblp-theme-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
	color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
	body.sblp-layout-active.sblp-theme-system {
		--sblp-bg: #11151b;
		--sblp-theme-bg: #11151b;
		--sblp-surface: #181e26;
		--sblp-theme-surface: #181e26;
		--sblp-surface-soft: #222a35;
		--sblp-theme-surface-soft: #222a35;
		--sblp-text: #edf1f5;
		--sblp-theme-text: #edf1f5;
		--sblp-muted: #a9b3bf;
		--sblp-theme-muted: #a9b3bf;
		--sblp-border: #5d6a79;
		--sblp-theme-border: #5d6a79;
		--sblp-accent-foreground: var(--sblp-link);
		--sblp-on-accent-hover: #101820;
		--sblp-theme-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
		color-scheme: dark;
	}
}

/* Accent palettes: no page background values live in this layer. */
body.sblp-layout-active.sblp-accent-blue {
	--sblp-accent: #4f6f8f;
	--sblp-palette-accent: #4f6f8f;
	--sblp-accent-strong: #35556f;
	--sblp-palette-accent-strong: #35556f;
	--sblp-accent-soft: #e7eef4;
	--sblp-palette-accent-soft: #e7eef4;
	--sblp-link: #355f83;
	--sblp-palette-link: #355f83;
	--sblp-focus: #4f6f8f;
	--sblp-palette-focus: #4f6f8f;
	--sblp-on-accent: #ffffff;
	--sblp-palette-on-accent: #ffffff;
}

body.sblp-layout-active.sblp-accent-red {
	--sblp-accent: #9a5a62;
	--sblp-palette-accent: #9a5a62;
	--sblp-accent-strong: #7d424a;
	--sblp-palette-accent-strong: #7d424a;
	--sblp-accent-soft: #f3e8ea;
	--sblp-palette-accent-soft: #f3e8ea;
	--sblp-link: #7d424a;
	--sblp-palette-link: #7d424a;
	--sblp-focus: #9a5a62;
	--sblp-palette-focus: #9a5a62;
	--sblp-on-accent: #ffffff;
	--sblp-palette-on-accent: #ffffff;
}

body.sblp-layout-active.sblp-accent-green {
	--sblp-accent: #5f7d6e;
	--sblp-palette-accent: #5f7d6e;
	--sblp-accent-strong: #466454;
	--sblp-palette-accent-strong: #466454;
	--sblp-accent-soft: #e8efeb;
	--sblp-palette-accent-soft: #e8efeb;
	--sblp-link: #466454;
	--sblp-palette-link: #466454;
	--sblp-focus: #5f7d6e;
	--sblp-palette-focus: #5f7d6e;
	--sblp-on-accent: #ffffff;
	--sblp-palette-on-accent: #ffffff;
}

body.sblp-layout-active.sblp-accent-violet {
	--sblp-accent: #756b8f;
	--sblp-palette-accent: #756b8f;
	--sblp-accent-strong: #5d5477;
	--sblp-palette-accent-strong: #5d5477;
	--sblp-accent-soft: #eeebf3;
	--sblp-palette-accent-soft: #eeebf3;
	--sblp-link: #5d5477;
	--sblp-palette-link: #5d5477;
	--sblp-focus: #756b8f;
	--sblp-palette-focus: #756b8f;
	--sblp-on-accent: #ffffff;
	--sblp-palette-on-accent: #ffffff;
}

body.sblp-layout-active.sblp-accent-orange {
	--sblp-accent: #9a6b49;
	--sblp-palette-accent: #9a6b49;
	--sblp-accent-strong: #7d5235;
	--sblp-palette-accent-strong: #7d5235;
	--sblp-accent-soft: #f3ece6;
	--sblp-palette-accent-soft: #f3ece6;
	--sblp-link: #7d5235;
	--sblp-palette-link: #7d5235;
	--sblp-focus: #9a6b49;
	--sblp-palette-focus: #9a6b49;
	--sblp-on-accent: #ffffff;
	--sblp-palette-on-accent: #ffffff;
}

body.sblp-layout-active.sblp-accent-mono {
	--sblp-accent: #5f6873;
	--sblp-palette-accent: #5f6873;
	--sblp-accent-strong: #3f4852;
	--sblp-palette-accent-strong: #3f4852;
	--sblp-accent-soft: #e9ecef;
	--sblp-palette-accent-soft: #e9ecef;
	--sblp-link: #46515c;
	--sblp-palette-link: #46515c;
	--sblp-focus: #5f6873;
	--sblp-palette-focus: #5f6873;
	--sblp-on-accent: #ffffff;
	--sblp-palette-on-accent: #ffffff;
}

/* Dark-theme palette tuning keeps links bright and solid actions contrasted. */
body.sblp-layout-active.sblp-theme-dark.sblp-accent-blue {
	--sblp-accent: #8ca8bf;
	--sblp-palette-accent: #8ca8bf;
	--sblp-accent-strong: #446985;
	--sblp-palette-accent-strong: #446985;
	--sblp-accent-soft: #23303b;
	--sblp-palette-accent-soft: #23303b;
	--sblp-link: #aac1d3;
	--sblp-palette-link: #aac1d3;
	--sblp-focus: #8ca8bf;
	--sblp-palette-focus: #8ca8bf;
}

body.sblp-layout-active.sblp-theme-dark.sblp-accent-red {
	--sblp-accent: #c28b91;
	--sblp-palette-accent: #c28b91;
	--sblp-accent-strong: #8a4f57;
	--sblp-palette-accent-strong: #8a4f57;
	--sblp-accent-soft: #3a252a;
	--sblp-palette-accent-soft: #3a252a;
	--sblp-link: #d8a8ad;
	--sblp-palette-link: #d8a8ad;
	--sblp-focus: #c28b91;
	--sblp-palette-focus: #c28b91;
}

body.sblp-layout-active.sblp-theme-dark.sblp-accent-green {
	--sblp-accent: #8eaa9b;
	--sblp-palette-accent: #8eaa9b;
	--sblp-accent-strong: #527361;
	--sblp-palette-accent-strong: #527361;
	--sblp-accent-soft: #22332b;
	--sblp-palette-accent-soft: #22332b;
	--sblp-link: #b5c9be;
	--sblp-palette-link: #b5c9be;
	--sblp-focus: #8eaa9b;
	--sblp-palette-focus: #8eaa9b;
}

body.sblp-layout-active.sblp-theme-dark.sblp-accent-violet {
	--sblp-accent: #a99fbd;
	--sblp-palette-accent: #a99fbd;
	--sblp-accent-strong: #6c6283;
	--sblp-palette-accent-strong: #6c6283;
	--sblp-accent-soft: #2d2938;
	--sblp-palette-accent-soft: #2d2938;
	--sblp-link: #c4bbd2;
	--sblp-palette-link: #c4bbd2;
	--sblp-focus: #a99fbd;
	--sblp-palette-focus: #a99fbd;
}

body.sblp-layout-active.sblp-theme-dark.sblp-accent-orange {
	--sblp-accent: #bd9677;
	--sblp-palette-accent: #bd9677;
	--sblp-accent-strong: #805c40;
	--sblp-palette-accent-strong: #805c40;
	--sblp-accent-soft: #382c23;
	--sblp-palette-accent-soft: #382c23;
	--sblp-link: #d4b69d;
	--sblp-palette-link: #d4b69d;
	--sblp-focus: #bd9677;
	--sblp-palette-focus: #bd9677;
}

body.sblp-layout-active.sblp-theme-dark.sblp-accent-mono {
	--sblp-accent: #b8c0c8;
	--sblp-palette-accent: #b8c0c8;
	--sblp-accent-strong: #56616d;
	--sblp-palette-accent-strong: #56616d;
	--sblp-accent-soft: #292f37;
	--sblp-palette-accent-soft: #292f37;
	--sblp-link: #d4d9de;
	--sblp-palette-link: #d4d9de;
	--sblp-focus: #b8c0c8;
	--sblp-palette-focus: #b8c0c8;
}

@media (prefers-color-scheme: dark) {
	body.sblp-layout-active.sblp-theme-system.sblp-accent-blue {
		--sblp-accent: #8ca8bf;
		--sblp-palette-accent: #8ca8bf;
		--sblp-accent-strong: #446985;
		--sblp-palette-accent-strong: #446985;
		--sblp-accent-soft: #23303b;
		--sblp-palette-accent-soft: #23303b;
		--sblp-link: #aac1d3;
		--sblp-palette-link: #aac1d3;
		--sblp-focus: #8ca8bf;
		--sblp-palette-focus: #8ca8bf;
	}

	body.sblp-layout-active.sblp-theme-system.sblp-accent-red {
		--sblp-accent: #c28b91;
		--sblp-palette-accent: #c28b91;
		--sblp-accent-strong: #8a4f57;
		--sblp-palette-accent-strong: #8a4f57;
		--sblp-accent-soft: #3a252a;
		--sblp-palette-accent-soft: #3a252a;
		--sblp-link: #d8a8ad;
		--sblp-palette-link: #d8a8ad;
		--sblp-focus: #c28b91;
		--sblp-palette-focus: #c28b91;
	}

	body.sblp-layout-active.sblp-theme-system.sblp-accent-green {
		--sblp-accent: #8eaa9b;
		--sblp-palette-accent: #8eaa9b;
		--sblp-accent-strong: #527361;
		--sblp-palette-accent-strong: #527361;
		--sblp-accent-soft: #22332b;
		--sblp-palette-accent-soft: #22332b;
		--sblp-link: #b5c9be;
		--sblp-palette-link: #b5c9be;
		--sblp-focus: #8eaa9b;
		--sblp-palette-focus: #8eaa9b;
	}

	body.sblp-layout-active.sblp-theme-system.sblp-accent-violet {
		--sblp-accent: #a99fbd;
		--sblp-palette-accent: #a99fbd;
		--sblp-accent-strong: #6c6283;
		--sblp-palette-accent-strong: #6c6283;
		--sblp-accent-soft: #2d2938;
		--sblp-palette-accent-soft: #2d2938;
		--sblp-link: #c4bbd2;
		--sblp-palette-link: #c4bbd2;
		--sblp-focus: #a99fbd;
		--sblp-palette-focus: #a99fbd;
	}

	body.sblp-layout-active.sblp-theme-system.sblp-accent-orange {
		--sblp-accent: #bd9677;
		--sblp-palette-accent: #bd9677;
		--sblp-accent-strong: #805c40;
		--sblp-palette-accent-strong: #805c40;
		--sblp-accent-soft: #382c23;
		--sblp-palette-accent-soft: #382c23;
		--sblp-link: #d4b69d;
		--sblp-palette-link: #d4b69d;
		--sblp-focus: #bd9677;
		--sblp-palette-focus: #bd9677;
	}

	body.sblp-layout-active.sblp-theme-system.sblp-accent-mono {
		--sblp-accent: #b8c0c8;
		--sblp-palette-accent: #b8c0c8;
		--sblp-accent-strong: #56616d;
		--sblp-palette-accent-strong: #56616d;
		--sblp-accent-soft: #292f37;
		--sblp-palette-accent-soft: #292f37;
		--sblp-link: #d4d9de;
		--sblp-palette-link: #d4d9de;
		--sblp-focus: #b8c0c8;
		--sblp-palette-focus: #b8c0c8;
	}
}

/* Bridge the public API to variables used by all 15 existing layouts. */
body.sblp-layout-active .sblp-post {
	--sblp-ink: var(--sblp-theme-text);
	--sblp-muted: var(--sblp-theme-muted);
	--sblp-soft: var(--sblp-theme-surface-soft);
	--sblp-line: var(--sblp-theme-border);
	--sblp-surface: var(--sblp-theme-surface);
	--sblp-accent: var(--sblp-palette-accent);
	--sblp-accent-dark: var(--sblp-palette-accent-strong);
	--sblp-shadow: var(--sblp-theme-shadow);
	color: var(--sblp-text);
}

body.sblp-layout-active .sblp-site-main {
	background: var(--sblp-bg);
	color: var(--sblp-text);
	transition: background-color 180ms ease, color 180ms ease;
}

body.sblp-layout-active .sblp-post,
body.sblp-layout-active .sblp-post * {
	transition-duration: 180ms;
	transition-property: background-color, border-color, box-shadow, color;
	transition-timing-function: ease;
}

body.sblp-layout-active .sblp-post a:not(.sblp-embedded-cta__content a):not(.sblp-cta__button) {
	color: var(--sblp-link);
}

body.sblp-layout-active .sblp-post a:not(.sblp-embedded-cta__content a):not(.sblp-cta__button):hover {
	color: var(--sblp-design-link-hover, var(--sblp-accent-foreground));
	text-decoration-thickness: 2px;
}

body.sblp-layout-active .sblp-post :where(a, button, input, select, textarea, summary):focus-visible {
	outline: 3px solid var(--sblp-focus);
	outline-offset: 3px;
}

/* Neutral component surfaces follow the reading theme without flattening layout-specific heroes. */
body.sblp-layout-active .sblp-review-summary,
body.sblp-layout-active .sblp-interview-format,
body.sblp-layout-active .sblp-author-card,
body.sblp-layout-active .sblp-post-navigation__link,
body.sblp-layout-active .sblp-related-post,
body.sblp-layout-active .sblp-toc,
body.sblp-layout-active .sblp-faq__item,
body.sblp-layout-active .sblp-prose--faq details,
body.sblp-layout-active .sblp-comparison__scroll,
body.sblp-layout-active figure.wp-block-table.sblp-comparison,
body.sblp-layout-active .sblp-pros-cons__panel,
body.sblp-layout-active .wp-block-columns.sblp-pros-cons > .wp-block-column {
	background: var(--sblp-surface);
	border-color: var(--sblp-border);
	color: var(--sblp-text);
}

/* Layout artwork remains intact in light mode; dark mode receives a readable neutral surface only. */
body.sblp-layout-active.sblp-theme-dark :where(
	.sblp-default-hero,
	.sblp-guide-hero,
	.sblp-interview-hero,
	.sblp-opinion-hero,
	.sblp-comparison-hero,
	.sblp-evergreen-hero
) {
	background: linear-gradient(145deg, var(--sblp-surface) 0%, var(--sblp-surface-soft) 100%);
	border-color: var(--sblp-border);
}

@media (prefers-color-scheme: dark) {
	body.sblp-layout-active.sblp-theme-system :where(
		.sblp-default-hero,
		.sblp-guide-hero,
		.sblp-interview-hero,
		.sblp-opinion-hero,
		.sblp-comparison-hero,
		.sblp-evergreen-hero
	) {
		background: linear-gradient(145deg, var(--sblp-surface) 0%, var(--sblp-surface-soft) 100%);
		border-color: var(--sblp-border);
	}
}

body.sblp-layout-active .sblp-interview-hero__quote,
body.sblp-layout-active .sblp-comparison-hero__visual span {
	background: var(--sblp-surface);
	border-color: var(--sblp-border);
	color: var(--sblp-muted);
}

body.sblp-layout-active .sblp-comparison-hero__visual b {
	background: var(--sblp-accent-soft);
	color: var(--sblp-link);
}

body.sblp-layout-active .sblp-prose--listicle > h2 + p,
body.sblp-layout-active .sblp-prose--listicle > h2 + figure,
body.sblp-layout-active .sblp-prose--listicle > h2 + .wp-block-image {
	background: var(--sblp-surface-soft);
	border-color: var(--sblp-border);
	color: var(--sblp-text);
}

body.sblp-layout-active .sblp-review-hero,
body.sblp-layout-active .sblp-listicle-hero,
body.sblp-layout-active .sblp-faq-hero {
	border-color: var(--sblp-border);
	box-shadow: inset 0 4px 0 var(--sblp-accent);
}

body.sblp-layout-active.sblp-theme-dark .sblp-review-hero,
body.sblp-layout-active.sblp-theme-dark .sblp-listicle-hero,
body.sblp-layout-active.sblp-theme-dark .sblp-faq-hero {
	background-color: var(--sblp-surface);
}

@media (prefers-color-scheme: dark) {
	body.sblp-layout-active.sblp-theme-system .sblp-review-hero,
	body.sblp-layout-active.sblp-theme-system .sblp-listicle-hero,
	body.sblp-layout-active.sblp-theme-system .sblp-faq-hero {
		background-color: var(--sblp-surface);
	}
}

/* Editorial accents, labels and navigational chips. */
body.sblp-layout-active .sblp-type-pill,
body.sblp-layout-active .sblp-category-chip,
body.sblp-layout-active .sblp-faq__icon {
	background: var(--sblp-accent-soft);
	border-color: var(--sblp-accent);
	color: var(--sblp-link);
}

/* A kicker is a compact text accent, never a block-wide painted stripe. */
body.sblp-layout-active .sblp-layout-kicker {
	align-items: center;
	background: transparent;
	border: 0;
	color: var(--sblp-design-kicker-text, var(--sblp-accent-foreground));
	display: inline-flex;
	line-height: 1.35;
	max-width: 100%;
	overflow-wrap: anywhere;
	padding: 0;
	width: fit-content;
}

body.sblp-layout-active .sblp-expert-hero .sblp-layout-kicker {
	border-left: 2px solid #8fa8bd;
	color: #d7e1e8;
	padding-left: 0.72rem;
}

body.sblp-layout-active :where(
	.sblp-review-hero,
	.sblp-case-hero,
	.sblp-listicle-hero,
	.sblp-faq-hero
) .sblp-layout-kicker {
	color: #f3f5f7;
}

/* Dark and image-led heroes retain their deliberately translucent category chips. */
body.sblp-layout-active :where(
	.sblp-expert-hero,
	.sblp-review-hero,
	.sblp-case-hero,
	.sblp-listicle-hero,
	.sblp-faq-hero,
	.sblp-announcement-hero
) .sblp-category-chip {
	background: rgba(255, 255, 255, 0.075);
	border-color: rgba(255, 255, 255, 0.16);
	color: #edf2f5;
}

body.sblp-layout-active :where(
	.sblp-expert-hero,
	.sblp-review-hero,
	.sblp-case-hero,
	.sblp-listicle-hero,
	.sblp-faq-hero,
	.sblp-announcement-hero
) .sblp-category-chip:is(:hover, :focus-visible) {
	background: rgba(255, 255, 255, 0.13);
	border-color: rgba(255, 255, 255, 0.26);
	color: #ffffff;
}

/* Real badges stay content-sized and wrap safely on narrow screens. */
body.sblp-layout-active :where(
	.sblp-type-pill,
	.sblp-category-chip,
	.sblp-announcement-badge
) {
	align-items: center;
	border-radius: 999px;
	display: inline-flex;
	line-height: 1.25;
	max-width: 100%;
	overflow-wrap: anywhere;
	white-space: normal;
	width: fit-content;
}

body.sblp-layout-active .sblp-review-summary span,
body.sblp-layout-active .sblp-prose--listicle > h2::before {
	background: var(--sblp-accent-strong);
	border-color: var(--sblp-accent-soft);
	color: var(--sblp-on-accent);
}

body.sblp-layout-active .sblp-prose--news > p:first-child::first-letter,
body.sblp-layout-active .sblp-opinion-byline a:hover,
body.sblp-layout-active .sblp-opinion-byline a:focus-visible {
	color: var(--sblp-accent-foreground);
}

body.sblp-layout-active .sblp-prose--case h2::after,
body.sblp-layout-active .sblp-prose--comparison h2::after {
	background: var(--sblp-accent);
}

body.sblp-layout-active .sblp-prose--opinion blockquote::before {
	color: var(--sblp-accent);
}

body.sblp-layout-active .sblp-tag-list a,
body.sblp-layout-active .sblp-back-to-top span,
body.sblp-layout-active .sblp-page-links a,
body.sblp-layout-active .sblp-page-links > span:not(:first-child) {
	background: var(--sblp-surface-soft);
	border-color: var(--sblp-border);
	color: var(--sblp-link);
}

body.sblp-layout-active .sblp-tag-list a:hover,
body.sblp-layout-active .sblp-back-to-top:hover span,
body.sblp-layout-active .sblp-page-links a:hover {
	background: var(--sblp-accent-soft);
	border-color: var(--sblp-accent);
	color: var(--sblp-accent-foreground);
}

body.sblp-layout-active .sblp-post-meta,
body.sblp-layout-active .sblp-related-post__meta,
body.sblp-layout-active .sblp-review-summary p,
body.sblp-layout-active .sblp-evergreen-meta span,
body.sblp-layout-active .sblp-evergreen-meta time,
body.sblp-layout-active .sblp-prose--evergreen dd,
body.sblp-layout-active .sblp-pros-cons__panel li,
body.sblp-layout-active .sblp-pros-cons__body li {
	color: var(--sblp-muted);
}

body.sblp-layout-active .sblp-evergreen-meta i,
body.sblp-layout-active .sblp-prose--evergreen dl,
body.sblp-layout-active .sblp-prose--interview > h2::before,
body.sblp-layout-active .sblp-prose--guide > h2::before {
	background: var(--sblp-accent-soft);
	border-color: var(--sblp-accent);
	color: var(--sblp-link);
}

body.sblp-layout-active .sblp-prose--evergreen h2,
body.sblp-layout-active .sblp-prose--evergreen dt,
body.sblp-layout-active .sblp-interview-format strong {
	color: var(--sblp-text);
}

body.sblp-layout-active .sblp-interview-format a,
body.sblp-layout-active .sblp-opinion-byline a {
	color: var(--sblp-link);
}

/* Long-form elements, tables, FAQ and TOC. */
body.sblp-layout-active .sblp-prose blockquote {
	background: var(--sblp-surface-soft);
	border-left-color: var(--sblp-accent);
	color: var(--sblp-text);
}

body.sblp-layout-active .sblp-prose :not(pre) > code {
	background: var(--sblp-accent-soft);
	color: var(--sblp-design-code-text, var(--sblp-accent-foreground));
}

body.sblp-layout-active .sblp-prose pre {
	border-color: var(--sblp-border);
}

body.sblp-layout-active .wp-block-details.is-style-sblp-faq,
body.sblp-layout-active .wp-block-table.is-style-sblp-comparison,
body.sblp-layout-active .wp-block-quote.is-style-sblp-interview-question {
	background: var(--sblp-surface);
	border-color: var(--sblp-border);
	color: var(--sblp-text);
}

body.sblp-layout-active .wp-block-details.is-style-sblp-faq > summary::after {
	background: var(--sblp-accent-soft);
	color: var(--sblp-link);
}

body.sblp-layout-active .wp-block-details.is-style-sblp-faq[open] > summary::after {
	background: var(--sblp-accent-strong);
	color: var(--sblp-on-accent);
}

body.sblp-layout-active .sblp-prose table,
body.sblp-layout-active .sblp-comparison table,
body.sblp-layout-active .wp-block-table.is-style-sblp-comparison table {
	background: var(--sblp-surface);
	border-color: var(--sblp-border);
	color: var(--sblp-text);
}

body.sblp-layout-active .sblp-prose th,
body.sblp-layout-active .sblp-comparison th,
body.sblp-layout-active .wp-block-table.is-style-sblp-comparison th {
	background: var(--sblp-accent-soft);
	border-color: var(--sblp-border);
	color: var(--sblp-text);
}

body.sblp-layout-active .sblp-prose td,
body.sblp-layout-active .sblp-comparison td,
body.sblp-layout-active .wp-block-table.is-style-sblp-comparison td {
	border-color: var(--sblp-border);
}

body.sblp-layout-active .sblp-prose tbody tr:nth-child(even) td,
body.sblp-layout-active .sblp-comparison tbody tr:nth-child(even) td,
body.sblp-layout-active .sblp-prose--comparison .wp-block-table tbody tr:nth-child(even) td,
body.sblp-layout-active .wp-block-table.is-style-sblp-comparison tbody tr:nth-child(even) td {
	background: var(--sblp-surface-soft);
}

body.sblp-layout-active .sblp-toc {
	box-shadow: inset 4px 0 0 var(--sblp-accent);
}

body.sblp-layout-active .sblp-toc a:hover,
body.sblp-layout-active .sblp-faq__item:hover,
body.sblp-layout-active .sblp-prose--faq details:hover {
	border-color: var(--sblp-accent);
}

body.sblp-layout-active .sblp-faq__item[open],
body.sblp-layout-active .sblp-prose--faq details[open] {
	box-shadow: inset 4px 0 0 var(--sblp-accent);
}

body.sblp-layout-active .sblp-faq__item[open] .sblp-faq__icon,
body.sblp-layout-active .sblp-prose--faq details[open] > summary::after {
	background: var(--sblp-accent-strong);
	border-color: var(--sblp-accent-strong);
	color: var(--sblp-on-accent);
}

body.sblp-layout-active .wp-block-group.is-style-sblp-cta {
	background: linear-gradient(
		135deg,
		var(--sblp-accent-strong),
		color-mix(in srgb, var(--sblp-accent-strong) 78%, #111827)
	);
	color: var(--sblp-on-accent);
}

/* Breadcrumbs use the same neutral and interactive color tokens. */
body.sblp-layout-active .sblp-breadcrumbs {
	color: var(--sblp-muted);
}

body.sblp-layout-active .sblp-breadcrumbs__item:not(:last-child)::after {
	color: var(--sblp-border);
}

body.sblp-layout-active .sblp-breadcrumbs a:hover,
body.sblp-layout-active .sblp-breadcrumbs a:focus-visible {
	color: var(--sblp-link);
	outline-color: var(--sblp-focus);
}

body.sblp-layout-active .sblp-breadcrumbs [aria-current="page"] {
	color: var(--sblp-text);
}

/* Cards and footer navigation use theme surfaces plus accent interactions. */
body.sblp-layout-active .sblp-author-card,
body.sblp-layout-active .sblp-related-post,
body.sblp-layout-active .sblp-post-navigation__link {
	box-shadow: var(--sblp-theme-shadow);
}

body.sblp-layout-active .sblp-related-post:hover,
body.sblp-layout-active .sblp-post-navigation__link:hover,
body.sblp-layout-active .sblp-author-card:hover {
	border-color: var(--sblp-accent);
	box-shadow: 0 16px 38px color-mix(in srgb, var(--sblp-focus) 56%, transparent);
}

body.sblp-layout-active .sblp-related-post__placeholder {
	background: var(--sblp-design-badge-bg, var(--sblp-accent-soft));
	color: var(--sblp-design-badge-text, var(--sblp-accent-foreground));
}

/* Existing content components inherit the same API. */
body.sblp-layout-active .sblp-post {
	--sblp-component-ink: var(--sblp-text);
	--sblp-component-muted: var(--sblp-muted);
	--sblp-component-line: var(--sblp-border);
	--sblp-component-soft: var(--sblp-surface-soft);
	--sblp-component-surface: var(--sblp-surface);
	--sblp-component-accent: var(--sblp-accent);
	--sblp-component-accent-dark: var(--sblp-accent-strong);
}

body.sblp-layout-active .sblp-pros-cons__panel--pros,
body.sblp-layout-active .wp-block-list.is-style-sblp-pros {
	background: linear-gradient(145deg, var(--sblp-accent-soft) 0%, var(--sblp-surface) 82%);
	border-color: var(--sblp-accent);
}

body.sblp-layout-active .sblp-pros-cons__panel--cons,
body.sblp-layout-active .wp-block-list.is-style-sblp-cons {
	background: linear-gradient(145deg, var(--sblp-surface-soft) 0%, var(--sblp-surface) 82%);
	border-color: var(--sblp-accent);
}

body.sblp-layout-active .sblp-pros-cons__panel--pros h3 > span,
body.sblp-layout-active .sblp-pros-cons__panel--cons h3 > span {
	background: var(--sblp-accent-soft);
	color: var(--sblp-link);
}

body.sblp-layout-active .sblp-pros-cons__panel--pros li::marker,
body.sblp-layout-active .sblp-pros-cons__panel--cons li::marker {
	color: var(--sblp-accent);
}

/* CTA: accent changes actions and borders while the theme owns the container. */
body.sblp-layout-active .sblp-embedded-cta:not(.sblp-embedded-cta--dark),
body.sblp-layout-active .sblp-cta:not(.sblp-cta--dark) {
	--sblp-cta-bg: linear-gradient(145deg, var(--sblp-accent-soft) 0%, var(--sblp-surface) 78%);
	--sblp-cta-border: var(--sblp-accent);
	--sblp-cta-copy: var(--sblp-text);
	--sblp-cta-muted: var(--sblp-muted);
	--sblp-cta-action: var(--sblp-accent-strong);
	background: var(--sblp-cta-bg);
	border-color: var(--sblp-cta-border);
	color: var(--sblp-cta-copy);
}

body.sblp-layout-active .sblp-embedded-cta__content :where(a, button, input[type="submit"], input[type="button"]),
body.sblp-layout-active .sblp-cta__button {
	background: var(--sblp-accent-strong);
	border-color: var(--sblp-accent-strong);
	color: var(--sblp-on-accent);
}

body.sblp-layout-active .sblp-embedded-cta__content :where(a, button, input[type="submit"], input[type="button"]):hover,
body.sblp-layout-active .sblp-cta__button:hover {
	background: var(--sblp-accent);
	border-color: var(--sblp-accent);
	color: var(--sblp-on-accent-hover);
}

body.sblp-layout-active .sblp-embedded-cta__content input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="hidden"]),
body.sblp-layout-active .sblp-embedded-cta__content textarea,
body.sblp-layout-active .sblp-embedded-cta__content select {
	background: var(--sblp-surface);
	border-color: var(--sblp-border);
	color: var(--sblp-text);
}

body.sblp-layout-active .sblp-embedded-cta__content input:focus,
body.sblp-layout-active .sblp-embedded-cta__content textarea:focus,
body.sblp-layout-active .sblp-embedded-cta__content select:focus {
	border-color: var(--sblp-accent);
	box-shadow: 0 0 0 3px var(--sblp-focus);
}

/* Explicit dark/system fixes for layout rules that contain hard-coded light colors. */
body.sblp-layout-active.sblp-theme-dark .sblp-post-title,
body.sblp-layout-active.sblp-theme-dark .sblp-post-lead,
body.sblp-layout-active.sblp-theme-dark .sblp-prose,
body.sblp-layout-active.sblp-theme-dark .sblp-author-card__name,
body.sblp-layout-active.sblp-theme-dark .sblp-related-post__body,
body.sblp-layout-active.sblp-theme-dark .sblp-post-navigation__link,
body.sblp-layout-active.sblp-theme-dark .sblp-toc,
body.sblp-layout-active.sblp-theme-dark .sblp-faq__answer {
	color: var(--sblp-text);
}

body.sblp-layout-active.sblp-theme-dark .sblp-expert-content > .sblp-reading-layout:first-child,
body.sblp-layout-active.sblp-theme-dark .sblp-case-content > .sblp-reading-layout:first-child {
	background: var(--sblp-surface);
	border-color: var(--sblp-border);
}

@media (prefers-color-scheme: dark) {
	body.sblp-layout-active.sblp-theme-system .sblp-post-title,
	body.sblp-layout-active.sblp-theme-system .sblp-post-lead,
	body.sblp-layout-active.sblp-theme-system .sblp-prose,
	body.sblp-layout-active.sblp-theme-system .sblp-author-card__name,
	body.sblp-layout-active.sblp-theme-system .sblp-related-post__body,
	body.sblp-layout-active.sblp-theme-system .sblp-post-navigation__link,
	body.sblp-layout-active.sblp-theme-system .sblp-toc,
	body.sblp-layout-active.sblp-theme-system .sblp-faq__answer {
		color: var(--sblp-text);
	}

	body.sblp-layout-active.sblp-theme-system .sblp-expert-content > .sblp-reading-layout:first-child,
	body.sblp-layout-active.sblp-theme-system .sblp-case-content > .sblp-reading-layout:first-child {
		background: var(--sblp-surface);
		border-color: var(--sblp-border);
	}
}

@media (prefers-reduced-motion: reduce) {
	body.sblp-layout-active .sblp-post,
	body.sblp-layout-active .sblp-post * {
		transition: none;
	}
}

/* Links inside CTA controls retain the foreground paired with their surface;
 * the generic editorial-link cascade above owns text links only. */
body.sblp-layout-active .sblp-post :where(
	.sblp-campaign-cta__button,
	.sblp-cta__button,
	.sblp-cta .wp-block-button__link,
	.wp-block-group.is-style-sblp-cta .wp-block-button__link,
	.sblp-embedded-cta--button .sblp-embedded-cta__content a,
	.sblp-embedded-cta__content input[type="submit"],
	.sblp-embedded-cta__content button[type="submit"]
) {
	background: var(--sblp-design-cta-button-bg, var(--sblp-accent-strong, var(--sblp-accent))) !important;
	border-color: var(--sblp-design-cta-button-bg, var(--sblp-accent-strong, var(--sblp-accent))) !important;
	color: var(--sblp-design-cta-button-text, var(--sblp-on-accent)) !important;
}

/* Gutenberg and theme button anchors are controls, not editorial text links. */
body.sblp-layout-active .sblp-post :where(
	a.button,
	a.wp-element-button,
	a.wp-block-button__link,
	a.wp-block-file__button,
	a[role="button"]
) {
	background: var(--sblp-design-button-bg, var(--sblp-accent-strong, var(--sblp-accent))) !important;
	border-color: var(--sblp-design-button-bg, var(--sblp-accent-strong, var(--sblp-accent))) !important;
	color: var(--sblp-design-button-text, var(--sblp-on-accent)) !important;
}