/**
 * The glossary (S012; docs/14-DETAILED-PAGES.md §18.5, 02 §7.28 "Glossary", 10 §4.17): the hero's "Look up a term"
 * column, the "Start here" tiles, the A–Z list with its tools and the term cards. Render-blocking on /glossary/ only
 * (its hero column is on the first screen; themes/mainland/inc/glossary.php). The diagrams band has its own file
 * (glossary-diagrams.css, loaded without blocking) and the guides' popover another (glossary-pop.css).
 *
 * Without JavaScript everything here is a plain, complete page; glossary.js adds .is-live to the list band. Layout that
 * differs with the script is keyed to the scripting media feature, so it is right from the first paint (CLS 0).
 */

/* 1. The hero's right column: "Look up a term" and the anatomy teaser, on glass ------------------------------------ */

.mn-gl-hero { display: grid; gap: 14px; }
.mn-gl-hero__card {
	position: relative;
	display: grid;
	gap: 14px;
	padding: 20px 22px 22px;
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: var(--wp--custom--radius--lg);
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02));
	box-shadow: var(--wp--preset--shadow--deep);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	color: var(--wp--preset--color--on-dark-2);
}
.mn-gl-hero__find { border-color: rgba(var(--wp--custom--cyan-rgb), 0.35); }
.mn-gl-hero__label {
	color: var(--wp--preset--color--cyan-300);
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: var(--wp--custom--tracking--label);
	line-height: 1.3;
	text-transform: uppercase;
}
.mn-gl-hero__field { display: flex; gap: 8px; }
.mn-gl-hero__input {
	box-sizing: border-box;
	flex: 1;
	min-inline-size: 0;
	min-block-size: var(--wp--custom--target--button);
	padding: 0 14px;
	border: 1px solid rgba(255, 255, 255, 0.24);
	border-radius: var(--wp--custom--radius--sm);
	background: rgba(var(--wp--custom--ink-rgb), 0.55);
	color: var(--wp--preset--color--white);
	font: inherit;
	font-size: max(16px, var(--wp--preset--font-size--medium));
}
.mn-gl-hero__input::placeholder { color: var(--wp--preset--color--on-dark-3); opacity: 1; }
.mn-gl-hero__input:hover { border-color: rgba(255, 255, 255, 0.5); }
.mn-gl-hero__input:focus-visible {
	border-color: var(--wp--preset--color--cyan);
	outline: 2px solid transparent;
	box-shadow: 0 0 0 3px rgba(var(--wp--custom--cyan-rgb), 0.35);
}
.mn-gl-hero__go {
	display: grid;
	flex: none;
	place-items: center;
	inline-size: var(--wp--custom--target--button);
	block-size: var(--wp--custom--target--button);
	padding: 0;
	border: 0;
	border-radius: var(--wp--custom--radius--sm);
	background: var(--wp--preset--color--cyan);
	box-shadow: var(--wp--preset--shadow--glow);
	color: var(--wp--preset--color--ink-1);
	cursor: pointer;
	transition: background-color var(--wp--custom--motion--micro) var(--wp--custom--motion--ease);
}
.mn-gl-hero__go:hover { background: var(--wp--preset--color--cyan-hover); }
.mn-gl-hero__go .mn-icon { inline-size: 20px; block-size: 20px; }
.mn-gl-hero__try { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.mn-gl-hero__try-label { color: var(--wp--preset--color--on-dark-3); font-size: var(--wp--preset--font-size--small); }
.mn-gl-hero__try-list { display: flex; flex-wrap: wrap; gap: 4px 6px; margin: 0; padding: 0; list-style: none; }
.mn-gl-hero__try-link {
	display: inline-flex;
	align-items: center;
	min-block-size: var(--wp--custom--target--min);
	padding: 0 12px;
	border-radius: var(--wp--custom--radius--pill);
	color: var(--wp--preset--color--white);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	text-decoration: none;
	background: linear-gradient(rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.07)) center / 100% 32px no-repeat;
	transition: color var(--wp--custom--motion--micro) var(--wp--custom--motion--ease);
}
.mn-gl-hero__try-link:hover { color: var(--wp--preset--color--cyan-300); }
.mn-gl-hero__teaser { color: inherit; text-decoration: none; transition: border-color var(--wp--custom--motion--ui) var(--wp--custom--motion--ease), transform var(--wp--custom--motion--ui) var(--wp--custom--motion--ease); }
.mn-gl-hero__teaser:hover { border-color: rgba(var(--wp--custom--cyan-rgb), 0.5); transform: translateY(-2px); }
.mn-gl-hero__art {
	display: block;
	inline-size: 100%;
	block-size: auto;
	overflow: visible;
	color: var(--wp--preset--color--white);
	fill: none;
	stroke: currentColor;
	stroke-width: 1.75;
	stroke-linecap: round;
	stroke-linejoin: round;
}
.mn-gl-hero__art :is(path, rect, circle) { vector-effect: non-scaling-stroke; }
.mn-gl-hero__art .mn-gla__box { fill: rgba(var(--wp--custom--cyan-rgb), 0.06); stroke: var(--wp--preset--color--cyan-300); stroke-dasharray: 7 6; }
.mn-gl-hero__art .mn-gla__ribs { stroke: rgba(var(--wp--custom--cyan-rgb), 0.22); }
.mn-gl-hero__art .mn-gla__doors { stroke: var(--wp--preset--color--cyan-300); opacity: 0.6; }
.mn-gl-hero__art .mn-gla__fine { opacity: 0.35; }
.mn-gl-hero__art .mn-gla__lamp { fill: var(--wp--preset--color--led-amber); stroke: none; }
.mn-gl-hero__art :is(.mn-gla__part--corner-casting, .mn-gla__part--twist-lock) { color: var(--wp--preset--color--cyan-300); }
.mn-gl-hero__art .mn-gla__ground { stroke: rgba(255, 255, 255, 0.2); }
.mn-gl-hero__dot { fill: var(--wp--preset--color--cyan); stroke: var(--wp--preset--color--ink-1); stroke-width: 3; transform-box: fill-box; transform-origin: center; }
.mn-gl-hero__more { display: inline-flex; align-items: center; gap: 8px; color: var(--wp--preset--color--cyan-300); font-size: var(--wp--custom--font-size--ui); font-weight: 600; }
.mn-gl-hero__more .mn-icon { inline-size: 18px; block-size: 18px; transition: transform var(--wp--custom--motion--micro) var(--wp--custom--motion--ease); }
.mn-gl-hero__teaser:hover .mn-gl-hero__more .mn-icon { transform: translateX(3px); }
@media (prefers-reduced-motion: no-preference) {
	/* Two pulses each, all done within five seconds of load (WCAG 2.2.2). */
	.mn-gl-hero__dot { animation: mn-gl-ping 1.6s var(--wp--custom--motion--ease-out) 2; }
	.mn-gl-hero__dot--2 { animation-delay: 0.5s; }
	.mn-gl-hero__dot--3 { animation-delay: 1s; }
}
@keyframes mn-gl-ping {
	0%, 60%, 100% { transform: scale(1); filter: drop-shadow(0 0 0 rgba(var(--wp--custom--cyan-rgb), 0)); }
	20% { transform: scale(1.35); filter: drop-shadow(0 0 6px rgba(var(--wp--custom--cyan-rgb), 0.9)); }
}
/* On phones the search stays and the teaser goes (the diagrams are a scroll away), and of the hero's two buttons only
   "Browse A to Z" stays, so the search card is close to the top. */
