/* ROBERIN The New dark hardening / 20260630h
   Late-loaded guard for sitewide The New dark canvas, editor controls, and suffix chip borders. */
/* 20260630g-0: auto-dark must darken the page canvas, not just inner controls. */
body[data-scheme="auto"][data-l="dark"],
body[data-scheme="auto"][data-d="dark"],
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body[data-scheme="auto"]:not([data-scheme="light"]) {
	--cs-site-background: #201811 !important;
	--cs-layout-background: #201811 !important;
	--roberin-shell-background: #201811 !important;
	--roberin-shell-bg: #201811 !important;
	--roberin-shell-panel: #2b2119 !important;
	--roberin-shell-card: #33271d !important;
	--roberin-shell-input: #241c15 !important;
	--roberin-shell-line: #a98b6b !important;
	--roberin-shell-text: #f2e4cf !important;
	--roberin-shell-muted: #f0dfc5 !important;
	color: #f2e4cf !important;
	-webkit-text-fill-color: currentColor !important;
	color-scheme: dark !important;
	background-color: #201811 !important;
	background-image:
		linear-gradient(rgba(229, 196, 139, 0.055) 1px, transparent 1px),
		linear-gradient(90deg, rgba(229, 196, 139, 0.045) 1px, transparent 1px) !important;
	background-size: 16px 16px !important;
}

body[data-scheme="auto"][data-l="dark"] :is(.cs-wrapper, .cs-site, .cs-site-inner, .cs-site-primary, .cs-site-content, .cs-main-content),
body[data-scheme="auto"][data-d="dark"] :is(.cs-wrapper, .cs-site, .cs-site-inner, .cs-site-primary, .cs-site-content, .cs-main-content),
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body[data-scheme="auto"]:not([data-scheme="light"]) :is(.cs-wrapper, .cs-site, .cs-site-inner, .cs-site-primary, .cs-site-content, .cs-main-content) {
	color: #f2e4cf !important;
	-webkit-text-fill-color: currentColor !important;
	background-color: #201811 !important;
	background-image:
		linear-gradient(rgba(229, 196, 139, 0.055) 1px, transparent 1px),
		linear-gradient(90deg, rgba(229, 196, 139, 0.045) 1px, transparent 1px) !important;
	background-size: 16px 16px !important;
}

html body[class] [class*="tn-"] .tn-input-wrap.tn-input-wrap > b,
html body[class] [class*="tn-"] .tn-input-wrap.tn-input-wrap > b[aria-hidden="true"] {
	box-sizing: border-box !important;
	align-self: stretch !important;
	border-bottom: 1px solid var(--tn-line-soft, var(--tn-line, #c7a879)) !important;
	border-right: 1px solid var(--tn-line-soft, var(--tn-line, #c7a879)) !important;
}

body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) [class*="tn-"] .tn-input-wrap.tn-input-wrap > b,
body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) [class*="tn-"] .tn-input-wrap.tn-input-wrap > b[aria-hidden="true"],
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) [class*="tn-"] .tn-input-wrap.tn-input-wrap > b,
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) [class*="tn-"] .tn-input-wrap.tn-input-wrap > b[aria-hidden="true"] {
	background: #493521 !important;
	color: #f7ead1 !important;
	-webkit-text-fill-color: #f7ead1 !important;
	border-left-color: #604a31 !important;
	border-bottom-color: #604a31 !important;
	border-right-color: #604a31 !important;
}

body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) [class*="tn-"] :is(.tn-text-btn, .tn-icon-btn, .tn-source-link, button.tn-text-btn, button.tn-icon-btn),
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) [class*="tn-"] :is(.tn-text-btn, .tn-icon-btn, .tn-source-link, button.tn-text-btn, button.tn-icon-btn) {
	background: #2f2115 !important;
	color: #f7ead1 !important;
	-webkit-text-fill-color: #f7ead1 !important;
	border-color: #604a31 !important;
	box-shadow: none !important;
}

body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) [class*="tn-"] :is(.tn-text-btn:hover, .tn-icon-btn:hover, .tn-source-link:hover, button.tn-text-btn:hover, button.tn-icon-btn:hover),
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) [class*="tn-"] :is(.tn-text-btn:hover, .tn-icon-btn:hover, .tn-source-link:hover, button.tn-text-btn:hover, button.tn-icon-btn:hover) {
	background: #3a2818 !important;
	color: #fff4dc !important;
	-webkit-text-fill-color: #fff4dc !important;
}

