@charset "UTF-8";
/* ============================================================================
   JASON SLADE — INSTRUMENT PANEL
   The theme's only stylesheet. Hand-written, no build step. Loaded on the front
   end and inside the block editor (see functions.php).

   Order:
     1  tokens (light authored on :root; dark authored independently)
     2  reset + base
     3  layout scaffolding
     4  header / status bar
     5  footer
     6  primitives: label, value, chip, status, panel, button
     7  core block treatments
     8  registered block styles (is-style-jsd-*)
     9  reading view (single post) — direction-B posture inside direction-A chrome
    10  post lists, archives, series hub, search, 404
    11  editor-only corrections
    12  screen captures
    13  reduced motion
   ========================================================================== */

/* ------------------------------------------------------------------ *
   1 · TOKENS
   Light is the authored base. Dark is authored independently — it is not
   an inversion. Both directions of the toggle must win over the media
   query, hence the three blocks below.
 * ------------------------------------------------------------------ */
:root {
	color-scheme: light;

	--jsd-bg: #f2f2f0;
	--jsd-surface: #fafaf9;
	--jsd-panel: #ffffff;
	--jsd-rule: #dcdcd8;
	--jsd-rule-strong: #b8b8b2;
	--jsd-ink: #16181b;
	--jsd-ink-2: #4e5157;
	--jsd-ink-3: #64676d;
	--jsd-link: #10528f;
	--jsd-ok: #176b45;
	--jsd-warn: #8a5d00;
	--jsd-alarm: #a3231a;
	--jsd-focus: #10528f;
	--jsd-selection: #d7e4f2;
	--jsd-code-bg: #f7f7f5;

	--jsd-gut: clamp(1.15rem, 4vw, 3rem);
	--jsd-page: 75rem;
	--jsd-measure: 70ch;
	--jsd-bar-h: 3.25rem;

	--jsd-ff-sans: var(--wp--preset--font-family--sans, ui-sans-serif, system-ui, sans-serif);
	--jsd-ff-mono: var(--wp--preset--font-family--mono, ui-monospace, Menlo, Consolas, monospace);
}

@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) {
		color-scheme: dark;
		--jsd-bg: #0f1113;
		--jsd-surface: #15181b;
		--jsd-panel: #1a1e22;
		--jsd-rule: #282d33;
		--jsd-rule-strong: #3b4249;
		--jsd-ink: #e8eaec;
		--jsd-ink-2: #a8aeb5;
		--jsd-ink-3: #8a9199;
		--jsd-link: #7ab6f5;
		--jsd-ok: #4fc98c;
		--jsd-warn: #e0b451;
		--jsd-alarm: #ff7a6e;
		--jsd-focus: #7ab6f5;
		--jsd-selection: #1e3652;
		--jsd-code-bg: #101316;
	}
}

:root[data-theme="dark"] {
	color-scheme: dark;
	--jsd-bg: #0f1113;
	--jsd-surface: #15181b;
	--jsd-panel: #1a1e22;
	--jsd-rule: #282d33;
	--jsd-rule-strong: #3b4249;
	--jsd-ink: #e8eaec;
	--jsd-ink-2: #a8aeb5;
	--jsd-ink-3: #8a9199;
	--jsd-link: #7ab6f5;
	--jsd-ok: #4fc98c;
	--jsd-warn: #e0b451;
	--jsd-alarm: #ff7a6e;
	--jsd-focus: #7ab6f5;
	--jsd-selection: #1e3652;
	--jsd-code-bg: #101316;
}

/* ------------------------------------------------------------------ *
   2 · RESET + BASE
 * ------------------------------------------------------------------ */
*,
*::before,
*::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	scroll-padding-top: calc(var(--jsd-bar-h) + 1rem);
}

body {
	margin: 0;
	background: var(--jsd-bg);
	color: var(--jsd-ink);
	font-synthesis-weight: none;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	overflow-wrap: break-word;
}

img,
svg,
video,
canvas { max-width: 100%; height: auto; }

::selection { background: var(--jsd-selection); color: var(--jsd-ink); }

:focus-visible {
	outline: 2px solid var(--jsd-focus);
	outline-offset: 3px;
	border-radius: 1px;
}

a { text-underline-offset: 0.18em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }

hr { border: 0; }

/* Skip link — visible the moment it takes focus. */
.jsd-skip {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 100;
	padding: 0.7rem 1rem;
	background: var(--jsd-panel);
	color: var(--jsd-ink);
	border: 1px solid var(--jsd-rule-strong);
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--small);
	text-decoration: none;
}
.jsd-skip:focus { left: 0.5rem; top: 0.5rem; }

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.screen-reader-text:focus {
	position: static !important;
	width: auto;
	height: auto;
	margin: 0;
	clip: auto;
	white-space: normal;
}

/* ------------------------------------------------------------------ *
   3 · LAYOUT SCAFFOLDING
   No root-padding-aware alignments: gutters are owned by the three
   wrappers below, so nothing depends on core's negative-margin dance.
 * ------------------------------------------------------------------ */
.wp-site-blocks {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}
.wp-site-blocks > footer { margin-top: auto; }

.jsd-main {
	flex: 1 0 auto;
	width: 100%;
	max-width: var(--jsd-page);
	margin-inline: auto;
	padding-inline: var(--jsd-gut);
	padding-block: clamp(2rem, 5vw, 3.5rem) clamp(3rem, 7vw, 5rem);
}
/* Reading pages: a narrower frame. Prose keeps its 70ch measure inside it;
   code, tables and figures are allowed the full column width. */
.jsd-main.is-reading { max-width: 48rem; }

/* Page bodies flow left, the way the comp does: nothing is centred, and only
   running prose is held to a reading measure. Panels, tables and grids take
   the full column. */
.jsd-pagebody > p,
.jsd-pagebody > ul:not([class*="is-style-jsd-"]),
.jsd-pagebody > ol:not([class*="is-style-jsd-"]),
.jsd-pagebody > .wp-block-quote,
.is-style-jsd-band > p,
.is-style-jsd-band > ul:not([class*="is-style-jsd-"]),
.is-style-jsd-band > ol:not([class*="is-style-jsd-"]),
.is-style-jsd-band > .wp-block-quote { max-width: var(--jsd-measure); }
/* Styled registers (jsd-fields etc.) are components, not prose — they take the
   full column like tables do, so their hairlines meet the column edge. */

