/* ── Parametric colour system (Colophon v2) ─────────────────────────────────
   Three anchor custom props drive the entire neutral + accent scale via
   color-mix() in OKLCh space. Set in settings.custom (theme.json); overridden
   per style variation via the same settings.custom key.

   Derived tokens (--clr-*) are intentionally separate from the block-editor
   palette (--wp--preset--color--*). The palette tokens give the editor
   accurate swatches; --clr-* tokens give CSS components automatic
   variation-awareness without manual per-token overrides.

   color-mix() browser support: Chrome 111+ · Firefox 113+ · Safari 16.2+
   Global coverage ≈ 93 %. Fallback values (hex literals) serve older clients.
   ─────────────────────────────────────────────────────────────────────────── */
body {
  /* Anchors — resolved from settings.custom; hex literals are the fallback */
  --colophon-light:  var(--wp--custom--colophon-light,  #ffffff);
  --colophon-dark:   var(--wp--custom--colophon-dark,   #0a0a0a);
  --colophon-accent: var(--wp--custom--colophon-accent, #1a3762);

  /* Derived neutral scale (8 % / 22 % / 45 % stops in OKLCh) */
  --clr-bg:          var(--colophon-light);
  --clr-fg:          var(--colophon-dark);
  --clr-surface:     color-mix(in oklch, var(--colophon-dark)  8%,  var(--colophon-light));
  --clr-rule:        color-mix(in oklch, var(--colophon-dark) 22%,  var(--colophon-light));
  --clr-muted:       color-mix(in oklch, var(--colophon-dark) 45%,  var(--colophon-light));

  /* Accent and its tinted surface */
  --clr-accent:      var(--colophon-accent);
  --clr-accent-tint: color-mix(in oklch, var(--colophon-accent) 12%, var(--colophon-light));
}

/* [SKIN] skin.css — Masthead's personality */

/* Semantic token contract — unlayered so these beat layered declarations */
:root {
	--cl-focus-ring:         var(--wp--preset--color--accent-red, #c62828);
	--cl-focus-ring-inverse: var(--wp--preset--color--paper-off-white, #f8f8f6);
	/* Skip link is fixed dark chrome with #fff text, edition-stable for the same
	   reason as the footer: base-black inverts to a light value in Midnight and
	   Broadsheet, which would render the white skip-link label at ~1:1 — an
	   accessibility-critical failure on the first keyboard-focusable element. */
	--cl-skip-bg:            var(--np-footer-bg, #0a0a0a);
	--cl-skip-fg:            #fff;

	/* Text colour that sits ON the accent-red button ground. White by default;
	   the dark editions (Midnight, Broadsheet) lighten accent-red for label
	   legibility on their dark ground, which drops white button text to ~3:1 —
	   so they re-point this to their dark paper via settings.custom.on-accent.
	   Read through the same --wp--custom-- bridge Colophon uses for its anchors. */
	--np-on-accent:          var(--wp--custom--on-accent, #fff);

	/* Footer chrome ground — intentionally edition-stable. The newspaper footer
	   is a dark masthead band in every edition, so its ground must NOT follow
	   the base-black palette token: base-black is "the darkest ink", which
	   inverts to a light value in the dark editions (Midnight, Broadsheet),
	   and binding the footer to it composited the near-white footer text down
	   to ~1.04:1. This fixed dark value keeps the footer dark-ground/light-text
	   everywhere and clears WCAG 4.5:1 against the rgba text in parts/footer.html. */
	--np-footer-bg:          #0a0a0a;
	--np-footer-fg:          #f8f8f6;

	/* Runtime tokens */
	--np-transition:       200ms cubic-bezier(0.4, 0, 0.2, 1);
	--np-transition-slow:  400ms cubic-bezier(0.4, 0, 0.2, 1);
	--np-rule-weight:      2px;
	--np-border:           1px solid var(--wp--preset--color--rule-light, #e0e0db);
	--np-utility-height:   40px;
	--np-header-height:    80px;
	--np-breaking-height:  44px;
	--np-section-nav-h:    48px;
	--np-section-gap:      clamp(2.5rem, 5vw, 5rem);
	--np-gutter:           clamp(1rem, 3vw, 2.5rem);
	--np-full-max:         1440px;
	--np-card-gap:         clamp(1rem, 2vw, 2rem);

	/* Section accent colours — override via Customizer */
	--np-col-news:     var(--wp--preset--color--accent-red, #c62828);
	--np-col-politics: var(--wp--preset--color--section-politics, #1a3762);
	--np-col-business: var(--wp--preset--color--section-business, #1b5e20);
	--np-col-culture:  var(--wp--preset--color--section-culture, #6a1b9a);
	--np-col-sports:   var(--wp--preset--color--section-sports, #bf360c);
	--np-col-tech:     var(--wp--preset--color--section-tech, #0d47a1);
	--np-col-opinion:  var(--wp--preset--color--accent-red, #c62828);
	--np-col-world:    var(--wp--preset--color--section-world, #3d7a3d);

	/* Active section colour (set per section block) */
	--np-section-color: var(--np-col-news);
}

@layer reset, base;

@layer reset {
	*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

	html {
		scroll-behavior: smooth;
		-webkit-text-size-adjust: 100%;
		text-size-adjust: 100%;
		color-scheme: light;
		hanging-punctuation: first last;
	}

	body {
		min-height: 100dvh;
		overflow-x: hidden;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		text-rendering: optimizeLegibility;
	}

	img, video, canvas, audio, iframe, embed, object {
		display: block;
		max-width: 100%;
	}

	img, video { height: auto; }
	input, button, textarea, select { font: inherit; }
	p, h1, h2, h3, h4, h5, h6 { overflow-wrap: break-word; }
	ol, ul { list-style: none; }

	@media (prefers-reduced-motion: reduce) {
		*, *::before, *::after {
			animation-duration: 0.01ms !important;
			animation-iteration-count: 1 !important;
			transition-duration: 0.01ms !important;
			scroll-behavior: auto !important;
		}
	}
}

@layer base {

	::selection {
		background-color: var(--wp--preset--color--accent-red, #c62828);
		color: var(--np-on-accent, #fff);
	}

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

	.skip-link {
		position: absolute;
		inset-block-start: -100%;
		inset-inline-start: 0.75rem;
		padding: 0.5rem 1.25rem;
		background: var(--cl-skip-bg);
		color: var(--cl-skip-fg);
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.875rem;
		font-weight: 700;
		letter-spacing: 0.06em;
		text-transform: uppercase;
		text-decoration: none;
		z-index: 9999;
		transition: inset-block-start var(--np-transition);
	}
	.skip-link:focus { inset-block-start: 0; }
}



	/* Hero: 2/3 + 1/3 */
	.np-hero-grid {
		display: grid;
		grid-template-columns: 1fr;
		gap: var(--np-card-gap);
	}
	@media (min-width: 1024px) {
		.np-hero-grid { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
	}

	/* Article grids */
	.np-grid-2, .np-grid-3, .np-grid-4 {
		display: grid;
		grid-template-columns: 1fr;
		gap: var(--np-card-gap);
	}
	@media (min-width: 640px) {
		.np-grid-2 { grid-template-columns: repeat(2, 1fr); }
		.np-grid-4 { grid-template-columns: repeat(2, 1fr); }
	}
	@media (min-width: 768px) {
		.np-grid-3 { grid-template-columns: repeat(3, 1fr); }
	}
	@media (min-width: 1024px) {
		.np-grid-4 { grid-template-columns: repeat(4, 1fr); }
	}

	/* Main + Sidebar */
	.np-content-sidebar {
		display: grid;
		grid-template-columns: 1fr;
		gap: clamp(2rem, 4vw, 4rem);
		align-items: start;
	}
	@media (min-width: 1024px) {
		.np-content-sidebar { grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); }
	}




	/* Utility bar */
	.np-utility-bar {
		height: var(--np-utility-height);
		background: var(--wp--preset--color--base-black, #0a0a0a);
		color: var(--wp--preset--color--paper-off-white, #f8f8f6);
		border-block-end: var(--np-rule-weight) solid var(--wp--preset--color--accent-red, #c62828);
		position: relative;
		z-index: 100;
	}

	.np-utility-bar__inner {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 100%;
		max-width: var(--np-full-max);
		margin-inline: auto;
		padding-inline: var(--np-gutter);
		gap: 1rem;
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.75rem;
		letter-spacing: 0.04em;
	}

	.np-utility-bar__date { opacity: 0.65; white-space: nowrap; }

	.np-utility-bar__actions {
		display: flex;
		align-items: center;
		gap: 1.25rem;
		margin-inline-start: auto;
	}

	.np-utility-bar a {
		color: inherit;
		text-decoration: none;
		opacity: 0.7;
		transition: opacity var(--np-transition);
	}
	.np-utility-bar a:hover { opacity: 1; }

	.np-subscribe-btn {
		padding: 0.25rem 0.875rem;
		background: var(--wp--preset--color--accent-red, #c62828);
		color: var(--np-on-accent, #fff) !important;
		font-weight: 700;
		font-size: 0.6875rem;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		opacity: 1 !important;
		transition: background var(--np-transition) !important;
	}
	.np-subscribe-btn:hover { background: #a32020 !important; color: #fff !important; }

	@media (max-width: 767px) {
		.np-utility-bar__date { display: none; }
		.np-utility-bar__inner { justify-content: flex-end; }
	}

	/* Masthead / header */
	.np-masthead {
		background: var(--wp--preset--color--paper-white, #fff);
		border-block-end: 1px solid var(--wp--preset--color--rule-light, #e0e0db);
		padding-block: clamp(0.875rem, 2vw, 1.625rem);
		position: sticky;
		top: 0;
		z-index: 90;
		box-shadow: 0 1px 8px rgba(0, 0, 0, 0.05);
	}

	.np-masthead__inner {
		display: grid;
		grid-template-columns: 1fr auto 1fr;
		align-items: center;
		gap: 1rem;
		max-width: var(--np-full-max);
		margin-inline: auto;
		padding-inline: var(--np-gutter);
	}

	.np-masthead__nav-start  { justify-self: start; }
	.np-masthead__branding   { justify-self: center; text-align: center; }
	.np-masthead__nav-end    { justify-self: end; display: flex; align-items: center; gap: 1rem; }

	.wp-block-site-title a {
		font-family: var(--wp--preset--font-family--playfair-display, Georgia, serif);
		font-size: clamp(1.75rem, 4vw, 3.5rem);
		font-weight: 900;
		letter-spacing: -0.03em;
		color: var(--wp--preset--color--ink-primary, #1a1a1a);
		text-decoration: none;
		line-height: 1;
		display: block;
		transition: color var(--np-transition);
	}
	.wp-block-site-title a:hover { color: var(--wp--preset--color--accent-red, #c62828); }

	.wp-block-site-tagline {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.6875rem;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		color: var(--wp--preset--color--ink-muted, #6b6b6b);
		margin-block-start: 0.25rem;
	}

	@media (max-width: 1023px) {
		.np-masthead__inner {
			grid-template-columns: auto 1fr;
			grid-template-rows: auto auto;
		}
		.np-masthead__branding { grid-column: 1 / -1; justify-self: center; }
		/* The primary navigation (and its mobile menu button) stays visible; hiding
		   it here left no navigation at all on small screens. */
		.np-masthead__nav-start { min-width: 0; }
	}

	/* Breaking news bar */
	.np-breaking-bar {
		min-height: var(--np-breaking-height);
		display: flex;
		align-items: stretch;
		background: var(--wp--preset--color--paper-off-white, #f8f8f6);
		border-block-end: 1px solid var(--wp--preset--color--rule-light, #e0e0db);
		overflow: hidden;
	}

	.np-breaking-label {
		flex-shrink: 0;
		display: flex;
		align-items: center;
		padding-inline: 1.25rem;
		background: var(--wp--preset--color--breaking-red, #d32f2f);
		color: #fff;
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.6875rem;
		font-weight: 800;
		letter-spacing: 0.12em;
		text-transform: uppercase;
		white-space: nowrap;
		gap: 0.5rem;
	}

	.np-breaking-label::before {
		content: '';
		width: 8px;
		height: 8px;
		border-radius: 50%;
		background: #fff;
		animation: np-blink 1.2s ease-in-out infinite;
	}

	@keyframes np-blink {
		0%, 100% { opacity: 1; }
		50%       { opacity: 0.3; }
	}

	.np-breaking-ticker-wrap {
		flex: 1;
		overflow: hidden;
		display: flex;
		align-items: center;
		mask-image: linear-gradient(to right, transparent 0, black 2rem, black calc(100% - 2rem), transparent 100%);
	}

	.np-breaking-ticker {
		display: flex;
		gap: 4rem;
		white-space: nowrap;
		/* width: max-content so the track is as wide as its content rather than
		   the container — without it the headlines wrap and the scroll is wrong. */
		width: max-content;
		animation: np-ticker 35s linear infinite;
	}

	.np-breaking-ticker a {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.875rem;
		font-weight: 500;
		color: var(--wp--preset--color--ink-primary, #1a1a1a);
		text-decoration: none;
		transition: color var(--np-transition);
	}
	.np-breaking-ticker a:hover { color: var(--wp--preset--color--accent-red, #c62828); }

	/*
	 * Scroll the whole track across the bar, entering from the right edge and
	 * leaving past the left.
	 *
	 * This previously animated translateX(0) → translateX(-50%), which is the
	 * seamless-loop trick — but that only works when the content is rendered
	 * TWICE in the DOM, so the halfway point lands exactly on the start of the
	 * second copy. The ticker renders its query once, so the animation ran to
	 * the middle of a single list and then snapped back to the start: a visible
	 * jump-cut on every loop, even fully populated. That artifact is what
	 * WP.org ticket #280625 read as "does not flow gracefully".
	 *
	 * Scrolling fully across fixes it without duplicating the markup (which
	 * would have meant either a second identical wp:query and a second database
	 * round-trip, or hand-cloned nodes that drift from the live ones).
	 */
	@keyframes np-ticker {
		from { transform: translateX(100%); }
		to   { transform: translateX(-100%); }
	}

	.np-breaking-dismiss {
		flex-shrink: 0;
		display: flex;
		align-items: center;
		padding-inline: 1rem;
		background: none;
		border: none;
		cursor: pointer;
		color: var(--wp--preset--color--ink-muted, #6b6b6b);
		font-size: 1.25rem;
		line-height: 1;
		transition: color var(--np-transition);
	}
	.np-breaking-dismiss:hover { color: var(--wp--preset--color--ink-primary, #1a1a1a); }

	/* Section navigation bar */
	.np-section-nav {
		background: var(--wp--preset--color--paper-white, #fff);
		border-block-end: var(--np-rule-weight) solid var(--wp--preset--color--ink-primary, #1a1a1a);
		position: sticky;
		top: 0;
		z-index: 80;
	}

	.np-section-nav__inner {
		display: flex;
		align-items: stretch;
		height: var(--np-section-nav-h);
		max-width: var(--np-full-max);
		margin-inline: auto;
		padding-inline: var(--np-gutter);
		overflow-x: auto;
		scrollbar-width: none;
		gap: 0;
	}
	.np-section-nav__inner::-webkit-scrollbar { display: none; }

	.np-section-nav a {
		display: flex;
		align-items: center;
		padding-inline: 1rem;
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.75rem;
		font-weight: 700;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		text-decoration: none;
		color: var(--wp--preset--color--ink-primary, #1a1a1a);
		white-space: nowrap;
		border-block-end: 3px solid transparent;
		transition: color var(--np-transition), border-color var(--np-transition);
	}
	.np-section-nav a:hover,
	.np-section-nav a[aria-current="true"] {
		color: var(--wp--preset--color--accent-red, #c62828);
		border-block-end-color: var(--wp--preset--color--accent-red, #c62828);
	}

	/* Date banner */
	.np-date-banner {
		display: flex;
		align-items: center;
		gap: 1.5rem;
		padding-block: 0.75rem;
		border-block: 1px solid var(--wp--preset--color--rule-light, #e0e0db);
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.75rem;
		letter-spacing: 0.06em;
		color: var(--wp--preset--color--ink-muted, #6b6b6b);
	}

	.np-date-banner::before,
	.np-date-banner::after {
		content: '';
		flex: 1;
		height: 1px;
		background: var(--wp--preset--color--rule-light, #e0e0db);
	}

	/* Story cards */
	.np-story-card {
		display: flex;
		flex-direction: column;
		gap: 0.75rem;
	}

	.np-story-card__image {
		overflow: hidden;
		background: var(--wp--preset--color--paper-light, #eff0ec);
		flex-shrink: 0;
	}

	.np-story-card__image a { display: block; overflow: hidden; }

	.np-story-card__image img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		transition: transform var(--np-transition-slow);
		aspect-ratio: 3 / 2;
	}
	.np-story-card:hover .np-story-card__image img { transform: scale(1.04); }

	.np-story-card__body {
		display: flex;
		flex-direction: column;
		gap: 0.5rem;
	}

	.np-story-card--hero .np-story-card__image img { aspect-ratio: 16 / 9; }

	.np-story-card--horizontal {
		flex-direction: row;
		align-items: start;
	}
	.np-story-card--horizontal .np-story-card__image {
		width: clamp(80px, 28%, 130px);
	}
	.np-story-card--horizontal .np-story-card__image img {
		aspect-ratio: 1;
		height: 100%;
	}
	.np-story-card--horizontal .np-story-card__body { flex: 1; }

	.np-story-card--text {
		border-block-start: 1px solid var(--wp--preset--color--rule-light, #e0e0db);
		padding-block-start: 0.875rem;
	}

	.np-story-card--numbered {
		display: grid;
		grid-template-columns: 2.25rem 1fr;
		gap: 0.875rem;
		align-items: start;
		padding-block: 0.875rem;
		border-block-end: 1px solid var(--wp--preset--color--rule-light, #e0e0db);
	}
	.np-story-card__rank {
		font-family: var(--wp--preset--font-family--playfair-display, Georgia, serif);
		font-size: clamp(1.75rem, 2.5vw, 2.25rem);
		font-weight: 700;
		color: var(--wp--preset--color--rule-medium, #c0c0b8);
		line-height: 1;
		text-align: end;
		padding-block-start: 0.125rem;
	}

	/* Category labels */
	.np-category-label,
	.wp-block-post-terms {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.6875rem;
		font-weight: 700;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		color: var(--wp--preset--color--accent-red, #c62828);
	}

	.wp-block-post-terms a {
		color: inherit;
		text-decoration: none;
		transition: opacity var(--np-transition);
	}
	.wp-block-post-terms a:hover { opacity: 0.7; }

	/* Post titles / headlines */
	.wp-block-post-title {
		font-family: var(--wp--preset--font-family--playfair-display, Georgia, serif);
		font-weight: 700;
		line-height: 1.15;
		letter-spacing: -0.015em;
	}

	.wp-block-post-title a {
		color: inherit;
		text-decoration: none;
		display: -webkit-box;
		-webkit-line-clamp: 4;
		-webkit-box-orient: vertical;
		overflow: hidden;
		transition: color var(--np-transition);
	}
	.wp-block-post-title a:hover { color: var(--wp--preset--color--accent-red, #c62828); }

	.np-headline--hero.wp-block-post-title,
	.np-headline--hero .wp-block-post-title {
		font-size: clamp(1.75rem, 2.5vw + 1rem, 3.5rem);
		line-height: 1.05;
		letter-spacing: -0.025em;
		-webkit-line-clamp: 3;
	}
	.np-headline--secondary.wp-block-post-title,
	.np-headline--secondary .wp-block-post-title {
		font-size: clamp(1.125rem, 1.5vw, 1.75rem);
		-webkit-line-clamp: 3;
	}
	.np-headline--section.wp-block-post-title,
	.np-headline--section .wp-block-post-title {
		font-size: clamp(1rem, 1.25vw, 1.375rem);
	}
	.np-headline--compact.wp-block-post-title,
	.np-headline--compact .wp-block-post-title {
		font-size: clamp(0.9375rem, 0.9vw, 1.0625rem);
		font-weight: 600;
		line-height: 1.3;
		-webkit-line-clamp: 3;
	}

	/* Bylines */
	.np-byline {
		display: flex;
		align-items: center;
		gap: 0.375rem 0.625rem;
		flex-wrap: wrap;
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.8125rem;
	}

	.wp-block-post-author {
		display: flex;
		align-items: center;
		gap: 0.5rem;
	}
	.wp-block-post-author__name {
		font-weight: 600;
		color: var(--wp--preset--color--ink-secondary, #3d3d3d);
		text-decoration: none;
	}
	.wp-block-post-author__avatar img { border-radius: 50%; }

	.wp-block-post-date {
		color: var(--wp--preset--color--ink-muted, #6b6b6b);
	}

	.np-byline__sep {
		color: var(--wp--preset--color--rule-medium, #c0c0b8);
	}

	/* Section block headers */
	.np-section-header {
		display: flex;
		align-items: baseline;
		gap: 1rem;
		margin-block-end: clamp(1rem, 2vw, 2rem);
		padding-block-end: 0.625rem;
		border-block-end: var(--np-rule-weight) solid var(--np-section-color);
	}
	.np-section-header__title {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.8125rem;
		font-weight: 800;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		color: var(--np-section-color);
		white-space: nowrap;
	}
	.np-section-header__rule {
		flex: 1;
		height: 1px;
		background: var(--wp--preset--color--rule-light, #e0e0db);
	}

	/* Empty-state line under a section heading whose query returned nothing.
	   Quiet on purpose: it should read as "this section is waiting for copy",
	   not as an error. See templates/front-page.html and WP.org #280625. */
	.np-section-empty {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.875rem;
		font-style: italic;
		color: var(--wp--preset--color--ink-muted, #6b6b6b);
		margin-block: 0;
		padding-block: 1.5rem;
	}
	.np-section-header__more {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.75rem;
		font-weight: 600;
		letter-spacing: 0.06em;
		text-transform: uppercase;
		color: var(--wp--preset--color--ink-muted, #6b6b6b);
		text-decoration: none;
		white-space: nowrap;
		transition: color var(--np-transition);
	}
	.np-section-header__more:hover { color: var(--np-section-color); }

	.np-section--news     { --np-section-color: var(--np-col-news); }
	.np-section--politics { --np-section-color: var(--np-col-politics); }
	.np-section--business { --np-section-color: var(--np-col-business); }
	.np-section--culture  { --np-section-color: var(--np-col-culture); }
	.np-section--sports   { --np-section-color: var(--np-col-sports); }
	.np-section--tech     { --np-section-color: var(--np-col-tech); }
	.np-section--opinion  { --np-section-color: var(--np-col-opinion); }
	.np-section--world    { --np-section-color: var(--np-col-world); }

	/* Sidebar */
	.np-sidebar {
		display: flex;
		flex-direction: column;
		gap: 2.5rem;
	}

	.np-sidebar-widget {
		border-block-start: var(--np-rule-weight) solid var(--wp--preset--color--ink-primary, #1a1a1a);
		padding-block-start: 1rem;
	}

	.np-sidebar-widget__title {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.75rem;
		font-weight: 800;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		margin-block-end: 1.25rem;
	}

	/* Newsletter CTA */
	.np-newsletter {
		padding: 1.5rem;
		background: var(--wp--preset--color--paper-light, #eff0ec);
		border-inline-start: 4px solid var(--wp--preset--color--accent-red, #c62828);
	}

	.np-newsletter__eyebrow {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.6875rem;
		font-weight: 800;
		letter-spacing: 0.12em;
		text-transform: uppercase;
		color: var(--wp--preset--color--accent-red, #c62828);
		margin-block-end: 0.5rem;
	}

	.np-newsletter__heading {
		font-family: var(--wp--preset--font-family--playfair-display, Georgia, serif);
		font-size: 1.25rem;
		font-weight: 700;
		line-height: 1.25;
		color: var(--wp--preset--color--ink-primary, #1a1a1a);
		margin-block-end: 0.375rem;
	}

	.np-newsletter__desc {
		font-family: var(--wp--preset--font-family--lora, Georgia, serif);
		font-size: 0.875rem;
		color: var(--wp--preset--color--ink-muted, #6b6b6b);
		margin-block-end: 1rem;
		line-height: 1.5;
	}

	.np-newsletter form {
		display: flex;
		flex-direction: column;
		gap: 0.5rem;
	}

	.np-newsletter input[type="email"] {
		width: 100%;
		padding: 0.625rem 0.875rem;
		border: 1px solid var(--wp--preset--color--rule-medium, #c0c0b8);
		background: var(--wp--preset--color--paper-white);
		font-size: 0.875rem;
		color: var(--wp--preset--color--ink-primary, #1a1a1a);
		transition: border-color var(--np-transition);
	}
	.np-newsletter input[type="email"]:focus {
		outline: none;
		border-color: var(--wp--preset--color--accent-red, #c62828);
	}
	.np-newsletter input[type="email"]::placeholder {
		color: var(--wp--preset--color--ink-muted, #6b6b6b);
	}

	.np-newsletter button[type="submit"],
	.np-newsletter .wp-block-button__link {
		padding: 0.625rem 1.25rem !important;
		background: var(--wp--preset--color--accent-red, #c62828) !important;
		color: var(--np-on-accent, #fff) !important;
		border: none;
		font-size: 0.8125rem;
		font-weight: 700;
		letter-spacing: 0.06em;
		text-transform: uppercase;
		cursor: pointer;
		transition: background var(--np-transition);
		border-radius: 0 !important;
	}
	.np-newsletter button[type="submit"]:hover,
	.np-newsletter .wp-block-button__link:hover { background: #a32020 !important; color: #fff !important; }

	/* Ad placeholders */
	.np-ad-placeholder {
		display: flex;
		align-items: center;
		justify-content: center;
		background: var(--wp--preset--color--paper-light, #eff0ec);
		border: 1px dashed var(--wp--preset--color--rule-medium, #c0c0b8);
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.6875rem;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		color: var(--wp--preset--color--ink-muted, #6b6b6b);
		text-align: center;
		width: 100%;
	}

	.np-ad-placeholder--rectangle  { height: 250px; max-width: 300px; }
	.np-ad-placeholder--leaderboard{ height: 90px; }
	.np-ad-placeholder--billboard  { height: 250px; max-width: 970px; }

	/* Single article */
	.np-article { max-width: 780px; margin-inline: auto; }

	.np-article-header { margin-block-end: clamp(1.5rem, 3vw, 3rem); }

	.np-article-kicker {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.75rem;
		font-weight: 700;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		color: var(--wp--preset--color--accent-red, #c62828);
		margin-block-end: 0.625rem;
	}

	.np-article-header .wp-block-post-title {
		font-size: clamp(1.75rem, 3vw + 0.5rem, 3.25rem);
		line-height: 1.08;
		letter-spacing: -0.025em;
		margin-block-end: 1rem;
		-webkit-line-clamp: unset;
	}

	.np-article-deck {
		font-family: var(--wp--preset--font-family--lora, Georgia, serif);
		font-size: clamp(1.125rem, 1.5vw, 1.375rem);
		line-height: 1.6;
		color: var(--wp--preset--color--ink-secondary, #3d3d3d);
		font-style: italic;
		margin-block-end: 1.5rem;
	}

	.np-article-byline-bar {
		display: flex;
		align-items: center;
		flex-wrap: wrap;
		gap: 0.75rem 1.5rem;
		padding-block: 1rem;
		border-block: 1px solid var(--wp--preset--color--rule-light, #e0e0db);
		margin-block-end: 1.75rem;
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.8125rem;
	}

	.wp-block-post-content {
		font-family: var(--wp--preset--font-family--lora, Georgia, serif);
		font-size: clamp(1rem, 1.2vw, 1.125rem);
		line-height: 1.85;
		color: var(--wp--preset--color--ink-secondary, #3d3d3d);
	}

	.wp-block-post-content > * + * { margin-block-start: 1.5em; }
	.wp-block-post-content p { max-width: 68ch; }

	/*
	 * Drop cap — applied per paragraph from the block Styles panel.
	 *
	 * The original rule here was `.np-dropcap .wp-block-post-content >
	 * p:first-of-type::first-letter`, an ancestor selector expecting a
	 * `np-dropcap` class that appeared in no template, part or pattern, so the
	 * drop cap never rendered while style.css and readme.txt both advertised it.
	 *
	 * Styling core's own `.has-drop-cap` seam instead would be the tidier answer
	 * and does NOT work here: core ships `.has-drop-cap:not(:focus)::first-letter`
	 * UNLAYERED, and unlayered CSS beats every layer, so this rule — inside
	 * @layer components — would lose the cascade no matter what specificity it
	 * carried. Rather than hoist one rule out of the layer system, the theme keeps
	 * its own block style and switches core's duplicate control off in theme.json
	 * (settings.typography.dropCap), so editors see exactly one drop-cap control.
	 */
	.is-style-np-dropcap::first-letter {
		float: inline-start;
		font-family: var(--wp--preset--font-family--playfair-display, Georgia, serif);
		font-size: 4.5em;
		font-weight: 700;
		line-height: 0.8;
		padding-inline-end: 0.1em;
		padding-block-start: 0.075em;
		color: var(--wp--preset--color--ink-primary, #1a1a1a);
	}

	.np-reading-progress {
		position: fixed;
		inset-block-start: 0;
		inset-inline-start: 0;
		width: 0%;
		height: 3px;
		background: var(--wp--preset--color--accent-red, #c62828);
		z-index: 9999;
		animation: np-progress linear;
		animation-timeline: scroll(root block);
	}
	@keyframes np-progress {
		from { width: 0%; }
		to   { width: 100%; }
	}

	.np-article-tags {
		display: flex;
		flex-wrap: wrap;
		gap: 0.5rem;
		margin-block-start: 2rem;
		padding-block-start: 2rem;
		border-block-start: 1px solid var(--wp--preset--color--rule-light, #e0e0db);
	}
	.np-article-tags a {
		padding: 0.3rem 0.75rem;
		border: 1px solid var(--wp--preset--color--rule-medium, #c0c0b8);
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.75rem;
		font-weight: 500;
		color: var(--wp--preset--color--ink-secondary, #3d3d3d);
		text-decoration: none;
		transition: border-color var(--np-transition), color var(--np-transition);
	}
	.np-article-tags a:hover {
		border-color: var(--wp--preset--color--accent-red, #c62828);
		color: var(--wp--preset--color--accent-red, #c62828);
	}

	.np-author-card {
		display: flex;
		gap: 1.5rem;
		padding: 1.5rem;
		background: var(--wp--preset--color--paper-off-white, #f8f8f6);
		border-block-start: var(--np-rule-weight) solid var(--wp--preset--color--ink-primary, #1a1a1a);
		margin-block: 2.5rem;
	}
	.np-author-card__avatar img {
		width: 72px;
		height: 72px;
		border-radius: 50%;
		flex-shrink: 0;
		object-fit: cover;
	}
	.np-author-card__name {
		font-family: var(--wp--preset--font-family--playfair-display, Georgia, serif);
		font-size: 1.125rem;
		font-weight: 700;
		margin-block-end: 0.375rem;
	}
	.np-author-card__bio {
		font-family: var(--wp--preset--font-family--lora, Georgia, serif);
		font-size: 0.9375rem;
		line-height: 1.65;
		color: var(--wp--preset--color--ink-secondary, #3d3d3d);
	}

	/* Comments */
	.np-comments {
		margin-block-start: 3rem;
		padding-block-start: 2rem;
		border-block-start: var(--np-rule-weight) solid var(--wp--preset--color--ink-primary, #1a1a1a);
	}
	.np-comments .wp-block-comments-title {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.75rem;
		font-weight: 800;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		color: var(--wp--preset--color--ink-muted, #6b6b6b);
		margin-block-end: 2rem;
	}
	.np-comments .wp-block-comment-template {
		list-style: none;
		margin: 0;
		padding: 0;
	}
	.np-comments .np-comment {
		padding-block: 1.5rem;
		border-block-start: 1px solid var(--wp--preset--color--rule-light, #e0e0db);
	}
	.np-comments .np-comment:first-child { border-block-start: none; padding-block-start: 0; }
	.np-comments .wp-block-avatar img { display: block; }
	.np-comments .wp-block-comment-author-name a {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.875rem;
		font-weight: 700;
		color: var(--wp--preset--color--ink-primary, #1a1a1a);
		text-decoration: none;
	}
	.np-comments .wp-block-comment-date {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.75rem;
		color: var(--wp--preset--color--ink-muted, #6b6b6b);
		margin-block-start: 0.125rem;
		margin-block-end: 0.75rem;
	}
	.np-comments .wp-block-comment-date a { color: inherit; text-decoration: none; }
	.np-comments .wp-block-comment-content {
		font-family: var(--wp--preset--font-family--lora, Georgia, serif);
		font-size: 0.9375rem;
		line-height: 1.7;
		color: var(--wp--preset--color--ink-secondary, #3d3d3d);
	}
	.np-comments .wp-block-comment-content p:last-child { margin-block-end: 0; }
	.np-comments .wp-block-comment-reply-link {
		margin-block-start: 0.5rem;
	}
	.np-comments .wp-block-comment-reply-link a {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.75rem;
		font-weight: 700;
		letter-spacing: 0.04em;
		text-transform: uppercase;
		color: var(--wp--preset--color--accent-red, #c62828);
		text-decoration: none;
	}
	.np-comments .wp-block-comments-pagination {
		margin-block-start: 1.5rem;
	}
	.np-comments .comment-reply-title {
		font-family: var(--wp--preset--font-family--playfair-display, Georgia, serif);
		font-size: 1.375rem;
		font-weight: 700;
		margin-block: 2rem 1rem;
	}
	.np-comments .comment-reply-title small a {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.75rem;
		font-weight: 500;
		text-transform: none;
		letter-spacing: normal;
		color: var(--wp--preset--color--ink-muted, #6b6b6b);
	}
	.np-comments .comment-form p { margin-block-end: 1rem; }
	.np-comments .comment-form label {
		display: block;
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.75rem;
		font-weight: 700;
		letter-spacing: 0.04em;
		text-transform: uppercase;
		color: var(--wp--preset--color--ink-muted, #6b6b6b);
		margin-block-end: 0.375rem;
	}
	.np-comments .comment-form input[type="text"],
	.np-comments .comment-form input[type="email"],
	.np-comments .comment-form input[type="url"],
	.np-comments .comment-form textarea {
		width: 100%;
		font-family: var(--wp--preset--font-family--lora, Georgia, serif);
		font-size: 0.9375rem;
		padding: 0.625rem 0.75rem;
		border: 1px solid var(--wp--preset--color--rule-medium, #c0c0b8);
		border-radius: 0;
		background: var(--wp--preset--color--paper-white, #fff);
		color: var(--wp--preset--color--ink-primary, #1a1a1a);
	}
	.np-comments .comment-form input:focus,
	.np-comments .comment-form textarea:focus {
		outline: 3px solid var(--cl-focus-ring, var(--wp--preset--color--accent-red, #c62828));
		outline-offset: 1px;
	}
	.np-comments .comment-form-cookies-consent {
		display: flex;
		align-items: center;
		gap: 0.5rem;
	}
	.np-comments .comment-form-cookies-consent label {
		display: inline;
		font-weight: 400;
		text-transform: none;
		letter-spacing: normal;
	}
	.np-comments .form-submit input[type="submit"] {
		min-height: 44px;
		padding: 0.625rem 1.5rem;
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.8125rem;
		font-weight: 700;
		letter-spacing: 0.04em;
		text-transform: uppercase;
		background: var(--wp--preset--color--accent-red, #c62828);
		color: var(--np-on-accent, #fff);
		border: none;
		border-radius: 0;
		cursor: pointer;
	}
	.np-comments .form-submit input[type="submit"]:hover { background: #a32020; }

	/* Pagination */
	.np-pagination,
	.wp-block-query-pagination {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-wrap: wrap;
		gap: 0.375rem;
		padding-block: 2.5rem;
		border-block-start: 1px solid var(--wp--preset--color--rule-light, #e0e0db);
	}

	.wp-block-query-pagination-numbers a,
	.wp-block-query-pagination-numbers span {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 2.25rem;
		height: 2.25rem;
		padding-inline: 0.5rem;
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.875rem;
		font-weight: 600;
		color: var(--wp--preset--color--ink-secondary, #3d3d3d);
		text-decoration: none;
		border: 1px solid transparent;
		transition: all var(--np-transition);
	}
	.wp-block-query-pagination-numbers a:hover { border-color: var(--wp--preset--color--rule-medium, #c0c0b8); }
	.wp-block-query-pagination-numbers .current {
		background: var(--wp--preset--color--accent-red, #c62828);
		color: var(--np-on-accent, #fff);
		border-color: var(--wp--preset--color--accent-red, #c62828);
	}

	.wp-block-query-pagination-previous-page,
	.wp-block-query-pagination-next-page {
		padding: 0.5rem 1rem;
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.8125rem;
		font-weight: 700;
		letter-spacing: 0.06em;
		text-transform: uppercase;
		color: var(--wp--preset--color--ink-primary, #1a1a1a);
		text-decoration: none;
		border: 1px solid var(--wp--preset--color--rule-medium, #c0c0b8);
		transition: all var(--np-transition);
	}
	.wp-block-query-pagination-previous-page:hover,
	.wp-block-query-pagination-next-page:hover {
		background: var(--wp--preset--color--ink-primary, #1a1a1a);
		color: var(--wp--preset--color--paper-white);
		border-color: var(--wp--preset--color--ink-primary, #1a1a1a);
	}

	/* Footer */
	.np-footer {
		/* Edition-stable dark chrome (see --np-footer-bg note above). Both the
		   ground AND the base text are fixed: the footer is a self-contained
		   dark band in every edition, so neither may follow palette tokens
		   (base-black / paper-off-white) that invert to light values in the
		   dark editions — that would composite footer text to ~1.1:1. */
		background: var(--np-footer-bg, #0a0a0a);
		color: var(--np-footer-fg, #f8f8f6);
		padding-block: clamp(3rem, 6vw, 6rem);
	}

	.np-footer a {
		color: inherit;
		text-decoration: none;
		opacity: 0.7;
		transition: opacity var(--np-transition);
	}
	.np-footer a:hover { opacity: 1; }

	.np-footer__nameplate {
		font-family: var(--wp--preset--font-family--playfair-display, Georgia, serif);
		font-size: clamp(1.5rem, 3vw, 2.5rem);
		font-weight: 900;
		letter-spacing: -0.03em;
		margin-block-end: 0.5rem;
	}
	.np-footer__tagline {
		font-family: var(--wp--preset--font-family--lora, Georgia, serif);
		font-size: 0.9375rem;
		font-style: italic;
		/* Colour is set per-instance (footer.html rgba); no opacity dim —
		   it would compound the alpha below WCAG 4.5:1. */
		margin-block-end: 2rem;
	}
	.np-footer__nav-heading {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.6875rem;
		font-weight: 800;
		letter-spacing: 0.12em;
		text-transform: uppercase;
		/* Colour is set per-instance (footer.html rgba / section-footer ink-faint);
		   no opacity dim here — it would compound the alpha below WCAG 4.5:1. */
		margin-block-end: 1rem;
	}
	.np-footer__nav li + li { margin-block-start: 0.5rem; }
	.np-footer__nav a {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.875rem;
	}

	.np-footer__bottom {
		border-block-start: 1px solid rgba(255, 255, 255, 0.1);
		padding-block-start: 1.5rem;
		margin-block-start: 3rem;
		display: flex;
		align-items: center;
		justify-content: space-between;
		flex-wrap: wrap;
		gap: 1rem;
	}
	.np-footer__copyright {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.8125rem;
		/* Colour is set per-instance; no opacity dim — see nav-heading note. */
	}




	.wp-block-navigation .wp-block-navigation-item__content {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif) !important;
		font-size: 0.8125rem !important;
		font-weight: 600 !important;
		letter-spacing: 0.04em !important;
		transition: color var(--np-transition) !important;
	}

	.wp-block-pullquote {
		border: none !important;
		border-inline-start: 4px solid var(--wp--preset--color--accent-red, #c62828) !important;
		padding-block: 0.5rem !important;
		padding-inline: 1.5rem !important;
		margin-block: 2rem !important;
	}
	.wp-block-pullquote p {
		font-family: var(--wp--preset--font-family--playfair-display, Georgia, serif);
		font-size: clamp(1.25rem, 2vw, 1.75rem);
		font-weight: 600;
		font-style: italic;
		line-height: 1.4;
		max-width: none !important;
	}
	.wp-block-pullquote cite {
		display: block;
		margin-block-start: 0.75rem;
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.8125rem;
		font-style: normal;
		font-weight: 600;
		letter-spacing: 0.06em;
		text-transform: uppercase;
		color: var(--wp--preset--color--ink-muted, #6b6b6b);
	}

	.wp-block-pullquote.alignwide {
		border: none !important;
		border-block: 2px solid var(--wp--preset--color--ink-primary, #1a1a1a) !important;
		padding-inline: 0 !important;
		padding-block: 1.5rem !important;
		text-align: center;
	}
	.wp-block-pullquote.alignwide p { font-size: clamp(1.5rem, 3vw, 2.5rem); }

	.wp-block-quote {
		border-inline-start: 3px solid var(--wp--preset--color--rule-medium, #c0c0b8);
		padding-inline-start: 1.5rem;
		padding-block: 0.25rem;
		margin-block: 1.5rem;
	}
	.wp-block-quote p { font-style: italic; }
	.wp-block-quote cite {
		display: block;
		margin-block-start: 0.5rem;
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.8125rem;
		font-style: normal;
		color: var(--wp--preset--color--ink-muted, #6b6b6b);
	}

	.wp-block-image figcaption {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif) !important;
		font-size: 0.8125rem !important;
		color: var(--wp--preset--color--ink-muted, #6b6b6b) !important;
		margin-block-start: 0.5rem;
		line-height: 1.5;
	}

	.wp-block-separator { border-color: var(--wp--preset--color--rule-light, #e0e0db); }
	.wp-block-separator.is-style-wide {
		border-color: var(--wp--preset--color--ink-primary, #1a1a1a);
		border-width: 2px;
	}

	.wp-block-table table {
		border-collapse: collapse;
		width: 100%;
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.9375rem;
	}
	.wp-block-table th {
		background: var(--wp--preset--color--ink-primary, #1a1a1a);
		color: var(--wp--preset--color--paper-white);
		font-weight: 700;
		text-align: start;
		padding: 0.75rem 1rem;
		font-size: 0.8125rem;
		letter-spacing: 0.04em;
	}
	.wp-block-table td {
		padding: 0.75rem 1rem;
		border-block-end: 1px solid var(--wp--preset--color--rule-light, #e0e0db);
		vertical-align: top;
	}
	.wp-block-table tr:nth-child(even) td {
		background: var(--wp--preset--color--paper-off-white, #f8f8f6);
	}

	.wp-block-tag-cloud a {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif) !important;
		font-size: 0.8125rem !important;
		font-weight: 500;
		padding: 0.25rem 0.625rem !important;
		border: 1px solid var(--wp--preset--color--rule-light, #e0e0db);
		text-decoration: none;
		transition: all var(--np-transition);
		display: inline-block;
		margin: 0.125rem;
	}
	.wp-block-tag-cloud a:hover {
		background: var(--wp--preset--color--accent-red, #c62828) !important;
		border-color: var(--wp--preset--color--accent-red, #c62828) !important;
		color: var(--np-on-accent, #fff) !important;
	}

	.wp-block-button__link {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif) !important;
		font-weight: 700 !important;
		letter-spacing: 0.06em !important;
		text-transform: uppercase !important;
		font-size: 0.8125rem !important;
		border-radius: 0 !important;
	}
	.is-style-fill .wp-block-button__link {
		background: var(--wp--preset--color--accent-red, #c62828) !important;
		color: var(--np-on-accent, #fff) !important;
	}
	.is-style-outline .wp-block-button__link {
		border-width: 2px !important;
	}

	.wp-block-search__input {
		border-radius: 0 !important;
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif) !important;
	}
	.wp-block-search__button {
		border-radius: 0 !important;
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif) !important;
		background: var(--wp--preset--color--ink-primary, #1a1a1a) !important;
		color: var(--wp--preset--color--paper-white) !important;
	}



	.np-sr-only {
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
		border-width: 0;
	}

	.np-label {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.6875rem;
		font-weight: 700;
		letter-spacing: 0.1em;
		text-transform: uppercase;
	}

	.np-meta {
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.8125rem;
		color: var(--wp--preset--color--ink-muted, #6b6b6b);
	}

	.np-live-badge {
		display: inline-flex;
		align-items: center;
		gap: 0.375rem;
		padding: 0.125rem 0.5rem;
		background: var(--wp--preset--color--breaking-red, #d32f2f);
		color: #fff;
		font-family: var(--wp--preset--font-family--inter, system-ui, sans-serif);
		font-size: 0.6875rem;
		font-weight: 800;
		letter-spacing: 0.1em;
		text-transform: uppercase;
	}
	.np-live-badge::before {
		content: '';
		width: 6px;
		height: 6px;
		border-radius: 50%;
		background: #fff;
		animation: np-blink 1.2s ease-in-out infinite;
	}


@media (prefers-reduced-motion: reduce) {
	/* Reading progress bar: animation-duration:0.01ms doesn't suppress
	   scroll-driven animations (animation-timeline: scroll()). Hide it. */
	.np-reading-progress {
		display: none;
	}

	/* Breaking news ticker: freeze it in place and show all items wrapping
	   so reduced-motion users see the full content without a moving element. */
	.np-breaking-ticker {
		animation: none;
		transform: none;
		flex-wrap: wrap;
		gap: 1rem;
		white-space: normal;
		/* Undo the max-content track width used for the scroll: it is what makes
		   the animated track wider than the bar, and it would stop flex-wrap
		   above from ever wrapping. */
		width: auto;
	}
	.np-breaking-ticker-wrap {
		mask-image: none;
	}

	/* Blink dot on LIVE label: suppress. */
	.np-breaking-label::before,
	.np-live-badge::before {
		animation: none;
	}
}

@media (prefers-contrast: more) {
	:focus-visible { outline-width: 4px; outline-offset: 2px; }
	.np-story-card__image img { transition: none; }
	.wp-block-post-title a { text-decoration: underline; }
}

@media print {
	.np-utility-bar,
	.np-masthead .wp-block-navigation,
	.np-breaking-bar,
	.np-section-nav,
	.np-sidebar,
	.np-footer,
	.wp-block-query-pagination,
	.np-newsletter,
	.np-ad-placeholder,
	.skip-link,
	.np-reading-progress {
		display: none !important;
	}

	body { font-size: 11pt; color: #000; background: #fff; }
	.wp-block-post-content { font-size: 11pt; line-height: 1.6; color: #000; }
	.wp-block-post-title { font-size: 20pt; }
	h2 { font-size: 16pt; } h3 { font-size: 14pt; }

	a[href]::after { content: " (" attr(href) ")"; font-size: 9pt; color: #555; }
	a[href^="#"]::after, a[href^="javascript:"]::after { content: ""; }

	img { max-width: 100% !important; break-inside: avoid; }
	h1, h2, h3 { break-after: avoid; }
	p { orphans: 3; widows: 3; }

	@page { margin: 2cm; }
}


/* Review fixes (ticket #282661): keyboard focus on the utility-bar search,
   readable primary navigation in dark mode, and a visible mobile menu. */


	.np-utility-bar .wp-block-search__button:focus-visible,
	.np-utility-bar .wp-block-search__button:focus,
	.np-utility-bar a:focus-visible {
		outline: 3px solid var(--cl-focus-ring-inverse) !important;
		outline-offset: 2px !important;
		opacity: 1 !important;
	}
	.np-utility-bar .wp-block-search__button:focus-visible,
	.np-utility-bar .wp-block-search__button:focus {
		background: var(--wp--preset--color--accent-red, #c62828) !important;
		color: #fff !important;
	}

	.np-masthead .wp-block-navigation .wp-block-navigation-item__content {
		color: var(--wp--preset--color--ink-primary, #1a1a1a);
	}
	.np-masthead .wp-block-navigation .wp-block-navigation-item__content:hover,
	.np-masthead .wp-block-navigation .wp-block-navigation-item__content:focus-visible {
		color: var(--wp--preset--color--accent-red, #c62828);
	}
	.np-masthead .wp-block-navigation__responsive-container-open,
	.np-masthead .wp-block-navigation__responsive-container-close {
		color: var(--wp--preset--color--ink-primary, #1a1a1a);
	}
	.np-masthead .wp-block-navigation__responsive-container.is-menu-open {
		background-color: var(--wp--preset--color--paper-white, #fff);
		color: var(--wp--preset--color--ink-primary, #1a1a1a);
	}


/* Unlayered on purpose. WordPress emits global styles (theme.json element and
   block colours) outside any @layer, and unlayered rules beat layered ones. The
   footer sits on a fixed dark ground, so its links, tagline and lists must set
   their own light colour here or they inherit the dark link colour and vanish. */
.np-footer a,
.np-footer .wp-block-categories a,
.np-footer .wp-block-page-list a,
.np-footer__nav a {
	color: var(--np-footer-fg, #f8f8f6);
}
.np-footer a:hover,
.np-footer a:focus-visible {
	color: #fff;
	text-decoration: underline;
}
.np-footer .np-footer__tagline {
	/* Fixed value: the footer ground is fixed near-black in every edition. */
	color: #b0b0ab;
}

/* Side gutters: <main> and the footer use a constrained layout, which centres
   content but adds no padding, so below the 1440px content width the text sat
   flush against the viewport edge. */
.np-main,
.np-footer {
	padding-inline: var(--np-gutter);
}

/* The breaking-news query renders a vertical <ul>; lay it out as the horizontal
   track the ticker animation expects. */
.np-breaking-ticker .wp-block-post-template {
	display: flex;
	gap: 4rem;
	margin: 0;
	padding: 0;
	list-style: none;
	white-space: nowrap;
}
.np-breaking-ticker .wp-block-post-template > li {
	margin: 0;
	flex: none;
}

/* WCAG 2.2 target size (2.5.8): the dismiss control and ticker links need a
   comfortably large hit area. */
.np-breaking-dismiss button {
	min-width: 44px;
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.np-breaking-ticker .wp-block-post-title a {
	display: inline-block;
	padding-block: 0.75rem;
}

.np-breaking-bar {
	min-height: max(var(--np-breaking-height, 2.5rem), 44px);
}

.np-breaking-dismiss {
	position: relative;
	z-index: 2;
	background: var(--wp--preset--color--paper-off-white, #f8f8f6);
}
.np-breaking-ticker-wrap {
	min-width: 0;
	position: relative;
	z-index: 1;
}

.np-breaking-bar.hidden {
	display: none;
}

.np-trending-query .wp-block-post-template {
	counter-reset: np-rank;
}
.np-story-card__rank {
	counter-increment: np-rank;
}
.np-story-card__rank::before {
	content: counter(np-rank);
}