@media (prefers-color-scheme: dark) {
	body[data-scheme="auto"] [class*="tn-"] .tn-input-wrap.tn-input-wrap > b,
	body[data-scheme="auto"] [class*="tn-"] .tn-input-wrap.tn-input-wrap > b[aria-hidden="true"] {
		background: #493521 !important;
		color: #f7ead1 !important;
		-webkit-text-fill-color: #f7ead1 !important;
		border-left-color: #604a31 !important;
		border-bottom-color: #604a31 !important;
		border-right-color: #604a31 !important;
	}

	body[data-scheme="auto"] [class*="tn-"] :is(.tn-text-btn, .tn-icon-btn, .tn-source-link, button.tn-text-btn, button.tn-icon-btn) {
		background: #2f2115 !important;
		color: #f7ead1 !important;
		-webkit-text-fill-color: #f7ead1 !important;
		border-color: #604a31 !important;
		box-shadow: none !important;
	}

	body[data-scheme="auto"] [class*="tn-"] :is(.tn-text-btn:hover, .tn-icon-btn:hover, .tn-source-link:hover, button.tn-text-btn:hover, button.tn-icon-btn:hover) {
		background: #3a2818 !important;
		color: #fff4dc !important;
		-webkit-text-fill-color: #fff4dc !important;
	}
}

