/*
 * KEH-TECH 2026 redesign layer ("Terminal Modern").
 *
 * Loaded after style.css (functions.php, handle keh-tech-redesign). It changes how the site
 * looks, never what it does: every rule here targets a class, element or token style.css
 * already uses, and no rule hides or reorders a control. Delete the enqueue and the site is
 * back to the glossy 1.x look with nothing else to undo.
 *
 * Direction: flat ink bands instead of glossy gradients, one bright accent (Signal cyan, the
 * old Sky pushed a step brighter), an amber cursor as the brand's second colour, IBM Plex Sans
 * for text and Plex Mono for labels. Plex is already self-hosted for the Shell Lab, so the
 * CSP ('self' only) and "no Google requests" rules still hold.
 */

/* ---------- Fonts (same files the Shell Lab uses) ---------- */
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/ibm-plex/ibm-plex-sans-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 500; font-display: swap; src: url("fonts/ibm-plex/ibm-plex-sans-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 600; font-display: swap; src: url("fonts/ibm-plex/ibm-plex-sans-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/ibm-plex/ibm-plex-sans-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/ibm-plex/ibm-plex-mono-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("fonts/ibm-plex/ibm-plex-mono-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 600; font-display: swap; src: url("fonts/ibm-plex/ibm-plex-mono-latin-600-normal.woff2") format("woff2"); }

/* ---------- Brand tokens ----------
   The --keh-* names are the ones style.css (and wpforo-colors.css) already read, so the whole
   site follows from these values, dark mode included. New tokens are --k-*. */
:root {
	--k-sans: "IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--k-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	/* Fixed brand colours: the ink bands look the same in both schemes. */
	--k-ink: #070E1C;
	--k-ink-2: #0B1628;
	--k-ink-3: #12203A;
	--k-ink-line: rgba(148, 178, 230, .14);
	--k-cyan: #3CD0FF;
	--k-cyan-soft: rgba(60, 208, 255, .14);
	--k-amber: #FFB547;
	--k-on-ink: #E8EEF8;
	--k-on-ink-2: #A9B7CE;
	--k-grid: linear-gradient(rgba(148,178,230,.07) 1px, transparent 1px) 0 0 / 100% 32px, linear-gradient(90deg, rgba(148,178,230,.07) 1px, transparent 1px) 0 0 / 32px 100%;

	--keh-midnight: #070E1C;
	--keh-bright: #1D5FE0; /* read as text on light cards, so it stays dark enough for 4.5:1 */
	--keh-sky: #3CD0FF;
	--keh-brand: linear-gradient(135deg, #070E1C 0%, #0B1628 60%, #0E2350 100%);
	--keh-gloss: #1D5FE0;
	--keh-radius: 14px;

	--keh-navy: #0A1428;
	--keh-deep: #174FC0;
	--keh-royal: #1D5FE0;
	--keh-slate: #4A5872;
	--keh-ice: #EBF1FB;
	--keh-mist: #F5F7FB;
	--keh-text: #0E1A2E;
	--keh-surface: #FFFFFF;
	--keh-surface-2: #F8FAFD;
	--keh-border: #E1E7F0;
	--keh-field-border: #8591A8;
	--keh-focus: #1D5FE0;
	--keh-card-shadow: 0 1px 2px rgba(10,20,40,.05), 0 8px 24px -16px rgba(10,20,40,.22);
	--keh-lift-shadow: 0 2px 4px rgba(10,20,40,.06), 0 18px 40px -20px rgba(10,20,40,.35);
}
@supports (color: light-dark(#000, #fff)) {
	html:root {
		--keh-bright: light-dark(#1D5FE0, #3CD0FF);
		--keh-navy: light-dark(#0A1428, #F1F5FC);
		--keh-deep: light-dark(#174FC0, #A8D4FF);
		--keh-royal: light-dark(#1D5FE0, #7CC4FF);
		--keh-slate: light-dark(#4A5872, #A3B1C9);
		--keh-ice: light-dark(#EBF1FB, #13223D);
		--keh-mist: light-dark(#F5F7FB, #070E1C);
		--keh-text: light-dark(#0E1A2E, #E4EAF5);
		--keh-surface: light-dark(#FFFFFF, #0C1629);
		--keh-surface-2: light-dark(#F8FAFD, #101C33);
		--keh-border: light-dark(#E1E7F0, rgba(148,178,230,.16));
		--keh-field-border: light-dark(#8591A8, #7D8CA8);
		--keh-search-bg: light-dark(#FFFFFF, #101C33);
		--keh-search-text: light-dark(#33415C, #E4EAF5);
		--keh-focus: light-dark(#1D5FE0, #7CC4FF);
		--keh-card-shadow: 0 1px 2px light-dark(rgba(10,20,40,.05), rgba(0,0,0,.35)), 0 8px 24px -16px light-dark(rgba(10,20,40,.22), rgba(0,0,0,.6));
		--keh-lift-shadow: 0 2px 4px light-dark(rgba(10,20,40,.06), rgba(0,0,0,.4)), 0 18px 40px -20px light-dark(rgba(10,20,40,.35), rgba(0,0,0,.75));
		--wp--preset--color--base: light-dark(#FFFFFF, #0C1629);
		--wp--preset--color--contrast: light-dark(#0E1A2E, #E4EAF5);
		--wp--preset--color--accent-2: light-dark(#EBF1FB, #13223D);
		--wp--preset--color--accent-3: light-dark(#1D5FE0, #7CC4FF);
		--wp--preset--color--accent-4: light-dark(#4A5872, #A3B1C9);
		--wp--preset--color--accent-5: light-dark(#F5F7FB, #070E1C);
		--wp--preset--color--deep-blue: light-dark(#174FC0, #A8D4FF);
	}
}

/* ---------- Type ---------- */
body { font-family: var(--k-sans); font-feature-settings: "ss01" 0; }
h1, h2, h3, h4, h5, h6, .wp-block-heading, .wp-block-post-title { font-family: var(--k-sans); font-weight: 700; letter-spacing: -.022em; }
code, kbd, pre, samp { font-family: var(--k-mono); }
/* Labels: dates, kickers, eyebrows and footer headings read as terminal output. */
.keh-post-date, .keh-page-kicker, .keh-page-kicker a, .keh-lab-eyebrow, .keh-footer-heading, .keh-eyebrow,
.keh-kb-id-value, .keh-404-prompt, .keh-lab-badge-mark {
	font-family: var(--k-mono) !important; letter-spacing: .06em;
}

/* ---------- Buttons: flat, squared-off pills ---------- */
.wp-element-button, .wp-block-button__link {
	background: var(--keh-royal) !important; background-image: none !important; color: #fff !important;
	border-radius: var(--k-radius, 4px) !important; font-weight: 600; letter-spacing: 0;
	box-shadow: 0 1px 0 rgba(255,255,255,.12) inset, 0 8px 20px -12px rgba(29,95,224,.9);
	transition: transform .15s ease, background-color .15s ease, box-shadow .15s ease;
}
.wp-element-button::before, .wp-element-button::after,
.wp-block-button__link::before, .wp-block-button__link::after { display: none !important; }
.wp-element-button:hover, .wp-block-button__link:hover { background: #174FC0 !important; transform: translateY(-1px); filter: none; box-shadow: 0 12px 26px -14px rgba(29,95,224,1); }
@supports (color: light-dark(#000, #fff)) {
	/* Dark mode: the royal token turns light for text, so buttons keep their own fill. */
	html:root .wp-element-button, html:root .wp-block-button__link { background: #1D5FE0 !important; }
	html:root .wp-element-button:hover, html:root .wp-block-button__link:hover { background: #2A6CF0 !important; }
}
/* On the ink bands the main action is the signal colour, with ink text (contrast 11:1). */
.keh-btn-light .wp-block-button__link, html:root .keh-btn-light .wp-block-button__link {
	background: var(--k-cyan) !important; color: var(--k-ink) !important;
	box-shadow: 0 10px 28px -14px rgba(60,208,255,.9);
}
.keh-btn-light .wp-block-button__link:hover, html:root .keh-btn-light .wp-block-button__link:hover { background: #7ADFFF !important; }
.keh-btn-ghost .wp-block-button__link, html:root .keh-btn-ghost .wp-block-button__link {
	background: transparent !important; color: var(--k-on-ink) !important; box-shadow: inset 0 0 0 1px rgba(232,238,248,.35);
}
.keh-btn-ghost .wp-block-button__link:hover, html:root .keh-btn-ghost .wp-block-button__link:hover { background: rgba(232,238,248,.08) !important; box-shadow: inset 0 0 0 1px rgba(232,238,248,.6); }

/* ---------- Header ---------- */
.keh-header {
	background: var(--k-ink);
	border-bottom: 1px solid var(--k-ink-line);
	box-shadow: none;
	padding-block: .8rem;
}
@supports (backdrop-filter: blur(8px)) or (-webkit-backdrop-filter: blur(8px)) {
	/* Nearly opaque: the bar sits over the light page as you scroll, and a see-through bar went grey.
	   The blur sits on a layer behind the bar, never on .keh-header itself: backdrop-filter makes an
	   element the containing block for position:fixed descendants, and the phone menu's full-screen
	   overlay lives inside the header, so it was trapped in the 70px bar (Karl, 25 September 2026).
	   isolation keeps the layer behind the bar's content without creating a containing block. */
	.keh-header { background: transparent; isolation: isolate; }
	.keh-header::before {
		content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
		background: rgba(7, 14, 28, .96); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
	}
}
.keh-logo-link, .keh-logo-link:hover { filter: none; }
.keh-slogan { filter: none; }
.keh-slogan text { fill: var(--k-on-ink-2); font-family: var(--k-mono); font-weight: 500; }
.keh-header .wp-block-navigation { color: var(--k-on-ink-2); font-weight: 500; font-size: .95rem; }
.keh-header .wp-block-navigation a:hover, .keh-header .wp-block-navigation-submenu__toggle:hover { color: #fff; }
.keh-header .wp-block-navigation .wp-block-navigation-item__content::after,
.keh-header .wp-block-navigation .wp-block-loginout a::after { background: var(--k-cyan); height: 2px; bottom: -4px; }
.keh-header .wp-block-navigation .current-menu-item > a, .keh-header .wp-block-navigation [aria-current="page"] { color: #fff; }
.keh-header .keh-login-button a {
	background: var(--k-cyan); color: var(--k-ink); border-radius: var(--k-radius, 4px); font-weight: 600;
	box-shadow: none; padding: .5rem 1rem;
}
.keh-header .keh-login-button a:hover { background: #7ADFFF; color: var(--k-ink); }
.keh-theme-toggle, .keh-header .keh-logout-button a, .keh-search-toggle {
	background: transparent; border: 1px solid rgba(232,238,248,.22); border-radius: var(--k-radius, 4px);
}
.keh-theme-toggle:hover, .keh-header .keh-logout-button a:hover, .keh-search-toggle:hover { background: rgba(232,238,248,.08); border-color: rgba(232,238,248,.45); }
.keh-header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container { border-radius: var(--k-radius, 4px); }
.keh-header .wp-block-navigation__responsive-container.is-menu-open { background: var(--k-ink) !important; }

/* ---------- Home hero ---------- */
.keh-hero {
	background:
		radial-gradient(38% 60% at 85% 20%, rgba(60,208,255,.16) 0%, rgba(60,208,255,0) 70%),
		radial-gradient(30% 50% at 8% 100%, rgba(29,95,224,.22) 0%, rgba(29,95,224,0) 70%),
		var(--k-ink);
	padding-block: clamp(3.5rem, 7vw, 6rem) clamp(3.5rem, 7vw, 5.5rem);
	border-bottom: 1px solid var(--k-ink-line);
}
.keh-hero::before { display: none; }
.keh-hero::after {
	background: var(--k-grid); animation: none;
	-webkit-mask-image: radial-gradient(70% 90% at 70% 30%, #000 0%, transparent 75%);
	mask-image: radial-gradient(70% 90% at 70% 30%, #000 0%, transparent 75%);
}
.keh-hero-grid {
	display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center;
	max-width: var(--wp--style--global--wide-size, 1240px) !important; margin-inline: auto !important;
}
.keh-hero-copy > * { margin-block: 0; }
.keh-hero .keh-hero-title, .keh-hero .keh-hero-lede { text-align: left !important; margin-inline: 0 !important; }
.keh-hero-title {
	font-size: clamp(2.6rem, 5.4vw, 4.4rem); font-weight: 700; letter-spacing: -.04em; line-height: 1.02;
	background: none; -webkit-text-fill-color: currentColor; color: #fff; filter: none; margin-bottom: 1.4rem !important;
}
.keh-it { background: none; -webkit-text-fill-color: var(--k-cyan); color: var(--k-cyan); font-weight: 700; }
.keh-hero-title .keh-it { filter: none; }
.keh-hero-lede { color: var(--k-on-ink-2); font-size: clamp(1.05rem, 1.4vw, 1.2rem); max-width: 36rem; margin-bottom: 0 !important; }
.keh-hero-together { color: #fff; font-weight: 600; font-size: 1.1em; margin-bottom: .5rem; }
.keh-hero-together .keh-it { font-weight: 600; }
.keh-eyebrow {
	display: inline-flex; align-items: center; gap: .6rem; margin: 0 0 1.3rem !important;
	font-size: .78rem; font-weight: 500; text-transform: uppercase; color: var(--k-cyan);
}
.keh-hero .keh-eyebrow { padding: .38rem .75rem; border: 1px solid rgba(60,208,255,.35); border-radius: 999px; background: rgba(60,208,255,.07); }
.keh-eyebrow-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--k-amber); box-shadow: 0 0 0 4px rgba(255,181,71,.18); }

/* The terminal card beside the headline: plain HTML, so it reads the same with CSS off. */
.keh-hero-term {
	margin: 0; border-radius: var(--k-radius, 4px); overflow: hidden;
	background: #0A1324; border: 1px solid rgba(148,178,230,.2);
	box-shadow: 0 40px 80px -40px rgba(0,0,0,.8), 0 0 0 1px rgba(60,208,255,.06), 0 0 60px -20px rgba(60,208,255,.25);
	font-family: var(--k-mono); font-size: .86rem; line-height: 1.7; color: var(--k-on-ink);
}
.keh-hero-term-bar { display: flex; align-items: center; gap: .45rem; padding: .7rem .95rem; background: #0E1A30; border-bottom: 1px solid var(--k-ink-line); font-size: .75rem; color: var(--k-on-ink-2); }
.keh-hero-term-bar i { width: 10px; height: 10px; border-radius: 50%; background: #34425C; }
.keh-hero-term-bar span { margin-left: .5rem; }
.keh-hero-term pre { margin: 0; padding: 1.1rem 1.2rem 1.3rem; background: none; border: 0; color: inherit; font: inherit; white-space: pre-wrap; overflow: hidden; }
.keh-hero-term .p { color: var(--k-cyan); }
.keh-hero-term .c { color: #7D8CA8; }
.keh-hero-term .ok { color: #4ADE9B; }
.keh-hero-term .hl { color: var(--k-amber); }
.keh-cursor { display: inline-block; width: .6em; height: 1.1em; vertical-align: -.2em; background: var(--k-amber); animation: keh-blink 1.1s steps(1) infinite; }
@keyframes keh-blink { 50% { opacity: 0; } }
@media (max-width: 960px) {
	.keh-hero-grid { grid-template-columns: minmax(0, 1fr); }
	.keh-hero-term { max-width: 38rem; }
}
@media (max-width: 480px) { .keh-hero-term { font-size: .76rem; } }

/* ---------- Cards ---------- */
.keh-features { margin-top: clamp(2.5rem, 5vw, 4rem) !important; }
.keh-card {
	background: var(--keh-surface); border: 1px solid var(--keh-border); border-radius: var(--keh-radius);
	box-shadow: var(--keh-card-shadow); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.keh-card::before { display: none; }
.keh-card:hover { transform: translateY(-3px); box-shadow: var(--keh-lift-shadow); border-color: color-mix(in srgb, var(--keh-royal) 45%, var(--keh-border)); }
.keh-card h3 { font-size: 1.22rem; letter-spacing: -.015em; }
.keh-card-link { font-weight: 600; }
.keh-card-link a::after { content: " \2192"; font-family: var(--k-mono); }

/* Icons: flat tiles in the brand blue with a cyan hairline, no gloss. */
.keh-icon {
	width: 46px; height: 46px; border-radius: var(--k-radius, 4px); background: var(--k-ink-2);
	box-shadow: inset 0 0 0 1px rgba(60,208,255,.35);
}
.keh-icon::before { display: none; }
.keh-icon::after { width: 22px; height: 22px; background: var(--k-cyan); filter: none; }
.keh-card-media + .keh-icon { margin-top: -23px; box-shadow: 0 0 0 4px var(--keh-surface), inset 0 0 0 1px rgba(60,208,255,.35); }

/* ---------- Section headings ---------- */
.keh-section-title { letter-spacing: -.03em; }
.keh-section-title::after { display: none; }
.keh-latest .keh-eyebrow { display: flex; justify-content: center; margin-inline: auto !important; color: var(--keh-royal); margin-bottom: .6rem !important; }
.keh-latest .keh-section-title { margin-bottom: 2.2rem; }
.keh-post-date { color: var(--keh-royal); font-size: .74rem; font-weight: 500; }
.keh-post-card .wp-block-post-title { letter-spacing: -.015em; }

/* ---------- Shell Lab: an ink card in both schemes, the page's one dark accent ---------- */
.keh-lab-card, html:root .keh-lab-card {
	background: radial-gradient(50% 80% at 100% 0%, rgba(60,208,255,.14), rgba(60,208,255,0) 70%), var(--k-ink);
	border-color: rgba(148,178,230,.18); color: var(--k-on-ink);
}
.keh-lab-card .keh-lab-title { color: #fff; }
.keh-lab-card p { color: var(--k-on-ink-2); }
.keh-lab-card .keh-lab-eyebrow { color: var(--k-cyan) !important; }
.keh-lab-card .keh-card-link a { color: var(--k-cyan); }
.keh-lab-underscore { background: none; -webkit-text-fill-color: var(--k-amber); color: var(--k-amber); }
.keh-lab-media img { box-shadow: 0 30px 60px -30px rgba(0,0,0,.9), 0 0 0 1px rgba(148,178,230,.18); }
:where(.keh-lab-card) :where(a):focus-visible { outline-color: #fff; }

/* ---------- Call to action band ---------- */
.keh-cta-inner {
	background:
		radial-gradient(40% 90% at 100% 0%, rgba(60,208,255,.2), rgba(60,208,255,0) 65%),
		radial-gradient(30% 70% at 0% 100%, rgba(255,181,71,.10), rgba(255,181,71,0) 70%),
		var(--k-ink);
	border: 1px solid rgba(148,178,230,.18); border-radius: var(--k-radius, 4px);
	box-shadow: 0 30px 60px -36px rgba(7,14,28,.9);
}
.keh-cta-inner::before { top: 0; left: 0; right: 0; height: 100%; border-radius: 0; background: var(--k-grid); -webkit-mask-image: linear-gradient(90deg, #000, transparent 60%); mask-image: linear-gradient(90deg, #000, transparent 60%); }
.keh-cta-inner p { color: var(--k-on-ink-2); }
.keh-cta-title { letter-spacing: -.03em; }
.keh-keys { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin: 0 0 .9rem !important; font-family: var(--k-mono); font-size: .8rem; color: var(--k-on-ink-2) !important; }
.keh-keys kbd { padding: .2rem .5rem; border-radius: var(--k-radius, 4px); border: 1px solid rgba(232,238,248,.25); border-bottom-width: 3px; background: rgba(232,238,248,.05); color: #fff; font: inherit; font-weight: 600; }

/* ---------- Footer ---------- */
.keh-footer { background: var(--k-ink); border-top: 1px solid var(--k-ink-line); color: var(--k-on-ink-2); }
.keh-footer-heading { color: var(--k-cyan) !important; font-size: .74rem !important; font-weight: 500; }
.keh-footer-links { font-size: .98rem; }
.keh-footer a { color: var(--k-on-ink-2); }
.keh-footer a:hover { color: #fff; }
.keh-footer-slogan { margin: .6rem 0 0 !important; font-family: var(--k-mono); font-size: .78rem; letter-spacing: .12em; color: var(--k-amber); }
.keh-footer-base { border-top-color: var(--k-ink-line); font-size: .84rem; }

/* ---------- Inner page title bands ---------- */
.keh-page-hero {
	background:
		radial-gradient(35% 90% at 95% 0%, rgba(60,208,255,.16) 0%, rgba(60,208,255,0) 70%),
		var(--k-ink);
	border-bottom: 1px solid var(--k-ink-line);
}
.keh-page-hero::before { top: 0; left: 0; right: 0; height: 100%; border-radius: 0; background: var(--k-grid); -webkit-mask-image: linear-gradient(90deg, transparent 20%, #000 90%); mask-image: linear-gradient(90deg, transparent 20%, #000 90%); }
.keh-page-title, .keh-page-title a { font-weight: 700; letter-spacing: -.035em; filter: none; }
.keh-page-kicker, .keh-page-kicker a { color: var(--k-cyan) !important; font-weight: 500; }
.keh-page-lede, .keh-page-meta { color: var(--k-on-ink-2); }
.keh-article { border-radius: var(--k-radius, 4px); }

/* ---------- Plugin surfaces that used the gloss ---------- */
.keh-kb-body .betterdocs-category-items-counts, .betterdocs-category-items-counts, .betterdocs-category-items-counts span { background: var(--keh-gloss) !important; box-shadow: none; }
#wpforo-wrap { border-radius: var(--k-radius, 4px); }

/* =====================================================================
   Site-wide: every remaining surface that style.css paints with the 1.x
   gloss or hard-coded palette. Grouped by where it appears.
   ===================================================================== */

/* ---------- Header details ---------- */
.keh-header .wp-block-navigation__responsive-container.is-menu-open .keh-login-button a { color: var(--k-ink) !important; }
.keh-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content,
.keh-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__label { border-bottom-color: var(--k-ink-line); }
/* Phone menu: one divider per item. The rule above styles both a link and the label span inside it,
   so each item drew two lines about 12px apart; the inner label keeps the link's text, not its box.
   The list also shrank to its widest label instead of the panel's width. */
.keh-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content .wp-block-navigation-item__label {
	display: inline; padding: 0 !important; border: 0 !important; font: inherit; color: inherit !important;
}
.keh-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { width: 100%; }
/* Phone menu: the Learn and Tools sub-items sat in a 230px column floated to the middle, with their
   divider lines out of step, left over from the desktop dropdown card. Here they are a plain indented
   list under their parent, full width, one step smaller than the top-level items. */
.keh-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	position: static !important; width: 100% !important; min-width: 0 !important; left: auto !important; transform: none !important;
	margin: 0 !important; padding: 0 0 .3rem 1rem !important; background: transparent !important; border: 0 !important; box-shadow: none !important;
}
.keh-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item { width: 100%; margin: 0 !important; padding: 0 !important; }
.keh-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	left: 0 !important; margin: 0 !important; padding: .55rem 0 !important; font-size: 1.05rem; font-weight: 600; color: var(--k-on-ink) !important;
}
.keh-header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container { box-shadow: 0 18px 40px -20px rgba(7,14,28,.6); }
.keh-header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container a { font-weight: 500; border-radius: var(--k-radius, 4px); }
.keh-header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container a:hover,
.keh-header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container a:focus-visible { color: var(--keh-royal) !important; }
.keh-header-search { border-radius: var(--k-radius, 4px); }

/* ---------- Controls: one button shape everywhere ---------- */
.keh-search-form { border-radius: var(--k-radius, 4px); }
.keh-search-submit, .keh-cookie-btn {
	border-radius: var(--k-radius, 4px); background: #1D5FE0; box-shadow: none; font-weight: 600;
}
.keh-search-submit:hover, .keh-cookie-btn:hover { filter: none; background: #174FC0; }
.keh-cookie-btn.is-quiet, .keh-cookie-btn.is-quiet:hover { background: none; }
.keh-hero-search { box-shadow: 0 18px 40px -22px rgba(0,0,0,.7); }
.keh-kb-search-compact { box-shadow: 0 12px 28px -18px rgba(7,14,28,.5); }
.keh-print, .keh-tool-copy, .keh-top, .keh-share { border-radius: var(--k-radius, 4px); font-weight: 600; }
.keh-print:hover, .keh-tool-copy:hover { border-color: var(--keh-royal); }
.keh-belt-tab, .keh-search-tab { border-radius: var(--k-radius, 4px); }
.keh-top, .keh-share { box-shadow: 0 10px 24px -14px rgba(7,14,28,.6); }
.keh-copy { border-radius: var(--k-radius, 4px); font-family: var(--k-mono); }
.keh-progress { background: var(--k-cyan); }
.keh-path-bar span { background: linear-gradient(90deg, var(--keh-royal), var(--k-cyan)); }

/* ---------- Title bands on inner pages ---------- */
.keh-sheet-actions .keh-print { background: var(--k-cyan); color: var(--k-ink); border-color: transparent; }
.keh-sheet-actions .keh-print:hover { background: #7ADFFF; }
.keh-sheet-actions a { color: var(--k-on-ink); }
.keh-doc-hero .betterdocs-breadcrumb, .keh-doc-hero .betterdocs-breadcrumb * { color: var(--k-on-ink-2) !important; font-family: var(--k-mono); font-weight: 500; }
.keh-doc-hero .betterdocs-breadcrumb svg { fill: var(--k-on-ink-2) !important; }
.keh-doc-hero .reading-time, .keh-kb-id { border-radius: var(--k-radius, 4px); background: rgba(60,208,255,.08) !important; border: 1px solid rgba(60,208,255,.3); }
.keh-kb-id-label { color: var(--k-on-ink-2); }
.keh-kb-id-value { color: var(--k-cyan); }
/* No ::before "_" here: the page is titled "_Terminal" already, so the hero read "__Terminal" (review, 28 Sept 2026). */

/* ---------- Articles, callouts and code ---------- */
.keh-callout { border-left-color: var(--keh-royal); border-radius: var(--k-radius, 4px); }
.keh-callout-cta {
	background: radial-gradient(60% 120% at 100% 0%, rgba(60,208,255,.18), rgba(60,208,255,0) 70%), var(--k-ink);
	border: 1px solid rgba(148,178,230,.18); box-shadow: 0 18px 36px -24px rgba(7,14,28,.9);
}
.keh-callout-cta a, .single-docs .betterdocs-content .keh-callout-cta a { color: var(--k-cyan) !important; }
.wp-block-code, .wp-block-post-content pre, html #wpforo #wpforo-wrap .wpforo-post-content pre {
	background: #0A1324; border-color: rgba(148,178,230,.18); color: var(--k-on-ink); font-family: var(--k-mono);
}
:not(pre) > code, html #wpforo #wpforo-wrap .wpforo-post-content :not(pre) > code { font-family: var(--k-mono); }
.wp-block-post-content :where(h2, h3) { letter-spacing: -.02em; }
.wp-block-post-content blockquote, .wp-block-quote { border-left-color: var(--k-cyan); }
.keh-kb-summary { border-left-color: var(--keh-royal); }
.keh-author, .keh-kb-related { border-radius: var(--k-radius, 4px); }

/* ---------- 404 ---------- */
.keh-404-code { background: none !important; -webkit-text-fill-color: var(--keh-royal); color: var(--keh-royal); font-family: var(--k-mono); font-weight: 600; letter-spacing: -.06em; }
.keh-404-prompt { background: #0A1324; color: var(--k-on-ink); border: 1px solid rgba(148,178,230,.18); }
.keh-404-prompt b { color: var(--k-cyan); }

/* ---------- The Cache (BetterDocs) ---------- */
.keh-kb-body .betterdocs-single-category-wrapper .betterdocs-single-category-inner { border-radius: var(--k-radius, 4px) !important; }
.keh-kb-body .betterdocs-single-category-wrapper .betterdocs-single-category-inner:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--keh-royal) 45%, var(--keh-border)) !important; }
.keh-kb-body .betterdocs-category-header .betterdocs-category-header-inner { border-color: var(--keh-royal) !important; }
.keh-kb-body .betterdocs-category-items-counts, .betterdocs-category-items-counts, .betterdocs-category-items-counts span { border-radius: var(--k-radius, 4px) !important; font-family: var(--k-mono); }

/* BetterDocs sets its own heading font; the Cache reads in the site's type like everything else. */
.betterdocs-category-title, .betterdocs-category-title a, .betterdocs-articles-list a, .betterdocs-content :where(h1, h2, h3, h4, p, li, td, th), .betterdocs-toc :where(a, .toc-title) { font-family: var(--k-sans) !important; }

/* ---------- The Patch Panel (wpForo) ---------- */
#wpforo-wrap #wpforo-menu {
	background: var(--k-ink) !important; border: 1px solid rgba(148,178,230,.16) !important; border-radius: var(--k-radius, 4px) !important;
	box-shadow: none !important;
}
/* wpForo paints the tab list itself #f5f5f5 in light mode; on the ink bar it must be see-through. */
#wpforo-wrap #wpforo-menu ul.wpf-menu { background: transparent !important; }
#wpforo-wrap #wpforo-menu ul.wpf-menu > li > a { color: var(--k-on-ink-2) !important; font-weight: 500; }
#wpforo-wrap #wpforo-menu ul.wpf-menu > li > a:hover { color: #fff !important; }
#wpforo-wrap #wpforo-menu ul.wpf-menu > li.wpforo-active > a, #wpforo-wrap #wpforo-menu ul.wpf-menu > li.current-menu-item > a {
	background: var(--k-cyan) !important; color: var(--k-ink) !important; box-shadow: none; border-radius: var(--k-radius, 4px);
}
@media (max-width: 620px) {
	#wpforo-wrap #wpforo-menu ul.wpf-menu { background: var(--k-ink) !important; border-color: rgba(148,178,230,.18) !important; box-shadow: 0 18px 36px -18px rgba(0,0,0,.8) !important; }
	#wpforo-wrap #wpforo-menu ul.wpf-menu > li.wpforo-active > a, #wpforo-wrap #wpforo-menu ul.wpf-menu > li.current-menu-item > a { color: var(--k-ink) !important; }
}
#wpforo-wrap .wpforo-cat-panel, #wpforo-wrap .wpf-head-bar { background: var(--keh-surface-2) !important; border-bottom: 2px solid var(--keh-royal) !important; }
#wpforo-wrap .wpf-forum-info, #wpforo-wrap #wpforo-stat-body, #wpforo-wrap .wpforo-stat-body { background: var(--keh-surface-2) !important; border: 1px solid var(--keh-border); }
#wpforo-wrap input[type="submit"], #wpforo-wrap input[type="button"], #wpforo-wrap button[type="submit"], #wpforo-wrap .wpf-button, #wpforo-wrap .add_wpftopic {
	background: #1D5FE0 !important; border-radius: var(--k-radius, 4px) !important; box-shadow: none !important; font-weight: 600;
}
#wpforo-wrap input[type="submit"]:hover, #wpforo-wrap input[type="button"]:hover, #wpforo-wrap button[type="submit"]:hover, #wpforo-wrap .wpf-button:hover, #wpforo-wrap .add_wpftopic:hover { background: #174FC0 !important; }
#wpforo #wpforo-wrap .wpf-please-login { background: var(--keh-surface); }
#wpforo #wpforo-wrap .wpf-please-login a { background: #1D5FE0; border-color: #1D5FE0; border-radius: var(--k-radius, 4px); box-shadow: none; font-weight: 600; }
#wpforo #wpforo-wrap .wpf-please-login a:hover { background: #174FC0; filter: none; }
#wpforo #wpforo-wrap .wpf-please-login a + a { background: transparent; border-color: var(--keh-field-border); }
#wpforo #wpforo-wrap .wpf-please-login a + a:hover { background: var(--keh-surface-2); }
#wpforo-wrap .wpforo-post-content, #wpforo-wrap .wpforo-post-content p { font-family: var(--k-sans); }
.wpf-edit-cover i { background: rgba(7,14,28,.78) !important; }
.wpf-edit-cover i:hover { background: var(--k-ink) !important; }
#wpforo .mce-tinymce, #wpforo #wpforo-wrap .wpforo-login-wrap .wpforo-login-table { border-radius: var(--k-radius, 4px) !important; }

/* ---------- Cookie panel ---------- */
.keh-cookie { box-shadow: 0 -18px 44px -28px rgba(7,14,28,.8); }
.keh-cookie-title { font-family: var(--k-mono); font-weight: 600; font-size: .92rem; letter-spacing: .04em; }

/* ---------- Consent gate (keh-tech-consent.php) ---------- */
.keh-gate-page { background: radial-gradient(45% 60% at 90% 0%, rgba(60,208,255,.16), rgba(60,208,255,0) 70%), var(--k-ink); }
.keh-gate p { color: var(--k-on-ink-2); }
.keh-gate h1 { font-weight: 700; letter-spacing: -.03em; }
.keh-gate a, .keh-gate-changes a { color: var(--k-cyan); }
.keh-gate-check, .keh-gate-name, .keh-gate-changes { background: rgba(148,178,230,.06); border-color: rgba(148,178,230,.2); border-radius: var(--k-radius, 4px); }
.keh-gate-btn { background: var(--k-cyan); color: var(--k-ink); border-radius: var(--k-radius, 4px); font-weight: 700; box-shadow: 0 12px 28px -16px rgba(60,208,255,.8); }
.keh-gate-btn:hover { background: #7ADFFF; }
.keh-gate-skip { color: var(--k-on-ink-2); }
.keh-gate-name input { color: var(--k-ink); }
.keh-gate .keh-name-roll { border-color: rgba(60,208,255,.45); color: var(--k-cyan); }
.keh-gate .keh-name-roll:hover { background: var(--k-cyan-soft); border-color: var(--k-cyan); }

/* ---------- Learn, practice, leaderboard, tools ---------- */
.keh-lab-preview-hero .keh-lab-media img { box-shadow: 0 24px 50px -28px rgba(7,14,28,.7); }
.keh-rank-badge { box-shadow: none; }
.keh-rank-points { font-family: var(--k-mono); font-weight: 600; }

/* ---------- Motion ---------- */
@media (prefers-reduced-motion: reduce) {
	.keh-cursor { animation: none; }
	.keh-card:hover { transform: none; }
}
/* Windows High Contrast: the decorative grid and glows drop out on their own; keep the cursor visible. */
@media (forced-colors: active) { .keh-cursor { background: CanvasText; } }