/* ------------------------------------------------------------------ *
   4 · HEADER / STATUS BAR
 * ------------------------------------------------------------------ */
.wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 50;
	background: var(--jsd-surface);
	border-bottom: 1px solid var(--jsd-rule-strong);
}

.jsd-mast-in {
	max-width: var(--jsd-page);
	margin-inline: auto;
	padding-inline: var(--jsd-gut);
	display: flex;
	align-items: stretch;
	gap: 0.75rem;
	min-height: var(--jsd-bar-h);
	flex-wrap: nowrap;
}
.jsd-mast-in > * { margin-block: 0; }

.jsd-brand {
	flex: 0 0 auto;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-inline-end: 1.25rem;
	border-inline-end: 1px solid var(--jsd-rule);
	row-gap: 0.15rem;
}
.jsd-brand > *,
.jsd-mast-side > * { margin-block: 0; }
.jsd-brand .wp-block-site-title a { color: var(--jsd-ink); text-decoration: none; }
.jsd-brand .wp-block-site-title a:hover { text-decoration: underline; }
.jsd-brand { min-width: 0; }
.jsd-brand .wp-block-site-tagline { margin: 0; overflow-wrap: anywhere; }
/* The site tagline is a four-item list; below tablet it costs more room than
   it earns, and the h1 says the same thing one scroll down. */
@media (max-width: 34rem) {
	.jsd-brand .wp-block-site-tagline { display: none; }
}

.jsd-mast-side {
	flex: 0 0 auto;
	margin-inline-start: auto;
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding-inline-start: 1rem;
	border-inline-start: 1px solid var(--jsd-rule);
}

/* --- primary navigation (core/page-list, wrapped in <nav> by the theme) --- */
.jsd-nav {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	align-items: center;
	overflow-x: auto;
	scrollbar-width: thin;
}
.jsd-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 0.1rem;
}
.jsd-nav li { margin: 0; }
.jsd-nav a {
	display: block;
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--jsd-ink-2);
	padding: 0.45rem 0.5rem;
	border: 1px solid transparent;
	white-space: nowrap;
}
.jsd-nav a:hover { color: var(--jsd-ink); border-color: var(--jsd-rule); text-decoration: none; }
.jsd-nav .current-menu-item > a,
.jsd-nav a[aria-current="page"] {
	color: var(--jsd-ink);
	border-color: var(--jsd-rule-strong);
	background: var(--jsd-panel);
}
/* Sub-pages are not part of this site's IA; keep the bar one row deep. */
.jsd-nav ul ul { display: none; }

/* --- control buttons in the bar --- */
.jsd-btn-bar {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	padding: 0.35rem 0.6rem;
	border: 1px solid var(--jsd-rule-strong);
	background: var(--jsd-panel);
	color: var(--jsd-ink);
	cursor: pointer;
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	line-height: 1.4;
}
.jsd-btn-bar:hover { border-color: var(--jsd-ink-3); }
.jsd-btn-bar .jsd-k { color: var(--jsd-ink-3); }
.jsd-btn-bar .jsd-v { color: var(--jsd-ink); min-width: 3.1em; text-align: start; }

.jsd-navtoggle { display: none; }
.jsd-navtoggle .jsd-bars {
	display: inline-block;
	width: 0.85rem;
	height: 1px;
	background: currentColor;
	box-shadow: 0 4px 0 currentColor, 0 -4px 0 currentColor;
}

/* Mobile: nav collapses behind a real button with aria-expanded. */
@media (max-width: 47.99rem) {
	.jsd-mast-in { padding-block: 0.5rem; align-items: center; flex-wrap: wrap; }
	.jsd-mast-side { padding-inline-start: 0; border-inline-start: 0; }
	.jsd-brand { border-inline-end: 0; padding-inline-end: 0; }
	.jsd-navtoggle { display: inline-flex; }
	.jsd-nav {
		flex: 1 0 100%;
		order: 3;
		display: none;
		border-top: 1px solid var(--jsd-rule);
		padding-block: 0.5rem;
	}
	.jsd-mast-in[data-nav="open"] .jsd-nav { display: block; }
	.jsd-nav { overflow-x: visible; }
	.jsd-nav ul { flex-direction: column; align-items: stretch; gap: 0; flex-wrap: nowrap; }
	.jsd-nav a { padding: 0.7rem 0.4rem; border-block-end: 1px solid var(--jsd-rule); }
	.jsd-nav li:last-child a { border-block-end: 0; }
}

/* No JS: never hide the nav, never show a dead toggle. */
.no-js .jsd-navtoggle,
.no-js .jsd-themetoggle { display: none; }
.no-js .jsd-nav { display: block !important; }

/* ------------------------------------------------------------------ *
   5 · FOOTER
 * ------------------------------------------------------------------ */
.wp-site-blocks > footer.wp-block-template-part {
	background: var(--jsd-surface);
	border-top: 1px solid var(--jsd-rule-strong);
}
.jsd-foot-in {
	max-width: var(--jsd-page);
	margin-inline: auto;
	padding-inline: var(--jsd-gut);
	padding-block: clamp(2.5rem, 5vw, 3.5rem) 1.25rem;
}
.jsd-foot-grid {
	display: grid;
	gap: 2rem;
}
@media (min-width: 47.5rem) {
	.jsd-foot-grid { grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr)); }
}
.jsd-foot-grid h2,
.jsd-foot-grid .jsd-foot-h {
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--jsd-ink-3);
	font-weight: 400;
	margin: 0 0 0.8rem;
}
.jsd-foot-grid .wp-block-site-title a { color: var(--jsd-ink); text-decoration: none; }
.jsd-foot-grid .wp-block-site-title a:hover { text-decoration: underline; }
.jsd-foot-grid ul { list-style: none; margin: 0; padding: 0; }
.jsd-foot-grid li { margin: 0 0 0.5rem; font-size: var(--wp--preset--font-size--small); }
.jsd-foot-grid li a { color: var(--jsd-ink-2); text-decoration: none; }
.jsd-foot-grid li a:hover { color: var(--jsd-ink); text-decoration: underline; }
.jsd-foot-grid p { font-size: var(--wp--preset--font-size--small); color: var(--jsd-ink-2); line-height: 1.6; }

.jsd-foot-bar {
	border-top: 1px solid var(--jsd-rule);
	margin-top: 2rem;
	padding-block: 0.9rem 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.5rem;
	justify-content: space-between;
	align-items: center;
}
.jsd-foot-bar p { margin: 0; }