@media (max-width: 959px) {
	.mn-gl-hero__teaser { display: none; }
	.mn-page-hero--aside:has(.mn-gl-hero) .mn-page-hero__actions > .mn-btn--glass { display: none; }
}

/* 2. "Start here": the tiles ------------------------------------------------------------------------------------- */

.mn-gl-tiles {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr));
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.mn-gl-tile { display: flex; min-inline-size: 0; }
.mn-gl-tiles a.mn-gl-tile__link {
	position: relative;
	box-sizing: border-box;
	display: grid;
	grid-template-rows: auto auto 1fr auto;
	gap: 10px;
	inline-size: 100%;
	padding: 22px 22px 18px;
	overflow: hidden;
	border: 1px solid var(--mn-rule);
	border-radius: var(--wp--custom--radius--md);
	background: var(--wp--preset--color--white);
	box-shadow: var(--mn-shadow-card);
	color: var(--mn-text);
	text-decoration: none;
	transition:
		transform var(--wp--custom--motion--ui) var(--wp--custom--motion--ease),
		box-shadow var(--wp--custom--motion--ui) var(--wp--custom--motion--ease),
		border-color var(--wp--custom--motion--ui) var(--wp--custom--motion--ease);
}
.mn-gl-tiles a.mn-gl-tile__link::before {
	content: "";
	position: absolute;
	inset-inline: 0;
	inset-block-start: 0;
	block-size: 3px;
	background: var(--wp--preset--color--cyan);
	transform: scaleX(0);
	transform-origin: 0 50%;
	transition: transform var(--wp--custom--motion--panel) var(--wp--custom--motion--ease-out);
}
.mn-gl-tiles a.mn-gl-tile__link:hover { border-color: var(--mn-rule-2); box-shadow: var(--mn-shadow-lift); transform: translateY(-3px); }
.mn-gl-tiles a.mn-gl-tile__link:is(:hover, :focus-visible)::before { transform: scaleX(1); }
.mn-gl-tile__cat {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--mn-text-muted);
	font-size: var(--wp--custom--font-size--micro);
	font-weight: 600;
	letter-spacing: var(--wp--custom--tracking--label);
	line-height: 1.3;
	text-transform: uppercase;
}
.mn-gl-tile__cat .mn-icon { flex: none; inline-size: 18px; block-size: 18px; color: var(--mn-link); }
.mn-gl-tile__name {
	color: var(--mn-text-strong);
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 800;
	letter-spacing: var(--wp--custom--tracking--title);
	line-height: var(--wp--custom--line-height--title);
}
.mn-gl-tile__def {
	display: -webkit-box;
	align-self: start; /* Never stretched by a taller neighbour, so the clamp holds at four lines. */
	color: var(--mn-text);
	overflow: hidden;
	font-size: var(--wp--custom--font-size--ui);
	line-height: 1.5;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
	line-clamp: 4;
}
.mn-gl-tile__go { display: inline-flex; align-items: center; gap: 6px; color: var(--mn-link); font-size: var(--wp--custom--font-size--ui); font-weight: 600; }
.mn-gl-tile__go .mn-icon { inline-size: 18px; block-size: 18px; transition: transform var(--wp--custom--motion--micro) var(--wp--custom--motion--ease); }
.mn-gl-tile__link:hover .mn-gl-tile__go .mn-icon { transform: translateX(3px); }