/* 20260630f-2: beat page-local !important converter controls without touching layout. */
html body[class] [class*="tn-"] .tn-input-wrap.tn-input-wrap.tn-input-wrap > b,
html body[class] [class*="tn-"] .tn-input-wrap.tn-input-wrap.tn-input-wrap > b[aria-hidden="true"] {
	height: calc(100% + 1px) !important;
	min-height: calc(100% + 1px) !important;
	border-bottom: 1px solid var(--tn-line-soft, var(--tn-line, #c7a879)) !important;
	border-right: 1px solid var(--tn-line-soft, var(--tn-line, #c7a879)) !important;
}

body[class][data-scheme="dark"]:not([data-scheme="light"]) [class*="tn-"] .tn-input-wrap.tn-input-wrap.tn-input-wrap > b,
body[class][data-scheme="inverse"]:not([data-scheme="light"]) [class*="tn-"] .tn-input-wrap.tn-input-wrap.tn-input-wrap > b,
body[class][data-scheme="auto"][data-l="dark"] [class*="tn-"] .tn-input-wrap.tn-input-wrap.tn-input-wrap > b,
body[class][data-scheme="auto"][data-d="dark"] [class*="tn-"] .tn-input-wrap.tn-input-wrap.tn-input-wrap > b,
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body[class]:not([data-scheme="light"]) [class*="tn-"] .tn-input-wrap.tn-input-wrap.tn-input-wrap > b {
	background: #493521 !important;
	color: #f7ead1 !important;
	-webkit-text-fill-color: #f7ead1 !important;
	border-left-color: #604a31 !important;
	border-bottom-color: #604a31 !important;
	border-right-color: #604a31 !important;
}

body[class][data-scheme="dark"]:not([data-scheme="light"]) [class*="tn-"] .tn-text-btn.tn-text-btn.tn-text-btn,
body[class][data-scheme="dark"]:not([data-scheme="light"]) [class*="tn-"] .tn-icon-btn.tn-icon-btn.tn-icon-btn,
body[class][data-scheme="dark"]:not([data-scheme="light"]) [class*="tn-"] .tn-source-link.tn-source-link.tn-source-link,
body[class][data-scheme="inverse"]:not([data-scheme="light"]) [class*="tn-"] .tn-text-btn.tn-text-btn.tn-text-btn,
body[class][data-scheme="inverse"]:not([data-scheme="light"]) [class*="tn-"] .tn-icon-btn.tn-icon-btn.tn-icon-btn,
body[class][data-scheme="inverse"]:not([data-scheme="light"]) [class*="tn-"] .tn-source-link.tn-source-link.tn-source-link,
body[class][data-scheme="auto"][data-l="dark"] [class*="tn-"] .tn-text-btn.tn-text-btn.tn-text-btn,
body[class][data-scheme="auto"][data-l="dark"] [class*="tn-"] .tn-icon-btn.tn-icon-btn.tn-icon-btn,
body[class][data-scheme="auto"][data-l="dark"] [class*="tn-"] .tn-source-link.tn-source-link.tn-source-link,
body[class][data-scheme="auto"][data-d="dark"] [class*="tn-"] .tn-text-btn.tn-text-btn.tn-text-btn,
body[class][data-scheme="auto"][data-d="dark"] [class*="tn-"] .tn-icon-btn.tn-icon-btn.tn-icon-btn,
body[class][data-scheme="auto"][data-d="dark"] [class*="tn-"] .tn-source-link.tn-source-link.tn-source-link,
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body[class]:not([data-scheme="light"]) [class*="tn-"] .tn-text-btn.tn-text-btn.tn-text-btn,
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body[class]:not([data-scheme="light"]) [class*="tn-"] .tn-icon-btn.tn-icon-btn.tn-icon-btn,
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body[class]:not([data-scheme="light"]) [class*="tn-"] .tn-source-link.tn-source-link.tn-source-link {
	background: #2f2115 !important;
	color: #f7ead1 !important;
	-webkit-text-fill-color: #f7ead1 !important;
	border-color: #604a31 !important;
	box-shadow: none !important;
}

@media (prefers-color-scheme: dark) {
	body[class][data-scheme="auto"] [class*="tn-"] .tn-input-wrap.tn-input-wrap.tn-input-wrap > b {
		height: calc(100% + 1px) !important;
		min-height: calc(100% + 1px) !important;
		background: #493521 !important;
		color: #f7ead1 !important;
		-webkit-text-fill-color: #f7ead1 !important;
		border-left-color: #604a31 !important;
		border-bottom-color: #604a31 !important;
		border-right-color: #604a31 !important;
	}

	body[class][data-scheme="auto"] [class*="tn-"] .tn-text-btn.tn-text-btn.tn-text-btn,
	body[class][data-scheme="auto"] [class*="tn-"] .tn-icon-btn.tn-icon-btn.tn-icon-btn,
	body[class][data-scheme="auto"] [class*="tn-"] .tn-source-link.tn-source-link.tn-source-link {
		background: #2f2115 !important;
		color: #f7ead1 !important;
		-webkit-text-fill-color: #f7ead1 !important;
		border-color: #604a31 !important;
		box-shadow: none !important;
	}
}

/* 20260630f-3: unit-converter wrappers are already 44px; keep suffix line inside that box. */
html body[class] .tn-unit-converter.tn-unit-converter .tn-input-wrap.tn-input-wrap.tn-input-wrap.tn-input-wrap > b,
html body[class] .tn-unit-converter.tn-unit-converter .tn-input-wrap.tn-input-wrap.tn-input-wrap.tn-input-wrap > b[aria-hidden="true"] {
	height: 100% !important;
	min-height: 100% !important;
}


/* 20260630d: header menu base must not repaint as separate chips during scheme toggle. */
body .cs-header .cs-header__menu a,
body .cs-header__menu a,
body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .cs-header .cs-header__menu a,
body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .cs-header__menu a,
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .cs-header .cs-header__menu a,
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .cs-header__menu a {
	background: transparent !important;
	background-color: transparent !important;
	border-color: transparent !important;
	box-shadow: none !important;
	transition-property: background-color, border-color, color, -webkit-text-fill-color !important;
	transition-duration: var(--roberin-scheme-transition-duration, 240ms) !important;
	transition-timing-function: var(--roberin-scheme-transition-ease, cubic-bezier(.2, 0, .2, 1)) !important;
	transition-delay: 0s !important;
}

body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .cs-header .cs-header__menu a,
body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .cs-header__menu a,
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .cs-header .cs-header__menu a,
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .cs-header__menu a {
	color: #f7ead1 !important;
	-webkit-text-fill-color: #f7ead1 !important;
}

body .cs-header .cs-header__menu a:hover,
body .cs-header .cs-header__menu a:focus-visible,
body .cs-header__menu a:hover,
body .cs-header__menu a:focus-visible {
	background: rgba(237, 230, 212, .72) !important;
	background-color: rgba(237, 230, 212, .72) !important;
}

body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .cs-header .cs-header__menu a:hover,
body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .cs-header .cs-header__menu a:focus-visible,
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .cs-header .cs-header__menu a:hover,
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .cs-header .cs-header__menu a:focus-visible {
	background: rgba(58, 40, 24, .72) !important;
	background-color: rgba(58, 40, 24, .72) !important;
}

/* 20260630d: speed/unit converter suffix uses the wrapper content box, not an overhanging chip. */
html body[class] .tn-unit-converter.tn-unit-converter.tn-unit-converter .tn-input-wrap.tn-input-wrap.tn-input-wrap.tn-input-wrap > b,
html body[class] .tn-unit-converter.tn-unit-converter.tn-unit-converter .tn-input-wrap.tn-input-wrap.tn-input-wrap.tn-input-wrap > b[aria-hidden="true"] {
	height: calc(100% - 2px) !important;
	min-height: calc(100% - 2px) !important;
	margin-block: 0 !important;
	border-bottom-width: 1px !important;
	border-right-width: 1px !important;
}


/* 20260630e: final non-hover header menu base override after hover rules. */
body .cs-header .cs-header__menu.cs-header__menu a:not(:hover):not(:focus):not(:focus-visible),
body .cs-header__menu.cs-header__menu a:not(:hover):not(:focus):not(:focus-visible),
body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .cs-header .cs-header__menu.cs-header__menu a:not(:hover):not(:focus):not(:focus-visible),
body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .cs-header__menu.cs-header__menu a:not(:hover):not(:focus):not(:focus-visible),
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .cs-header .cs-header__menu.cs-header__menu a:not(:hover):not(:focus):not(:focus-visible),
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .cs-header__menu.cs-header__menu a:not(:hover):not(:focus):not(:focus-visible) {
	background: transparent !important;
	background-color: transparent !important;
	border-color: transparent !important;
	box-shadow: none !important;
}


/* 20260630f: all The New suffix chips use the inner content box so the bottom line is visible. */
html body[class] [class*="tn-"] .tn-input-wrap.tn-input-wrap.tn-input-wrap.tn-input-wrap > b,
html body[class] [class*="tn-"] .tn-input-wrap.tn-input-wrap.tn-input-wrap.tn-input-wrap > b[aria-hidden="true"],
html body[class] .tn-unit-converter.tn-unit-converter.tn-unit-converter .tn-input-wrap.tn-input-wrap.tn-input-wrap.tn-input-wrap > b,
html body[class] .tn-unit-converter.tn-unit-converter.tn-unit-converter .tn-input-wrap.tn-input-wrap.tn-input-wrap.tn-input-wrap > b[aria-hidden="true"] {
	height: calc(100% - 2px) !important;
	min-height: calc(100% - 2px) !important;
	margin-block: 0 !important;
	border-bottom-width: 1px !important;
	border-right-width: 1px !important;
}


/* 20260630g: baseline dark parity for The New text/code editor and shared TN controls. */
body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .entry-content [class*="tn-"],
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .entry-content [class*="tn-"] {
	--tn-ink: #f7ead1;
	--tn-muted: #eadbbf;
	--tn-line: #826744;
	--tn-line-soft: #604a31;
	--tn-paper: #2c2015;
	--tn-paper-strong: #241c15;
	--tn-wash: #30251b;
	--tn-button: #3a2a1b;
	--tn-button-hover: #493521;
	--tn-accent: #ffb36d;
	color: #f7ead1 !important;
	-webkit-text-fill-color: currentColor !important;
}

body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .entry-content [class*="tn-"] :is(input:not([type="checkbox"]):not([type="radio"]), textarea, select),
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .entry-content [class*="tn-"] :is(input:not([type="checkbox"]):not([type="radio"]), textarea, select) {
	color: #f7ead1 !important;
	-webkit-text-fill-color: #f7ead1 !important;
	background-color: #21170f !important;
	border-color: #826744 !important;
	color-scheme: dark !important;
}

body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .entry-content [class*="tn-"] :is(.tn-input-wrap input, .tn-code-input),
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .entry-content [class*="tn-"] :is(.tn-input-wrap input, .tn-code-input) {
	background-color: transparent !important;
}

body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .tn-css-tool :is(.tn-article-panel, .tn-info-card, .tn-faq-item, .tn-intro-columns, .tn-source-links),
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .tn-css-tool :is(.tn-article-panel, .tn-info-card, .tn-faq-item, .tn-intro-columns, .tn-source-links) {
	color: #f7ead1 !important;
	-webkit-text-fill-color: currentColor !important;
}

body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .tn-css-tool :is(.tn-article-title h2, .tn-info-card h3, .tn-faq-item h3, .tn-design-note strong, .tn-design-note li b, .tn-source-link),
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .tn-css-tool :is(.tn-article-title h2, .tn-info-card h3, .tn-faq-item h3, .tn-design-note strong, .tn-design-note li b, .tn-source-link) {
	color: #f7ead1 !important;
	-webkit-text-fill-color: #f7ead1 !important;
}

body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .tn-css-tool :is(.tn-code-input, .tn-hero p, .tn-hero__eyebrow, .tn-message-row, .tn-tool-note, .tn-settings-chip, .tn-stat-card span, .tn-tool-meta-row, .tn-design-note strong span, .tn-design-note li, .tn-intro-columns p, .tn-info-card p, .tn-info-card li, .tn-faq-item p, .tn-source-links span),
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .tn-css-tool :is(.tn-code-input, .tn-hero p, .tn-hero__eyebrow, .tn-message-row, .tn-tool-note, .tn-settings-chip, .tn-stat-card span, .tn-tool-meta-row, .tn-design-note strong span, .tn-design-note li, .tn-intro-columns p, .tn-info-card p, .tn-info-card li, .tn-faq-item p, .tn-source-links span) {
	color: #eadbbf !important;
	-webkit-text-fill-color: currentColor !important;
}
body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .tn-css-tool .tn-code-input::placeholder,
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .tn-css-tool .tn-code-input::placeholder {
	color: #eadbbf !important;
	-webkit-text-fill-color: #eadbbf !important;
}

body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .tn-css-tool :is(.tn-code-panel, .tn-code-editor, .tn-settings-chip select, .tn-settings-chip input[type="number"]),
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .tn-css-tool :is(.tn-code-panel, .tn-code-editor, .tn-settings-chip select, .tn-settings-chip input[type="number"]) {
	background: #241c15 !important;
	color: #f7ead1 !important;
	-webkit-text-fill-color: #f7ead1 !important;
	border-color: #826744 !important;
}

body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .tn-css-tool :is(.tn-code-gutter, .tn-message-row, .tn-command-bar, .tn-stat-strip, .tn-info-card),
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .tn-css-tool :is(.tn-code-gutter, .tn-message-row, .tn-command-bar, .tn-stat-strip, .tn-info-card) {
	background: #30251b !important;
	border-color: #826744 !important;
}

body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .tn-css-tool :is(.tn-action-btn, .tn-file-btn),
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .tn-css-tool :is(.tn-action-btn, .tn-file-btn) {
	background: #3a2a1b !important;
	color: #f7ead1 !important;
	-webkit-text-fill-color: #f7ead1 !important;
	border-color: #826744 !important;
	box-shadow: none !important;
}

body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .tn-css-tool :is(.tn-action-btn:hover, .tn-file-btn:hover),
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .tn-css-tool :is(.tn-action-btn:hover, .tn-file-btn:hover) {
	background: #493521 !important;
	color: #fff4dc !important;
	-webkit-text-fill-color: #fff4dc !important;
}

body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .tn-css-tool :is(.tn-action-btn[aria-pressed="true"], .tn-action-btn--primary),
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .tn-css-tool :is(.tn-action-btn[aria-pressed="true"], .tn-action-btn--primary) {
	background: #ffb36d !important;
	color: #1a1208 !important;
	-webkit-text-fill-color: #1a1208 !important;
	border-color: #ffb36d !important;
}

body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .tn-css-tool :is(.tn-mini-mark, .tn-toast),
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .tn-css-tool :is(.tn-mini-mark, .tn-toast) {
	background: #120d08 !important;
	color: #f7ead1 !important;
	-webkit-text-fill-color: #f7ead1 !important;
	border-color: #826744 !important;
}


/* 20260630h: final override for CSS formatter primary buttons after shared text-fill guards. */
body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .tn-css-tool .tn-action-btn.tn-action-btn--primary,
body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-l="dark"], [data-scheme="auto"][data-d="dark"], .theme-dark):not([data-scheme="light"]) .tn-css-tool .tn-action-btn[aria-pressed="true"],
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .tn-css-tool .tn-action-btn.tn-action-btn--primary,
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .tn-css-tool .tn-action-btn[aria-pressed="true"] {
	background: #ffb36d !important;
	color: #1a1208 !important;
	-webkit-text-fill-color: #1a1208 !important;
	border-color: #ffb36d !important;
}