/* ------------------------------------------------------------------ *
   6 · PRIMITIVES
 * ------------------------------------------------------------------ */
.jsd-status {
	display: inline-flex;
	align-items: center;
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	margin: 0;
}
.jsd-status::before {
	content: "";
	display: inline-block;
	inline-size: 0.5rem;
	block-size: 0.5rem;
	flex: 0 0 auto;
	border: 1px solid currentColor;
	background: currentColor;
	margin-inline-end: 0.5rem;
}
.jsd-status.is-ok { color: var(--jsd-ok); }
.jsd-status.is-warn { color: var(--jsd-warn); }
.jsd-status.is-alarm { color: var(--jsd-alarm); }

/* ------------------------------------------------------------------ *
   7 · CORE BLOCK TREATMENTS
 * ------------------------------------------------------------------ */

/* --- buttons ------------------------------------------------------ */
.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
	border-radius: 0;
}
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: var(--jsd-surface);
	color: var(--jsd-ink);
	border-color: var(--jsd-rule-strong);
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover,
.wp-block-button.is-style-outline > .wp-block-button__link:focus {
	background: var(--jsd-panel);
	border-color: var(--jsd-ink-3);
	color: var(--jsd-ink);
}

/* --- separator ---------------------------------------------------- */
.wp-block-separator {
	border-top: 1px solid var(--jsd-rule-strong);
	border-bottom: 0;
	opacity: 1;
	background: none;
	margin-block: clamp(2rem, 4vw, 3rem);
}
.wp-block-separator.is-style-wide { width: 100%; max-width: none; }

/* --- lists -------------------------------------------------------- */
.wp-block-list { padding-inline-start: 1.25rem; }
.wp-block-list li { margin-block: 0.35rem; }
.wp-block-list li::marker { color: var(--jsd-ink-3); }

/* --- quote -------------------------------------------------------- */
.wp-block-quote {
	border-inline-start: 2px solid var(--jsd-rule-strong);
	padding-inline-start: 1.15rem;
	margin-inline: 0;
	font-style: normal;
}
.wp-block-quote cite {
	display: block;
	margin-top: 0.8rem;
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: var(--jsd-ink-3);
	font-style: normal;
}
.wp-block-pullquote {
	border-block: 1px solid var(--jsd-rule-strong);
	padding-block: 1.5rem;
	color: var(--jsd-ink);
}

/* --- inline code -------------------------------------------------- */
:where(p, li, td, th, dd, figcaption) code {
	font-family: var(--jsd-ff-mono);
	font-size: 0.875em;
	background: var(--jsd-code-bg);
	border: 1px solid var(--jsd-rule);
	padding: 0.05em 0.3em;
	color: var(--jsd-ink);
}

/* --- code blocks: bordered, mono, scroll inside their own box ------ */
.wp-block-code,
.wp-block-preformatted {
	background: var(--jsd-code-bg);
	border: 1px solid var(--jsd-rule-strong);
	border-radius: 0;
	padding: 0;
	margin-block: 2rem;
	max-width: 100%;
	overflow: hidden; /* the scroller is the inner <code>, never the page */
}
.wp-block-code > code,
.wp-block-preformatted {
	display: block;
	overflow-x: auto;
	overflow-y: hidden;
	padding: 0.9rem 1rem;
	white-space: pre;
	tab-size: 2;
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--micro);
	line-height: 1.7;
	color: var(--jsd-ink);
	background: none;
	border: 0;
	-webkit-overflow-scrolling: touch;
}
.wp-block-preformatted { padding: 0.9rem 1rem; }

/* Language badge for fenced blocks converted by migration/01 (see
   jasonslade_code_language_badge). Absent attribute → no badge. */
.wp-block-code[data-lang] { position: relative; }
.wp-block-code[data-lang]::before {
	content: attr(data-lang);
	position: absolute;
	inset-block-start: 0;
	inset-inline-end: 0;
	padding: 0.2rem 0.5rem;
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--jsd-ink-3);
	background: var(--jsd-surface);
	border-inline-start: 1px solid var(--jsd-rule);
	border-block-end: 1px solid var(--jsd-rule);
	pointer-events: none;
}

/* --- tables ------------------------------------------------------- */
.wp-block-table { margin-block: 2rem; max-width: 100%; }
.wp-block-table > table {
	border-collapse: collapse;
	width: 100%;
	background: var(--jsd-panel);
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.55;
}
.wp-block-table th,
.wp-block-table td {
	padding: 0.65rem 0.8rem;
	border: 1px solid var(--jsd-rule);
	text-align: start;
	vertical-align: top;
	color: var(--jsd-ink-2);
}
.wp-block-table thead th,
.wp-block-table tbody th {
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--jsd-ink-3);
	font-weight: 400;
	background: var(--jsd-surface);
	white-space: nowrap;
}
.wp-block-table figcaption {
	margin-top: 0.6rem;
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--label);
	line-height: 1.65;
	color: var(--jsd-ink-3);
}
/* Never let a table push the page sideways. */
.wp-block-table {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid var(--jsd-rule-strong);
}
.wp-block-table > table { min-width: 32rem; border: 0; }
.wp-block-table th:first-child,
.wp-block-table td:first-child { border-inline-start: 0; }
.wp-block-table th:last-child,
.wp-block-table td:last-child { border-inline-end: 0; }
.wp-block-table tr:first-child th,
.wp-block-table tr:first-child td { border-block-start: 0; }
.wp-block-table tr:last-child th,
.wp-block-table tr:last-child td { border-block-end: 0; }

/* --- figures / images --------------------------------------------- */
figure { margin-inline: 0; }
.wp-block-image { margin-block: 2rem; }
.wp-block-image img { display: block; border: 1px solid var(--jsd-rule); }
.wp-block-image.is-style-rounded img,
.wp-block-image .rounded { border-radius: 50%; }
/* Archived project clips (jasonslade/demo-clip). The <img> carries its own
   sizing inline; this just gives the figure room and keeps <picture> from
   introducing an inline-element baseline gap under the frame. */
.jsd-demo-clip { margin-block: 1.75rem; max-width: 46rem; }
.jsd-demo-clip picture { display: block; }

.wp-block-image figcaption,
.wp-block-embed figcaption {
	margin-top: 0.6rem;
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.02em;
	line-height: 1.65;
	color: var(--jsd-ink-3);
	max-width: var(--jsd-measure);
}