/* Phones: two compact tiles a row (the whole tile is the link), so eight terms take two screens, not eight. */
@media (max-width: 599px) {
	.mn-gl-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	.mn-gl-tiles a.mn-gl-tile__link { gap: 6px; padding: 14px 14px 12px; }
	.mn-gl-tile__cat span { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
	.mn-gl-tile__name { font-size: var(--wp--preset--font-size--large); }
	.mn-gl-tile__def { font-size: var(--wp--preset--font-size--small); -webkit-line-clamp: 3; line-clamp: 3; }
	.mn-gl-tile__go { display: none; }
}

/* 3. The A–Z band: layout ---------------------------------------------------------------------------------------- */

.mn-gl { interpolate-size: allow-keywords; }
.mn-gl [hidden] { display: none !important; }
.mn-gl__layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; align-items: start; }
.mn-gl__main { min-inline-size: 0; }
.mn-gl__tools > *,
.mn-gl__main > * { margin-block: 0; }
.mn-gl-tools__label {
	margin: 0 0 10px;
	padding: 0;
	color: var(--mn-text-muted);
	font-size: var(--wp--custom--font-size--micro);
	font-weight: 600;
	letter-spacing: var(--wp--custom--tracking--label);
	line-height: 1.3;
	text-transform: uppercase;
}

/* Desktop: the tools in a sticky column on the left, the list on the right. */
@media (min-width: 1100px) {
	.mn-gl__layout { grid-template-columns: minmax(0, 19rem) minmax(0, 1fr); gap: 56px; }
	.mn-gl__tools {
		position: sticky;
		inset-block-start: calc(var(--mn-sticky-top) + 24px);
		box-sizing: border-box;
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		gap: 22px;
		max-block-size: calc(100vh - var(--mn-sticky-top) - 48px);
		max-block-size: calc(100dvh - var(--mn-sticky-top) - 48px);
		overflow-y: auto;
		overscroll-behavior: contain;
		padding: 22px 20px;
		border: 1px solid var(--mn-rule);
		border-radius: var(--wp--custom--radius--lg);
		background: var(--wp--preset--color--paper);
		scrollbar-width: thin;
	}
}

/* 4. Search ---------------------------------------------------------------------------------------------------- */

.mn-gl-find { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; margin: 0; }
.mn-gl-find__label { display: block; margin-block-end: -12px; color: var(--mn-text-strong); font-size: var(--wp--custom--font-size--ui); font-weight: 600; }
.mn-gl-find__field { position: relative; display: flex; gap: 8px; }
.mn-gl-find__icon {
	position: absolute;
	inset-block-start: 50%;
	inset-inline-start: 14px;
	inline-size: 20px;
	block-size: 20px;
	color: var(--mn-text-muted);
	transform: translateY(-50%);
	pointer-events: none;
}
.mn-gl-find__input {
	box-sizing: border-box;
	flex: 1;
	inline-size: 100%;
	min-inline-size: 0;
	min-block-size: var(--wp--custom--target--button);
	padding: 0 48px 0 44px;
	border: 1px solid var(--mn-field-border);
	border-radius: var(--wp--custom--radius--sm);
	background: var(--wp--preset--color--white);
	box-shadow: inset 0 1px 2px rgba(var(--wp--custom--ink-rgb), 0.05);
	color: var(--mn-field-text);
	font: inherit;
	font-size: max(16px, var(--wp--preset--font-size--medium));
	transition: border-color var(--wp--custom--motion--micro) var(--wp--custom--motion--ease), box-shadow var(--wp--custom--motion--micro) var(--wp--custom--motion--ease);
}
.mn-gl-find__input::placeholder { color: var(--mn-text-muted); opacity: 1; }
.mn-gl-find__input::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
.mn-gl-find__input:hover { border-color: var(--mn-text-strong); }
.mn-gl-find__input:focus-visible {
	border-color: var(--mn-focus);
	outline: 2px solid transparent;
	box-shadow: 0 0 0 1px var(--mn-focus), 0 0 0 4px rgba(var(--wp--custom--cyan-rgb), 0.22);
}
.mn-gl-find__clear {
	position: absolute;
	inset-block: 2px;
	inset-inline-end: 2px;
	display: grid;
	place-items: center;
	inline-size: 44px;
	padding: 0;
	border: 0;
	border-radius: var(--wp--custom--radius--xs);
	background: transparent;
	color: var(--mn-text-muted);
	cursor: pointer;
}
.mn-gl-find__clear:hover { color: var(--mn-text-strong); }
.mn-gl-find__clear .mn-icon { inline-size: 18px; block-size: 18px; }
/* Without the script the form's own button runs the search (the server answers ?q=); with it the list filters as
   you type, so the button goes and the clear button sits in the field. */
