/* Medium-style single post layout (loaded on single posts only). */

/* Astra's .ast-container is a flex row; take the full width. */
.nb-main { flex: 1 1 100%; width: 100%; min-width: 0; }

.nb-article {
	--nb-text: #242424;
	--nb-muted: #6b6b6b;
	--nb-faint: #f7f7f5;
	--nb-line: #e6e6e6;
	--nb-accent: var(--ast-global-color-0, #0170b9);
	--nb-serif: "Source Serif 4", Charter, "Bitstream Charter", Georgia, Cambria, serif;
	--nb-sans: Inter, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--nb-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	/* Reading width grows with the screen: ~680px on laptops up to 920px on large monitors. */
	--nb-measure: clamp(600px, 19.4vw + 528px, 920px);
	color: var(--nb-text);
	padding: 56px 24px 32px;
	background: #fff;
}

.nb-measure,
.nb-content > * {
	max-width: var(--nb-measure);
	margin-left: auto;
	margin-right: auto;
}

.nb-article [id] { scroll-margin-top: 96px; }

/* ---------- reading progress */
.nb-progress { position: fixed; inset: 0 0 auto; height: 3px; z-index: 1000; pointer-events: none; }
.nb-progress span { display: block; height: 100%; width: 100%; background: var(--nb-accent, #0170b9); transform-origin: 0 50%; transform: scaleX(0); }

/* ---------- header */
.nb-kicker {
	display: inline-block;
	font: 600 13px/1 var(--nb-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--nb-accent);
	text-decoration: none;
	margin-bottom: 18px;
}
.nb-kicker:hover { text-decoration: underline; }

.nb-article .nb-title {
	font: 700 42px/1.2 var(--nb-sans);
	letter-spacing: -0.022em;
	color: var(--nb-text);
	margin: 0 0 14px;
}
.nb-subtitle {
	font: 400 22px/1.4 var(--nb-sans);
	color: var(--nb-muted);
	margin: 0 0 24px;
}

.nb-byline { display: flex; align-items: center; gap: 12px; margin: 24px 0 0; padding-bottom: 24px; border-bottom: 1px solid var(--nb-line); }
.nb-avatar { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; background: var(--nb-faint); flex: none; }
.nb-avatar--logo { object-fit: contain; padding: 6px; border: 1px solid var(--nb-line); background: #fff; }
.nb-byline__text { display: flex; flex-direction: column; font-family: var(--nb-sans); line-height: 1.35; }
.nb-byline__name { font-size: 15px; font-weight: 500; }
.nb-byline__meta { font-size: 14px; color: var(--nb-muted); }

/* ---------- paper card */
.nb-paper {
	margin: 28px 0 0;
	padding: 22px 24px;
	background: var(--nb-faint);
	border-radius: 12px;
	font-family: var(--nb-sans);
}
.nb-paper p { margin: 0; }
.nb-paper__badge { font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--nb-muted); }
.nb-paper__authors { font-size: 16px; font-weight: 500; margin-top: 10px !important; line-height: 1.45; }
.nb-paper__affil { font-size: 13.5px; color: var(--nb-muted); margin-top: 6px !important; line-height: 1.5; }
.nb-paper__venue { font-size: 14.5px; margin-top: 12px !important; line-height: 1.45; }
.nb-paper__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }

.nb-btn {
	display: inline-flex; align-items: center;
	font: 500 14px/1 var(--nb-sans);
	padding: 9px 16px;
	border-radius: 999px;
	border: 1px solid #cfcfcf;
	background: #fff;
	color: var(--nb-text) !important;
	text-decoration: none !important;
	cursor: pointer;
	transition: border-color .15s, background .15s;
}
.nb-btn:hover { border-color: var(--nb-text); background: #fff; }
.nb-btn--primary { background: var(--nb-text); border-color: var(--nb-text); color: #fff !important; }
.nb-btn--primary:hover { background: #000; }

.nb-cite { margin-top: 16px; display: grid; gap: 12px; }
.nb-cite[hidden] { display: none; }
.nb-cite__block { background: #fff; border: 1px solid var(--nb-line); border-radius: 8px; padding: 12px 14px; }
.nb-cite__head { display: flex; justify-content: space-between; align-items: center; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--nb-muted); margin-bottom: 8px; }
.nb-cite p { font-size: 14px; line-height: 1.55; }
.nb-cite pre { margin: 0; font: 12.5px/1.55 var(--nb-mono); white-space: pre-wrap; word-break: break-word; background: none; padding: 0; border: 0; color: var(--nb-text); }

.nb-copy {
	font: 500 13px/1 var(--nb-sans);
	background: none; border: 0; padding: 4px 6px; border-radius: 4px;
	color: var(--nb-accent); cursor: pointer; text-transform: none; letter-spacing: 0;
}
.nb-copy:hover { background: rgba(0, 0, 0, .05); }

/* ---------- hero */
.nb-hero { max-width: 1000px; margin: 40px auto 0; }
.nb-hero img { width: 100%; height: auto; border-radius: 4px; display: block; }

/* ---------- body + table of contents */
.nb-body { position: relative; margin-top: 40px; }
.nb-toc { display: none; }
@media (min-width: 1200px) {
	/* Leave room for the contents column on both sides so text stays centred. */
	.nb-article { --nb-measure: min(clamp(600px, 19.4vw + 528px, 920px), calc(100vw - 530px)); }
	.nb-body { display: grid; grid-template-columns: minmax(190px, 1fr) minmax(0, var(--nb-measure)) minmax(190px, 1fr); column-gap: 40px; }
	.nb-content { grid-column: 2; }
	.nb-toc:not([hidden]) {
		display: block; grid-column: 1; justify-self: end; align-self: start;
		position: sticky; top: 110px; width: min(220px, 100%);
		font-family: var(--nb-sans); font-size: 13.5px; line-height: 1.4;
	}
}
.nb-toc__title { font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--nb-muted); margin: 0 0 10px; }
.nb-toc ol { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--nb-line); }
.nb-toc li { margin: 0; }
.nb-toc a { display: block; padding: 5px 0 5px 14px; margin-left: -1px; border-left: 2px solid transparent; color: var(--nb-muted); text-decoration: none; }
.nb-toc a:hover { color: var(--nb-text); }
.nb-toc a.is-active { color: var(--nb-text); border-left-color: var(--nb-text); font-weight: 500; }

/* ---------- prose */
.nb-article .nb-content {
	font-family: var(--nb-serif);
	font-size: clamp(18px, 0.45vw + 14.2px, 21px);
	line-height: 1.6;
	letter-spacing: -0.003em;
	color: var(--nb-text);
}
.nb-article .nb-content > * { margin-top: 0; margin-bottom: 0; }
.nb-article .nb-content p { margin: 0 auto 1.6em; }
.nb-article .nb-content a { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.nb-article .nb-content a:hover { color: var(--nb-accent); }

.nb-article .nb-content h2,
.nb-article .nb-content h3,
.nb-article .nb-content h4 {
	font-family: var(--nb-sans);
	color: var(--nb-text);
	letter-spacing: -0.016em;
}
.nb-article .nb-content h2 { font-size: 26px; font-weight: 700; line-height: 1.3; margin: 2.1em auto .55em; }
.nb-article .nb-content h3 { font-size: 21px; font-weight: 600; line-height: 1.35; margin: 1.8em auto .5em; }
.nb-article .nb-content h4 { font-size: 18px; font-weight: 600; margin: 1.6em auto .4em; }

.nb-article .nb-content ul,
.nb-article .nb-content ol:not(.nb-refs) { margin: 0 auto 1.6em; padding-left: 1.4em; }
.nb-article .nb-content li { margin-bottom: .45em; padding-left: .2em; }

.nb-article .nb-content blockquote {
	border-left: 3px solid var(--nb-text);
	padding: 0 0 0 22px;
	margin: 0 auto 1.6em;
	font-style: italic;
}

/* inline code that is not maths */
.nb-article .nb-content code {
	font: .82em/1.4 var(--nb-mono);
	background: #f2f2f2;
	padding: 2px 5px;
	border-radius: 4px;
}
.nb-article .nb-content pre { font: 15px/1.6 var(--nb-mono); background: #f6f8fa; border-radius: 8px; padding: 18px 20px; overflow-x: auto; margin: 0 auto 1.8em; }
.nb-article .nb-content pre code { background: none; padding: 0; font-size: inherit; }

/* ---------- abstract */
.nb-article .nb-abstract {
	background: var(--nb-faint);
	border-radius: 12px;
	padding: 26px 28px 8px;
	margin: 0 auto 2.4em !important;
	font-size: 18px;
	line-height: 1.6;
}
.nb-article .nb-abstract > * { max-width: none !important; }
.nb-article .nb-content .nb-abstract h2 {
	font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
	color: var(--nb-muted); margin: 0 0 12px;
}
.nb-article .nb-content .nb-abstract p { margin-bottom: 1em; }
.nb-article .nb-content .nb-keywords { font: 14px/1.5 var(--nb-sans); color: var(--nb-muted); }
.nb-article .nb-content .nb-keywords strong { color: var(--nb-text); font-weight: 600; }

/* ---------- maths */
.nb-math .katex { font-size: 1.04em; }
.nb-article .nb-content .nb-eq { position: relative; margin: 1.4em auto 1.8em; overflow-x: auto; overflow-y: hidden; }
.nb-math--display .katex-display { margin: 0; }
.nb-math--display .katex-display > .katex { text-align: center; }
/* Wide equations scroll instead of running into their \tag number. */
.nb-math--display .katex-display > .katex > .katex-html { min-width: max-content; padding-right: 2.6em; }

/* ---------- figures */
.nb-article .nb-content .wp-block-image { margin: 2.2em auto 2.4em; text-align: center; }
.nb-article .nb-content .wp-block-image img { max-width: 100%; height: auto; display: inline-block; }
.nb-article .nb-content figcaption,
.nb-article .nb-content .wp-element-caption {
	font: 14px/1.5 var(--nb-sans);
	color: var(--nb-muted);
	text-align: center;
	margin: 12px auto 0;
	max-width: 90%;
}
.nb-article .nb-content figcaption strong { color: var(--nb-text); font-weight: 600; }

/* ---------- tables (booktabs look, caption on top, scroll on small screens) */
.nb-article .nb-content .wp-block-table {
	display: flex; flex-direction: column;
	position: relative; /* keeps KaTeX's hidden MathML inside the scroll box */
	margin: 2.2em auto 2.4em;
	overflow-x: auto;
}
.nb-article .nb-content .wp-block-table figcaption { order: -1; margin: 0 auto 12px; }
.nb-article .nb-content .wp-block-table table {
	table-layout: auto;
	width: 100%;
	min-width: 560px;
	border-collapse: collapse;
	border: 0;
	border-top: 2px solid var(--nb-text);
	border-bottom: 2px solid var(--nb-text);
	font: 15px/1.45 var(--nb-sans);
	font-variant-numeric: tabular-nums;
}
.nb-article .nb-content .wp-block-table th,
.nb-article .nb-content .wp-block-table td {
	border: 0;
	padding: 9px 12px;
	text-align: center;
	vertical-align: middle;
	overflow-wrap: normal;
	word-break: normal;
	hyphens: none;
}
.nb-article .nb-content .wp-block-table thead th { border-bottom: 1px solid var(--nb-text); font-weight: 600; }
.nb-article .nb-content .wp-block-table thead th strong { font-weight: 600; }
.nb-article .nb-content .wp-block-table tbody tr + tr td { border-top: 1px solid #f0f0f0; }
.nb-article .nb-content .wp-block-table a { text-decoration: none; color: var(--nb-accent); }

/* ---------- references */
.nb-article .nb-content ol.nb-refs {
	list-style: none;
	counter-reset: nbref;
	padding: 0;
	margin: 0 auto 2em;
	font: 15px/1.55 var(--nb-sans);
	color: #3d3d3d;
}
.nb-article .nb-content ol.nb-refs li { counter-increment: nbref; position: relative; padding: 6px 8px 6px 46px; margin: 0; border-radius: 6px; }
.nb-article .nb-content ol.nb-refs li::before { content: "[" counter(nbref) "]"; position: absolute; left: 6px; color: var(--nb-muted); font-variant-numeric: tabular-nums; }
.nb-article .nb-content ol.nb-refs li:target { background: #fff6d6; }
.nb-article .nb-content .nb-refs a { word-break: break-word; }

/* citation hover card */
.nb-refcard {
	position: absolute; z-index: 50; max-width: 380px;
	background: #fff; color: var(--nb-text, #242424);
	border: 1px solid #e6e6e6; border-radius: 10px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, .12);
	padding: 12px 14px;
	font: 13.5px/1.5 Inter, -apple-system, "Segoe UI", sans-serif;
}

.nb-article .nb-content .nb-copyright { font: 12.5px/1.55 var(--nb-sans); color: var(--nb-muted); border-top: 1px solid var(--nb-line); padding-top: 16px; margin-top: 2.4em; }

/* ---------- footer */
.nb-footer { margin-top: 40px; font-family: var(--nb-sans); }
.nb-tags { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 28px; padding: 0; }
.nb-tags a { display: inline-block; padding: 8px 16px; border-radius: 999px; background: #f2f2f2; color: var(--nb-text); font-size: 14px; text-decoration: none; }
.nb-tags a:hover { background: #e8e8e8; }
.nb-share { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 18px; font-size: 14px; padding: 18px 0; border-top: 1px solid var(--nb-line); border-bottom: 1px solid var(--nb-line); }
.nb-share span { color: var(--nb-muted); }
.nb-share a { color: var(--nb-text); text-decoration: none; }
.nb-share a:hover { text-decoration: underline; }
.nb-share .nb-copy { padding: 0; color: var(--nb-text); font-size: 14px; }
.nb-share .nb-copy:hover { background: none; text-decoration: underline; }

.nb-author { display: flex; gap: 18px; align-items: flex-start; padding: 32px 0; }
.nb-author .nb-avatar { width: 64px; height: 64px; }
.nb-author p { margin: 0; }
.nb-author__label { font-size: 13px; color: var(--nb-muted); }
.nb-author__name { font-size: 20px; font-weight: 600; margin: 2px 0 6px !important; }
.nb-author__bio { font-size: 15px; color: #3d3d3d; line-height: 1.5; }

/* ---------- related */
.nb-related { max-width: 1000px; margin: 24px auto 0; padding: 40px 0 8px; border-top: 1px solid var(--nb-line); font-family: var(--nb-sans); }
.nb-related__title { font: 600 20px/1.3 var(--nb-sans); margin: 0 0 22px; color: var(--nb-text); }
.nb-related__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 28px; }
.nb-card { display: flex; flex-direction: column; gap: 10px; text-decoration: none; color: var(--nb-text); }
.nb-card__img { aspect-ratio: 16 / 9; overflow: hidden; border-radius: 6px; background: var(--nb-faint); }
.nb-card__img img { width: 100%; height: 100%; object-fit: contain; }
.nb-card__title { font-size: 17px; font-weight: 700; line-height: 1.35; }
.nb-card:hover .nb-card__title { text-decoration: underline; }
.nb-card__meta { font-size: 13.5px; color: var(--nb-muted); }

.nb-comments { margin-top: 40px; font-family: var(--nb-sans); }

/* ---------- small screens */
@media (max-width: 720px) {
	.nb-article { padding: 32px 16px 24px; }
	.nb-article .nb-title { font-size: 30px; line-height: 1.22; }
	.nb-subtitle { font-size: 19px; }
	.nb-article .nb-content { font-size: 18px; line-height: 1.6; }
	.nb-article .nb-content h2 { font-size: 22px; }
	.nb-article .nb-content h3 { font-size: 19px; }
	.nb-paper { padding: 18px; }
	.nb-article .nb-abstract { padding: 20px 18px 4px; font-size: 17px; }
	.nb-article .nb-content ol.nb-refs li { padding-left: 40px; }
	.nb-math--display .katex { font-size: .95em; }
}

/* ---------- galleries (sub-figures): captions under each panel, not over it */
.nb-article .nb-content .wp-block-gallery { margin: 2.2em auto 2.4em; }
.nb-article .nb-content .wp-block-gallery.has-nested-images figure.wp-block-image { flex-direction: column; justify-content: flex-start; align-self: flex-start; }
.nb-article .nb-content .wp-block-gallery.has-nested-images figure.wp-block-image img { height: auto; object-fit: contain; }
.nb-article .nb-content .wp-block-gallery.has-nested-images figure.wp-block-image:has(figcaption)::before { display: none; }
.nb-article .nb-content .wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
	position: static; background: none; color: var(--nb-muted); text-shadow: none;
	max-height: none; overflow: visible; padding: 6px 4px 0; margin: 0;
	font: 13.5px/1.4 var(--nb-sans); text-align: center; backdrop-filter: none; -webkit-mask-image: none; mask-image: none;
}
.nb-article .nb-content .wp-block-gallery > figcaption.blocks-gallery-caption { flex-basis: 100%; margin-top: 6px; }
@media (max-width: 600px) {
	/* one panel per row on phones; :not(#individual-image) matches core's selector weight */
	.nb-article .nb-content .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) { width: 100%; }
}