/* --- search form -------------------------------------------------- */
.wp-block-search__input,
input[type="search"],
input[type="text"],
input[type="email"] {
	font: inherit;
	font-size: var(--wp--preset--font-size--small);
	padding: 0.6rem 0.75rem;
	color: var(--jsd-ink);
	background: var(--jsd-panel);
	border: 1px solid var(--jsd-rule-strong);
	border-radius: 0;
	min-width: 0;
}
.wp-block-search__button {
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 0.6rem 1rem;
	border: 1px solid var(--jsd-ink);
	background: var(--jsd-ink);
	color: var(--jsd-bg);
	border-radius: 0;
	cursor: pointer;
}
.wp-block-search__button:hover { background: var(--jsd-ink-2); border-color: var(--jsd-ink-2); }
.wp-block-search .wp-block-search__label {
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--jsd-ink-3);
	margin-bottom: 0.5rem;
}

/* ------------------------------------------------------------------ *
   8 · REGISTERED BLOCK STYLES  (is-style-jsd-*)
   Every class the theme asks page content to carry is registered in
   functions.php, so it appears in the editor's Styles panel and none of
   them is an orphan.
 * ------------------------------------------------------------------ */

/* paragraph → instrument label */
.is-style-jsd-label {
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--label);
	line-height: 1.4;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--jsd-ink-3);
	font-variant-numeric: tabular-nums;
}

/* paragraph → lead / deck */
.is-style-jsd-lead {
	font-size: var(--wp--preset--font-size--lead);
	line-height: 1.5;
	color: var(--jsd-ink-2);
	max-width: min(58ch, 100%);
}
.is-style-jsd-lead strong { color: var(--jsd-ink); font-weight: 600; }

/* paragraph → footnote / caption under a block */
.is-style-jsd-note {
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.04em;
	line-height: 1.65;
	color: var(--jsd-ink-3);
	max-width: var(--jsd-measure);
}

/* group → panel (the workhorse: 1px rule, panel ground, no radius) */
.is-style-jsd-panel {
	border: 1px solid var(--jsd-rule-strong);
	background: var(--jsd-panel);
	padding: 1.15rem 1.25rem 1.35rem;
}
.is-style-jsd-panel > :first-child { margin-block-start: 0; }
.is-style-jsd-panel > :last-child { margin-block-end: 0; }
/* A leading label becomes the panel's header bar, as in the comp's card-bar. */
.is-style-jsd-panel > .is-style-jsd-label:first-child,
.is-style-jsd-panel-quiet > .is-style-jsd-label:first-child {
	border-block-end: 1px solid var(--jsd-rule);
	padding-block-end: 0.7rem;
	margin-block-end: 0.4rem;
}

/* group → hairline panel (secondary weight) */
.is-style-jsd-panel-quiet {
	border: 1px solid var(--jsd-rule);
	background: var(--jsd-surface);
	padding: 1.05rem 1.15rem 1.15rem;
}
.is-style-jsd-panel-quiet > :first-child { margin-block-start: 0; }
.is-style-jsd-panel-quiet > :last-child { margin-block-end: 0; }

/* group → section header: index rule + title + strapline */
.is-style-jsd-section-head {
	border-block-end: 1px solid var(--jsd-rule);
	padding-block-end: 1.25rem;
	margin-block-end: 2rem;
}
.is-style-jsd-section-head > * { margin-block: 0; }
.is-style-jsd-section-head > * + * { margin-block-start: 0.5rem; }
.is-style-jsd-section-head h2,
.is-style-jsd-section-head h3 { line-height: 1.18; }

/* group → hero split: statement column plus a record panel, as in the comp */
.is-style-jsd-hero {
	display: grid;
	gap: clamp(2rem, 4vw, 3.25rem);
	align-items: start;
	padding: 0;
}
.is-style-jsd-hero > * { margin-block: 0; }
@media (min-width: 60rem) {
	.is-style-jsd-hero { grid-template-columns: minmax(0, 1fr) 23rem; }
}

/* group → responsive grids. auto-fit means the same class serves a 2-up
   and a 4-up without a breakpoint per layout. */
.is-style-jsd-grid,
.is-style-jsd-split {
	display: grid;
	gap: 1.25rem;
	padding: 0;
}
.is-style-jsd-grid { grid-template-columns: repeat(auto-fit, minmax(19rem, 1fr)); }
/* Cards are containers so component styles inside them can adapt to the CARD's
   width, not the viewport's (a narrow card on a wide screen is the norm here). */
.is-style-jsd-grid > *,
.is-style-jsd-split > * { container-type: inline-size; }
.is-style-jsd-split { grid-template-columns: repeat(auto-fit, minmax(21rem, 1fr)); }
.is-style-jsd-grid > *,
.is-style-jsd-split > * { margin-block: 0; }

/* group → section band (a hairline above, air below) */
.is-style-jsd-band {
	border-top: 1px solid var(--jsd-rule-strong);
	padding-top: clamp(2.25rem, 5vw, 3.5rem);
	margin-top: clamp(2.5rem, 6vw, 4.5rem);
}
.is-style-jsd-band > :first-child { margin-block-start: 0; }

/* group → status/readout strip: equal cells divided by hairlines */
.is-style-jsd-readouts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
	gap: 1px;
	background: var(--jsd-rule);
	border: 1px solid var(--jsd-rule-strong);
	padding: 0;
}
/* A lone gauge must not stretch into a column-wide empty bezel. */
.is-style-jsd-readouts:has(> :only-child) { max-width: 18rem; }
.is-style-jsd-readouts > * {
	background: var(--jsd-panel);
	padding: 1rem 1.15rem 1.05rem;
	margin: 0;
}
.is-style-jsd-readout { margin: 0; }
.is-style-jsd-readout > * { margin-block: 0; }
.is-style-jsd-readout > .jsd-rv,
.is-style-jsd-readout > p:nth-child(2) {
	font-family: var(--jsd-ff-mono);
	font-size: clamp(1.5rem, 1.2rem + 1.1vw, 2.1rem);
	font-weight: 500;
	letter-spacing: -0.02em;
	line-height: 1.05;
	color: var(--jsd-ink);
	font-variant-numeric: tabular-nums;
	margin-block: 0.4rem 0.3rem;
}
.is-style-jsd-readout > p:nth-child(3) {
	font-size: var(--wp--preset--font-size--small);
	color: var(--jsd-ink-2);
}