.mn-gl-find__go {
	flex: none;
	min-block-size: var(--wp--custom--target--button);
	padding: 0 16px;
	border: 0;
	border-radius: var(--wp--custom--radius--sm);
	background: var(--wp--preset--color--ink-1);
	color: var(--wp--preset--color--white);
	font: inherit;
	font-size: var(--wp--custom--font-size--ui);
	font-weight: 600;
	cursor: pointer;
}
/* The script-on layout is there from the first paint (scripting media), so nothing moves when the script starts. */
@media (scripting: enabled) {
	.mn-gl-find__go { display: none; }
}
@media (scripting: none) {
	.mn-gl-find__clear { display: none; }
	.mn-gl-find__input { padding-inline-end: 14px; }
}

/* 5. Topics: a list in the column (desktop), a row of chips that scrolls (narrower) ----------------------------- */

.mn-gl-cats { min-inline-size: 0; margin: 0; padding: 0; border: 0; }
.mn-gl-cats__list { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
.mn-gl-cat {
	position: relative;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	gap: 10px;
	inline-size: 100%;
	min-block-size: var(--wp--custom--target--min);
	padding: 0 12px;
	border: 0;
	border-radius: var(--wp--custom--radius--sm);
	background: transparent;
	color: var(--mn-text);
	font: inherit;
	font-size: var(--wp--custom--font-size--ui);
	font-weight: 500;
	line-height: 1.2;
	text-align: start;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	transition: background-color var(--wp--custom--motion--micro) var(--wp--custom--motion--ease), color var(--wp--custom--motion--micro) var(--wp--custom--motion--ease);
}
.mn-gl-cat .mn-icon { flex: none; inline-size: 18px; block-size: 18px; color: var(--mn-link); }
.mn-gl-cat__label { flex: 1; min-inline-size: 0; }
.mn-gl-cat__n { flex: none; color: var(--mn-text-muted); font-size: var(--wp--preset--font-size--small); font-variant-numeric: tabular-nums; }
.mn-gl-cat:hover { background: var(--wp--preset--color--white); color: var(--mn-text-strong); }
.mn-gl-cat[aria-pressed="true"] {
	background: var(--wp--preset--color--ink-1);
	box-shadow: inset 3px 0 0 var(--wp--preset--color--cyan), var(--wp--preset--shadow--ink);
	color: var(--wp--preset--color--white);
}
.mn-gl-cat[aria-pressed="true"] .mn-icon,
.mn-gl-cat[aria-pressed="true"] .mn-gl-cat__n { color: var(--wp--preset--color--cyan-300); }
.mn-gl-cat[aria-pressed="true"]:focus-visible { outline-color: var(--wp--preset--color--cyan); }
.mn-gl-cat.is-zero:not([aria-pressed="true"]) { color: var(--mn-text-muted); }

@media (max-width: 1099px) {
	.mn-gl-cats__list {
		display: flex;
		gap: 8px;
		margin-inline: calc(var(--mn-gutter) * -1);
		padding: 2px var(--mn-gutter) 6px;
		overflow-x: auto;
		scroll-padding-inline: var(--mn-gutter);
		scrollbar-width: none;
		contain: paint;
	}
	.mn-gl-cats__list::-webkit-scrollbar { display: none; }
	.mn-gl-cats__list > li { flex: none; }
	.mn-gl-cat {
		inline-size: auto;
		padding: 0 14px;
		border: 1px solid var(--mn-rule-2);
		background: var(--wp--preset--color--white);
		white-space: nowrap;
	}
	.mn-gl-cat[aria-pressed="true"] { border-color: var(--wp--preset--color--ink-1); box-shadow: inset 0 -3px 0 var(--wp--preset--color--cyan), var(--wp--preset--shadow--ink); }
}

/* 6. A to Z: a grid in the column (desktop); a sticky strip under the header (narrower) ---------------------------- */

.mn-gl-az__list { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 2px; margin: 0; padding: 0; list-style: none; }
.mn-gl-az a.mn-gl-az__l,
.mn-gl-az .mn-gl-az__l {
	box-sizing: border-box;
	display: grid;
	place-items: center;
	min-inline-size: 40px;
	min-block-size: var(--wp--custom--target--min);
	border-radius: var(--wp--custom--radius--sm);
	color: var(--mn-text-strong);
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.0625rem;
	font-weight: 800;
	text-decoration: none;
	transition: background-color var(--wp--custom--motion--micro) var(--wp--custom--motion--ease), color var(--wp--custom--motion--micro) var(--wp--custom--motion--ease);
}
.mn-gl-az a.mn-gl-az__l:hover { background: var(--wp--preset--color--white); color: var(--mn-link); }
.mn-gl-az a.mn-gl-az__l.is-current { background: var(--wp--preset--color--ink-1); box-shadow: inset 0 -3px 0 var(--wp--preset--color--cyan); color: var(--wp--preset--color--white); }
.mn-gl-az a.mn-gl-az__l.is-current:focus-visible { outline-color: var(--wp--preset--color--cyan); }
.mn-gl-az :is(a, span).mn-gl-az__l:is(.is-empty, .is-none) { color: var(--mn-rule-3); font-weight: 600; pointer-events: none; }
.mn-gl-az a.mn-gl-az__find { display: none; }
.mn-gl-az a.mn-gl-az__search { color: var(--mn-link); }
.mn-gl-az__search .mn-icon { inline-size: 20px; block-size: 20px; }

@media (max-width: 1099px) {
	.mn-gl__tools { display: contents; }
	.mn-gl-az {
		position: sticky;
		inset-block-start: var(--mn-sticky-top);
		z-index: var(--mn-z-sticky);
		margin-inline: calc(var(--mn-gutter) * -1);
		padding: 4px var(--mn-gutter);
		border-block: 1px solid var(--mn-rule);
		background: color-mix(in srgb, var(--wp--preset--color--white) 92%, transparent);
		-webkit-backdrop-filter: blur(12px) saturate(1.2);
		backdrop-filter: blur(12px) saturate(1.2);
	}
	.mn-gl-az > .mn-gl-tools__label { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
	/* contain: paint keeps the strip's scrolling letters from widening the page (the sticky bar leaks them otherwise). */
	.mn-gl-az__list { display: flex; gap: 0; overflow-x: auto; scrollbar-width: none; contain: paint; }
	.mn-gl-az__list::-webkit-scrollbar { display: none; }
	.mn-gl-az__list > li { flex: none; }
	.mn-gl-az .mn-gl-az__l { min-inline-size: 38px; }
	.mn-gl-az { display: flex; align-items: center; }
	.mn-gl-az__list { flex: 1; min-inline-size: 0; }
	.mn-gl-az a.mn-gl-az__find { display: grid; flex: none; margin-inline-end: 4px; border-inline-end: 1px solid var(--mn-rule); border-radius: 0; }
	.mn-gl-az a.mn-gl-az__search { min-inline-size: 44px; }
}

/* 7. The status bar, the empty state and the letters ------------------------------------------------------------ */

.mn-gl__bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 4px 16px;
	min-block-size: var(--wp--custom--target--min);
	margin-block-end: 12px;
}
.mn-gl__status { margin: 0; color: var(--mn-text-muted); font-size: var(--wp--preset--font-size--small); font-variant-numeric: tabular-nums; }
.mn-gl__reset {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-block-size: var(--wp--custom--target--min);
	color: var(--mn-link);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	text-decoration: none;
}
.mn-gl__reset .mn-icon { inline-size: 16px; block-size: 16px; }
.mn-gl__reset:hover { text-decoration: underline; }

.mn-gl-empty {
	display: grid;
	gap: 8px;
	margin-block-end: 24px;
	padding: 28px;
	border: 1px dashed var(--mn-rule-3);
	border-radius: var(--wp--custom--radius--md);
	background: var(--wp--preset--color--paper);
}
.mn-gl-empty > * { margin: 0; }
.mn-gl-empty__title { color: var(--mn-text-strong); font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--x-large); font-weight: 800; letter-spacing: var(--wp--custom--tracking--title); }
.mn-gl-empty__hint:empty { display: none; }
.mn-gl-empty a { font-weight: 600; }

/* html's scroll-padding already clears the header (theme.css); the margins add the A–Z strip where it sticks.
   Letters off screen skip their layout (content-visibility), sized from their term count until first drawn, so the
   long list costs little to lay out on a phone. */
.mn-gl-letter {
	scroll-margin-block-start: var(--mn-gl-bar, 0px);
	content-visibility: auto;
	contain-intrinsic-size: auto calc(var(--n, 6) * 350px + 66px); /* Over the measured card heights (about 300 px at 1440, 340 at 1100), so content never overflows the placeholder. */
}
@media (max-width: 1099px) {
	.mn-gl-letter { contain-intrinsic-size: auto calc(var(--n, 6) * 380px + 66px); }
}
@media (max-width: 599px) {
	.mn-gl-letter { contain-intrinsic-size: auto calc(var(--n, 6) * 460px + 58px); } /* Over the measured ~435 px a card at 390. */
}
.mn-gl-letter + .mn-gl-letter { margin-block-start: 44px; }
.mn-gl-letter__h { display: flex; align-items: center; gap: 16px; margin: 0 0 14px; font-size: inherit; line-height: 1; }
.mn-gl-letter__h:focus { outline: none; }
.mn-gl-letter__glyph {
	display: grid;
	flex: none;
	place-items: center;
	inline-size: 52px;
	block-size: 52px;
	border-radius: var(--wp--custom--radius--sm);
	background: var(--wp--preset--color--ink-1);
	box-shadow: inset 0 -3px 0 var(--wp--preset--color--cyan), var(--wp--preset--shadow--ink);
	color: var(--wp--preset--color--white);
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.75rem;
	font-weight: 800;
}
.mn-gl-letter__h::after { content: ""; flex: 1; order: 1; block-size: 1px; background: var(--mn-rule); }
.mn-gl-letter__n { order: 2; color: var(--mn-text-muted); font-size: var(--wp--custom--font-size--micro); font-weight: 600; letter-spacing: var(--wp--custom--tracking--label); text-transform: uppercase; }
.mn-gl-letter__list { display: grid; gap: 12px; }