/* list → chip row (technology tags) */
.is-style-jsd-chips {
	list-style: none;
	padding: 0;
	margin-block: 0.9rem 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem;
}
.is-style-jsd-chips li {
	margin: 0;
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--jsd-ink-2);
	border: 1px solid var(--jsd-rule);
	padding: 0.2rem 0.45rem;
	background: var(--jsd-surface);
	white-space: nowrap;
}

/* list → field register (mono spec lines) */
.is-style-jsd-fields {
	list-style: none;
	padding: 0;
	margin-block: 0.85rem 0;
	border-block-start: 1px solid var(--jsd-rule);
}
/* Each row is a two-column grid: the <strong> is the field name, everything
   after it is one anonymous grid item holding the value. */
.is-style-jsd-fields li {
	display: grid;
	grid-template-columns: minmax(0, 7.5rem) minmax(0, 1fr);
	gap: 0.2rem 0.9rem;
	align-items: baseline;
	margin: 0;
	padding-block: 0.55rem;
	border-block-end: 1px solid var(--jsd-rule);
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--micro);
	line-height: 1.55;
	color: var(--jsd-ink-2);
}
.is-style-jsd-fields li:last-child { border-block-end: 0; }
.is-style-jsd-fields li > strong:first-child {
	color: var(--jsd-ink-3);
	font-weight: 400;
	letter-spacing: 0.11em;
	text-transform: uppercase;
	font-size: var(--wp--preset--font-size--label);
	line-height: 1.7;
}
/* Only the first <strong> is the field name. Any later inline <em>/<strong>
   in the value would otherwise become its own grid item and wrap into the
   label column; display:contents dissolves their boxes back into the value's
   anonymous run (their italic/bold still applies through inheritance). */
.is-style-jsd-fields li > em,
.is-style-jsd-fields li > strong:not(:first-child) { display: contents; }
@media (max-width: 26rem) {
	.is-style-jsd-fields li { grid-template-columns: minmax(0, 1fr); }
}
/* Same collapse when the COMPONENT is narrow (a field register inside a card
   on a wide viewport) — the viewport query above can't see that. */
@container (max-width: 26rem) {
	.is-style-jsd-fields li { grid-template-columns: minmax(0, 1fr); gap: 0.1rem 0.9rem; }
}

/* table → instrument table (numeric, tabular, mono) */
.is-style-jsd-instrument > table {
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--micro);
	font-variant-numeric: tabular-nums;
}

/* table → comparison ("same discipline, two scales")
   The thesis device grafted from direction C: identical row labels,
   two columns, no visual demotion of either side. */
.is-style-jsd-compare > table { min-width: 34rem; }
.is-style-jsd-compare tbody th {
	width: 1%;
	white-space: nowrap;
	color: var(--jsd-ink);
	background: var(--jsd-surface);
}
.is-style-jsd-compare thead th {
	color: var(--jsd-ink);
	background: var(--jsd-surface);
	white-space: normal;
}
/* The row-label column is as narrow as its labels; the two compared columns
   split the rest evenly, so neither reads as the primary one. */
.is-style-jsd-compare thead th:first-child { width: 1%; }
.is-style-jsd-compare thead th + th { width: 45%; }
.is-style-jsd-compare td { color: var(--jsd-ink-2); }
@media (max-width: 32.5rem) {
	.is-style-jsd-compare tbody th { white-space: normal; }
}

/* paragraph → status line with an 8px state indicator */
.is-style-jsd-status-ok,
.is-style-jsd-status-warn {
	display: inline-flex;
	align-items: center;
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.1em;
	text-transform: uppercase;
}
.is-style-jsd-status-ok::before,
.is-style-jsd-status-warn::before {
	content: "";
	display: inline-block;
	inline-size: 0.5rem;
	block-size: 0.5rem;
	flex: 0 0 auto;
	border: 1px solid currentColor;
	background: currentColor;
	margin-inline-end: 0.5rem;
}
.is-style-jsd-status-ok { color: var(--jsd-ok); }
.is-style-jsd-status-warn { color: var(--jsd-warn); }

/* separator → hairline only, no air */
.is-style-jsd-hairline { margin-block: 1.25rem; border-top-color: var(--jsd-rule); }

/* ------------------------------------------------------------------ *
   9 · READING VIEW — single post
   Grafted from direction B: bigger reading size, generous leading, a
   strict measure. The instrument chrome frames the prose; it does not
   gridify it.
 * ------------------------------------------------------------------ */
.jsd-article { min-width: 0; }

.jsd-article-head {
	border-block-end: 1px solid var(--jsd-rule);
	padding-block-end: 1.35rem;
	margin-block-end: 1.75rem;
}
.jsd-article-head > * { margin-block: 0; }
.jsd-article-head > * + * { margin-block-start: 0.75rem; }
.jsd-article-head .wp-block-post-title {
	font-size: clamp(1.6rem, 1.15rem + 1.9vw, 2.5rem);
	max-width: 24ch;
}

/* post meta row — mono instrument readout */
.jsd-postmeta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem 0.75rem;
	align-items: baseline;
}
/* Divide the rail's items the way the rest of the chrome does. */
.jsd-postmeta > * + *::before {
	content: "·";
	color: var(--jsd-rule-strong);
	margin-inline-end: 0.75rem;
}
.jsd-postmeta > *,
.jsd-postmeta .wp-block-post-date,
.jsd-postmeta .wp-block-post-terms,
.jsd-postmeta .wp-block-post-author-name {
	margin: 0;
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.11em;
	text-transform: uppercase;
	color: var(--jsd-ink-3);
	font-variant-numeric: tabular-nums;
}
.jsd-postmeta a { color: var(--jsd-ink-2); text-decoration: none; }
.jsd-postmeta a:hover { color: var(--jsd-ink); text-decoration: underline; }

/* compact series marker inside post lists */
.jsd-series-tag {
	border: 1px solid var(--jsd-rule);
	background: var(--jsd-surface);
	padding: 0.1rem 0.4rem;
	color: var(--jsd-ink-2);
}

/* the prose itself */
.jsd-prose {
	font-size: var(--wp--preset--font-size--reading);
	line-height: 1.72;
}
.jsd-prose > * { max-width: var(--jsd-measure); }
.jsd-prose > p { margin-block: 0 1.3rem; }
.jsd-prose > p:first-of-type {
	font-size: var(--wp--preset--font-size--lead);
	line-height: 1.55;
	color: var(--jsd-ink);
}
.jsd-prose > h2 {
	font-size: clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem);
	margin-block: 2.5rem 0.85rem;
}
.jsd-prose > h3 { margin-block: 2rem 0.75rem; }
.jsd-prose > h4 { margin-block: 1.75rem 0.6rem; }
.jsd-prose strong { font-weight: 650; color: var(--jsd-ink); }
.jsd-prose em { font-style: italic; }
.jsd-prose > ul,
.jsd-prose > ol { margin-block: 0 1.3rem; }
.jsd-prose > .wp-block-image,
.jsd-prose > figure,
.jsd-prose > .wp-block-code,
.jsd-prose > .wp-block-preformatted,
.jsd-prose > .wp-block-table,
.jsd-prose > .wp-block-embed { max-width: 100%; }
.jsd-prose > .wp-block-separator { max-width: var(--jsd-measure); }

/* featured image above the prose */
.jsd-hero-figure { margin-block: 0 2rem; }
.jsd-hero-figure img {
	width: 100%;
	border: 1px solid var(--jsd-rule-strong);
	background: var(--jsd-surface);
}

/* --- series banner + pager (jasonslade/series-nav) ---------------- */
.jsd-series {
	border: 1px solid var(--jsd-rule-strong);
	background: var(--jsd-surface);
	margin-block-end: 1.75rem;
}
.jsd-series-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem 1rem;
	padding: 0.55rem 0.85rem;
	border-block-end: 1px solid var(--jsd-rule);
	background: var(--jsd-panel);
}
.jsd-series-title {
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--jsd-ink);
	margin: 0;
}
.jsd-series-title a { color: inherit; text-decoration: none; }
.jsd-series-title a:hover { text-decoration: underline; }
.jsd-series-progress {
	display: flex;
	gap: 3px;
	list-style: none;
	margin: 0;
	padding: 0.6rem 0.85rem 0.85rem;
}
.jsd-series-progress li {
	flex: 1 1 0;
	block-size: 0.4rem;
	border: 1px solid var(--jsd-rule-strong);
	background: transparent;
	margin: 0;
}
.jsd-series-progress li.is-done { background: var(--jsd-ink-3); border-color: var(--jsd-ink-3); }
.jsd-series-progress li.is-current { background: var(--jsd-ok); border-color: var(--jsd-ok); }

.jsd-series-pager {
	display: grid;
	gap: 1px;
	background: var(--jsd-rule);
	border: 1px solid var(--jsd-rule-strong);
	margin-block: 2.5rem 0;
}
@media (min-width: 34rem) {
	.jsd-series-pager { grid-template-columns: 1fr 1fr; }
}
.jsd-series-pager a,
.jsd-series-pager span {
	display: block;
	padding: 0.9rem 1rem;
	background: var(--jsd-panel);
	text-decoration: none;
	color: var(--jsd-ink);
}
.jsd-series-pager .jsd-dir {
	display: block;
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: var(--jsd-ink-3);
	margin-block-end: 0.35rem;
}
.jsd-series-pager .jsd-t { font-size: var(--wp--preset--font-size--small); line-height: 1.45; }
.jsd-series-pager a:hover .jsd-t { text-decoration: underline; }
.jsd-series-pager .is-next { text-align: end; }
.jsd-series-pager span.is-empty { color: var(--jsd-ink-3); }
/* The dead cell must not impersonate a link: mute BOTH inner spans (the title
   span otherwise wins the cascade back to --jsd-ink) and demote the
   placeholder sentence from title size to label size. */
.jsd-series-pager .is-empty,
.jsd-series-pager .is-empty .jsd-t { color: var(--jsd-ink-3); }
.jsd-series-pager .is-empty .jsd-t {
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.06em;
}

/* --- article footer ---------------------------------------------- */
.jsd-article-foot {
	margin-block-start: 2.5rem;
	padding-block-start: 1.25rem;
	border-block-start: 1px solid var(--jsd-rule);
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem 1.5rem;
	justify-content: space-between;
	align-items: center;
}
.jsd-article-foot p { margin: 0; }

/* ------------------------------------------------------------------ *
   10 · POST LISTS, ARCHIVES, SERIES HUB, SEARCH, 404
 * ------------------------------------------------------------------ */
/* The list rules live on core's <li> wrapper, not on the inner group — putting
   them on both draws every separator twice. */
.jsd-postlist { list-style: none; margin: 0; padding: 0; }
.jsd-postlist > li {
	margin: 0;
	padding-block: 1.35rem;
	border-block-end: 1px solid var(--jsd-rule);
}
.jsd-postlist > li:first-child { border-block-start: 1px solid var(--jsd-rule); }
/* The block after the list (pagination / article foot) opens with its own
   hairline — a border on the last row too would draw a double rule with a
   dead band between them. */
.jsd-postlist > li:last-child { border-block-end: 0; }
.jsd-entry { margin: 0; max-width: 42rem; }
.jsd-entry > * { margin-block: 0; }
.jsd-entry > * + * { margin-block-start: 0.5rem; }
.jsd-entry .wp-block-post-title {
	font-size: clamp(1.125rem, 1rem + 0.7vw, 1.4rem);
	letter-spacing: -0.015em;
	line-height: 1.25;
}
.jsd-entry .wp-block-post-title a { color: var(--jsd-ink); text-decoration: none; }
.jsd-entry .wp-block-post-title a:hover { text-decoration: underline; }
.jsd-entry .wp-block-post-excerpt__excerpt {
	font-size: var(--wp--preset--font-size--small);
	color: var(--jsd-ink-2);
	line-height: 1.65;
	max-width: var(--jsd-measure);
	margin: 0;
}
.jsd-entry .wp-block-post-excerpt { margin: 0; }
.jsd-entry .wp-block-post-excerpt__more-text { margin-top: 0.5rem; }
.jsd-entry .wp-block-post-excerpt__more-link {
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

/* pagination */
.wp-block-query-pagination {
	margin-block-start: 2.5rem;
	padding-block-start: 1.25rem;
	border-block-start: 1px solid var(--jsd-rule-strong);
	gap: 0.35rem;
	align-items: center;
}
.wp-block-query-pagination a,
.wp-block-query-pagination .page-numbers {
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	padding: 0.4rem 0.7rem;
	border: 1px solid var(--jsd-rule);
	color: var(--jsd-ink-2);
}
.wp-block-query-pagination a:hover { border-color: var(--jsd-ink-3); color: var(--jsd-ink); }
.wp-block-query-pagination .page-numbers.current {
	border-color: var(--jsd-rule-strong);
	background: var(--jsd-panel);
	color: var(--jsd-ink);
}
.wp-block-query-pagination .page-numbers.dots { border-color: transparent; }

.wp-block-query-no-results { color: var(--jsd-ink-2); }

/* series hub — numbered entry register */
.jsd-series-index { list-style: none; margin: 0; padding: 0; border-block-start: 1px solid var(--jsd-rule-strong); }
.jsd-series-index li {
	display: grid;
	grid-template-columns: 3.25rem minmax(0, 1fr);
	gap: 0.35rem 0.85rem;
	align-items: baseline;
	margin: 0;
	padding-block: 0.95rem;
	border-block-end: 1px solid var(--jsd-rule);
}
.jsd-series-index li:last-child { border-block-end: 0; }
.jsd-series-index .jsd-n {
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.1em;
	color: var(--jsd-ink-3);
	font-variant-numeric: tabular-nums;
}
.jsd-series-index .jsd-e-title { font-size: var(--wp--preset--font-size--large); line-height: 1.3; font-weight: 600; }
.jsd-series-index .jsd-e-title a { color: var(--jsd-ink); text-decoration: none; }
.jsd-series-index .jsd-e-title a:hover { text-decoration: underline; }
.jsd-series-index .jsd-e-meta {
	grid-column: 2;
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--jsd-ink-3);
}
.jsd-series-index li[aria-current="true"] .jsd-e-title { color: var(--jsd-ink); }
.jsd-series-index .jsd-pending { color: var(--jsd-ink-3); }
.jsd-series-index .jsd-pending .jsd-e-title { font-weight: 500; color: var(--jsd-ink-3); }