/* 8. The term card ------------------------------------------------------------------------------------------------ */

.mn-gl-card {
	position: relative;
	display: grid;
	gap: 8px;
	padding: 20px 22px 18px;
	border: 1px solid var(--mn-rule);
	border-radius: var(--wp--custom--radius--md);
	background: var(--wp--preset--color--white);
	scroll-margin-block-start: calc(var(--mn-gl-bar, 0px) + 8px);
	transition: border-color var(--wp--custom--motion--ui) var(--wp--custom--motion--ease), box-shadow var(--wp--custom--motion--ui) var(--wp--custom--motion--ease);
}
.mn-gl-card > * { margin: 0; }
.mn-gl-card:hover { border-color: var(--mn-rule-2); box-shadow: var(--mn-shadow-card); }
.mn-gl-card__top { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; padding-inline-end: 40px; }
.mn-gl-card__name {
	margin: 0;
	color: var(--mn-text-strong);
	font-size: var(--wp--preset--font-size--x-large);
	letter-spacing: var(--wp--custom--tracking--title);
	line-height: var(--wp--custom--line-height--title);
}
.mn-gl-card__name:focus { outline: none; }
.mn-gl-card__cat,
.mn-gl-card__label {
	color: var(--mn-text-muted);
	font-size: var(--wp--custom--font-size--micro);
	font-weight: 600;
	letter-spacing: var(--wp--custom--tracking--label);
	line-height: 1.3;
	text-transform: uppercase;
}
.mn-gl-card__cat { display: inline-flex; align-items: center; gap: 6px; }
.mn-gl-card__cat::before,
.mn-gl-rel--part::before,
.mn-gl-card__source::before,
.mn-gl-card__next a::before {
	content: "";
	flex: none;
	inline-size: 15px;
	block-size: 15px;
	background: currentColor;
	-webkit-mask: var(--mn-gl-icon) center / contain no-repeat;
	mask: var(--mn-gl-icon) center / contain no-repeat;
}
.mn-gl-card__cat::before { color: var(--mn-link); }
.mn-gl-card[data-cat="chassis"] { --mn-gl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 7V4.5'/%3E%3Cpath d='M21 7V4.5'/%3E%3Crect x='2' y='7' width='20' height='3.5' rx='0.75'/%3E%3Cpath d='M7 10.5V17'/%3E%3Cpath d='M5.5 17h3'/%3E%3Cpath d='M16.5 10.5v3'/%3E%3Ccircle cx='13.5' cy='16.5' r='3'/%3E%3Ccircle cx='19.5' cy='16.5' r='3'/%3E%3C/svg%3E"); }
.mn-gl-card[data-cat="trucks"] { --mn-gl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 18V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v11a1 1 0 0 0 1 1h2'/%3E%3Cpath d='M15 18H9'/%3E%3Cpath d='M19 18h2a1 1 0 0 0 1-1v-3.65a1 1 0 0 0-.22-.624l-3.48-4.35A1 1 0 0 0 17.52 8H14'/%3E%3Ccircle cx='17' cy='18' r='2'/%3E%3Ccircle cx='7' cy='18' r='2'/%3E%3C/svg%3E"); }
.mn-gl-card[data-cat="trailers"] { --mn-gl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='5' width='16' height='10' rx='1'/%3E%3Cpath d='M18 13h4'/%3E%3Cpath d='M5 15v3'/%3E%3Ccircle cx='12' cy='18' r='2'/%3E%3Ccircle cx='16.5' cy='18' r='2'/%3E%3C/svg%3E"); }
.mn-gl-card[data-cat="port"] { --mn-gl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 6v16'/%3E%3Cpath d='m19 13 2-1a9 9 0 0 1-18 0l2 1'/%3E%3Cpath d='M9 11h6'/%3E%3Ccircle cx='12' cy='4' r='2'/%3E%3C/svg%3E"); }
.mn-gl-card[data-cat="compliance"] { --mn-gl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E"); }
.mn-gl-card[data-cat="finance"] { --mn-gl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 7V4a1 1 0 0 0-1-1H5a2 2 0 0 0 0 4h15a1 1 0 0 1 1 1v4h-3a2 2 0 0 0 0 4h3a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1'/%3E%3Cpath d='M3 5v14a2 2 0 0 0 2 2h15a1 1 0 0 0 1-1v-4'/%3E%3C/svg%3E"); }

.mn-gl-card__copy {
	position: absolute;
	inset-block-start: 10px;
	inset-inline-end: 10px;
	display: grid;
	place-items: center;
	inline-size: var(--wp--custom--target--min);
	block-size: var(--wp--custom--target--min);
	border-radius: var(--wp--custom--radius--sm);
	color: var(--mn-text-muted);
	transition: background-color var(--wp--custom--motion--micro) var(--wp--custom--motion--ease), color var(--wp--custom--motion--micro) var(--wp--custom--motion--ease);
}
.mn-gl-card__copy .mn-icon { inline-size: 18px; block-size: 18px; }
.mn-gl-card__copy:hover { background: var(--wp--preset--color--paper); color: var(--mn-text-strong); }
/* "Link copied": a small ink tag beside the button, from the script (no layout moves). */
.mn-gl-card__copy[data-copied]::after {
	content: attr(data-copied);
	position: absolute;
	inset-block-start: 50%;
	inset-inline-end: calc(100% + 6px);
	padding: 6px 10px;
	border-radius: var(--wp--custom--radius--xs);
	background: var(--wp--preset--color--ink-1);
	color: var(--wp--preset--color--white);
	font-size: var(--wp--custom--font-size--micro);
	font-weight: 600;
	white-space: nowrap;
	transform: translateY(-50%);
	pointer-events: none;
}
.mn-gl-card__copy[data-copied] { color: var(--mn-link); }

.mn-gl-card__aka { color: var(--mn-text-muted); font-size: var(--wp--preset--font-size--small); line-height: 1.45; }
.mn-gl-card__aka-label { color: var(--mn-text); font-weight: 600; }
.mn-gl-card__def { max-inline-size: 68ch; color: var(--mn-text-strong); font-size: var(--wp--preset--font-size--large); line-height: 1.5; }
.mn-gl-card__hit { max-inline-size: 68ch; color: var(--mn-text); font-size: var(--wp--preset--font-size--small); line-height: 1.5; }
.mn-gl-card__hit-label { margin-inline-end: 6px; color: var(--mn-text-muted); font-weight: 600; }
.mn-gl-card__source {
	--mn-gl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 18v-7'/%3E%3Cpath d='M11.119 2.205a2 2 0 0 1 1.762 0l7.84 3.846A.5.5 0 0 1 20.5 7h-17a.5.5 0 0 1-.22-.949z'/%3E%3Cpath d='M14 18v-7'/%3E%3Cpath d='M18 18v-7'/%3E%3Cpath d='M3 22h18'/%3E%3Cpath d='M6 18v-7'/%3E%3C/svg%3E");
	display: flex;
	align-items: flex-start;
	gap: 8px;
	color: var(--mn-text-muted);
	font-size: var(--wp--custom--font-size--micro);
	line-height: 1.45;
}
.mn-gl-card__source::before { margin-block-start: 1px; }
.mn-gl-card__source a { color: var(--mn-link); font-weight: 600; }

/* "Read more": a native disclosure that opens smoothly where the browser can size to auto. */
.mn-gl-card__more { display: grid; }
.mn-gl-card__toggle {
	display: inline-flex;
	align-items: center;
	justify-self: start;
	gap: 8px;
	min-block-size: var(--wp--custom--target--min);
	margin-block: -4px;
	color: var(--mn-link);
	font-size: var(--wp--custom--font-size--ui);
	font-weight: 600;
	list-style: none;
	cursor: pointer;
}
.mn-gl-card__toggle::-webkit-details-marker { display: none; }
.mn-gl-card__toggle::after {
	content: "";
	inline-size: 7px;
	block-size: 7px;
	margin-block-start: -4px;
	border-inline-end: 2px solid currentColor;
	border-block-end: 2px solid currentColor;
	transform: rotate(45deg);
	transition: transform var(--wp--custom--motion--ui) var(--wp--custom--motion--ease);
}
.mn-gl-card__more[open] > .mn-gl-card__toggle::after { margin-block-start: 4px; transform: rotate(-135deg); }
.mn-gl-card__toggle:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.mn-gl-card__more::details-content {
	block-size: 0;
	overflow: clip;
	transition: block-size var(--wp--custom--motion--ui) var(--wp--custom--motion--ease), content-visibility var(--wp--custom--motion--ui) allow-discrete;
}
.mn-gl-card__more[open]::details-content { block-size: auto; }
.mn-gl-card__long { display: grid; gap: 12px; max-inline-size: 68ch; padding-block: 8px 4px; color: var(--mn-text); font-size: var(--wp--custom--font-size--ui); line-height: 1.6; }
.mn-gl-card__long > * { margin: 0; }
.mn-gl-card__next { display: grid; gap: 8px; padding: 14px 16px; border-radius: var(--wp--custom--radius--sm); background: var(--wp--preset--color--paper); }
.mn-gl-card__next ul { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
.mn-gl-card__next a {
	--mn-gl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E");
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-block-size: 36px;
	color: var(--mn-link);
	font-weight: 600;
	text-decoration: none;
}
.mn-gl-card__next a:hover { text-decoration: underline; text-underline-offset: 0.2em; }

/* Related terms: small chips that jump to the term (each a 44 px target, the chip drawn inside it). */
.mn-gl-card__rels { display: flex; flex-wrap: wrap; align-items: center; gap: 0 12px; }
.mn-gl-card__rels > ul,
.mn-gl-card__rels ul,
.mn-gls__terms { display: flex; flex-wrap: wrap; gap: 0 6px; margin: 0; padding: 0; list-style: none; }
.mn-kit a.mn-gl-rel {
	position: relative;
	isolation: isolate;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-block-size: var(--wp--custom--target--min);
	padding: 0 12px;
	color: var(--mn-text-strong);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	text-decoration: none;
}
.mn-gl-rel::after {
	content: "";
	position: absolute;
	inset: 6px 0;
	z-index: -1;
	border: 1px solid var(--mn-rule-2);
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--white);
	transition: border-color var(--wp--custom--motion--micro) var(--wp--custom--motion--ease), background-color var(--wp--custom--motion--micro) var(--wp--custom--motion--ease);
}
.mn-kit a.mn-gl-rel:hover { color: var(--mn-link); }
.mn-gl-rel:hover::after { border-color: var(--mn-link); background: rgba(var(--wp--custom--cyan-rgb), 0.06); }
.mn-kit a.mn-gl-rel--part { --mn-gl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='22' y1='12' x2='18' y2='12'/%3E%3Cline x1='6' y1='12' x2='2' y2='12'/%3E%3Cline x1='12' y1='6' x2='12' y2='2'/%3E%3Cline x1='12' y1='22' x2='12' y2='18'/%3E%3C/svg%3E"); color: var(--mn-link); }

/* Arrived at (a related chip, a tile, a guide's link): a cyan ring that settles; :target does it without the script. */
.mn-gl-card:target { border-color: var(--wp--preset--color--cyan-700); box-shadow: 0 0 0 3px rgba(var(--wp--custom--cyan-rgb), 0.18); }
.mn-gl-card.is-flash { animation: mn-gl-flash 1.8s var(--wp--custom--motion--ease-out); }
@keyframes mn-gl-flash {
	0% { border-color: var(--wp--preset--color--cyan); box-shadow: 0 0 0 0 rgba(var(--wp--custom--cyan-rgb), 0.5); background-color: rgba(var(--wp--custom--cyan-rgb), 0.08); }
	30% { border-color: var(--wp--preset--color--cyan); box-shadow: 0 0 0 8px rgba(var(--wp--custom--cyan-rgb), 0.16); background-color: rgba(var(--wp--custom--cyan-rgb), 0.06); }
	100% { border-color: var(--wp--preset--color--cyan-700); box-shadow: 0 0 0 3px rgba(var(--wp--custom--cyan-rgb), 0.18); background-color: var(--wp--preset--color--white); }
}

/* Search matches. */
.mn-gl-mark { padding: 0 1px; border-radius: 2px; background: rgba(var(--wp--custom--cyan-rgb), 0.22); box-shadow: inset 0 -2px 0 var(--wp--preset--color--cyan-700); color: inherit; }

/* A term printed on its own (anywhere but the glossary page). */
.mn-gl-solo { max-inline-size: 48rem; margin-block: var(--wp--preset--spacing--50); }

@media (max-width: 599px) {
	.mn-gl-card { padding: 16px 16px 14px; }
	.mn-gl-card__def { font-size: var(--wp--preset--font-size--medium); }
	.mn-gl-letter__glyph { inline-size: 44px; block-size: 44px; font-size: 1.5rem; }
}

@media (prefers-reduced-motion: reduce) {
	.mn-gl-card.is-flash { animation: none; }
	.mn-gl-card__more::details-content { transition: none; }
	.mn-gl-tile__link,
	.mn-gl-hero__teaser { transition: none; }
}

/* The page's icon sprite takes no room. */
.mn-gl-sprite { position: absolute; inline-size: 0; block-size: 0; overflow: hidden; }