/* 404 / search intro */
.jsd-notice {
	border: 1px solid var(--jsd-rule-strong);
	background: var(--jsd-panel);
	padding: 1.35rem 1.35rem 1.5rem;
}
.jsd-notice > :first-child { margin-block-start: 0; }
.jsd-notice > :last-child { margin-block-end: 0; }

/* archive/search page headers */
.jsd-page-head { margin-block-end: clamp(1.75rem, 4vw, 2.5rem); }
.jsd-page-head > * { margin-block: 0; }
.jsd-page-head > * + * { margin-block-start: 0.65rem; }
/* A display-size H1's descenders need more air before the dek than the
   eyebrow needs above the H1 — not less. */
.jsd-page-head > :is(h1, .wp-block-query-title) + * { margin-block-start: 1.1rem; }
.jsd-page-head .wp-block-query-title,
.jsd-page-head h1 { max-width: 26ch; }
.jsd-page-head .wp-block-term-description p {
	font-size: var(--wp--preset--font-size--small);
	color: var(--jsd-ink-2);
	max-width: var(--jsd-measure);
}

/* ------------------------------------------------------------------ *
   11 · EDITOR CORRECTIONS
   The editor canvas has no <body class="wp-site-blocks">; re-state the
   few rules that hang off page chrome so the editor matches the front.
 * ------------------------------------------------------------------ */
.editor-styles-wrapper {
	background: var(--jsd-bg);
	color: var(--jsd-ink);
}
.editor-styles-wrapper .jsd-main {
	padding-block: 0;
	min-height: 0;
}
.editor-styles-wrapper .wp-block-code > code { white-space: pre-wrap; }

/* Placeholders for the theme's three dynamic blocks. */
.jsd-editor-placeholder {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem 1rem;
	align-items: baseline;
	border: 1px dashed var(--jsd-rule-strong);
	background: var(--jsd-surface);
	padding: 0.85rem 1rem;
	font-family: var(--jsd-ff-mono);
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--jsd-ink-3);
}
.jsd-editor-placeholder b { color: var(--jsd-ink-2); font-weight: 400; }

/* ------------------------------------------------------------------ *
   12 · SCREEN CAPTURES
   Grids of stills read off a device's own framebuffer — the XREAL
   glasses' HDMI display, not a simulator. Each figure captions itself
   because each shot shows a different subsystem, so they cannot share
   one caption. Auto-fit keeps two-up on a desktop and one-up on a
   phone without a media query.
 * ------------------------------------------------------------------ */
.jsd-shots { margin-block: 1.25rem; }
.jsd-shots > .is-style-jsd-label { margin-block-end: 0.75rem; }

.jsd-shots-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr));
	gap: clamp(0.75rem, 2vw, 1.25rem);
}

.jsd-shots figure { margin: 0; }

.jsd-shots img {
	display: block;
	width: 100%;
	height: auto;
	border: 1px solid var(--jsd-rule);
	border-radius: 10px;
	/* The glasses render on black; matching it hides letterboxing seams. */
	background: #000;
}

.jsd-shots figcaption { margin-block-start: 0.5rem; }
.jsd-shots-provenance { margin-block-start: 0.85rem; }

/* ------------------------------------------------------------------ *
   13 · REDUCED MOTION
   The theme animates nothing by default; this removes even the
   colour transitions on interactive chrome, and stops smooth scroll.
 * ------------------------------------------------------------------ */
a,
button,
.wp-block-button__link,
.jsd-nav a,
.jsd-btn-bar {
	transition: background-color 0.12s linear, border-color 0.12s linear, color 0.12s linear;
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition: none !important;
		animation: none !important;
		scroll-behavior: auto !important;
	}
	html { scroll-behavior: auto !important; }
}

/* ------------------------------------------------------------------ *
   PRINT — the dossier, on paper
 * ------------------------------------------------------------------ */
@media print {
	:root { --jsd-bg: #fff; --jsd-panel: #fff; --jsd-surface: #fff; --jsd-ink: #000; --jsd-ink-2: #222; --jsd-ink-3: #444; }
	header.wp-block-template-part,
	.jsd-navtoggle,
	.jsd-themetoggle,
	.jsd-series-pager { display: none !important; }
	.jsd-main { max-width: none; padding: 0; }
}

/* ------------------------------------------------------------------ *
   14 · RENDERED FIGURES — diagrams & charts in post bodies
   Ported from the July branch (34e1897) and re-tokenized for both
   schemes. The mermaid SVGs reference the same tokens from their own
   <style> blocks (inline SVG inherits custom properties); the 24-h
   dial carries its own dark plate and needs nothing from us.
 * ------------------------------------------------------------------ */
.jsd-figure {
	margin: 2rem 0;
	padding: 1.5rem 1.25rem 1.25rem;
	background: var(--jsd-surface);
	border: 1px solid var(--jsd-rule);
	border-radius: 4px;
	overflow-x: auto;
}
.jsd-figure svg { display: block; max-width: 100%; height: auto; margin: 0 auto; }
.jsd-figcap {
	font-family: var(--jsd-ff-mono);
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--jsd-ink-3);
	text-align: center;
	margin: 0 0 1.1rem;
}
.jsd-figcap::before { content: "◇ "; color: var(--jsd-link); }
.jsd-figcap-prose {
	font-size: 0.85rem;
	line-height: 1.6;
	color: var(--jsd-ink-3);
	text-align: center;
	max-width: 46rem;
	margin: 1rem auto 0;
	font-style: italic;
}
.jsd-diagram svg { max-width: 100%; height: auto; }

/* Grouped bar chart (pure CSS, no library). Scoped under .jsd-chart-figure:
   the nav toggle owns the bare `.jsd-bars` name for its hamburger glyph. */
.jsd-chart-figure .jsd-bars-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 1.25rem; margin-bottom: 1rem; }
.jsd-chart-figure .jsd-bars-key { display: inline-flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; color: var(--jsd-ink-2); }
.jsd-chart-figure .jsd-bars-key i { width: 12px; height: 12px; border-radius: 2px; display: inline-block; }
.jsd-chart-figure .jsd-bars { display: flex; align-items: stretch; gap: 0.5rem; }
.jsd-chart-figure .jsd-bars-ylab {
	writing-mode: vertical-rl; transform: rotate(180deg);
	font-family: var(--jsd-ff-mono); font-size: 10px; letter-spacing: 0.08em;
	color: var(--jsd-ink-3); text-transform: uppercase;
	align-self: center; padding-right: 0.25rem;
}
.jsd-chart-figure .jsd-bars-plot { position: relative; flex: 1; height: var(--plot); border-left: 1px solid var(--jsd-rule-strong); border-bottom: 1px solid var(--jsd-rule-strong); }
.jsd-chart-figure .jsd-bars-grid { position: absolute; left: 0; right: 0; border-top: 1px dashed var(--jsd-rule); }
.jsd-chart-figure .jsd-bars-grid span { position: absolute; left: -2.1rem; top: -0.6em; font-family: var(--jsd-ff-mono); font-size: 9px; color: var(--jsd-ink-3); }
.jsd-chart-figure .jsd-bars-groups { position: absolute; inset: 0; display: flex; justify-content: space-around; align-items: flex-end; padding: 0 0.5rem; }
.jsd-chart-figure .jsd-bars-group { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; flex: 1; }
.jsd-chart-figure .jsd-bars-set { display: flex; align-items: flex-end; justify-content: center; gap: 8px; height: var(--plot); }
.jsd-chart-figure .jsd-bar { width: 34px; border-radius: 2px 2px 0 0; position: relative; transition: filter .2s; }
.jsd-chart-figure .jsd-bar:hover { filter: brightness(1.15); }
.jsd-chart-figure .jsd-bar-val { position: absolute; top: -1.25rem; left: 50%; transform: translateX(-50%); font-family: var(--jsd-ff-mono); font-size: 10px; color: var(--jsd-ink); white-space: nowrap; }
.jsd-chart-figure .jsd-bars-xlab { font-size: 0.8rem; color: var(--jsd-ink-2); text-align: center; }
.jsd-chart-figure .jsd-bars-xaxis { font-family: var(--jsd-ff-mono); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--jsd-ink-3); text-align: center; margin-top: 0.6rem; padding-left: 1.5rem; }
@media (max-width: 560px) {
	.jsd-chart-figure .jsd-bar { width: 22px; }
	.jsd-chart-figure .jsd-bars-group { gap: 0.35rem; }
}

/* CLI flags inside chips are wrapped in <code> purely to defeat wptexturize's
   `--` → en-dash conversion; visually they must stay plain chip text. */
.is-style-jsd-chips li code {
	background: none;
	border: 0;
	padding: 0;
	font: inherit;
	color: inherit;
	letter-spacing: inherit;
}

/* Live-readout process states — a value rendered against its limits. */
.is-style-jsd-readout > .jsd-readout-val.is-ok { color: var(--jsd-ok); }
.is-style-jsd-readout > .jsd-readout-val.is-warn { color: var(--jsd-warn); }
.is-style-jsd-readout > .jsd-readout-val.is-alarm { color: var(--jsd-alarm); }

/* ------------------------------------------------------------------ *
   15 · ROUND-3 POLISH (design review 2026-08-16)
 * ------------------------------------------------------------------ */

/* Plain lists in page bodies get the register's dash, not the browser disc —
   the only unstyled marker left in the theme. Styled jsd-* lists opt out. */
.jsd-pagebody ul:not([class*="is-style-jsd-"]):not(.wp-block-list ul) {
	list-style: none;
	padding-inline-start: 1.2rem;
}
.jsd-pagebody ul:not([class*="is-style-jsd-"]) > li { position: relative; }
.jsd-pagebody ul:not([class*="is-style-jsd-"]) > li::before {
	content: "—";
	position: absolute;
	inset-inline-start: -1.2rem;
	color: var(--jsd-ink-3);
	font-family: var(--jsd-ff-mono);
}

/* Contact channel cards: pin each card's CTA to a shared baseline. Scoped to
   the contact page — flex kills margin-collapse, so keep it local. */
.page-id-108 .jsd-pagebody .is-style-jsd-panel,
.page-id-108 .jsd-pagebody .is-style-jsd-panel-quiet {
	display: flex;
	flex-direction: column;
}
.page-id-108 .jsd-pagebody .is-style-jsd-panel > :last-child,
.page-id-108 .jsd-pagebody .is-style-jsd-panel-quiet > :last-child {
	margin-block-start: auto;
	padding-block-start: 0.75rem;
}

/* Touch targets: the two most-used controls and the footer link rows must
   clear 44px on touch layouts. */
@media (max-width: 47.99rem) {
	.jsd-btn-bar { min-height: 44px; }
	.jsd-foot-grid li a { display: block; padding-block: 0.55rem; }
}

/* 404/search "where to go" lists: their items already lead with a link and an
   inline em-dash, so they are registers, not bullet lists — drop the disc. */
.error404 ul.wp-block-list,
.search ul.wp-block-list {
	list-style: none;
	padding-inline-start: 0;
}
.error404 ul.wp-block-list > li,
.search ul.wp-block-list > li { margin-block: 0.45rem; }