/**
 * NeonPress 1.10.0 design presets.
 * Loaded after style.css so complete presets can override legacy combinations.
 */

/* --------------------------------------------------------------------------
   Seventy complete header presets
   -------------------------------------------------------------------------- */

.np-header--has-preset {
	--np-preset-bg: var(--np-bg);
	--np-preset-fg: var(--np-ink);
	--np-preset-line: var(--np-border);
	--np-preset-nav-bg: var(--np-surface);
	--np-preset-nav-fg: var(--np-ink);
	--np-preset-action-bg: var(--np-surface);
	--np-preset-action-fg: var(--np-ink);
	--np-preset-highlight: var(--np-accent);
	border-color: var(--np-preset-line);
	background: var(--np-preset-bg);
	color: var(--np-preset-fg);
	backdrop-filter: none;
}

.np-header--has-preset .np-brand,
.np-header--has-preset .np-brand__link,
.np-header--has-preset .np-brand__link:hover,
.np-header--has-preset .np-brand__link:focus-visible,
.np-header--has-preset .np-brand__name {
	color: var(--np-preset-fg);
}

.np-header--has-preset .np-navigation {
	border-color: var(--np-preset-line);
	background: var(--np-preset-nav-bg);
	box-shadow: none;
}

.np-header--has-preset .np-menu > li > a,
.np-header--has-preset .np-menu > li > a:hover,
.np-header--has-preset .np-menu > li > a:focus-visible,
.np-header--has-preset .np-menu > .current-menu-item > a,
.np-header--has-preset .np-menu > .current-category-ancestor > a {
	color: var(--np-preset-nav-fg);
}

.np-header--has-preset .np-menu > li > a:hover,
.np-header--has-preset .np-menu > li > a:focus-visible,
.np-header--has-preset .np-menu > .current-menu-item > a,
.np-header--has-preset .np-menu > .current-category-ancestor > a {
	background: color-mix(in srgb, var(--np-preset-highlight) 16%, transparent);
}

.np-header--has-preset .np-menu > li > a:hover::after,
.np-header--has-preset .np-menu > li > a:focus-visible::after,
.np-header--has-preset .np-menu > .current-menu-item > a::after,
.np-header--has-preset .np-menu > .current-category-ancestor > a::after {
	background: var(--np-preset-highlight);
}

.np-header--has-preset .np-social,
.np-header--has-preset .np-icon-button {
	border-color: var(--np-preset-line);
	background: var(--np-preset-action-bg);
	color: var(--np-preset-action-fg);
}

.np-header--has-preset .np-search-trigger {
	border: 1px solid var(--np-preset-line) !important;
	background: var(--np-preset-action-bg) !important;
	color: var(--np-preset-action-fg) !important;
	box-shadow: none;
}

.np-header--has-preset .np-search-trigger:hover,
.np-header--has-preset .np-search-trigger:focus-visible,
.np-header--has-preset .np-search-disclosure[open] > .np-search-trigger {
	border-color: var(--np-preset-highlight) !important;
	background: var(--np-preset-highlight) !important;
	color: #071018 !important;
}

.np-header--has-preset .np-offer-button {
	background: var(--np-preset-highlight);
	color: #071018;
}

/* 01 — Metro compatto */
.np-header--variant-metro {
	--np-preset-bg: #071a31;
	--np-preset-fg: #f7fbff;
	--np-preset-line: rgba(255, 255, 255, 0.16);
	--np-preset-nav-bg: transparent;
	--np-preset-nav-fg: #f7fbff;
	--np-preset-action-bg: rgba(255, 255, 255, 0.09);
	--np-preset-action-fg: #fff;
	border-top: 4px solid var(--np-accent);
}

.np-header--variant-metro .np-navigation {
	border-width: 0 0 0 1px;
	border-radius: 0;
}

.np-header--variant-metro .np-menu > li > a {
	font-size: 12px;
	letter-spacing: 0.035em;
	text-transform: uppercase;
}

/* 02 — Aurora centrale */
.np-header--variant-aurora {
	--np-preset-bg: linear-gradient(112deg, #142f74 0%, #4354b8 48%, #8b3fb1 100%);
	--np-preset-fg: #fff;
	--np-preset-line: rgba(255, 255, 255, 0.18);
	--np-preset-nav-bg: rgba(255, 255, 255, 0.11);
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: rgba(255, 255, 255, 0.13);
	--np-preset-action-fg: #fff;
	--np-preset-highlight: #d9ff57;
}

.np-header--variant-aurora .np-navigation {
	border-radius: 999px;
	backdrop-filter: blur(14px);
}

/* 03 — Newsroom a doppio livello */
.np-header--variant-newsroom {
	--np-preset-bg: #fff;
	--np-preset-fg: #0b1830;
	--np-preset-line: #d8dee8;
	--np-preset-nav-bg: #0b1830;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #eff2f6;
	--np-preset-action-fg: #0b1830;
	--np-preset-highlight: #ff526a;
	border-top: 5px solid #ff526a;
}

.np-header--variant-newsroom .np-navigation {
	border-radius: 3px;
}

/* 04 — Minimal lineare */
.np-header--variant-minimal-line {
	--np-preset-bg: color-mix(in srgb, #fff 95%, transparent);
	--np-preset-fg: #11151c;
	--np-preset-line: #dfe3e9;
	--np-preset-nav-bg: transparent;
	--np-preset-nav-fg: #11151c;
	--np-preset-action-bg: transparent;
	--np-preset-action-fg: #11151c;
	--np-preset-highlight: #3168ff;
	backdrop-filter: blur(20px);
}

.np-header--variant-minimal-line .np-navigation {
	border-width: 0 0 1px;
	border-radius: 0;
}

.np-header--variant-minimal-line .np-menu > li > a::before {
	display: none;
}

/* 05 — Dock sospeso in vetro */
.np-header--variant-glass-dock {
	--np-preset-bg: transparent;
	--np-preset-fg: var(--np-ink);
	--np-preset-line: color-mix(in srgb, var(--np-border) 76%, transparent);
	--np-preset-nav-bg: color-mix(in srgb, var(--np-surface) 68%, transparent);
	--np-preset-nav-fg: var(--np-ink);
	--np-preset-action-bg: color-mix(in srgb, var(--np-surface) 74%, transparent);
	--np-preset-action-fg: var(--np-ink);
	border: 0;
}

.np-header--variant-glass-dock .np-header__shell {
	margin-top: 10px;
	margin-bottom: 10px;
	border: 1px solid var(--np-preset-line);
	border-radius: 22px;
	background: color-mix(in srgb, var(--np-bg) 76%, transparent);
	box-shadow: 0 16px 38px rgba(7, 21, 39, 0.12);
	backdrop-filter: blur(24px) saturate(1.18);
}

.np-header--variant-glass-dock .np-navigation {
	border-radius: 16px;
	backdrop-filter: blur(18px);
}

/* 06 — Split corallo */
.np-header--variant-coral-split {
	--np-preset-bg: #fff5f1;
	--np-preset-fg: #2a1720;
	--np-preset-line: #f0b9ad;
	--np-preset-nav-bg: #ff765f;
	--np-preset-nav-fg: #32120d;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #2a1720;
	--np-preset-highlight: #d7ff3f;
	border-bottom-width: 3px;
}

.np-header--variant-coral-split .np-navigation {
	border-radius: 7px 22px 7px 22px;
}

/* 07 — Rail midnight */
.np-header--variant-midnight-rail {
	--np-preset-bg: #081528;
	--np-preset-fg: #f4f8ff;
	--np-preset-line: #29405f;
	--np-preset-nav-bg: #102641;
	--np-preset-nav-fg: #f4f8ff;
	--np-preset-action-bg: #122b4a;
	--np-preset-action-fg: #fff;
	--np-preset-highlight: #45d8db;
}

.np-header--variant-midnight-rail .np-brand {
	align-self: stretch;
	padding-right: 22px;
	border-right: 2px solid #45d8db;
}

.np-header--variant-midnight-rail .np-navigation {
	border-radius: 999px;
}

/* 08 — Masthead editoriale */
.np-header--variant-paper-masthead {
	--np-preset-bg: #f4ecd9;
	--np-preset-fg: #2d281f;
	--np-preset-line: #9e8c6a;
	--np-preset-nav-bg: transparent;
	--np-preset-nav-fg: #2d281f;
	--np-preset-action-bg: #fffaf0;
	--np-preset-action-fg: #2d281f;
	--np-preset-highlight: #a53b32;
	border-top: 1px solid #9e8c6a;
	border-bottom: 4px double #9e8c6a;
}

.np-header--variant-paper-masthead .np-brand__name {
	font-family: Georgia, "Times New Roman", serif;
	font-weight: 800;
	letter-spacing: -0.025em;
}

.np-header--variant-paper-masthead .np-navigation {
	border-width: 1px 0 0;
	border-radius: 0;
}

.np-header--variant-paper-masthead .np-menu > li > a::before {
	width: 4px;
	height: 4px;
	flex-basis: 4px;
	border-radius: 0;
	box-shadow: none;
}

/* 09 — Griglia tech */
.np-header--variant-tech-grid {
	--np-preset-bg: #092349;
	--np-preset-fg: #f2f8ff;
	--np-preset-line: rgba(103, 190, 255, 0.35);
	--np-preset-nav-bg: rgba(8, 28, 60, 0.72);
	--np-preset-nav-fg: #f2f8ff;
	--np-preset-action-bg: rgba(27, 84, 139, 0.55);
	--np-preset-action-fg: #fff;
	--np-preset-highlight: #62e8e0;
	background-color: #092349;
	background-image: linear-gradient(rgba(98, 232, 224, 0.065) 1px, transparent 1px), linear-gradient(90deg, rgba(98, 232, 224, 0.065) 1px, transparent 1px);
	background-size: 24px 24px;
}

.np-header--variant-tech-grid .np-navigation {
	border-radius: 4px;
}

.np-header--variant-tech-grid .np-menu > li > a {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 12px;
}

/* 10 — Menu a capsule */
.np-header--variant-capsule {
	--np-preset-bg: #f7f9fc;
	--np-preset-fg: #0c1c34;
	--np-preset-line: #dfe5ee;
	--np-preset-nav-bg: #fff;
	--np-preset-nav-fg: #0c1c34;
	--np-preset-action-bg: #0c1c34;
	--np-preset-action-fg: #fff;
	--np-preset-highlight: #d7ff3f;
}

.np-header--variant-capsule .np-navigation {
	padding: 6px;
	border-radius: 999px;
	box-shadow: 0 8px 22px rgba(7, 21, 39, 0.08);
}

.np-header--variant-capsule .np-menu > li > a {
	min-height: 38px;
	border-radius: 999px;
}

.np-header--variant-capsule .np-menu > li > a::after,
.np-header--variant-capsule .np-menu > li > a::before {
	display: none;
}

/* 11 — Ribbon a tutta larghezza */
.np-header--variant-wide-ribbon {
	--np-preset-bg: #fff;
	--np-preset-fg: #0c1c34;
	--np-preset-line: #dbe2eb;
	--np-preset-nav-bg: linear-gradient(90deg, #0b2350, #245ab5 54%, #6738a6);
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #eff3f8;
	--np-preset-action-fg: #0c1c34;
	--np-preset-highlight: #d7ff3f;
}

.np-header--variant-wide-ribbon .np-navigation {
	border: 0;
	border-radius: 0;
	box-shadow: 0 8px 18px rgba(16, 45, 96, 0.18);
}

/* 12 — Logo protagonista */
.np-header--variant-center-stage {
	--np-preset-bg: #fff;
	--np-preset-fg: #071b38;
	--np-preset-line: #e0e5ec;
	--np-preset-nav-bg: transparent;
	--np-preset-nav-fg: #071b38;
	--np-preset-action-bg: #f1f4f7;
	--np-preset-action-fg: #071b38;
	--np-preset-highlight: #3168ff;
	border-bottom: 6px solid #071b38;
}

.np-header--variant-center-stage .np-brand__name {
	font-size: clamp(31px, 3.2vw, 46px);
	letter-spacing: -0.065em;
}

.np-header--variant-center-stage .np-navigation {
	border-width: 1px 0 0;
	border-radius: 0;
}

/* 13 — Menu in primo piano */
.np-header--variant-menu-first {
	--np-preset-bg: #fff;
	--np-preset-fg: #0b1b32;
	--np-preset-line: #d9e0e9;
	--np-preset-nav-bg: #0b1b32;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #eef2f6;
	--np-preset-action-fg: #0b1b32;
	--np-preset-highlight: #ff596e;
}

.np-header--variant-menu-first .np-navigation {
	border-radius: 0 0 14px 14px;
}

/* 14 — Monocromatico */
.np-header--variant-monochrome {
	--np-preset-bg: #080808;
	--np-preset-fg: #fff;
	--np-preset-line: #414141;
	--np-preset-nav-bg: transparent;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #080808;
	--np-preset-highlight: #fff;
}

.np-header--variant-monochrome .np-navigation {
	border-width: 0 1px;
	border-radius: 0;
}

.np-header--variant-monochrome .np-menu > li > a::before {
	background: #fff;
	box-shadow: none;
}

/* 15 — Cornice lime */
.np-header--variant-accent-frame {
	--np-preset-bg: #f9fbf4;
	--np-preset-fg: #101810;
	--np-preset-line: #26351d;
	--np-preset-nav-bg: #152410;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #101810;
	--np-preset-highlight: #d7ff3f;
	border: 5px solid #d7ff3f;
	border-right: 0;
	border-left: 0;
}

.np-header--variant-accent-frame .np-navigation {
	border-radius: 8px;
	box-shadow: inset 0 -4px 0 #d7ff3f;
}

/* 16 — Blueprint blu */
.np-header--variant-blueprint {
	--np-preset-bg: #06366f;
	--np-preset-fg: #eef7ff;
	--np-preset-line: rgba(185, 223, 255, 0.36);
	--np-preset-nav-bg: rgba(0, 30, 71, 0.38);
	--np-preset-nav-fg: #eef7ff;
	--np-preset-action-bg: rgba(255, 255, 255, 0.11);
	--np-preset-action-fg: #fff;
	--np-preset-highlight: #75d7ff;
	background-color: #06366f;
	background-image: linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px);
	background-size: 100% 12px;
}

.np-header--variant-blueprint .np-navigation {
	border-style: dashed;
	border-radius: 2px;
}

/* 17 — Ultra compatto */
.np-header--variant-ultra-compact {
	--np-preset-bg: #fff;
	--np-preset-fg: #10151d;
	--np-preset-line: #e2e6eb;
	--np-preset-nav-bg: transparent;
	--np-preset-nav-fg: #10151d;
	--np-preset-action-bg: #f1f3f6;
	--np-preset-action-fg: #10151d;
	--np-preset-highlight: #3168ff;
}

.np-header--variant-ultra-compact .np-navigation {
	border: 0;
	border-radius: 0;
}

.np-header--variant-ultra-compact .np-menu > li > a {
	min-height: 36px;
	font-size: 12px;
}

.np-header--variant-ultra-compact .np-brand__name {
	font-size: 23px;
}

/* 18 — Luxe editoriale */
.np-header--variant-luxe {
	--np-preset-bg: #211b18;
	--np-preset-fg: #f6efe4;
	--np-preset-line: #806c50;
	--np-preset-nav-bg: transparent;
	--np-preset-nav-fg: #f6efe4;
	--np-preset-action-bg: #352c26;
	--np-preset-action-fg: #f6efe4;
	--np-preset-highlight: #d7b878;
	border-top: 3px solid #d7b878;
}

.np-header--variant-luxe .np-brand__name {
	font-family: Georgia, "Times New Roman", serif;
	font-weight: 700;
	letter-spacing: 0.015em;
}

.np-header--variant-luxe .np-navigation {
	border-width: 1px 0;
	border-radius: 0;
}

.np-header--variant-luxe .np-menu > li > a {
	font-family: Georgia, "Times New Roman", serif;
	letter-spacing: 0.025em;
}

/* 19 — Neon night */
.np-header--variant-neon-night {
	--np-preset-bg: #05080e;
	--np-preset-fg: #f3f9ff;
	--np-preset-line: rgba(56, 231, 224, 0.38);
	--np-preset-nav-bg: #07141d;
	--np-preset-nav-fg: #f3f9ff;
	--np-preset-action-bg: #0d1923;
	--np-preset-action-fg: #fff;
	--np-preset-highlight: #38e7e0;
	border-bottom: 2px solid #38e7e0;
	box-shadow: 0 8px 28px rgba(56, 231, 224, 0.13);
}

.np-header--variant-neon-night .np-navigation {
	border-radius: 5px;
	box-shadow: inset 0 0 22px rgba(56, 231, 224, 0.06), 0 0 18px rgba(56, 231, 224, 0.08);
}

.np-header--variant-neon-night .np-brand__mark {
	box-shadow: 0 0 18px rgba(215, 255, 63, 0.5);
}

/* 20 — Aria e spazio */
.np-header--variant-airy {
	--np-preset-bg: #fff;
	--np-preset-fg: #162032;
	--np-preset-line: #e7eaf0;
	--np-preset-nav-bg: transparent;
	--np-preset-nav-fg: #162032;
	--np-preset-action-bg: #f7f8fa;
	--np-preset-action-fg: #162032;
	--np-preset-highlight: #6b78ff;
}

.np-header--variant-airy .np-navigation {
	border-width: 1px 0 0;
	border-radius: 0;
}

.np-header--variant-airy .np-menu > li > a {
	padding-right: 18px;
	padding-left: 18px;
	font-weight: 650;
}

/* 21 — Obsidian bar. */
.np-header--variant-obsidian-bar {
	--np-preset-bg: #0a0d12;
	--np-preset-fg: #f8fafc;
	--np-preset-line: #343a43;
	--np-preset-nav-bg: transparent;
	--np-preset-nav-fg: #f8fafc;
	--np-preset-action-bg: #1b2028;
	--np-preset-action-fg: #fff;
	--np-preset-highlight: #ffcc4d;
	border-bottom: 3px solid #ffcc4d;
}

/* 22 — Amber line. */
.np-header--variant-amber-line {
	--np-preset-bg: #fff8e8;
	--np-preset-fg: #2f2415;
	--np-preset-line: #e6c982;
	--np-preset-nav-bg: transparent;
	--np-preset-nav-fg: #2f2415;
	--np-preset-action-bg: #fff0c4;
	--np-preset-action-fg: #2f2415;
	--np-preset-highlight: #d78100;
	border-top: 3px solid #d78100;
}

/* 23 — Steel compact. */
.np-header--variant-steel-compact {
	--np-preset-bg: linear-gradient(180deg, #f7f9fb, #dfe6ed);
	--np-preset-fg: #172332;
	--np-preset-line: #aeb8c4;
	--np-preset-nav-bg: #243447;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #eef2f5;
	--np-preset-action-fg: #172332;
	--np-preset-highlight: #5de1e6;
}

/* 24 — Ice minimal. */
.np-header--variant-ice-minimal {
	--np-preset-bg: color-mix(in srgb, #f6fcff 92%, transparent);
	--np-preset-fg: #102238;
	--np-preset-line: #cfe3f2;
	--np-preset-nav-bg: transparent;
	--np-preset-nav-fg: #102238;
	--np-preset-action-bg: transparent;
	--np-preset-action-fg: #102238;
	--np-preset-highlight: #2c92ff;
	backdrop-filter: blur(18px) saturate(1.12);
}

/* 25 — Cherry topline. */
.np-header--variant-cherry-topline {
	--np-preset-bg: #fff;
	--np-preset-fg: #22151a;
	--np-preset-line: #e9d6dc;
	--np-preset-nav-bg: #fff;
	--np-preset-nav-fg: #22151a;
	--np-preset-action-bg: #f8eef1;
	--np-preset-action-fg: #22151a;
	--np-preset-highlight: #c81d4a;
	border-top: 5px solid #c81d4a;
}

.np-header--has-preset:is(.np-header--variant-obsidian-bar, .np-header--variant-amber-line, .np-header--variant-steel-compact, .np-header--variant-ice-minimal, .np-header--variant-cherry-topline) .np-navigation {
	border-width: 0 0 1px;
	border-radius: 0;
}

.np-header--has-preset:is(.np-header--variant-obsidian-bar, .np-header--variant-amber-line, .np-header--variant-steel-compact, .np-header--variant-ice-minimal, .np-header--variant-cherry-topline) .np-menu > li > a {
	min-height: 38px;
	font-size: 12px;
	letter-spacing: 0.035em;
}

/* 26 — Sunrise stack. */
.np-header--variant-sunrise-stack {
	--np-preset-bg: linear-gradient(112deg, #ffe9bc, #ffb885 56%, #f58a99);
	--np-preset-fg: #321e1a;
	--np-preset-line: rgba(72, 34, 25, 0.2);
	--np-preset-nav-bg: #5b2245;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: rgba(255, 255, 255, 0.58);
	--np-preset-action-fg: #321e1a;
	--np-preset-highlight: #ffd75a;
}

/* 27 — Terracotta news. */
.np-header--variant-terracotta-news {
	--np-preset-bg: #fbf0e8;
	--np-preset-fg: #3b2019;
	--np-preset-line: #d8a18f;
	--np-preset-nav-bg: #a94832;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #fff9f4;
	--np-preset-action-fg: #3b2019;
	--np-preset-highlight: #f9c74f;
	border-top: 4px solid #a94832;
}

/* 28 — Ocean deck. */
.np-header--variant-ocean-deck {
	--np-preset-bg: #eaf8fb;
	--np-preset-fg: #0b3446;
	--np-preset-line: #8fcbd3;
	--np-preset-nav-bg: #0c5f73;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #0b3446;
	--np-preset-highlight: #65e0c2;
}

/* 29 — Cloud tabs. */
.np-header--variant-cloud-tabs {
	--np-preset-bg: #f7f9fd;
	--np-preset-fg: #202b44;
	--np-preset-line: #dce2ef;
	--np-preset-nav-bg: transparent;
	--np-preset-nav-fg: #202b44;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #202b44;
	--np-preset-highlight: #6d76e8;
}

/* 30 — Silver newsroom. */
.np-header--variant-silver-newsroom {
	--np-preset-bg: linear-gradient(180deg, #f8fafb, #e6eaee);
	--np-preset-fg: #17202a;
	--np-preset-line: #b7c0c9;
	--np-preset-nav-bg: #273443;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #17202a;
	--np-preset-highlight: #c7ff47;
}

.np-header--has-preset:is(.np-header--variant-sunrise-stack, .np-header--variant-terracotta-news, .np-header--variant-ocean-deck, .np-header--variant-cloud-tabs, .np-header--variant-silver-newsroom) .np-navigation {
	border-radius: 0;
	box-shadow: 0 7px 18px color-mix(in srgb, var(--np-preset-fg) 13%, transparent);
}

.np-header--variant-cloud-tabs .np-navigation {
	padding: 5px;
	border-radius: 12px 12px 0 0;
	box-shadow: none;
}

.np-header--variant-cloud-tabs .np-menu > li > a {
	border-radius: 9px 9px 0 0;
}

/* 31 — Lavender center. */
.np-header--variant-lavender-center {
	--np-preset-bg: linear-gradient(130deg, #f3edff, #dfd8ff);
	--np-preset-fg: #2d2150;
	--np-preset-line: #bdb0e7;
	--np-preset-nav-bg: rgba(255, 255, 255, 0.54);
	--np-preset-nav-fg: #2d2150;
	--np-preset-action-bg: rgba(255, 255, 255, 0.7);
	--np-preset-action-fg: #2d2150;
	--np-preset-highlight: #7c4dff;
}

/* 32 — Sand serif. */
.np-header--variant-sand-serif {
	--np-preset-bg: #efe3cc;
	--np-preset-fg: #332a1f;
	--np-preset-line: #ab9675;
	--np-preset-nav-bg: transparent;
	--np-preset-nav-fg: #332a1f;
	--np-preset-action-bg: #f9f3e8;
	--np-preset-action-fg: #332a1f;
	--np-preset-highlight: #9e4d2e;
	border-bottom: 4px double #ab9675;
}

/* 33 — Gold masthead. */
.np-header--variant-gold-masthead {
	--np-preset-bg: #12100c;
	--np-preset-fg: #f7ecd0;
	--np-preset-line: #7d6a39;
	--np-preset-nav-bg: transparent;
	--np-preset-nav-fg: #f7ecd0;
	--np-preset-action-bg: #272218;
	--np-preset-action-fg: #f7ecd0;
	--np-preset-highlight: #d8b458;
	border-top: 2px solid #d8b458;
	border-bottom: 2px solid #d8b458;
}

/* 34 — Ultramarine stage. */
.np-header--variant-ultramarine-stage {
	--np-preset-bg: #16296f;
	--np-preset-fg: #fff;
	--np-preset-line: rgba(255, 255, 255, 0.24);
	--np-preset-nav-bg: #fff;
	--np-preset-nav-fg: #16296f;
	--np-preset-action-bg: rgba(255, 255, 255, 0.13);
	--np-preset-action-fg: #fff;
	--np-preset-highlight: #ffdc59;
}

/* 35 — Ivory journal. */
.np-header--variant-ivory-journal {
	--np-preset-bg: #fffdf5;
	--np-preset-fg: #1d1a15;
	--np-preset-line: #2b2721;
	--np-preset-nav-bg: transparent;
	--np-preset-nav-fg: #1d1a15;
	--np-preset-action-bg: #f4efe1;
	--np-preset-action-fg: #1d1a15;
	--np-preset-highlight: #a21d2d;
	border-top: 4px double #2b2721;
	border-bottom: 4px double #2b2721;
}

.np-header--has-preset:is(.np-header--variant-lavender-center, .np-header--variant-sand-serif, .np-header--variant-gold-masthead, .np-header--variant-ultramarine-stage, .np-header--variant-ivory-journal) .np-navigation {
	border-width: 1px 0;
	border-radius: 0;
}

.np-header--variant-lavender-center .np-navigation {
	border-width: 1px;
	border-radius: 999px;
	backdrop-filter: blur(14px);
}

.np-header--has-preset:is(.np-header--variant-sand-serif, .np-header--variant-gold-masthead, .np-header--variant-ivory-journal) .np-brand__name,
.np-header--has-preset:is(.np-header--variant-sand-serif, .np-header--variant-gold-masthead, .np-header--variant-ivory-journal) .np-menu > li > a {
	font-family: Georgia, "Times New Roman", serif;
}

/* 36 — Ruby banner. */
.np-header--variant-ruby-banner {
	--np-preset-bg: #fff;
	--np-preset-fg: #251116;
	--np-preset-line: #dfb8c2;
	--np-preset-nav-bg: #a41336;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #f8edf0;
	--np-preset-action-fg: #251116;
	--np-preset-highlight: #ffd75a;
}

/* 37 — Navy step. */
.np-header--variant-navy-step {
	--np-preset-bg: #eef2f7;
	--np-preset-fg: #10213d;
	--np-preset-line: #bdc8d6;
	--np-preset-nav-bg: linear-gradient(90deg, #0f2d56, #1c4d86);
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #10213d;
	--np-preset-highlight: #5be3ff;
}

/* 38 — Emerald strip. */
.np-header--variant-emerald-strip {
	--np-preset-bg: #f3fbf7;
	--np-preset-fg: #123326;
	--np-preset-line: #99c9b3;
	--np-preset-nav-bg: #0e744f;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #123326;
	--np-preset-highlight: #d9ff57;
}

/* 39 — Midnight banner. */
.np-header--variant-midnight-banner {
	--np-preset-bg: #081421;
	--np-preset-fg: #f5f8ff;
	--np-preset-line: #294158;
	--np-preset-nav-bg: #10283e;
	--np-preset-nav-fg: #f5f8ff;
	--np-preset-action-bg: #17344e;
	--np-preset-action-fg: #fff;
	--np-preset-highlight: #ef62ff;
}

/* 40 — Magenta signal. */
.np-header--variant-magenta-signal {
	--np-preset-bg: #fff4fb;
	--np-preset-fg: #391029;
	--np-preset-line: #e6a8cb;
	--np-preset-nav-bg: #c62179;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #391029;
	--np-preset-highlight: #ffe66d;
}

.np-header--has-preset:is(.np-header--variant-ruby-banner, .np-header--variant-navy-step, .np-header--variant-emerald-strip, .np-header--variant-midnight-banner, .np-header--variant-magenta-signal) .np-navigation {
	border: 0;
	border-radius: 0 0 15px 15px;
	box-shadow: 0 8px 20px rgba(7, 21, 39, 0.18);
}

/* 41 — Forest rail. */
.np-header--variant-forest-rail {
	--np-preset-bg: #10251b;
	--np-preset-fg: #f4fff7;
	--np-preset-line: #315941;
	--np-preset-nav-bg: #18392a;
	--np-preset-nav-fg: #f4fff7;
	--np-preset-action-bg: #1e4433;
	--np-preset-action-fg: #fff;
	--np-preset-highlight: #8be35c;
}

/* 42 — Graphite frame. */
.np-header--variant-graphite-frame {
	--np-preset-bg: #f5f6f7;
	--np-preset-fg: #17191d;
	--np-preset-line: #777e87;
	--np-preset-nav-bg: #2a2e34;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #17191d;
	--np-preset-highlight: #ff705a;
	border-top: 1px solid #777e87;
	border-bottom: 1px solid #777e87;
}

/* 43 — Bronze editorial. */
.np-header--variant-bronze-editorial {
	--np-preset-bg: #2c231d;
	--np-preset-fg: #f7eadb;
	--np-preset-line: #866d55;
	--np-preset-nav-bg: transparent;
	--np-preset-nav-fg: #f7eadb;
	--np-preset-action-bg: #40342b;
	--np-preset-action-fg: #f7eadb;
	--np-preset-highlight: #d4a76c;
}

/* 44 — Teal balance. */
.np-header--variant-teal-balance {
	--np-preset-bg: #eaf8f7;
	--np-preset-fg: #103b3e;
	--np-preset-line: #82bfc1;
	--np-preset-nav-bg: #0b6669;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #103b3e;
	--np-preset-highlight: #f1d65c;
}

/* 45 — Plum gallery. */
.np-header--variant-plum-gallery {
	--np-preset-bg: #2b142d;
	--np-preset-fg: #fff4ff;
	--np-preset-line: #724b76;
	--np-preset-nav-bg: #4b224f;
	--np-preset-nav-fg: #fff4ff;
	--np-preset-action-bg: #56285b;
	--np-preset-action-fg: #fff;
	--np-preset-highlight: #ff96d2;
}

.np-header--has-preset:is(.np-header--variant-forest-rail, .np-header--variant-graphite-frame, .np-header--variant-bronze-editorial, .np-header--variant-teal-balance, .np-header--variant-plum-gallery) .np-navigation {
	border-radius: 14px;
}

.np-header--variant-bronze-editorial .np-brand__name,
.np-header--variant-bronze-editorial .np-menu > li > a {
	font-family: Georgia, "Times New Roman", serif;
}

/* 46 — Coral island. */
.np-header--variant-coral-island {
	--np-preset-bg: #fff6f2;
	--np-preset-fg: #32201d;
	--np-preset-line: #efbcb3;
	--np-preset-nav-bg: #ff806e;
	--np-preset-nav-fg: #30120e;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #32201d;
	--np-preset-highlight: #d9ff57;
}

/* 47 — Sky border. */
.np-header--variant-sky-border {
	--np-preset-bg: #f2f9ff;
	--np-preset-fg: #0c3152;
	--np-preset-line: #9ec9eb;
	--np-preset-nav-bg: #2588d8;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #0c3152;
	--np-preset-highlight: #c7ff55;
	border-top: 4px solid #2588d8;
}

/* 48 — Lime ticker. */
.np-header--variant-lime-ticker {
	--np-preset-bg: #151d12;
	--np-preset-fg: #fff;
	--np-preset-line: #4b5f3e;
	--np-preset-nav-bg: #d7ff3f;
	--np-preset-nav-fg: #14200d;
	--np-preset-action-bg: #25321f;
	--np-preset-action-fg: #fff;
	--np-preset-highlight: #fff;
}

/* 49 — Lilac ribbon. */
.np-header--variant-lilac-ribbon {
	--np-preset-bg: #fbf7ff;
	--np-preset-fg: #352245;
	--np-preset-line: #c9afd9;
	--np-preset-nav-bg: #9a6bc7;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #352245;
	--np-preset-highlight: #f3e05f;
}

/* 50 — Prism wide. */
.np-header--variant-prism-wide {
	--np-preset-bg: #fff;
	--np-preset-fg: #141a2c;
	--np-preset-line: #d7dbea;
	--np-preset-nav-bg: linear-gradient(90deg, #2758d7 0%, #8849d3 50%, #e64f8d 100%);
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #f2f4fb;
	--np-preset-action-fg: #141a2c;
	--np-preset-highlight: #e9ff58;
}

.np-header--has-preset:is(.np-header--variant-coral-island, .np-header--variant-sky-border, .np-header--variant-lime-ticker, .np-header--variant-lilac-ribbon, .np-header--variant-prism-wide) .np-navigation {
	border: 0;
	border-radius: 0;
	box-shadow: 0 9px 22px color-mix(in srgb, var(--np-preset-fg) 16%, transparent);
}

/* 51 — Arctic float. */
.np-header--variant-arctic-float {
	--np-dock-surface: rgba(236, 248, 255, 0.94);
	--np-preset-bg: transparent;
	--np-preset-fg: #0f2f45;
	--np-preset-line: rgba(87, 143, 178, 0.34);
	--np-preset-nav-bg: rgba(255, 255, 255, 0.62);
	--np-preset-nav-fg: #0f2f45;
	--np-preset-action-bg: rgba(255, 255, 255, 0.72);
	--np-preset-action-fg: #0f2f45;
	--np-preset-highlight: #1aa7d8;
	border: 0;
}

/* 52 — Rose glass. */
.np-header--variant-rose-glass {
	--np-dock-surface: rgba(255, 236, 246, 0.94);
	--np-preset-bg: transparent;
	--np-preset-fg: #4b1c32;
	--np-preset-line: rgba(175, 91, 132, 0.34);
	--np-preset-nav-bg: rgba(255, 242, 249, 0.66);
	--np-preset-nav-fg: #4b1c32;
	--np-preset-action-bg: rgba(255, 246, 251, 0.76);
	--np-preset-action-fg: #4b1c32;
	--np-preset-highlight: #e64c91;
	border: 0;
}

/* 53 — Carbon dock. */
.np-header--variant-carbon-dock {
	--np-dock-surface: rgba(12, 17, 23, 0.96);
	--np-preset-bg: transparent;
	--np-preset-fg: #f6f8fb;
	--np-preset-line: rgba(255, 255, 255, 0.17);
	--np-preset-nav-bg: rgba(20, 25, 32, 0.76);
	--np-preset-nav-fg: #f6f8fb;
	--np-preset-action-bg: rgba(36, 43, 53, 0.82);
	--np-preset-action-fg: #fff;
	--np-preset-highlight: #65e7d8;
	border: 0;
}

/* 54 — Dusk glow. */
.np-header--variant-dusk-glow {
	--np-dock-surface: linear-gradient(115deg, rgba(36, 31, 87, 0.96), rgba(113, 45, 92, 0.94));
	--np-preset-bg: transparent;
	--np-preset-fg: #fff;
	--np-preset-line: rgba(255, 255, 255, 0.2);
	--np-preset-nav-bg: rgba(35, 24, 76, 0.64);
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: rgba(255, 255, 255, 0.13);
	--np-preset-action-fg: #fff;
	--np-preset-highlight: #ffb45e;
	border: 0;
}

/* 55 — Cyan terminal. */
.np-header--variant-cyan-terminal {
	--np-dock-surface: rgba(4, 22, 28, 0.97);
	--np-preset-bg: transparent;
	--np-preset-fg: #eaffff;
	--np-preset-line: rgba(57, 231, 224, 0.38);
	--np-preset-nav-bg: rgba(4, 22, 28, 0.8);
	--np-preset-nav-fg: #eaffff;
	--np-preset-action-bg: rgba(11, 46, 54, 0.86);
	--np-preset-action-fg: #fff;
	--np-preset-highlight: #39e7e0;
	border: 0;
}

.np-header--has-preset:is(.np-header--variant-arctic-float, .np-header--variant-rose-glass, .np-header--variant-carbon-dock, .np-header--variant-dusk-glow, .np-header--variant-cyan-terminal) .np-navigation {
	border-radius: 999px;
	backdrop-filter: blur(18px) saturate(1.15);
}

.np-header--has-preset:is(.np-header--variant-arctic-float, .np-header--variant-rose-glass, .np-header--variant-carbon-dock, .np-header--variant-dusk-glow, .np-header--variant-cyan-terminal) .np-header__shell {
	background: var(--np-dock-surface);
}

.np-header--variant-cyan-terminal .np-menu > li > a {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 12px;
}

/* 56 — Electric split. */
.np-header--variant-electric-split {
	--np-preset-bg: #091426;
	--np-preset-fg: #f5f8ff;
	--np-preset-line: #2e4b73;
	--np-preset-nav-bg: #2c62e7;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #13294b;
	--np-preset-action-fg: #fff;
	--np-preset-highlight: #d7ff3f;
}

/* 57 — Cobalt corner. */
.np-header--variant-cobalt-corner {
	--np-preset-bg: #f3f6ff;
	--np-preset-fg: #13285d;
	--np-preset-line: #aebfe7;
	--np-preset-nav-bg: #204fb9;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #13285d;
	--np-preset-highlight: #ffcc58;
}

/* 58 — Orange slab. */
.np-header--variant-orange-slab {
	--np-preset-bg: #fff6e9;
	--np-preset-fg: #3b2512;
	--np-preset-line: #e5b876;
	--np-preset-nav-bg: #f27a21;
	--np-preset-nav-fg: #271204;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #3b2512;
	--np-preset-highlight: #fff36a;
}

/* 59 — Mint console. */
.np-header--variant-mint-console {
	--np-preset-bg: #eafff7;
	--np-preset-fg: #123b31;
	--np-preset-line: #91d5c1;
	--np-preset-nav-bg: #136b57;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #123b31;
	--np-preset-highlight: #ffe45c;
}

/* 60 — Blue arc. */
.np-header--variant-blue-arc {
	--np-preset-bg: #eaf4ff;
	--np-preset-fg: #102f58;
	--np-preset-line: #93b9e3;
	--np-preset-nav-bg: #0c5eaa;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #102f58;
	--np-preset-highlight: #78e7ff;
}

.np-header--has-preset:is(.np-header--variant-electric-split, .np-header--variant-cobalt-corner, .np-header--variant-orange-slab, .np-header--variant-mint-console, .np-header--variant-blue-arc) .np-navigation {
	border-radius: 4px 20px 4px 20px;
}

.np-header--variant-blue-arc .np-navigation {
	border-radius: 999px 16px 16px 999px;
}

/* 61 — Ink offset. */
.np-header--variant-ink-offset {
	--np-preset-bg: #f8f5ee;
	--np-preset-fg: #141311;
	--np-preset-line: #4a4741;
	--np-preset-nav-bg: #141311;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #fffdf8;
	--np-preset-action-fg: #141311;
	--np-preset-highlight: #ef3d36;
}

/* 62 — Cream ledger. */
.np-header--variant-cream-ledger {
	--np-preset-bg: #f7eedc;
	--np-preset-fg: #30291f;
	--np-preset-line: #a28e70;
	--np-preset-nav-bg: transparent;
	--np-preset-nav-fg: #30291f;
	--np-preset-action-bg: #fff9ed;
	--np-preset-action-fg: #30291f;
	--np-preset-highlight: #97602d;
}

/* 63 — Olive paper. */
.np-header--variant-olive-paper {
	--np-preset-bg: #ecebd8;
	--np-preset-fg: #2b301e;
	--np-preset-line: #8f9270;
	--np-preset-nav-bg: #555d37;
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: #f8f7e9;
	--np-preset-action-fg: #2b301e;
	--np-preset-highlight: #d8b854;
}

/* 64 — Sage shelf. */
.np-header--variant-sage-shelf {
	--np-preset-bg: #eef5ed;
	--np-preset-fg: #263828;
	--np-preset-line: #9bb19c;
	--np-preset-nav-bg: #dbe8da;
	--np-preset-nav-fg: #263828;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #263828;
	--np-preset-highlight: #527d57;
}

/* 65 — Redline tech. */
.np-header--variant-redline-tech {
	--np-preset-bg: #111419;
	--np-preset-fg: #f7f8fa;
	--np-preset-line: #4a4f58;
	--np-preset-nav-bg: #1d222a;
	--np-preset-nav-fg: #f7f8fa;
	--np-preset-action-bg: #252b34;
	--np-preset-action-fg: #fff;
	--np-preset-highlight: #ff4050;
	border-top: 4px solid #ff4050;
}

.np-header--has-preset:is(.np-header--variant-ink-offset, .np-header--variant-cream-ledger, .np-header--variant-olive-paper, .np-header--variant-sage-shelf) .np-brand__name,
.np-header--has-preset:is(.np-header--variant-ink-offset, .np-header--variant-cream-ledger, .np-header--variant-olive-paper, .np-header--variant-sage-shelf) .np-menu > li > a {
	font-family: Georgia, "Times New Roman", serif;
}

.np-header--has-preset:is(.np-header--variant-ink-offset, .np-header--variant-cream-ledger, .np-header--variant-olive-paper, .np-header--variant-sage-shelf, .np-header--variant-redline-tech) .np-navigation {
	border-width: 1px 0;
	border-radius: 0;
}

.np-header--variant-redline-tech .np-menu > li > a {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 12px;
}

/* 66 — Polar grid. */
.np-header--variant-polar-grid {
	--np-preset-bg: #eaf7ff;
	--np-preset-fg: #12354d;
	--np-preset-line: #93c7df;
	--np-preset-nav-bg: rgba(255, 255, 255, 0.62);
	--np-preset-nav-fg: #12354d;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #12354d;
	--np-preset-highlight: #098fc4;
	background-color: #eaf7ff;
	background-image: linear-gradient(rgba(9, 143, 196, 0.08) 1px, transparent 1px), linear-gradient(90deg, rgba(9, 143, 196, 0.08) 1px, transparent 1px);
	background-size: 22px 22px;
}

/* 67 — Violet orbit. */
.np-header--variant-violet-orbit {
	--np-preset-bg: radial-gradient(circle at 18% 10%, #604fc4, #241b57 48%, #130f2f 100%);
	--np-preset-fg: #fff;
	--np-preset-line: rgba(255, 255, 255, 0.22);
	--np-preset-nav-bg: rgba(255, 255, 255, 0.1);
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: rgba(255, 255, 255, 0.13);
	--np-preset-action-fg: #fff;
	--np-preset-highlight: #8df0e7;
}

/* 68 — Citrus blocks. */
.np-header--variant-citrus-blocks {
	--np-preset-bg: #fff8dc;
	--np-preset-fg: #26321b;
	--np-preset-line: #c9b95e;
	--np-preset-nav-bg: #eef06a;
	--np-preset-nav-fg: #26321b;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #26321b;
	--np-preset-highlight: #f26c2f;
}

/* 69 — Peach pill. */
.np-header--variant-peach-pill {
	--np-preset-bg: #fff0e8;
	--np-preset-fg: #3e231c;
	--np-preset-line: #e3ad9c;
	--np-preset-nav-bg: #fff9f5;
	--np-preset-nav-fg: #3e231c;
	--np-preset-action-bg: #fff;
	--np-preset-action-fg: #3e231c;
	--np-preset-highlight: #f2695c;
}

/* 70 — Spectrum wave. */
.np-header--variant-spectrum-wave {
	--np-preset-bg: linear-gradient(115deg, #081a38, #263f9c 43%, #7a2c8d 72%, #c33e6c);
	--np-preset-fg: #fff;
	--np-preset-line: rgba(255, 255, 255, 0.22);
	--np-preset-nav-bg: rgba(5, 16, 39, 0.34);
	--np-preset-nav-fg: #fff;
	--np-preset-action-bg: rgba(255, 255, 255, 0.13);
	--np-preset-action-fg: #fff;
	--np-preset-highlight: #d7ff55;
}

.np-header--variant-polar-grid .np-navigation {
	border-style: dashed;
	border-radius: 5px;
	backdrop-filter: blur(10px);
}

.np-header--variant-violet-orbit .np-navigation {
	border-radius: 999px;
	backdrop-filter: blur(14px);
}

.np-header--variant-citrus-blocks .np-navigation {
	padding: 5px;
	border-radius: 6px;
}

.np-header--variant-citrus-blocks .np-menu > li > a {
	border-right: 1px solid color-mix(in srgb, var(--np-preset-fg) 20%, transparent);
}

.np-header--variant-peach-pill .np-navigation {
	padding: 6px;
	border-radius: 999px;
	box-shadow: 0 9px 22px rgba(85, 44, 31, 0.1);
}

.np-header--variant-peach-pill .np-menu > li > a {
	min-height: 38px;
	border-radius: 999px;
}

.np-header--variant-spectrum-wave .np-navigation {
	border-radius: 999px 12px 999px 12px;
	backdrop-filter: blur(13px);
}

/* Desktop geometry shared by all presets. */
@media (min-width: 1200px) {
	body.np-header-variant-metro,
	body.np-header-variant-minimal-line,
	body.np-header-variant-coral-split,
	body.np-header-variant-midnight-rail,
	body.np-header-variant-tech-grid,
	body.np-header-variant-capsule,
	body.np-header-variant-monochrome,
	body.np-header-variant-accent-frame,
	body.np-header-variant-blueprint,
	body.np-header-variant-neon-night { --np-header-height: 88px; }

	body.np-header-variant-glass-dock { --np-header-height: 108px; }
	body.np-header-variant-ultra-compact { --np-header-height: 66px; }
	body.np-header-variant-newsroom,
	body.np-header-variant-wide-ribbon,
	body.np-header-variant-airy { --np-header-height: 136px; }
	body.np-header-variant-menu-first { --np-header-height: 130px; }
	body.np-header-variant-aurora,
	body.np-header-variant-paper-masthead,
	body.np-header-variant-center-stage,
	body.np-header-variant-luxe { --np-header-height: 158px; }

	body.np-header-variant-obsidian-bar,
	body.np-header-variant-amber-line,
	body.np-header-variant-steel-compact,
	body.np-header-variant-ice-minimal,
	body.np-header-variant-cherry-topline { --np-header-height: 72px; }

	body.np-header-variant-sunrise-stack,
	body.np-header-variant-terracotta-news,
	body.np-header-variant-ocean-deck,
	body.np-header-variant-cloud-tabs,
	body.np-header-variant-silver-newsroom { --np-header-height: 136px; }

	body.np-header-variant-lavender-center,
	body.np-header-variant-sand-serif,
	body.np-header-variant-gold-masthead,
	body.np-header-variant-ultramarine-stage,
	body.np-header-variant-ivory-journal { --np-header-height: 156px; }

	body.np-header-variant-ruby-banner,
	body.np-header-variant-navy-step,
	body.np-header-variant-emerald-strip,
	body.np-header-variant-midnight-banner,
	body.np-header-variant-magenta-signal { --np-header-height: 128px; }

	body.np-header-variant-forest-rail,
	body.np-header-variant-graphite-frame,
	body.np-header-variant-bronze-editorial,
	body.np-header-variant-teal-balance,
	body.np-header-variant-plum-gallery { --np-header-height: 96px; }

	body.np-header-variant-coral-island,
	body.np-header-variant-sky-border,
	body.np-header-variant-lime-ticker,
	body.np-header-variant-lilac-ribbon,
	body.np-header-variant-prism-wide { --np-header-height: 134px; }

	body.np-header-variant-arctic-float,
	body.np-header-variant-rose-glass,
	body.np-header-variant-carbon-dock,
	body.np-header-variant-dusk-glow,
	body.np-header-variant-cyan-terminal { --np-header-height: 108px; }

	body.np-header-variant-electric-split,
	body.np-header-variant-cobalt-corner,
	body.np-header-variant-orange-slab,
	body.np-header-variant-mint-console,
	body.np-header-variant-blue-arc { --np-header-height: 112px; }

	body.np-header-variant-ink-offset,
	body.np-header-variant-cream-ledger,
	body.np-header-variant-olive-paper,
	body.np-header-variant-sage-shelf,
	body.np-header-variant-redline-tech { --np-header-height: 148px; }

	body.np-header-variant-polar-grid,
	body.np-header-variant-violet-orbit,
	body.np-header-variant-peach-pill { --np-header-height: 96px; }
	body.np-header-variant-citrus-blocks { --np-header-height: 128px; }
	body.np-header-variant-spectrum-wave { --np-header-height: 150px; }

	.np-header--has-preset .np-header__shell {
		display: grid;
		min-height: 88px;
		grid-template-columns: max-content minmax(0, 1fr) max-content;
		gap: 18px;
		align-items: center;
	}

	.np-header--has-preset .np-header__top {
		display: contents;
	}

	.np-header--has-preset .np-brand {
		grid-column: 1;
		grid-row: 1;
	}

	.np-header--has-preset .np-header__actions {
		grid-column: 3;
		grid-row: 1;
		justify-self: end;
	}

	.np-header--has-preset .np-header__nav-row {
		grid-column: 2;
		grid-row: 1;
		min-width: 0;
		padding: 0;
	}

	.np-header--has-preset .np-navigation {
		width: fit-content;
		max-width: 100%;
		margin-inline: auto;
	}

	.np-header--has-preset .np-navigation > .np-menu,
	.np-header--has-preset .np-navigation > div > .np-menu {
		flex-wrap: wrap;
		justify-content: center;
	}

	.np-header--variant-coral-split .np-navigation,
	.np-header--variant-midnight-rail .np-navigation {
		margin-left: 0;
	}

	.np-header--variant-glass-dock .np-header__shell {
		min-height: 86px;
		padding-right: 18px;
		padding-left: 18px;
	}

	.np-header--variant-ultra-compact .np-header__shell {
		min-height: 64px;
	}

	.np-header--variant-ultra-compact .custom-logo {
		max-height: 42px;
	}

	/* Left-aligned two-level presets. */
	.np-header--variant-newsroom .np-header__shell,
	.np-header--variant-wide-ribbon .np-header__shell,
	.np-header--variant-airy .np-header__shell {
		display: flex;
		min-height: 0;
		flex-direction: column;
		gap: 0;
	}

	.np-header--variant-newsroom .np-header__top,
	.np-header--variant-wide-ribbon .np-header__top,
	.np-header--variant-airy .np-header__top {
		display: flex;
		width: 100%;
		min-height: 78px;
	}

	.np-header--variant-newsroom .np-brand,
	.np-header--variant-wide-ribbon .np-brand,
	.np-header--variant-airy .np-brand,
	.np-header--variant-newsroom .np-header__actions,
	.np-header--variant-wide-ribbon .np-header__actions,
	.np-header--variant-airy .np-header__actions {
		grid-column: auto;
		grid-row: auto;
	}

	.np-header--variant-newsroom .np-header__nav-row,
	.np-header--variant-wide-ribbon .np-header__nav-row,
	.np-header--variant-airy .np-header__nav-row {
		width: 100%;
	}

	.np-header--variant-newsroom .np-navigation,
	.np-header--variant-wide-ribbon .np-navigation,
	.np-header--variant-airy .np-navigation {
		width: 100%;
	}

	.np-header--variant-newsroom .np-navigation > .np-menu,
	.np-header--variant-newsroom .np-navigation > div > .np-menu,
	.np-header--variant-wide-ribbon .np-navigation > .np-menu,
	.np-header--variant-wide-ribbon .np-navigation > div > .np-menu,
	.np-header--variant-airy .np-navigation > .np-menu,
	.np-header--variant-airy .np-navigation > div > .np-menu {
		justify-content: flex-start;
	}

	.np-header--variant-wide-ribbon .np-navigation {
		width: calc(100% + 24px);
		margin-right: -12px;
		margin-left: -12px;
	}

	.np-header--variant-airy .np-header__top {
		min-height: 88px;
	}

	.np-header--variant-airy .np-navigation > .np-menu,
	.np-header--variant-airy .np-navigation > div > .np-menu {
		justify-content: center;
	}

	/* Centered mastheads. */
	.np-header--variant-aurora .np-header__shell,
	.np-header--variant-paper-masthead .np-header__shell,
	.np-header--variant-center-stage .np-header__shell,
	.np-header--variant-luxe .np-header__shell {
		display: flex;
		min-height: 0;
		flex-direction: column;
		gap: 0;
	}

	.np-header--variant-aurora .np-header__top,
	.np-header--variant-paper-masthead .np-header__top,
	.np-header--variant-center-stage .np-header__top,
	.np-header--variant-luxe .np-header__top {
		position: relative;
		display: flex;
		width: 100%;
		min-height: 98px;
		justify-content: center;
	}

	.np-header--variant-aurora .np-brand,
	.np-header--variant-paper-masthead .np-brand,
	.np-header--variant-center-stage .np-brand,
	.np-header--variant-luxe .np-brand {
		grid-column: auto;
		grid-row: auto;
		justify-content: center;
		text-align: center;
	}

	.np-header--variant-aurora .np-header__actions,
	.np-header--variant-paper-masthead .np-header__actions,
	.np-header--variant-center-stage .np-header__actions,
	.np-header--variant-luxe .np-header__actions {
		position: absolute;
		right: 0;
		grid-column: auto;
		grid-row: auto;
	}

	.np-header--variant-aurora .np-header__nav-row,
	.np-header--variant-paper-masthead .np-header__nav-row,
	.np-header--variant-center-stage .np-header__nav-row,
	.np-header--variant-luxe .np-header__nav-row {
		width: 100%;
	}

	.np-header--variant-aurora .np-navigation,
	.np-header--variant-paper-masthead .np-navigation,
	.np-header--variant-center-stage .np-navigation,
	.np-header--variant-luxe .np-navigation {
		width: 100%;
	}

	.np-header--variant-paper-masthead .np-navigation > .np-menu,
	.np-header--variant-paper-masthead .np-navigation > div > .np-menu,
	.np-header--variant-center-stage .np-navigation > .np-menu,
	.np-header--variant-center-stage .np-navigation > div > .np-menu,
	.np-header--variant-luxe .np-navigation > .np-menu,
	.np-header--variant-luxe .np-navigation > div > .np-menu {
		justify-content: center;
	}

	/* Menu-first preset. */
	.np-header--variant-menu-first .np-header__shell {
		display: grid;
		min-height: 128px;
		grid-template-columns: minmax(0, 1fr) max-content;
		grid-template-rows: 50px 78px;
		gap: 0 18px;
	}

	.np-header--variant-menu-first .np-header__top {
		display: contents;
	}

	.np-header--variant-menu-first .np-header__nav-row {
		grid-column: 1 / -1;
		grid-row: 1;
		width: 100%;
	}

	.np-header--variant-menu-first .np-navigation {
		width: 100%;
	}

	.np-header--variant-menu-first .np-brand {
		grid-column: 1;
		grid-row: 2;
	}

	.np-header--variant-menu-first .np-header__actions {
		grid-column: 2;
		grid-row: 2;
	}

	/* 21–25: compact one-line bars. */
	.np-header:is(.np-header--variant-obsidian-bar, .np-header--variant-amber-line, .np-header--variant-steel-compact, .np-header--variant-ice-minimal, .np-header--variant-cherry-topline) .np-header__shell {
		min-height: 70px;
		grid-template-columns: max-content minmax(0, 1fr) max-content;
		gap: 12px;
	}

	.np-header:is(.np-header--variant-obsidian-bar, .np-header--variant-amber-line, .np-header--variant-steel-compact, .np-header--variant-ice-minimal, .np-header--variant-cherry-topline) .np-brand__name {
		font-size: 23px;
	}

	.np-header:is(.np-header--variant-obsidian-bar, .np-header--variant-amber-line, .np-header--variant-steel-compact, .np-header--variant-ice-minimal, .np-header--variant-cherry-topline) .custom-logo {
		max-height: 42px;
	}

	/* 26–30: left-aligned double decks. */
	.np-header:is(.np-header--variant-sunrise-stack, .np-header--variant-terracotta-news, .np-header--variant-ocean-deck, .np-header--variant-cloud-tabs, .np-header--variant-silver-newsroom) .np-header__shell {
		display: flex;
		min-height: 0;
		flex-direction: column;
		gap: 0;
	}

	.np-header:is(.np-header--variant-sunrise-stack, .np-header--variant-terracotta-news, .np-header--variant-ocean-deck, .np-header--variant-cloud-tabs, .np-header--variant-silver-newsroom) .np-header__top {
		display: flex;
		width: 100%;
		min-height: 78px;
	}

	.np-header:is(.np-header--variant-sunrise-stack, .np-header--variant-terracotta-news, .np-header--variant-ocean-deck, .np-header--variant-cloud-tabs, .np-header--variant-silver-newsroom) :is(.np-brand, .np-header__actions) {
		grid-column: auto;
		grid-row: auto;
	}

	.np-header:is(.np-header--variant-sunrise-stack, .np-header--variant-terracotta-news, .np-header--variant-ocean-deck, .np-header--variant-cloud-tabs, .np-header--variant-silver-newsroom) .np-header__nav-row,
	.np-header:is(.np-header--variant-sunrise-stack, .np-header--variant-terracotta-news, .np-header--variant-ocean-deck, .np-header--variant-cloud-tabs, .np-header--variant-silver-newsroom) .np-navigation {
		width: 100%;
	}

	.np-header:is(.np-header--variant-sunrise-stack, .np-header--variant-terracotta-news, .np-header--variant-ocean-deck, .np-header--variant-cloud-tabs, .np-header--variant-silver-newsroom) .np-navigation > .np-menu,
	.np-header:is(.np-header--variant-sunrise-stack, .np-header--variant-terracotta-news, .np-header--variant-ocean-deck, .np-header--variant-cloud-tabs, .np-header--variant-silver-newsroom) .np-navigation > div > .np-menu {
		justify-content: flex-start;
	}

	.np-header--variant-cloud-tabs .np-navigation > .np-menu,
	.np-header--variant-cloud-tabs .np-navigation > div > .np-menu,
	.np-header--variant-silver-newsroom .np-navigation > .np-menu,
	.np-header--variant-silver-newsroom .np-navigation > div > .np-menu {
		justify-content: center;
	}

	/* 31–35: centered mastheads. */
	.np-header:is(.np-header--variant-lavender-center, .np-header--variant-sand-serif, .np-header--variant-gold-masthead, .np-header--variant-ultramarine-stage, .np-header--variant-ivory-journal) .np-header__shell {
		display: flex;
		min-height: 0;
		flex-direction: column;
		gap: 0;
	}

	.np-header:is(.np-header--variant-lavender-center, .np-header--variant-sand-serif, .np-header--variant-gold-masthead, .np-header--variant-ultramarine-stage, .np-header--variant-ivory-journal) .np-header__top {
		position: relative;
		display: flex;
		width: 100%;
		min-height: 98px;
		justify-content: center;
	}

	.np-header:is(.np-header--variant-lavender-center, .np-header--variant-sand-serif, .np-header--variant-gold-masthead, .np-header--variant-ultramarine-stage, .np-header--variant-ivory-journal) .np-brand {
		grid-column: auto;
		grid-row: auto;
		justify-content: center;
		text-align: center;
	}

	.np-header:is(.np-header--variant-lavender-center, .np-header--variant-sand-serif, .np-header--variant-gold-masthead, .np-header--variant-ultramarine-stage, .np-header--variant-ivory-journal) .np-header__actions {
		position: absolute;
		right: 0;
		grid-column: auto;
		grid-row: auto;
	}

	.np-header:is(.np-header--variant-lavender-center, .np-header--variant-sand-serif, .np-header--variant-gold-masthead, .np-header--variant-ultramarine-stage, .np-header--variant-ivory-journal) .np-header__nav-row,
	.np-header:is(.np-header--variant-lavender-center, .np-header--variant-sand-serif, .np-header--variant-gold-masthead, .np-header--variant-ultramarine-stage, .np-header--variant-ivory-journal) .np-navigation {
		width: 100%;
	}

	.np-header:is(.np-header--variant-lavender-center, .np-header--variant-sand-serif, .np-header--variant-gold-masthead, .np-header--variant-ultramarine-stage, .np-header--variant-ivory-journal) .np-navigation > .np-menu,
	.np-header:is(.np-header--variant-lavender-center, .np-header--variant-sand-serif, .np-header--variant-gold-masthead, .np-header--variant-ultramarine-stage, .np-header--variant-ivory-journal) .np-navigation > div > .np-menu {
		justify-content: center;
	}

	.np-header--variant-gold-masthead .np-brand__name,
	.np-header--variant-ivory-journal .np-brand__name {
		font-size: clamp(32px, 3.2vw, 46px);
	}

	/* 36–40: menu-first banners. */
	.np-header:is(.np-header--variant-ruby-banner, .np-header--variant-navy-step, .np-header--variant-emerald-strip, .np-header--variant-midnight-banner, .np-header--variant-magenta-signal) .np-header__shell {
		display: grid;
		min-height: 126px;
		grid-template-columns: minmax(0, 1fr) max-content;
		grid-template-rows: 50px 76px;
		gap: 0 18px;
	}

	.np-header:is(.np-header--variant-ruby-banner, .np-header--variant-navy-step, .np-header--variant-emerald-strip, .np-header--variant-midnight-banner, .np-header--variant-magenta-signal) .np-header__top {
		display: contents;
	}

	.np-header:is(.np-header--variant-ruby-banner, .np-header--variant-navy-step, .np-header--variant-emerald-strip, .np-header--variant-midnight-banner, .np-header--variant-magenta-signal) .np-header__nav-row {
		grid-column: 1 / -1;
		grid-row: 1;
		width: 100%;
	}

	.np-header:is(.np-header--variant-ruby-banner, .np-header--variant-navy-step, .np-header--variant-emerald-strip, .np-header--variant-midnight-banner, .np-header--variant-magenta-signal) .np-navigation {
		width: 100%;
	}

	.np-header:is(.np-header--variant-ruby-banner, .np-header--variant-navy-step, .np-header--variant-emerald-strip, .np-header--variant-midnight-banner, .np-header--variant-magenta-signal) .np-brand {
		grid-column: 1;
		grid-row: 2;
	}

	.np-header:is(.np-header--variant-ruby-banner, .np-header--variant-navy-step, .np-header--variant-emerald-strip, .np-header--variant-midnight-banner, .np-header--variant-magenta-signal) .np-header__actions {
		grid-column: 2;
		grid-row: 2;
	}

	/* 41–45: logo rail on the left. */
	.np-header:is(.np-header--variant-forest-rail, .np-header--variant-graphite-frame, .np-header--variant-bronze-editorial, .np-header--variant-teal-balance, .np-header--variant-plum-gallery) .np-header__shell {
		min-height: 94px;
		grid-template-columns: minmax(190px, max-content) minmax(0, 1fr) max-content;
		gap: 20px;
	}

	.np-header:is(.np-header--variant-forest-rail, .np-header--variant-graphite-frame, .np-header--variant-bronze-editorial, .np-header--variant-teal-balance, .np-header--variant-plum-gallery) .np-brand {
		align-self: stretch;
		padding-right: 20px;
		border-right: 3px solid var(--np-preset-highlight);
	}

	.np-header:is(.np-header--variant-forest-rail, .np-header--variant-graphite-frame, .np-header--variant-bronze-editorial, .np-header--variant-teal-balance, .np-header--variant-plum-gallery) .np-navigation {
		margin-left: 0;
	}

	.np-header:is(.np-header--variant-forest-rail, .np-header--variant-graphite-frame, .np-header--variant-bronze-editorial, .np-header--variant-teal-balance, .np-header--variant-plum-gallery) .np-navigation > .np-menu,
	.np-header:is(.np-header--variant-forest-rail, .np-header--variant-graphite-frame, .np-header--variant-bronze-editorial, .np-header--variant-teal-balance, .np-header--variant-plum-gallery) .np-navigation > div > .np-menu {
		justify-content: flex-start;
	}

	/* 46–50: full-width ribbons. */
	.np-header:is(.np-header--variant-coral-island, .np-header--variant-sky-border, .np-header--variant-lime-ticker, .np-header--variant-lilac-ribbon, .np-header--variant-prism-wide) .np-header__shell {
		display: flex;
		min-height: 0;
		flex-direction: column;
		gap: 0;
	}

	.np-header:is(.np-header--variant-coral-island, .np-header--variant-sky-border, .np-header--variant-lime-ticker, .np-header--variant-lilac-ribbon, .np-header--variant-prism-wide) .np-header__top {
		display: flex;
		width: 100%;
		min-height: 78px;
	}

	.np-header:is(.np-header--variant-coral-island, .np-header--variant-sky-border, .np-header--variant-lime-ticker, .np-header--variant-lilac-ribbon, .np-header--variant-prism-wide) :is(.np-brand, .np-header__actions) {
		grid-column: auto;
		grid-row: auto;
	}

	.np-header:is(.np-header--variant-coral-island, .np-header--variant-sky-border, .np-header--variant-lime-ticker, .np-header--variant-lilac-ribbon, .np-header--variant-prism-wide) .np-header__nav-row {
		width: 100%;
	}

	.np-header:is(.np-header--variant-coral-island, .np-header--variant-sky-border, .np-header--variant-lime-ticker, .np-header--variant-lilac-ribbon, .np-header--variant-prism-wide) .np-navigation {
		width: calc(100% + 24px);
		margin-right: -12px;
		margin-left: -12px;
	}

	.np-header:is(.np-header--variant-coral-island, .np-header--variant-sky-border, .np-header--variant-lime-ticker, .np-header--variant-lilac-ribbon, .np-header--variant-prism-wide) .np-navigation > .np-menu,
	.np-header:is(.np-header--variant-coral-island, .np-header--variant-sky-border, .np-header--variant-lime-ticker, .np-header--variant-lilac-ribbon, .np-header--variant-prism-wide) .np-navigation > div > .np-menu {
		justify-content: center;
	}

	/* 51–55: floating docks. */
	.np-header:is(.np-header--variant-arctic-float, .np-header--variant-rose-glass, .np-header--variant-carbon-dock, .np-header--variant-dusk-glow, .np-header--variant-cyan-terminal) .np-header__shell {
		min-height: 86px;
		margin-top: 10px;
		margin-bottom: 10px;
		padding-right: 18px;
		padding-left: 18px;
		border: 1px solid var(--np-preset-line);
		border-radius: 24px;
		box-shadow: 0 16px 38px rgba(7, 21, 39, 0.16);
		backdrop-filter: blur(24px) saturate(1.2);
	}

	/* 56–60: asymmetric split headers. */
	.np-header:is(.np-header--variant-electric-split, .np-header--variant-cobalt-corner, .np-header--variant-orange-slab, .np-header--variant-mint-console, .np-header--variant-blue-arc) .np-header__shell {
		min-height: 110px;
		grid-template-columns: minmax(210px, 0.78fr) minmax(0, 1.35fr) max-content;
		gap: 0;
		padding-right: 0;
		padding-left: 0;
		overflow: hidden;
		border: 1px solid var(--np-preset-line);
		border-radius: 4px 26px 4px 26px;
	}

	.np-header:is(.np-header--variant-electric-split, .np-header--variant-cobalt-corner, .np-header--variant-orange-slab, .np-header--variant-mint-console, .np-header--variant-blue-arc) .np-brand {
		align-self: stretch;
		padding: 0 20px;
		background: color-mix(in srgb, var(--np-preset-highlight) 16%, transparent);
	}

	.np-header:is(.np-header--variant-electric-split, .np-header--variant-cobalt-corner, .np-header--variant-orange-slab, .np-header--variant-mint-console, .np-header--variant-blue-arc) .np-header__nav-row {
		align-self: stretch;
		display: flex;
		align-items: center;
		padding: 0 16px;
		border-left: 1px solid var(--np-preset-line);
	}

	.np-header:is(.np-header--variant-electric-split, .np-header--variant-cobalt-corner, .np-header--variant-orange-slab, .np-header--variant-mint-console, .np-header--variant-blue-arc) .np-header__actions {
		padding-right: 16px;
	}

	.np-header:is(.np-header--variant-electric-split, .np-header--variant-cobalt-corner, .np-header--variant-orange-slab, .np-header--variant-mint-console, .np-header--variant-blue-arc) .np-navigation {
		width: 100%;
	}

	/* 61–65: editorial mastheads with a lower shelf. */
	.np-header:is(.np-header--variant-ink-offset, .np-header--variant-cream-ledger, .np-header--variant-olive-paper, .np-header--variant-sage-shelf, .np-header--variant-redline-tech) .np-header__shell {
		display: flex;
		min-height: 0;
		flex-direction: column;
		gap: 0;
	}

	.np-header:is(.np-header--variant-ink-offset, .np-header--variant-cream-ledger, .np-header--variant-olive-paper, .np-header--variant-sage-shelf, .np-header--variant-redline-tech) .np-header__top {
		position: relative;
		display: flex;
		width: 100%;
		min-height: 92px;
		justify-content: center;
	}

	.np-header:is(.np-header--variant-ink-offset, .np-header--variant-cream-ledger, .np-header--variant-olive-paper, .np-header--variant-sage-shelf, .np-header--variant-redline-tech) .np-brand {
		grid-column: auto;
		grid-row: auto;
		justify-content: center;
		text-align: center;
	}

	.np-header:is(.np-header--variant-ink-offset, .np-header--variant-cream-ledger, .np-header--variant-olive-paper, .np-header--variant-sage-shelf, .np-header--variant-redline-tech) .np-header__actions {
		position: absolute;
		right: 0;
		grid-column: auto;
		grid-row: auto;
	}

	.np-header:is(.np-header--variant-ink-offset, .np-header--variant-cream-ledger, .np-header--variant-olive-paper, .np-header--variant-sage-shelf, .np-header--variant-redline-tech) .np-header__nav-row,
	.np-header:is(.np-header--variant-ink-offset, .np-header--variant-cream-ledger, .np-header--variant-olive-paper, .np-header--variant-sage-shelf, .np-header--variant-redline-tech) .np-navigation {
		width: 100%;
	}

	.np-header:is(.np-header--variant-ink-offset, .np-header--variant-cream-ledger, .np-header--variant-olive-paper, .np-header--variant-sage-shelf, .np-header--variant-redline-tech) .np-navigation > .np-menu,
	.np-header:is(.np-header--variant-ink-offset, .np-header--variant-cream-ledger, .np-header--variant-olive-paper, .np-header--variant-sage-shelf, .np-header--variant-redline-tech) .np-navigation > div > .np-menu {
		justify-content: center;
	}

	.np-header--variant-ink-offset .np-brand {
		transform: translateX(-28px);
	}

	.np-header--variant-sage-shelf .np-header__top {
		justify-content: flex-start;
	}

	.np-header--variant-sage-shelf .np-brand {
		justify-content: flex-start;
		text-align: left;
	}

	/* 66–70: individual experimental geometries. */
	.np-header--variant-polar-grid .np-header__shell,
	.np-header--variant-violet-orbit .np-header__shell,
	.np-header--variant-peach-pill .np-header__shell {
		min-height: 94px;
	}

	.np-header--variant-violet-orbit .np-navigation {
		width: 92%;
	}

	.np-header--variant-citrus-blocks .np-header__shell {
		display: grid;
		min-height: 126px;
		grid-template-columns: minmax(0, 1fr) max-content;
		grid-template-rows: 76px 50px;
		gap: 0 18px;
	}

	.np-header--variant-citrus-blocks .np-header__top {
		display: contents;
	}

	.np-header--variant-citrus-blocks .np-brand {
		grid-column: 1;
		grid-row: 1;
	}

	.np-header--variant-citrus-blocks .np-header__actions {
		grid-column: 2;
		grid-row: 1;
	}

	.np-header--variant-citrus-blocks .np-header__nav-row {
		grid-column: 1 / -1;
		grid-row: 2;
		width: 100%;
	}

	.np-header--variant-citrus-blocks .np-navigation {
		width: 100%;
	}

	.np-header--variant-spectrum-wave .np-header__shell {
		display: flex;
		min-height: 0;
		flex-direction: column;
		gap: 0;
	}

	.np-header--variant-spectrum-wave .np-header__top {
		position: relative;
		display: flex;
		width: 100%;
		min-height: 94px;
		justify-content: center;
	}

	.np-header--variant-spectrum-wave .np-brand {
		grid-column: auto;
		grid-row: auto;
		justify-content: center;
		text-align: center;
	}

	.np-header--variant-spectrum-wave .np-header__actions {
		position: absolute;
		right: 0;
		grid-column: auto;
		grid-row: auto;
	}

	.np-header--variant-spectrum-wave .np-header__nav-row,
	.np-header--variant-spectrum-wave .np-navigation {
		width: 100%;
	}

	.np-header--variant-spectrum-wave .np-navigation > .np-menu,
	.np-header--variant-spectrum-wave .np-navigation > div > .np-menu {
		justify-content: center;
	}
}

/* Every preset becomes the same reliable compact structure below desktop. */
@media (max-width: 1199px) {
	body[class*="np-header-variant-"] { --np-header-height: 72px; }

	.np-header--has-preset .np-header__shell,
	.np-header--variant-menu-first .np-header__shell,
	.np-header--variant-newsroom .np-header__shell,
	.np-header--variant-wide-ribbon .np-header__shell,
	.np-header--variant-airy .np-header__shell,
	.np-header--variant-aurora .np-header__shell,
	.np-header--variant-paper-masthead .np-header__shell,
	.np-header--variant-center-stage .np-header__shell,
	.np-header--variant-luxe .np-header__shell {
		display: block;
		min-height: 0;
		margin-top: 0;
		margin-bottom: 0;
		padding-right: 0;
		padding-left: 0;
		border-right: 0;
		border-left: 0;
		border-radius: 0;
		box-shadow: none;
	}

	.np-header--has-preset .np-header__top,
	.np-header--variant-menu-first .np-header__top,
	.np-header--variant-newsroom .np-header__top,
	.np-header--variant-wide-ribbon .np-header__top,
	.np-header--variant-airy .np-header__top,
	.np-header--variant-aurora .np-header__top,
	.np-header--variant-paper-masthead .np-header__top,
	.np-header--variant-center-stage .np-header__top,
	.np-header--variant-luxe .np-header__top {
		position: static;
		display: flex;
		width: auto;
		min-height: 70px;
		justify-content: space-between;
	}

	.np-header--has-preset .np-brand,
	.np-header--has-preset .np-header__actions,
	.np-header--has-preset .np-header__nav-row {
		position: static;
		grid-column: auto;
		grid-row: auto;
		order: initial;
	}

	.np-header--has-preset .np-brand {
		align-self: auto;
		justify-content: flex-start;
		padding-right: 0;
		border-right: 0;
		text-align: left;
	}

	.np-header--has-preset .np-header__actions {
		right: auto;
		justify-self: auto;
	}

	.np-header--has-preset .np-header__nav-row {
		width: auto;
		margin: 0;
		padding: 0;
	}

	.np-header--has-preset .np-navigation {
		width: auto;
		max-width: none;
		margin: 0;
		border: 1px solid var(--np-border);
		border-top: 4px solid var(--np-preset-highlight);
		border-radius: 15px;
		background: var(--np-bg);
		box-shadow: var(--np-shadow-lg);
	}

	.np-header--has-preset .np-menu > li > a,
	.np-header--has-preset .np-menu > li > a:hover,
	.np-header--has-preset .np-menu > li > a:focus-visible,
	.np-header--has-preset .np-menu > .current-menu-item > a,
	.np-header--has-preset .np-menu > .current-category-ancestor > a {
		min-height: 44px;
		padding: 0 48px 0 10px;
		color: var(--np-ink);
		font-family: var(--np-font);
		font-size: 14px;
		letter-spacing: normal;
		text-transform: var(--np-menu-transform, none);
	}

	.np-header--has-preset .np-brand__name {
		font-family: var(--np-display);
		font-size: 24px;
		letter-spacing: -0.055em;
	}
}

/* --------------------------------------------------------------------------
   Twenty article-top and featured-image variants
   -------------------------------------------------------------------------- */

.np-article__top,
.np-article__top .np-article__header,
.np-article__top .np-article__featured {
	min-width: 0;
}

.np-article__top .np-article__header,
.np-article__top .np-article__featured {
	position: relative;
}

.np-article__top .np-article__header {
	z-index: 2;
}

.np-article__top .np-article__featured img {
	width: 100%;
}

/* 01 — Classic intentionally inherits the established article design. */
.np-article__top--classic {
	display: block;
}

/* 02 — Soft card. */
.np-article__top--soft-card {
	padding: clamp(22px, 3.2vw, 34px);
	border: 1px solid var(--np-border);
	border-radius: calc(var(--np-radius-lg) + 4px);
	background: linear-gradient(145deg, var(--np-surface-raised), var(--np-surface));
	box-shadow: var(--np-shadow-sm);
}

.np-article__top--soft-card .np-article__featured {
	box-shadow: 0 14px 34px rgba(7, 21, 39, 0.11);
}

/* 03 — Full bleed inside the editorial column. */
.np-article__top--full-bleed .np-article__featured {
	border-radius: 0;
}

.np-article__top--full-bleed .np-article__featured img {
	max-height: 620px;
	object-fit: cover;
}

/* 04 — Framed editorial card. */
.np-article__top--framed {
	padding: clamp(18px, 2.8vw, 30px);
	border: 2px solid var(--np-ink);
	border-top: 8px solid var(--np-accent);
	background: var(--np-bg);
}

.np-article__top--framed .np-article__featured {
	border: 1px solid var(--np-ink);
	border-radius: 2px;
}

/* 05 and 06 — Split layouts. */
.np-article__top--split-right,
.np-article__top--split-left {
	display: grid;
	grid-template-columns: minmax(0, 1.02fr) minmax(300px, 0.98fr);
	overflow: hidden;
	border: 1px solid var(--np-border);
	border-radius: var(--np-radius-lg);
	background: var(--np-surface-raised);
	box-shadow: var(--np-shadow-sm);
}

.np-article__top--split-right .np-article__header,
.np-article__top--split-left .np-article__header {
	display: flex;
	justify-content: center;
	flex-direction: column;
	padding: clamp(24px, 3.4vw, 40px);
}

.np-article__top--split-right .np-article__featured,
.np-article__top--split-left .np-article__featured {
	min-height: 100%;
	margin-top: 0;
	border-radius: 0;
}

.np-article__top--split-right .np-article__featured img,
.np-article__top--split-left .np-article__featured img {
	height: 100%;
	min-height: 470px;
	object-fit: cover;
}

.np-article__top--split-right .np-article__header {
	grid-column: 1;
	grid-row: 1;
}

.np-article__top--split-right .np-article__featured {
	grid-column: 2;
	grid-row: 1;
}

.np-article__top--split-left .np-article__header {
	grid-column: 2;
	grid-row: 1;
}

.np-article__top--split-left .np-article__featured {
	grid-column: 1;
	grid-row: 1;
}

.np-article__top:is(.np-article__top--split-right, .np-article__top--split-left) .np-article__header h1 {
	font-size: clamp(31px, 3.25vw, 46px);
}

.np-article__top:is(.np-article__top--split-right, .np-article__top--split-left) .np-article__meta-row {
	align-items: flex-start;
	flex-direction: column;
}

/* 07, 08 and 09 — Image overlays. */
.np-article__top--overlay-bottom,
.np-article__top--overlay-center,
.np-article__top--cinematic {
	position: relative;
	display: grid;
	overflow: hidden;
	border-radius: var(--np-radius-lg);
	background: #071426;
}

.np-article__top:is(.np-article__top--overlay-bottom, .np-article__top--overlay-center, .np-article__top--cinematic) .np-article__header,
.np-article__top:is(.np-article__top--overlay-bottom, .np-article__top--overlay-center, .np-article__top--cinematic) .np-article__featured {
	grid-column: 1;
	grid-row: 1;
}

.np-article__top:is(.np-article__top--overlay-bottom, .np-article__top--overlay-center, .np-article__top--cinematic) .np-article__featured {
	min-height: 520px;
	margin-top: 0;
	border-radius: 0;
}

.np-article__top:is(.np-article__top--overlay-bottom, .np-article__top--overlay-center, .np-article__top--cinematic) .np-article__featured::after {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(2, 8, 18, 0.08) 22%, rgba(2, 8, 18, 0.9) 100%);
	content: "";
	pointer-events: none;
}

.np-article__top:is(.np-article__top--overlay-bottom, .np-article__top--overlay-center, .np-article__top--cinematic) .np-article__featured img {
	height: 100%;
	min-height: 520px;
	object-fit: cover;
}

.np-article__top:is(.np-article__top--overlay-bottom, .np-article__top--overlay-center, .np-article__top--cinematic) .np-article__header {
	align-self: end;
	padding: clamp(28px, 5vw, 58px);
	color: #fff;
}

.np-article__top:is(.np-article__top--overlay-bottom, .np-article__top--overlay-center, .np-article__top--cinematic) .np-article__header h1,
.np-article__top:is(.np-article__top--overlay-bottom, .np-article__top--overlay-center, .np-article__top--cinematic) .np-article__dek,
.np-article__top:is(.np-article__top--overlay-bottom, .np-article__top--overlay-center, .np-article__top--cinematic) .np-author-meta span {
	color: #fff;
}

.np-article__top:is(.np-article__top--overlay-bottom, .np-article__top--overlay-center, .np-article__top--cinematic) .np-article__meta-row {
	border-color: rgba(255, 255, 255, 0.28);
}

/* Variant 07 keeps the overlay metadata strip especially compact. */
.np-article__top--overlay-bottom .np-article__meta-row {
	gap: 12px;
	margin-top: 14px;
	padding: 9px 0;
}

.np-article__top--overlay-bottom .np-author-meta {
	gap: 7px;
}

.np-article__top--overlay-bottom .np-author-meta .avatar {
	width: 32px;
	height: 32px;
}

.np-article__top--overlay-bottom .np-author-meta strong {
	font-size: 11.5px;
}

.np-article__top--overlay-bottom .np-author-meta span {
	font-size: 9.5px;
}

.np-article__top--overlay-bottom .np-share {
	gap: 4px;
}

.np-article__top--overlay-bottom .np-share > span {
	margin-right: 1px;
	font-size: 8.5px;
}

.np-article__top--overlay-bottom .np-share a {
	width: 28px;
	height: 28px;
	font-size: 8.5px;
}

.np-article__top:is(.np-article__top--overlay-bottom, .np-article__top--overlay-center, .np-article__top--cinematic) .np-article__featured figcaption {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 3;
	max-width: calc(100% - 24px);
	border-radius: 7px;
	background: rgba(0, 0, 0, 0.6);
	color: #fff;
}

.np-article__top--overlay-center .np-article__header {
	align-self: center;
	text-align: center;
}

.np-article__top--overlay-center .np-article__header > .np-badge {
	display: flex;
	width: max-content;
	margin-right: auto;
	margin-left: auto;
}

.np-article__top--overlay-center .np-article__dek {
	margin-right: auto;
	margin-left: auto;
}

.np-article__top--overlay-center .np-article__meta-row {
	justify-content: center;
}

.np-article__top--cinematic {
	border-radius: 2px;
	box-shadow: 0 22px 52px rgba(7, 21, 39, 0.2);
}

.np-article__top--cinematic .np-article__featured,
.np-article__top--cinematic .np-article__featured img {
	min-height: 470px;
}

.np-article__top--cinematic .np-article__featured img {
	filter: saturate(0.9) contrast(1.06);
}

/* 10 — Editorial rule. */
.np-article__top--editorial-line {
	padding-left: clamp(20px, 3vw, 34px);
	border-left: 7px solid var(--np-accent-strong);
}

.np-article__top--editorial-line .np-article__header {
	padding-bottom: 4px;
}

.np-article__top--editorial-line .np-article__featured {
	border-radius: 3px var(--np-radius-lg) var(--np-radius-lg) 3px;
}

/* 11 — Compact. */
.np-article__top--compact .np-article__header h1 {
	max-width: 760px;
	font-size: clamp(31px, 3.7vw, 44px);
}

.np-article__top--compact .np-article__dek {
	font-size: 17px;
}

.np-article__top--compact .np-article__meta-row {
	margin-top: 15px;
	padding: 11px 0;
}

.np-article__top--compact .np-article__featured {
	margin-top: 16px;
}

.np-article__top--compact .np-article__featured img {
	max-height: 390px;
	object-fit: cover;
}

/* 12 — Magazine band. */
.np-article__top--magazine-band {
	overflow: hidden;
	border-radius: var(--np-radius-lg);
	background: #0b1b32;
	box-shadow: var(--np-shadow-lg);
}

.np-article__top--magazine-band .np-article__header {
	padding: clamp(24px, 4vw, 42px);
	color: #fff;
}

.np-article__top--magazine-band .np-article__header h1,
.np-article__top--magazine-band .np-article__dek,
.np-article__top--magazine-band .np-author-meta span {
	color: #fff;
}

.np-article__top--magazine-band .np-article__meta-row {
	border-color: rgba(255, 255, 255, 0.2);
}

.np-article__top--magazine-band .np-article__featured {
	margin-top: 0;
	border-top: 6px solid var(--np-accent);
	border-radius: 0;
}

/* 13 — Floating title card. */
.np-article__top--floating-title {
	display: flex;
	flex-direction: column;
	padding-bottom: 28px;
}

.np-article__top--floating-title .np-article__featured {
	order: 1;
	margin-top: 0;
	border-radius: var(--np-radius-lg);
}

.np-article__top--floating-title .np-article__featured img {
	min-height: 430px;
	object-fit: cover;
}

.np-article__top--floating-title .np-article__header {
	order: 2;
	width: min(92%, 760px);
	margin: -96px auto 0;
	padding: clamp(22px, 3.5vw, 38px);
	border: 1px solid var(--np-border);
	border-radius: var(--np-radius-lg);
	background: var(--np-surface-raised);
	box-shadow: 0 20px 48px rgba(7, 21, 39, 0.18);
}

/* 14 — Image first. */
.np-article__top--image-first {
	display: flex;
	flex-direction: column;
}

.np-article__top--image-first .np-article__featured {
	order: 1;
	margin-top: 0;
	border-radius: var(--np-radius-lg);
}

.np-article__top--image-first .np-article__header {
	order: 2;
	padding-top: clamp(22px, 3vw, 34px);
}

/* 15 — Panorama. */
.np-article__top--panorama .np-article__featured {
	border-radius: 3px;
}

.np-article__top--panorama .np-article__featured img {
	width: 100%;
	aspect-ratio: 21 / 9;
	object-fit: cover;
}

/* 16 — Portrait focus. */
.np-article__top--portrait-focus {
	display: grid;
	grid-template-columns: minmax(0, 1.18fr) minmax(260px, 0.72fr);
	gap: clamp(24px, 4vw, 44px);
	align-items: center;
	padding: clamp(22px, 3vw, 36px);
	border: 1px solid var(--np-border);
	border-radius: var(--np-radius-lg);
	background: var(--np-surface);
}

.np-article__top--portrait-focus .np-article__featured {
	margin-top: 0;
	border-radius: 999px 999px 24px 24px;
}

.np-article__top--portrait-focus .np-article__featured img {
	width: 100%;
	min-height: 520px;
	aspect-ratio: 4 / 5;
	object-fit: cover;
}

.np-article__top--portrait-focus .np-article__header h1 {
	font-size: clamp(32px, 3.8vw, 48px);
}

.np-article__top--portrait-focus .np-article__meta-row {
	align-items: flex-start;
	flex-direction: column;
}

/* 17 — Photographic print. */
.np-article__top--polaroid .np-article__featured {
	margin: 32px 10px 12px;
	padding: 12px 12px 38px;
	border: 1px solid #dedbd2;
	border-radius: 2px;
	background: #fffdf8;
	box-shadow: 0 18px 38px rgba(39, 31, 20, 0.17);
	transform: rotate(-0.6deg);
}

.np-article__top--polaroid .np-article__featured figcaption {
	padding-bottom: 0;
	color: #625e55;
	font-family: Georgia, "Times New Roman", serif;
	text-align: center;
}

/* 18 — Duotone tech. */
.np-article__top--duotone {
	padding: clamp(22px, 3vw, 34px);
	border-radius: var(--np-radius-lg);
	background: linear-gradient(135deg, color-mix(in srgb, var(--np-blue) 11%, var(--np-surface)), color-mix(in srgb, var(--np-cyan) 10%, var(--np-bg)));
}

.np-article__top--duotone .np-article__featured {
	isolation: isolate;
	border-radius: 2px 24px 2px 24px;
	background: #244d9e;
}

.np-article__top--duotone .np-article__featured::after {
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, rgba(49, 104, 255, 0.42), rgba(34, 205, 208, 0.23));
	content: "";
	mix-blend-mode: color;
	pointer-events: none;
}

.np-article__top--duotone .np-article__featured figcaption {
	position: relative;
	z-index: 2;
}

/* 19 — Dark stage. */
.np-article__top--dark-stage {
	padding: clamp(24px, 4vw, 44px);
	border-radius: var(--np-radius-lg);
	background: radial-gradient(circle at top right, #193f72 0, #0a1a30 43%, #07111f 100%);
	box-shadow: 0 24px 54px rgba(4, 13, 26, 0.25);
}

.np-article__top--dark-stage .np-article__header {
	color: #fff;
}

.np-article__top--dark-stage .np-article__header h1,
.np-article__top--dark-stage .np-article__dek,
.np-article__top--dark-stage .np-author-meta span {
	color: #fff;
}

.np-article__top--dark-stage .np-article__meta-row {
	border-color: rgba(255, 255, 255, 0.22);
}

.np-article__top--dark-stage .np-article__featured {
	border: 1px solid rgba(255, 255, 255, 0.22);
	border-radius: 5px;
	box-shadow: 0 18px 38px rgba(0, 0, 0, 0.3);
}

.np-article__top--dark-stage .np-article__featured figcaption {
	color: #d2dbea;
}

/* 20 — Square focus. */
.np-article__top--square-focus {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(290px, 0.82fr);
	gap: clamp(24px, 4vw, 46px);
	align-items: center;
	padding: clamp(12px, 2vw, 20px) 0 clamp(12px, 2vw, 20px) clamp(22px, 3vw, 36px);
	border-left: 5px solid var(--np-blue);
}

.np-article__top--square-focus .np-article__featured {
	margin-top: 0;
	border: 10px solid var(--np-surface);
	border-radius: 50% 8px 8px 8px;
	box-shadow: var(--np-shadow-lg);
}

.np-article__top--square-focus .np-article__featured img {
	width: 100%;
	aspect-ratio: 1;
	object-fit: cover;
}

.np-article__top--square-focus .np-article__header h1 {
	font-size: clamp(31px, 3.5vw, 47px);
}

.np-article__top--square-focus .np-article__meta-row {
	align-items: flex-start;
	flex-direction: column;
}

/* Variants remain useful when an article has no featured image. */
.np-article__top--no-image:is(.np-article__top--split-right, .np-article__top--split-left, .np-article__top--portrait-focus, .np-article__top--square-focus) {
	display: block;
}

.np-article__top--no-image:is(.np-article__top--overlay-bottom, .np-article__top--overlay-center, .np-article__top--cinematic) {
	display: block;
	padding: clamp(26px, 4vw, 44px);
}

.np-article__top--no-image:is(.np-article__top--overlay-bottom, .np-article__top--overlay-center, .np-article__top--cinematic) .np-article__header {
	padding: 0;
}

.np-article__top--no-image.np-article__top--floating-title {
	padding-bottom: 0;
}

.np-article__top--no-image.np-article__top--floating-title .np-article__header {
	width: 100%;
	margin-top: 0;
}

/* Article tops collapse safely without horizontal overflow. */
@media (max-width: 760px) {
	.np-article__top--split-right,
	.np-article__top--split-left,
	.np-article__top--portrait-focus,
	.np-article__top--square-focus {
		display: flex;
		flex-direction: column;
		gap: 0;
		padding: 0;
		border-left-width: 1px;
	}

	.np-article__top:is(.np-article__top--split-right, .np-article__top--split-left, .np-article__top--portrait-focus, .np-article__top--square-focus) .np-article__header {
		order: 1;
		width: 100%;
		padding: 22px;
	}

	.np-article__top:is(.np-article__top--split-right, .np-article__top--split-left, .np-article__top--portrait-focus, .np-article__top--square-focus) .np-article__featured {
		order: 2;
		width: 100%;
		margin: 0;
		border: 0;
		border-radius: 0;
		box-shadow: none;
	}

	.np-article__top:is(.np-article__top--split-right, .np-article__top--split-left, .np-article__top--portrait-focus, .np-article__top--square-focus) .np-article__featured img {
		width: 100%;
		height: auto;
		min-height: 0;
		aspect-ratio: 16 / 10;
		object-fit: cover;
	}

	.np-article__top--overlay-bottom,
	.np-article__top--overlay-center,
	.np-article__top--cinematic {
		display: flex;
		flex-direction: column;
		border-radius: var(--np-radius);
	}

	.np-article__top:is(.np-article__top--overlay-bottom, .np-article__top--overlay-center, .np-article__top--cinematic) .np-article__header {
		order: 1;
		padding: 22px;
		text-align: left;
	}

	.np-article__top:is(.np-article__top--overlay-bottom, .np-article__top--overlay-center, .np-article__top--cinematic) .np-article__featured {
		order: 2;
		min-height: 0;
	}

	.np-article__top:is(.np-article__top--overlay-bottom, .np-article__top--overlay-center, .np-article__top--cinematic) .np-article__featured::after {
		display: none;
	}

	.np-article__top:is(.np-article__top--overlay-bottom, .np-article__top--overlay-center, .np-article__top--cinematic) .np-article__featured img {
		height: auto;
		min-height: 0;
		aspect-ratio: 16 / 10;
		object-fit: cover;
	}

	.np-article__top--overlay-center .np-article__header > .np-badge,
	.np-article__top--overlay-center .np-article__dek {
		margin-left: 0;
	}

	.np-article__top--overlay-center .np-article__meta-row {
		justify-content: flex-start;
	}

	.np-article__top--overlay-bottom .np-article__meta-row {
		width: 100%;
		align-items: center;
		justify-content: space-between;
		flex-direction: row;
		flex-wrap: wrap;
		gap: 10px;
		margin-top: 12px;
		padding: 9px 0;
	}

	.np-article__top--overlay-bottom .np-author-meta .avatar {
		width: 34px;
		height: 34px;
	}

	.np-article__top--overlay-bottom .np-share a {
		width: 32px;
		height: 32px;
	}

	.np-article__top:is(.np-article__top--overlay-bottom, .np-article__top--overlay-center, .np-article__top--cinematic) .np-article__featured figcaption {
		position: static;
		max-width: none;
		border-radius: 0;
		background: #071426;
	}

	.np-article__top--floating-title {
		padding-bottom: 0;
	}

	.np-article__top--floating-title .np-article__featured img {
		min-height: 280px;
	}

	.np-article__top--floating-title .np-article__header {
		width: calc(100% - 24px);
		margin-top: -46px;
		padding: 21px;
	}

	.np-article__top--soft-card,
	.np-article__top--framed,
	.np-article__top--duotone,
	.np-article__top--dark-stage {
		padding: 20px;
	}

	.np-article__top--polaroid .np-article__featured {
		margin-right: 2px;
		margin-left: 2px;
		transform: none;
	}
}

@media (max-width: 480px) {
	.np-article__top--soft-card,
	.np-article__top--framed,
	.np-article__top--duotone,
	.np-article__top--dark-stage {
		padding: 16px;
	}

	.np-article__top:is(.np-article__top--split-right, .np-article__top--split-left, .np-article__top--portrait-focus, .np-article__top--square-focus) .np-article__header,
	.np-article__top:is(.np-article__top--overlay-bottom, .np-article__top--overlay-center, .np-article__top--cinematic) .np-article__header {
		padding: 18px;
	}

	.np-article__top--floating-title .np-article__header {
		width: calc(100% - 16px);
		margin-top: -34px;
		padding: 18px;
	}
}

/* --------------------------------------------------------------------------
   First thirty legacy variants for the shared “Ultime notizie” panels
   -------------------------------------------------------------------------- */

.np-side-recent {
	--np-recent-accent: var(--np-blue);
	--np-recent-soft: color-mix(in srgb, var(--np-blue) 9%, var(--np-surface-raised));
	--np-recent-line: var(--np-border);
	min-width: 0;
}

.np-side-recent .np-side-list {
	min-width: 0;
}

.np-side-recent .np-side-story {
	position: relative;
	min-width: 0;
	color: inherit;
	isolation: isolate;
	transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.np-side-recent .np-side-story__media {
	position: relative;
	min-width: 0;
}

.np-side-recent .np-side-story__media .np-card__image,
.np-side-recent .np-side-story__media .np-card__fallback {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 0;
	object-fit: cover;
}

.np-side-recent .np-side-story__media .np-card__fallback {
	display: grid;
}

.np-side-recent .np-side-story__number,
.np-side-recent .np-side-story__category,
.np-side-recent .np-side-story__excerpt {
	display: none;
}

.np-side-recent .np-side-story__category {
	z-index: 3;
	width: max-content;
	max-width: calc(100% - 16px);
	min-height: 21px;
	padding: 3px 7px;
	font-size: 9px;
	line-height: 1.15;
	white-space: normal;
}

.np-side-recent .np-side-story__category--overlay {
	position: absolute;
	top: 8px;
	left: 8px;
}

.np-side-recent .np-side-story__category--inline {
	align-self: flex-start;
	margin-bottom: 6px;
}

.np-side-recent .np-side-story__excerpt {
	margin-top: 7px;
	color: var(--np-muted);
	font-size: 11px;
	line-height: 1.42;
}

.np-side-recent .np-side-story:hover .np-card__image,
.np-side-recent .np-side-story:focus-visible .np-card__image {
	transform: scale(1.045);
}

.np-side-recent .np-side-story:focus-visible {
	outline: 2px solid var(--np-blue);
	outline-offset: 3px;
}

/* 01 — Classic image on the left. */
.np-side-recent--classic-left .np-side-story {
	grid-template-columns: 58px minmax(0, 1fr);
}

/* 02 — Classic image on the right. */
.np-side-recent--classic-right .np-side-story {
	grid-template-columns: minmax(0, 1fr) 64px;
	gap: 12px;
}

.np-side-recent--classic-right .np-side-story__media {
	order: 2;
	width: 64px;
	height: 58px;
}

.np-side-recent--classic-right .np-side-story__content {
	order: 1;
}

/* Shared stacked-photo construction. */
.np-side-recent:is(.np-side-recent--photo-top, .np-side-recent--photo-bottom, .np-side-recent--category-overlay, .np-side-recent--panorama, .np-side-recent--separated, .np-side-recent--ribbon-category) .np-side-story {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 13px 0;
}

.np-side-recent:is(.np-side-recent--photo-top, .np-side-recent--photo-bottom, .np-side-recent--category-overlay, .np-side-recent--panorama, .np-side-recent--separated, .np-side-recent--ribbon-category) .np-side-story__media {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	border-radius: 11px;
}

.np-side-recent:is(.np-side-recent--photo-top, .np-side-recent--photo-bottom, .np-side-recent--category-overlay, .np-side-recent--panorama, .np-side-recent--separated, .np-side-recent--ribbon-category) .np-side-story strong {
	font-size: 14.5px;
	line-height: 1.32;
}

/* 03 — Image above, title below. */
.np-side-recent--photo-top .np-side-story__content {
	padding: 0 2px 2px;
}

/* 04 — Title above, image below. */
.np-side-recent--photo-bottom .np-side-story__content {
	order: 1;
}

.np-side-recent--photo-bottom .np-side-story__media {
	order: 2;
}

.np-side-recent--photo-bottom .np-side-story__category--inline {
	display: inline-flex;
}

/* 05 — Category over the image. */
.np-side-recent--category-overlay .np-side-story__category--overlay {
	display: inline-flex;
}

.np-side-recent--category-overlay .np-side-story__content {
	padding: 0 3px 3px;
}

/* Shared full-image overlay construction. */
.np-side-recent:is(.np-side-recent--title-overlay, .np-side-recent--center-overlay) .np-side-list {
	display: grid;
	gap: 12px;
}

.np-side-recent:is(.np-side-recent--title-overlay, .np-side-recent--center-overlay) .np-side-story {
	display: block;
	min-height: 190px;
	padding: 0;
	overflow: hidden;
	border: 0;
	border-radius: 14px;
	background: #071426;
}

.np-side-recent:is(.np-side-recent--title-overlay, .np-side-recent--center-overlay) .np-side-story::after {
	position: absolute;
	z-index: 1;
	inset: 0;
	content: "";
	background: linear-gradient(180deg, rgba(2, 8, 17, 0.06) 18%, rgba(2, 8, 17, 0.9) 100%);
}

.np-side-recent:is(.np-side-recent--title-overlay, .np-side-recent--center-overlay) .np-side-story__media {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border-radius: 0;
}

.np-side-recent:is(.np-side-recent--title-overlay, .np-side-recent--center-overlay) .np-side-story__content {
	position: absolute;
	z-index: 2;
	right: 0;
	bottom: 0;
	left: 0;
	padding: 20px;
	color: #fff;
}

.np-side-recent:is(.np-side-recent--title-overlay, .np-side-recent--center-overlay) .np-side-story strong {
	font-size: 17px;
	line-height: 1.25;
	-webkit-line-clamp: 4;
}

.np-side-recent:is(.np-side-recent--title-overlay, .np-side-recent--center-overlay) .np-side-story small {
	color: rgba(255, 255, 255, 0.78);
}

.np-side-recent:is(.np-side-recent--title-overlay, .np-side-recent--center-overlay) .np-side-story__category--overlay {
	display: inline-flex;
}

/* 06 — Title in the lower image overlay. */
.np-side-recent--title-overlay .np-side-story:hover,
.np-side-recent--title-overlay .np-side-story:focus-visible {
	transform: translateY(-2px);
	box-shadow: 0 16px 34px rgba(7, 21, 39, 0.23);
}

/* 07 — Centered full overlay. */
.np-side-recent--center-overlay .np-side-story::after {
	background: rgba(5, 13, 25, 0.62);
}

.np-side-recent--center-overlay .np-side-story__content {
	top: 50%;
	bottom: auto;
	transform: translateY(-50%);
	text-align: center;
}

.np-side-recent--center-overlay .np-side-story small {
	align-self: center;
}

/* 08 — Large lead story followed by compact rows. */
.np-side-recent--lead-story .np-side-story:first-child {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 0 0 14px;
}

.np-side-recent--lead-story .np-side-story:first-child .np-side-story__media {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	border-radius: 13px;
}

.np-side-recent--lead-story .np-side-story:first-child .np-side-story__category--overlay {
	display: inline-flex;
}

.np-side-recent--lead-story .np-side-story:first-child strong {
	font-size: 17px;
	line-height: 1.27;
}

.np-side-recent--lead-story .np-side-story:not(:first-child) {
	grid-template-columns: 54px minmax(0, 1fr);
	gap: 10px;
}

.np-side-recent--lead-story .np-side-story:not(:first-child) .np-side-story__media {
	width: 54px;
	height: 54px;
}

/* 09 — Numbered list without images. */
.np-side-recent--numbered .np-side-story {
	grid-template-columns: 48px minmax(0, 1fr);
	gap: 12px;
	align-items: center;
	padding: 14px 0;
}

.np-side-recent--numbered .np-side-story__media {
	display: none;
}

.np-side-recent--numbered .np-side-story__number {
	display: block;
	color: color-mix(in srgb, var(--np-blue) 78%, var(--np-ink));
	font-family: var(--np-display);
	font-size: 27px;
	font-weight: 950;
	line-height: 1;
}

.np-side-recent--numbered .np-side-story__category--inline {
	display: inline-flex;
}

/* 10 — Editorial timeline. */
.np-side-recent--timeline .np-side-list {
	position: relative;
	padding-left: 13px;
}

.np-side-recent--timeline .np-side-list::before {
	position: absolute;
	top: 16px;
	bottom: 16px;
	left: 4px;
	width: 2px;
	content: "";
	background: color-mix(in srgb, var(--np-blue) 40%, var(--np-border));
}

.np-side-recent--timeline .np-side-story {
	display: block;
	padding: 12px 0 12px 17px;
	border: 0;
}

.np-side-recent--timeline .np-side-story::before {
	position: absolute;
	top: 19px;
	left: -13px;
	width: 10px;
	height: 10px;
	border: 3px solid var(--np-surface-raised);
	border-radius: 50%;
	background: var(--np-blue);
	content: "";
	box-shadow: 0 0 0 1px var(--np-blue);
}

.np-side-recent--timeline .np-side-story__media {
	display: none;
}

.np-side-recent--timeline .np-side-story__category--inline {
	display: inline-flex;
}

/* 11 — Soft individual cards. */
.np-side-recent--soft-cards {
	background: color-mix(in srgb, var(--np-blue) 5%, var(--np-surface));
}

.np-side-recent--soft-cards .np-side-list {
	display: grid;
	gap: 10px;
}

.np-side-recent--soft-cards .np-side-story {
	grid-template-columns: 76px minmax(0, 1fr);
	gap: 12px;
	padding: 10px;
	border: 1px solid color-mix(in srgb, var(--np-blue) 13%, var(--np-border));
	border-radius: 13px;
	background: var(--np-surface-raised);
	box-shadow: 0 7px 18px rgba(7, 21, 39, 0.06);
}

.np-side-recent--soft-cards .np-side-story__media {
	width: 76px;
	height: 68px;
}

.np-side-recent--soft-cards .np-side-story:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 24px rgba(7, 21, 39, 0.11);
}

/* 12 — Two-column cards. */
.np-side-recent--two-column {
	padding: 14px;
}

.np-side-recent--two-column .np-side-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
}

.np-side-recent--two-column .np-side-story {
	display: flex;
	min-width: 0;
	flex-direction: column;
	gap: 8px;
	padding: 0 0 10px;
	overflow: hidden;
	border: 1px solid var(--np-border);
	border-radius: 11px;
	background: var(--np-surface);
}

.np-side-recent--two-column .np-side-story__media {
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	border-radius: 0;
}

.np-side-recent--two-column .np-side-story__content {
	padding: 0 9px;
}

.np-side-recent--two-column .np-side-story strong {
	font-size: 11.5px;
	-webkit-line-clamp: 4;
}

.np-side-recent--two-column .np-side-story__category--overlay {
	display: inline-flex;
}

/* 13 — Round thumbnails. */
.np-side-recent--round-thumbs .np-side-story {
	grid-template-columns: 66px minmax(0, 1fr);
	gap: 13px;
	align-items: center;
	padding: 12px 0;
}

.np-side-recent--round-thumbs .np-side-story__media {
	width: 66px;
	height: 66px;
	border: 3px solid color-mix(in srgb, var(--np-blue) 22%, var(--np-border));
	border-radius: 50%;
}

.np-side-recent--round-thumbs .np-side-story__category--inline {
	display: inline-flex;
}

/* 14 — Large square focus. */
.np-side-recent--square-focus .np-side-story {
	grid-template-columns: 96px minmax(0, 1fr);
	gap: 13px;
	align-items: center;
	padding: 12px 0;
}

.np-side-recent--square-focus .np-side-story__media {
	width: 96px;
	height: 96px;
	border-radius: 12px;
}

.np-side-recent--square-focus .np-side-story__category--overlay {
	display: inline-flex;
	top: 6px;
	left: 6px;
	max-width: calc(100% - 12px);
}

.np-side-recent--square-focus .np-side-story strong {
	font-size: 14px;
}

/* 15 — Vertical portrait image. */
.np-side-recent--portrait .np-side-story {
	grid-template-columns: 90px minmax(0, 1fr);
	gap: 14px;
	align-items: stretch;
	padding: 13px 0;
}

.np-side-recent--portrait .np-side-story__media {
	width: 90px;
	height: 122px;
	border-radius: 10px;
}

.np-side-recent--portrait .np-side-story__content {
	justify-content: flex-start;
	padding-top: 4px;
}

.np-side-recent--portrait .np-side-story__category--inline,
.np-side-recent--portrait .np-side-story__excerpt {
	display: inline-flex;
}

.np-side-recent--portrait .np-side-story__excerpt {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

/* 16 — Wide panorama. */
.np-side-recent--panorama .np-side-story__media {
	aspect-ratio: 2.15 / 1;
	border-radius: 7px;
}

.np-side-recent--panorama .np-side-story__category--overlay {
	display: inline-flex;
}

.np-side-recent--panorama .np-side-story strong {
	font-size: 15px;
}

/* 17 — Colored edge cards. */
.np-side-recent--accent-edge .np-side-list {
	display: grid;
	gap: 9px;
}

.np-side-recent--accent-edge .np-side-story {
	grid-template-columns: minmax(0, 1fr) 68px;
	gap: 12px;
	padding: 11px 10px 11px 13px;
	border: 0;
	border-left: 4px solid var(--np-blue);
	border-radius: 0 11px 11px 0;
	background: var(--np-recent-soft);
}

.np-side-recent--accent-edge .np-side-story:nth-child(even) {
	border-left-color: var(--np-accent);
}

.np-side-recent--accent-edge .np-side-story__media {
	order: 2;
	width: 68px;
	height: 60px;
}

.np-side-recent--accent-edge .np-side-story__content {
	order: 1;
}

/* 18 — Alternating color bands. */
.np-side-recent--color-band .np-side-list {
	display: grid;
	gap: 7px;
}

.np-side-recent--color-band .np-side-story {
	display: block;
	padding: 14px;
	border: 0;
	border-radius: 10px;
	background: color-mix(in srgb, var(--np-blue) 18%, var(--np-surface-raised));
	color: var(--np-ink);
}

.np-side-recent--color-band .np-side-story:nth-child(even) {
	background: color-mix(in srgb, var(--np-accent) 24%, var(--np-surface-raised));
}

.np-side-recent--color-band .np-side-story__media {
	display: none;
}

.np-side-recent--color-band .np-side-story small {
	color: currentColor;
	opacity: 0.76;
}

.np-side-recent--color-band .np-side-story:hover strong,
.np-side-recent--color-band .np-side-story:focus-visible strong {
	color: currentColor;
}

/* 19 — Dark newsroom panel. */
.np-side-recent--dark-panel {
	--np-recent-line: rgba(255, 255, 255, 0.14);
	border-color: #1e3858;
	background: #071a31;
	color: #f6f9ff;
	box-shadow: 0 18px 38px rgba(2, 9, 18, 0.24);
}

.np-side-recent--dark-panel .np-section-heading__dot {
	background: var(--np-accent);
}

.np-side-recent--dark-panel .np-side-story {
	grid-template-columns: 74px minmax(0, 1fr);
	gap: 12px;
	border-color: var(--np-recent-line);
}

.np-side-recent--dark-panel .np-side-story__media {
	width: 74px;
	height: 66px;
	border-radius: 5px;
}

.np-side-recent--dark-panel .np-side-story__category--overlay {
	display: inline-flex;
}

.np-side-recent--dark-panel .np-side-story small {
	color: #aebed1;
}

.np-side-recent--dark-panel .np-side-story:hover strong,
.np-side-recent--dark-panel .np-side-story:focus-visible strong {
	color: var(--np-accent);
}

/* 20 — Frosted glass. */
.np-side-recent--glass-panel {
	border-color: color-mix(in srgb, var(--np-blue) 24%, transparent);
	background: linear-gradient(145deg, color-mix(in srgb, var(--np-surface-raised) 78%, transparent), color-mix(in srgb, var(--np-blue) 8%, transparent));
	box-shadow: 0 18px 42px rgba(7, 21, 39, 0.12);
	backdrop-filter: blur(20px) saturate(1.16);
}

.np-side-recent--glass-panel .np-side-list {
	display: grid;
	gap: 9px;
}

.np-side-recent--glass-panel .np-side-story {
	grid-template-columns: 72px minmax(0, 1fr);
	gap: 12px;
	padding: 10px;
	border: 1px solid color-mix(in srgb, var(--np-border) 65%, transparent);
	border-radius: 13px;
	background: color-mix(in srgb, var(--np-surface-raised) 62%, transparent);
}

.np-side-recent--glass-panel .np-side-story__media {
	width: 72px;
	height: 64px;
}

/* 21 — Paper editorial. */
.np-side-recent--paper-editorial {
	border-color: #cdbf9d;
	border-radius: 2px;
	background: #f5efdf;
	color: #27231c;
	box-shadow: 5px 7px 0 #d8ccb0;
}

.np-side-recent--paper-editorial .np-section-heading {
	padding-bottom: 9px;
	border-bottom: 3px double #71664e;
}

.np-side-recent--paper-editorial .np-section-heading__dot {
	display: none;
}

.np-side-recent--paper-editorial .np-section-heading h2,
.np-side-recent--paper-editorial .np-side-story strong {
	font-family: Georgia, "Times New Roman", serif;
}

.np-side-recent--paper-editorial .np-side-story {
	grid-template-columns: minmax(0, 1fr) 76px;
	gap: 12px;
	border-color: #cdbf9d;
}

.np-side-recent--paper-editorial .np-side-story__media {
	order: 2;
	width: 76px;
	height: 68px;
	border-radius: 0;
	filter: saturate(0.72) contrast(1.04);
}

.np-side-recent--paper-editorial .np-side-story__content {
	order: 1;
}

.np-side-recent--paper-editorial .np-side-story__category--inline {
	display: inline-flex;
}

.np-side-recent--paper-editorial .np-side-story small {
	color: #786e5c;
}

/* 22 — Newspaper. */
.np-side-recent--newsprint {
	padding: 15px;
	border: 2px solid #171717;
	border-radius: 0;
	background: #fff;
	color: #111;
}

.np-side-recent--newsprint .np-section-heading {
	justify-content: center;
	padding: 5px 0 9px;
	border-top: 4px double #111;
	border-bottom: 1px solid #111;
	text-align: center;
}

.np-side-recent--newsprint .np-section-heading__dot {
	display: none;
}

.np-side-recent--newsprint .np-section-heading h2 {
	font-family: Georgia, "Times New Roman", serif;
	font-size: 24px;
}

.np-side-recent--newsprint .np-side-story {
	grid-template-columns: minmax(0, 1fr) 70px;
	gap: 12px;
	border-color: #111;
}

.np-side-recent--newsprint .np-side-story__media {
	order: 2;
	width: 70px;
	height: 62px;
	border-radius: 0;
	filter: grayscale(1);
}

.np-side-recent--newsprint .np-side-story__content {
	order: 1;
}

.np-side-recent--newsprint .np-side-story strong {
	font-family: Georgia, "Times New Roman", serif;
	font-size: 13.5px;
}

.np-side-recent--newsprint .np-side-story__category--inline {
	display: inline-flex;
}

.np-side-recent--newsprint .np-side-story small {
	color: #555;
}

/* 23 — Minimal lines, no imagery. */
.np-side-recent--minimal-lines {
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
}

.np-side-recent--minimal-lines .np-section-heading {
	padding-bottom: 10px;
	border-bottom: 2px solid var(--np-ink);
}

.np-side-recent--minimal-lines .np-side-story {
	display: block;
	padding: 14px 2px;
}

.np-side-recent--minimal-lines .np-side-story__media {
	display: none;
}

.np-side-recent--minimal-lines .np-side-story__category--inline {
	display: inline-flex;
}

.np-side-recent--minimal-lines .np-side-story strong {
	font-size: 14px;
	-webkit-line-clamp: 4;
}

/* 24 — Widely separated editorial blocks. */
.np-side-recent--separated {
	padding: 0;
	border: 0;
	background: transparent;
}

.np-side-recent--separated .np-side-list {
	display: grid;
	gap: 16px;
}

.np-side-recent--separated .np-side-story {
	padding: 13px;
	border: 1px solid var(--np-border);
	border-radius: 15px;
	background: var(--np-surface-raised);
	box-shadow: var(--np-shadow-sm);
}

.np-side-recent--separated .np-side-story__category--overlay {
	display: inline-flex;
}

.np-side-recent--separated .np-side-story__excerpt {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

/* 25 — Floating thumbnail. */
.np-side-recent--floating-thumb .np-side-list {
	display: grid;
	gap: 20px;
	padding-top: 10px;
}

.np-side-recent--floating-thumb .np-side-story {
	display: block;
	min-height: 88px;
	padding: 16px 13px 14px 86px;
	border: 1px solid var(--np-border);
	border-radius: 14px;
	background: var(--np-surface);
	box-shadow: 0 8px 20px rgba(7, 21, 39, 0.07);
}

.np-side-recent--floating-thumb .np-side-story__media {
	position: absolute;
	top: -10px;
	left: 12px;
	width: 62px;
	height: 62px;
	border: 3px solid var(--np-surface-raised);
	border-radius: 13px;
	box-shadow: 0 8px 18px rgba(7, 21, 39, 0.18);
}

.np-side-recent--floating-thumb .np-side-story__category--inline {
	display: inline-flex;
}

/* 26 — Category ribbon over the image. */
.np-side-recent--ribbon-category .np-side-story {
	overflow: visible;
	padding: 12px;
	border: 1px solid var(--np-border);
	border-radius: 13px;
	background: var(--np-surface-raised);
}

.np-side-recent--ribbon-category .np-side-story__media {
	overflow: visible;
}

.np-side-recent--ribbon-category .np-side-story__media .np-card__image,
.np-side-recent--ribbon-category .np-side-story__media .np-card__fallback {
	overflow: hidden;
	border-radius: 9px;
}

.np-side-recent--ribbon-category .np-side-story__category--overlay {
	display: inline-flex;
	top: 10px;
	left: -8px;
	padding-right: 13px;
	border-radius: 0 999px 999px 0;
	box-shadow: 0 5px 12px rgba(7, 21, 39, 0.2);
}

/* 27 — Category leads the content hierarchy. */
.np-side-recent--category-first .np-side-story {
	grid-template-columns: minmax(0, 1fr) 78px;
	gap: 13px;
	align-items: center;
	padding: 13px 0;
}

.np-side-recent--category-first .np-side-story__media {
	order: 2;
	width: 78px;
	height: 70px;
	border-radius: 4px 13px 4px 13px;
}

.np-side-recent--category-first .np-side-story__content {
	order: 1;
}

.np-side-recent--category-first .np-side-story__category--inline {
	display: inline-flex;
	margin-bottom: 8px;
}

.np-side-recent--category-first .np-side-story strong {
	font-size: 13.5px;
}

/* 28 — Images alternate left and right. */
.np-side-recent--alternating .np-side-story {
	grid-template-columns: 68px minmax(0, 1fr);
	gap: 12px;
	align-items: center;
}

.np-side-recent--alternating .np-side-story__media {
	width: 68px;
	height: 62px;
}

.np-side-recent--alternating .np-side-story:nth-child(even) {
	grid-template-columns: minmax(0, 1fr) 68px;
}

.np-side-recent--alternating .np-side-story:nth-child(even) .np-side-story__media {
	order: 2;
}

.np-side-recent--alternating .np-side-story:nth-child(even) .np-side-story__content {
	order: 1;
	text-align: right;
}

.np-side-recent--alternating .np-side-story:nth-child(even) small {
	align-self: flex-end;
}

/* 29 — Spotlight lead plus numbered text list. */
.np-side-recent--spotlight .np-side-story:first-child {
	display: block;
	min-height: 210px;
	padding: 0;
	overflow: hidden;
	border: 0;
	border-radius: 15px;
	background: #071426;
}

.np-side-recent--spotlight .np-side-story:first-child::after {
	position: absolute;
	z-index: 1;
	inset: 0;
	content: "";
	background: linear-gradient(180deg, transparent 25%, rgba(3, 9, 18, 0.92));
}

.np-side-recent--spotlight .np-side-story:first-child .np-side-story__media {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border-radius: 0;
}

.np-side-recent--spotlight .np-side-story:first-child .np-side-story__content {
	position: absolute;
	z-index: 2;
	right: 0;
	bottom: 0;
	left: 0;
	padding: 19px;
	color: #fff;
}

.np-side-recent--spotlight .np-side-story:first-child .np-side-story__category--overlay {
	display: inline-flex;
}

.np-side-recent--spotlight .np-side-story:first-child strong {
	font-size: 17px;
}

.np-side-recent--spotlight .np-side-story:first-child small {
	color: rgba(255, 255, 255, 0.78);
}

.np-side-recent--spotlight .np-side-story:not(:first-child) {
	grid-template-columns: 38px minmax(0, 1fr);
	gap: 10px;
}

.np-side-recent--spotlight .np-side-story:not(:first-child) .np-side-story__media {
	display: none;
}

.np-side-recent--spotlight .np-side-story:not(:first-child) .np-side-story__number {
	display: block;
	color: var(--np-blue);
	font-family: var(--np-display);
	font-size: 20px;
	font-weight: 950;
}

/* 30 — Editorial mosaic. */
.np-side-recent--mosaic {
	padding: 14px;
}

.np-side-recent--mosaic .np-side-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
}

.np-side-recent--mosaic .np-side-story {
	display: flex;
	min-width: 0;
	flex-direction: column;
	gap: 8px;
	padding: 0 0 9px;
	overflow: hidden;
	border: 1px solid var(--np-border);
	border-radius: 11px;
	background: var(--np-surface);
}

.np-side-recent--mosaic .np-side-story:first-child {
	grid-column: 1 / -1;
}

.np-side-recent--mosaic .np-side-story__media {
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	border-radius: 0;
}

.np-side-recent--mosaic .np-side-story:first-child .np-side-story__media {
	aspect-ratio: 16 / 8;
}

.np-side-recent--mosaic .np-side-story__content {
	padding: 0 9px;
}

.np-side-recent--mosaic .np-side-story strong {
	font-size: 11.5px;
	-webkit-line-clamp: 4;
}

.np-side-recent--mosaic .np-side-story:first-child strong {
	font-size: 15px;
}

.np-side-recent--mosaic .np-side-story__category--overlay {
	display: inline-flex;
}

@media (max-width: 420px) {
	.np-side-recent--two-column .np-side-list,
	.np-side-recent--mosaic .np-side-list {
		grid-template-columns: 1fr;
	}

	.np-side-recent--mosaic .np-side-story:first-child {
		grid-column: auto;
	}

	.np-side-recent--portrait .np-side-story {
		grid-template-columns: 82px minmax(0, 1fr);
	}

	.np-side-recent--portrait .np-side-story__media {
		width: 82px;
		height: 112px;
	}
}

/* --------------------------------------------------------------------------
   Variants 31–80 shared by sidebar and homepage recent-news widgets
   -------------------------------------------------------------------------- */

.np-side-recent .np-side-story__image {
	image-rendering: auto;
	object-position: center;
	backface-visibility: hidden;
}

/* Homepage adapter: keeps every composition usable beside the slider. */
.np-home-recent {
	min-height: 0;
}

.np-home-recent .np-section-heading {
	order: -3;
	flex: 0 0 auto;
	margin-bottom: 8px;
}

.np-home-recent .np-section-heading h2 {
	order: 0;
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 15px;
}

.np-home-recent .np-breaking__all {
	flex: 0 0 auto;
}

.np-home-recent .np-side-list {
	flex: 1 1 auto;
	min-height: 0;
	padding-right: 4px;
	overflow-y: auto;
	overscroll-behavior: contain;
	scrollbar-color: color-mix(in srgb, var(--np-blue) 45%, transparent) transparent;
	scrollbar-width: thin;
}

.np-home-recent .np-side-story {
	flex: 0 0 auto;
}

/* A user can disable homepage thumbnails independently of the selected style. */
.np-side-recent .np-side-story--media-disabled {
	display: block !important;
	min-height: 0 !important;
	padding: 12px 0 !important;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	transform: none !important;
	clip-path: none;
}

.np-side-recent .np-side-story--media-disabled::before,
.np-side-recent .np-side-story--media-disabled::after {
	display: none !important;
}

.np-side-recent .np-side-story--media-disabled .np-side-story__content {
	position: relative !important;
	inset: auto !important;
	align-items: flex-start;
	padding: 0 !important;
	color: inherit;
	text-align: left;
	transform: none !important;
}

.np-side-recent .np-side-story--media-disabled .np-side-story__category--inline {
	display: inline-flex;
}

.np-side-recent--date-block .np-side-story--no-time {
	min-height: 0;
	padding-left: 0 !important;
}

.np-side-recent--compact-newsroom .np-side-story--no-time {
	padding-right: 0 !important;
}

/* 31 — Wide landscape image on the left. */
.np-side-recent--wide-left .np-side-story {
	grid-template-columns: 108px minmax(0, 1fr);
	gap: 14px;
	align-items: center;
	padding: 13px 0;
}

.np-side-recent--wide-left .np-side-story__media {
	width: 108px;
	height: 78px;
	border-radius: 12px;
}

.np-side-recent--wide-left .np-side-story__category--inline,
.np-side-recent--wide-left .np-side-story__excerpt {
	display: -webkit-box;
}

.np-side-recent--wide-left .np-side-story__excerpt {
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
}

/* 32 — Wide landscape image on the right. */
.np-side-recent--wide-right .np-side-story {
	grid-template-columns: minmax(0, 1fr) 108px;
	gap: 14px;
	align-items: center;
	padding: 13px 0;
}

.np-side-recent--wide-right .np-side-story__media {
	order: 2;
	width: 108px;
	height: 78px;
	border-radius: 12px 3px 12px 3px;
}

.np-side-recent--wide-right .np-side-story__content {
	order: 1;
}

.np-side-recent--wide-right .np-side-story__category--inline {
	display: inline-flex;
}

/* 33 — Panoramic image followed by its editorial caption. */
.np-side-recent--top-caption .np-side-list {
	display: grid;
	gap: 15px;
}

.np-side-recent--top-caption .np-side-story {
	display: flex;
	flex-direction: column;
	gap: 9px;
	padding: 0 0 14px;
}

.np-side-recent--top-caption .np-side-story__media {
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	border-radius: 13px 13px 4px 4px;
}

.np-side-recent--top-caption .np-side-story__category--overlay {
	display: inline-flex;
}

.np-side-recent--top-caption .np-side-story strong {
	font-size: 15px;
	line-height: 1.3;
}

/* 34 — Copy first, panoramic image underneath. */
.np-side-recent--bottom-caption .np-side-list {
	display: grid;
	gap: 16px;
}

.np-side-recent--bottom-caption .np-side-story {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 13px;
	border: 1px solid var(--np-border);
	border-radius: 14px;
	background: var(--np-surface);
}

.np-side-recent--bottom-caption .np-side-story__content {
	order: 1;
}

.np-side-recent--bottom-caption .np-side-story__media {
	order: 2;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 8;
	border-radius: 8px;
}

.np-side-recent--bottom-caption .np-side-story__category--inline {
	display: inline-flex;
}

/* 35 — Inset image inside a softly raised card. */
.np-side-recent--inset-photo {
	background: color-mix(in srgb, var(--np-blue) 5%, var(--np-surface-raised));
}

.np-side-recent--inset-photo .np-side-list {
	display: grid;
	gap: 10px;
}

.np-side-recent--inset-photo .np-side-story {
	grid-template-columns: 86px minmax(0, 1fr);
	gap: 13px;
	padding: 10px;
	border: 1px solid color-mix(in srgb, var(--np-blue) 15%, var(--np-border));
	border-radius: 15px;
	background: var(--np-surface-raised);
	box-shadow: inset 0 0 0 4px color-mix(in srgb, var(--np-blue) 3%, transparent);
}

.np-side-recent--inset-photo .np-side-story__media {
	width: 86px;
	height: 76px;
	border: 4px solid var(--np-surface);
	border-radius: 12px;
	box-shadow: 0 8px 18px rgba(7, 21, 39, 0.14);
}

/* 36 — Every item becomes a full-image gradient story. */
.np-side-recent--gradient-story .np-side-list {
	display: grid;
	gap: 12px;
}

.np-side-recent--gradient-story .np-side-story {
	display: block;
	min-height: 176px;
	padding: 0;
	overflow: hidden;
	border: 0;
	border-radius: 16px;
	background: #071426;
}

.np-side-recent--gradient-story .np-side-story::after {
	position: absolute;
	z-index: 1;
	inset: 0;
	content: "";
	background: linear-gradient(155deg, rgba(0, 90, 190, 0.05), rgba(3, 10, 21, 0.93));
}

.np-side-recent--gradient-story .np-side-story__media {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border-radius: 0;
}

.np-side-recent--gradient-story .np-side-story__content {
	position: absolute;
	z-index: 2;
	right: 0;
	bottom: 0;
	left: 0;
	padding: 18px;
	color: #fff;
}

.np-side-recent--gradient-story .np-side-story__category--overlay {
	display: inline-flex;
}

.np-side-recent--gradient-story .np-side-story strong {
	font-size: 16px;
}

.np-side-recent--gradient-story .np-side-story small {
	color: rgba(255, 255, 255, 0.76);
}

/* 37 — Image with a floating caption card. */
.np-side-recent--corner-caption .np-side-list {
	display: grid;
	gap: 22px;
}

.np-side-recent--corner-caption .np-side-story {
	display: block;
	padding: 0 0 48px;
	border: 0;
}

.np-side-recent--corner-caption .np-side-story__media {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 10;
	border-radius: 16px;
}

.np-side-recent--corner-caption .np-side-story__content {
	position: absolute;
	z-index: 2;
	right: 10px;
	bottom: 0;
	left: 28px;
	min-height: 82px;
	padding: 13px 14px;
	border: 1px solid var(--np-border);
	border-radius: 12px 3px 12px 3px;
	background: var(--np-surface-raised);
	box-shadow: 0 12px 26px rgba(7, 21, 39, 0.14);
}

.np-side-recent--corner-caption .np-side-story__category--inline {
	display: inline-flex;
}

/* 38 — One overlay lead followed by compact rows. */
.np-side-recent--split-overlay .np-side-story:first-child {
	display: block;
	min-height: 220px;
	padding: 0;
	overflow: hidden;
	border: 0;
	border-radius: 16px;
	background: #071426;
}

.np-side-recent--split-overlay .np-side-story:first-child::after {
	position: absolute;
	z-index: 1;
	inset: 0;
	content: "";
	background: linear-gradient(180deg, transparent 22%, rgba(2, 9, 18, 0.92));
}

.np-side-recent--split-overlay .np-side-story:first-child .np-side-story__media {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border-radius: 0;
}

.np-side-recent--split-overlay .np-side-story:first-child .np-side-story__content {
	position: absolute;
	z-index: 2;
	right: 0;
	bottom: 0;
	left: 0;
	padding: 19px;
	color: #fff;
}

.np-side-recent--split-overlay .np-side-story:first-child strong {
	font-size: 18px;
}

.np-side-recent--split-overlay .np-side-story:first-child small {
	color: rgba(255, 255, 255, 0.75);
}

.np-side-recent--split-overlay .np-side-story:not(:first-child) {
	grid-template-columns: 36px minmax(0, 1fr);
	gap: 10px;
}

.np-side-recent--split-overlay .np-side-story:not(:first-child) .np-side-story__number {
	display: block;
	color: var(--np-blue);
	font-size: 18px;
	font-weight: 950;
}

/* 39 — Category pinned to the upper-right image corner. */
.np-side-recent--category-corner .np-side-story {
	display: flex;
	flex-direction: column;
	gap: 9px;
	padding: 12px 0;
}

.np-side-recent--category-corner .np-side-story__media {
	width: 100%;
	height: auto;
	aspect-ratio: 2 / 1;
	border-radius: 4px 15px 4px 15px;
}

.np-side-recent--category-corner .np-side-story__category--overlay {
	top: 8px;
	right: 8px;
	left: auto;
	display: inline-flex;
}

.np-side-recent--category-corner .np-side-story strong {
	font-size: 14.5px;
}

/* 40 — Monochrome photo cards with centered copy. */
.np-side-recent--monochrome-overlay {
	padding: 14px;
	border-radius: 0;
	background: #111;
	color: #fff;
}

.np-side-recent--monochrome-overlay .np-side-list {
	display: grid;
	gap: 10px;
}

.np-side-recent--monochrome-overlay .np-side-story {
	display: block;
	min-height: 168px;
	padding: 0;
	overflow: hidden;
	border: 1px solid #555;
	border-radius: 0;
}

.np-side-recent--monochrome-overlay .np-side-story::after {
	position: absolute;
	z-index: 1;
	inset: 0;
	content: "";
	background: rgba(0, 0, 0, 0.54);
}

.np-side-recent--monochrome-overlay .np-side-story__media {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border-radius: 0;
}

.np-side-recent--monochrome-overlay .np-card__image {
	filter: grayscale(1) contrast(1.12);
}

.np-side-recent--monochrome-overlay .np-side-story__content {
	position: absolute;
	z-index: 2;
	inset: 50% 14px auto;
	transform: translateY(-50%);
	color: #fff;
	text-align: center;
}

.np-side-recent--monochrome-overlay .np-side-story small {
	align-self: center;
	color: #ddd;
}

/* 41 — Large vertical ranking numbers. */
.np-side-recent--stacked-number .np-side-story {
	grid-template-columns: 58px minmax(0, 1fr);
	gap: 14px;
	align-items: center;
	padding: 15px 0;
}

.np-side-recent--stacked-number .np-side-story__number {
	display: block;
	color: color-mix(in srgb, var(--np-blue) 82%, var(--np-ink));
	font-family: var(--np-display);
	font-size: 32px;
	font-weight: 950;
	letter-spacing: -0.08em;
	line-height: 0.9;
	writing-mode: vertical-rl;
}

.np-side-recent--stacked-number .np-side-story__category--inline {
	display: inline-flex;
}

/* 42 — Time displayed as a dedicated side block. */
.np-side-recent--date-block .np-side-story {
	display: block;
	min-height: 76px;
	padding: 13px 0 13px 76px;
}

.np-side-recent--date-block .np-side-story small {
	position: absolute;
	top: 13px;
	left: 0;
	display: grid;
	width: 62px;
	min-height: 48px;
	place-items: center;
	margin: 0;
	padding: 6px;
	border: 1px solid color-mix(in srgb, var(--np-blue) 25%, var(--np-border));
	border-radius: 10px;
	background: var(--np-recent-soft);
	color: var(--np-blue);
	font-size: 11px;
	font-weight: 900;
	text-align: center;
}

.np-side-recent--date-block .np-side-story__category--inline {
	display: inline-flex;
}

/* 43 — Numbered ranking cards. */
.np-side-recent--rank-cards .np-side-list {
	display: grid;
	gap: 9px;
}

.np-side-recent--rank-cards .np-side-story {
	grid-template-columns: 44px minmax(0, 1fr);
	gap: 12px;
	align-items: center;
	padding: 12px;
	border: 1px solid var(--np-border);
	border-radius: 13px;
	background: var(--np-surface);
}

.np-side-recent--rank-cards .np-side-story__number {
	display: grid;
	width: 40px;
	height: 40px;
	place-items: center;
	border-radius: 12px;
	background: var(--np-blue);
	color: #fff;
	font-size: 15px;
	font-weight: 950;
}

.np-side-recent--rank-cards .np-side-story:nth-child(even) .np-side-story__number {
	background: var(--np-accent);
	color: #111;
}

/* 44 — Dark terminal-style feed. */
.np-side-recent--terminal-feed {
	border-color: #234258;
	border-radius: 5px;
	background: #06141d;
	color: #d8f7ef;
	box-shadow: 0 16px 36px rgba(2, 9, 14, 0.28);
}

.np-side-recent--terminal-feed .np-section-heading__dot {
	border-radius: 2px;
	background: #4dffb8;
	box-shadow: 0 0 12px rgba(77, 255, 184, 0.7);
}

.np-side-recent--terminal-feed .np-side-story {
	display: block;
	padding: 13px 8px 13px 25px;
	border-color: #183141;
	font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
}

.np-side-recent--terminal-feed .np-side-story::before {
	position: absolute;
	top: 14px;
	left: 4px;
	color: #4dffb8;
	content: ">";
	font-weight: 900;
}

.np-side-recent--terminal-feed .np-side-story strong {
	font-family: inherit;
	font-size: 12px;
}

.np-side-recent--terminal-feed .np-side-story small {
	color: #79b7a5;
}

/* 45 — Centered typographic list. */
.np-side-recent--centered-list .np-side-story {
	display: block;
	padding: 17px 8px;
	text-align: center;
}

.np-side-recent--centered-list .np-side-story__content {
	align-items: center;
}

.np-side-recent--centered-list .np-side-story__category--inline {
	display: inline-flex;
	align-self: center;
}

.np-side-recent--centered-list .np-side-story strong {
	font-family: Georgia, "Times New Roman", serif;
	font-size: 15px;
	line-height: 1.35;
}

/* Shared two- and three-column card construction. */
.np-side-recent:is(.np-side-recent--square-duo, .np-side-recent--portrait-duo, .np-side-recent--three-up, .np-side-recent--checkerboard) {
	padding: 14px;
}

.np-side-recent:is(.np-side-recent--square-duo, .np-side-recent--portrait-duo, .np-side-recent--three-up, .np-side-recent--checkerboard) .np-side-list {
	display: grid;
	gap: 10px;
}

.np-side-recent:is(.np-side-recent--square-duo, .np-side-recent--portrait-duo, .np-side-recent--checkerboard) .np-side-list {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.np-side-recent:is(.np-side-recent--square-duo, .np-side-recent--portrait-duo, .np-side-recent--three-up, .np-side-recent--checkerboard) .np-side-story {
	display: flex;
	min-width: 0;
	flex-direction: column;
	gap: 8px;
	padding: 0 0 10px;
	overflow: hidden;
	border: 1px solid var(--np-border);
	border-radius: 12px;
	background: var(--np-surface);
}

.np-side-recent:is(.np-side-recent--square-duo, .np-side-recent--portrait-duo, .np-side-recent--three-up, .np-side-recent--checkerboard) .np-side-story__content {
	padding: 0 9px;
}

.np-side-recent:is(.np-side-recent--square-duo, .np-side-recent--portrait-duo, .np-side-recent--three-up, .np-side-recent--checkerboard) .np-side-story strong {
	font-size: 11.5px;
	-webkit-line-clamp: 4;
}

.np-side-recent:is(.np-side-recent--square-duo, .np-side-recent--portrait-duo, .np-side-recent--three-up, .np-side-recent--checkerboard) .np-side-story__category--overlay {
	display: inline-flex;
}

/* 46 — Two square cards per row. */
.np-side-recent--square-duo .np-side-story__media {
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	border-radius: 0;
}

/* 47 — Two portrait cards per row. */
.np-side-recent--portrait-duo .np-side-story__media {
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 4;
	border-radius: 0;
}

.np-side-recent--portrait-duo .np-side-story:nth-child(even) {
	transform: translateY(14px);
}

/* 48 — Dense three-column mini grid. */
.np-side-recent--three-up .np-side-list {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.np-side-recent--three-up .np-side-story__media {
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	border-radius: 0;
}

.np-side-recent--three-up .np-side-story__content {
	padding: 0 7px;
}

.np-side-recent--three-up .np-side-story strong {
	font-size: 10.5px;
	line-height: 1.24;
}

.np-side-recent--three-up .np-side-story small {
	display: none;
}

/* 49 — Alternating checkerboard colors. */
.np-side-recent--checkerboard .np-side-story {
	border-radius: 0;
}

.np-side-recent--checkerboard .np-side-story:nth-child(4n + 1),
.np-side-recent--checkerboard .np-side-story:nth-child(4n + 4) {
	background: color-mix(in srgb, var(--np-blue) 12%, var(--np-surface));
}

.np-side-recent--checkerboard .np-side-story:nth-child(4n + 2),
.np-side-recent--checkerboard .np-side-story:nth-child(4n + 3) {
	background: color-mix(in srgb, var(--np-accent) 18%, var(--np-surface));
}

.np-side-recent--checkerboard .np-side-story__media {
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	border-radius: 0;
}

/* 50 — Horizontal snap-scrolling gallery. */
.np-side-recent--gallery-strip .np-side-list {
	display: grid;
	grid-auto-columns: minmax(190px, 78%);
	grid-auto-flow: column;
	gap: 12px;
	padding: 5px 2px 12px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
}

.np-side-recent--gallery-strip .np-side-story {
	display: flex;
	min-width: 0;
	flex-direction: column;
	gap: 9px;
	padding: 0 0 12px;
	overflow: hidden;
	border: 1px solid var(--np-border);
	border-radius: 15px;
	background: var(--np-surface);
	scroll-snap-align: start;
}

.np-side-recent--gallery-strip .np-side-story__media {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 10;
	border-radius: 0;
}

.np-side-recent--gallery-strip .np-side-story__content {
	padding: 0 12px;
}

.np-side-recent--gallery-strip .np-side-story__category--overlay {
	display: inline-flex;
}

.np-side-recent--gallery-strip .np-side-story strong {
	font-size: 14px;
}

/* 51 — Warm cream journal. */
.np-side-recent--cream-journal {
	border-color: #d8c9a9;
	border-radius: 3px;
	background: #fff8e9;
	color: #29251d;
	box-shadow: 7px 8px 0 #e6d9bd;
}

.np-side-recent--cream-journal .np-section-heading {
	padding-bottom: 10px;
	border-bottom: 1px solid #8f8062;
}

.np-side-recent--cream-journal .np-section-heading h2,
.np-side-recent--cream-journal .np-side-story strong {
	font-family: Georgia, "Times New Roman", serif;
}

.np-side-recent--cream-journal .np-side-story {
	grid-template-columns: 82px minmax(0, 1fr);
	gap: 13px;
	border-color: #d8c9a9;
}

.np-side-recent--cream-journal .np-side-story__media {
	width: 82px;
	height: 72px;
	border: 1px solid #b8a782;
	border-radius: 1px;
}

.np-side-recent--cream-journal .np-side-story__category--inline {
	display: inline-flex;
}

.np-side-recent--cream-journal .np-side-story small {
	color: #796e58;
}

/* 52 — Blue ruled ledger without images. */
.np-side-recent--blue-ledger {
	border-color: #a8bfdc;
	border-radius: 2px;
	background: repeating-linear-gradient(#f9fcff 0 31px, #dce9f7 32px);
	color: #13243b;
}

.np-side-recent--blue-ledger .np-side-list {
	counter-reset: np-ledger;
}

.np-side-recent--blue-ledger .np-side-story {
	display: block;
	min-height: 64px;
	padding: 14px 4px 14px 48px;
	border-color: #adc4de;
}

.np-side-recent--blue-ledger .np-side-story__number {
	position: absolute;
	top: 13px;
	left: 0;
	display: block;
	color: #28619a;
	font-family: Georgia, "Times New Roman", serif;
	font-size: 20px;
	font-weight: 800;
}

.np-side-recent--blue-ledger .np-side-story strong {
	font-family: Georgia, "Times New Roman", serif;
}

/* 53 — Double-rule editorial rows. */
.np-side-recent--double-rule {
	padding: 15px;
	border: 4px double var(--np-ink);
	border-radius: 0;
}

.np-side-recent--double-rule .np-section-heading__dot {
	display: none;
}

.np-side-recent--double-rule .np-section-heading {
	justify-content: center;
	padding-bottom: 10px;
	border-bottom: 4px double var(--np-ink);
}

.np-side-recent--double-rule .np-side-story {
	grid-template-columns: minmax(0, 1fr) 72px;
	gap: 12px;
	padding: 13px 0;
	border-bottom: 3px double var(--np-border);
}

.np-side-recent--double-rule .np-side-story__media {
	order: 2;
	width: 72px;
	height: 64px;
	border-radius: 0;
}

.np-side-recent--double-rule .np-side-story__content {
	order: 1;
}

.np-side-recent--double-rule .np-side-story__category--inline {
	display: inline-flex;
}

/* 54 — Slightly rotated instant-photo cards. */
.np-side-recent--polaroid-stack {
	padding: 18px;
	background: color-mix(in srgb, var(--np-blue) 5%, #ece7dd);
}

.np-side-recent--polaroid-stack .np-side-list {
	display: grid;
	gap: 18px;
}

.np-side-recent--polaroid-stack .np-side-story {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 10px 10px 16px;
	border: 1px solid #d5d0c5;
	border-radius: 2px;
	background: #fff;
	color: #222;
	box-shadow: 0 12px 24px rgba(25, 28, 32, 0.14);
	transform: rotate(-1.2deg);
}

.np-side-recent--polaroid-stack .np-side-story:nth-child(even) {
	transform: rotate(1.2deg);
}

.np-side-recent--polaroid-stack .np-side-story__media {
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	border-radius: 0;
}

.np-side-recent--polaroid-stack .np-side-story__content {
	padding: 0 5px;
}

.np-side-recent--polaroid-stack .np-side-story small {
	color: #666;
}

/* 55 — Bold cut-paper magazine composition. */
.np-side-recent--magazine-cut {
	border: 0;
	border-radius: 0;
	background: #f5ec45;
	color: #111;
	box-shadow: 8px 8px 0 #111;
}

.np-side-recent--magazine-cut .np-section-heading__dot {
	border-radius: 0;
	background: #f02678;
	box-shadow: none;
}

.np-side-recent--magazine-cut .np-side-list {
	display: grid;
	gap: 9px;
}

.np-side-recent--magazine-cut .np-side-story {
	grid-template-columns: 84px minmax(0, 1fr);
	gap: 12px;
	padding: 10px;
	border: 2px solid #111;
	background: #fff;
	clip-path: polygon(0 4px, 100% 0, calc(100% - 3px) 100%, 3px calc(100% - 2px));
}

.np-side-recent--magazine-cut .np-side-story:nth-child(even) {
	background: #f02678;
	color: #fff;
}

.np-side-recent--magazine-cut .np-side-story__media {
	width: 84px;
	height: 74px;
	border-radius: 0;
}

.np-side-recent--magazine-cut .np-side-story small {
	color: currentColor;
	opacity: 0.72;
}

/* 56 — Alternating pastel cards. */
.np-side-recent--pastel-cards .np-side-list {
	display: grid;
	gap: 10px;
}

.np-side-recent--pastel-cards .np-side-story {
	grid-template-columns: 72px minmax(0, 1fr);
	gap: 12px;
	padding: 11px;
	border: 0;
	border-radius: 16px;
	background: color-mix(in srgb, #9ed8ff 30%, var(--np-surface));
}

.np-side-recent--pastel-cards .np-side-story:nth-child(3n + 2) {
	background: color-mix(in srgb, #ffb8ca 34%, var(--np-surface));
}

.np-side-recent--pastel-cards .np-side-story:nth-child(3n) {
	background: color-mix(in srgb, #c9f0b0 38%, var(--np-surface));
}

.np-side-recent--pastel-cards .np-side-story__media {
	width: 72px;
	height: 66px;
	border-radius: 13px;
}

/* 57 — Coral cards stacked with right-side photography. */
.np-side-recent--coral-stack {
	background: color-mix(in srgb, #ff6f61 8%, var(--np-surface-raised));
}

.np-side-recent--coral-stack .np-side-list {
	display: grid;
	gap: 9px;
}

.np-side-recent--coral-stack .np-side-story {
	grid-template-columns: minmax(0, 1fr) 78px;
	gap: 12px;
	padding: 11px 10px 11px 14px;
	border: 0;
	border-left: 5px solid #ff6f61;
	border-radius: 5px 14px 14px 5px;
	background: var(--np-surface);
}

.np-side-recent--coral-stack .np-side-story__media {
	order: 2;
	width: 78px;
	height: 68px;
	border-radius: 10px;
}

.np-side-recent--coral-stack .np-side-story__content {
	order: 1;
}

.np-side-recent--coral-stack .np-side-story__category--inline {
	display: inline-flex;
}

/* 58 — Lime signal on a deep navy base. */
.np-side-recent--lime-signal {
	border-color: #a8ff3b;
	background: #071426;
	color: #f4f8ff;
	box-shadow: 0 18px 38px rgba(3, 11, 22, 0.24);
}

.np-side-recent--lime-signal .np-section-heading__dot {
	background: #a8ff3b;
	box-shadow: 0 0 0 5px rgba(168, 255, 59, 0.15);
}

.np-side-recent--lime-signal .np-side-story {
	grid-template-columns: 70px minmax(0, 1fr);
	gap: 12px;
	border-color: rgba(255, 255, 255, 0.12);
}

.np-side-recent--lime-signal .np-side-story__media {
	width: 70px;
	height: 64px;
	border: 2px solid #a8ff3b;
	border-radius: 4px;
}

.np-side-recent--lime-signal .np-side-story small {
	color: #a8bdd4;
}

.np-side-recent--lime-signal .np-side-story:hover strong {
	color: #a8ff3b;
}

/* 59 — Cobalt cards with oversized thumbnails. */
.np-side-recent--cobalt-cards {
	border-color: #1456d9;
	background: color-mix(in srgb, #1456d9 9%, var(--np-surface-raised));
}

.np-side-recent--cobalt-cards .np-side-list {
	display: grid;
	gap: 11px;
}

.np-side-recent--cobalt-cards .np-side-story {
	grid-template-columns: 98px minmax(0, 1fr);
	gap: 13px;
	padding: 10px;
	border: 1px solid color-mix(in srgb, #1456d9 28%, var(--np-border));
	border-radius: 14px;
	background: var(--np-surface);
}

.np-side-recent--cobalt-cards .np-side-story__media {
	width: 98px;
	height: 82px;
	border-radius: 12px;
}

.np-side-recent--cobalt-cards .np-side-story__category--overlay {
	display: inline-flex;
}

/* 60 — A different colored edge for each story. */
.np-side-recent--rainbow-edge .np-side-list {
	display: grid;
	gap: 8px;
}

.np-side-recent--rainbow-edge .np-side-story {
	grid-template-columns: minmax(0, 1fr) 68px;
	gap: 12px;
	padding: 11px 10px 11px 14px;
	border: 0;
	border-left: 5px solid #2787ff;
	border-radius: 0 12px 12px 0;
	background: var(--np-surface);
}

.np-side-recent--rainbow-edge .np-side-story:nth-child(4n + 2) { border-left-color: #f04f88; }
.np-side-recent--rainbow-edge .np-side-story:nth-child(4n + 3) { border-left-color: #39b87f; }
.np-side-recent--rainbow-edge .np-side-story:nth-child(4n) { border-left-color: #f3a126; }

.np-side-recent--rainbow-edge .np-side-story__media {
	order: 2;
	width: 68px;
	height: 62px;
	border-radius: 50%;
}

.np-side-recent--rainbow-edge .np-side-story__content {
	order: 1;
}

/* 61 — Midnight cards. */
.np-side-recent--midnight-cards {
	border-color: #183c68;
	background: linear-gradient(155deg, #061528, #0d2745);
	color: #f5f8ff;
	box-shadow: 0 20px 42px rgba(3, 11, 23, 0.28);
}

.np-side-recent--midnight-cards .np-side-list {
	display: grid;
	gap: 9px;
}

.np-side-recent--midnight-cards .np-side-story {
	grid-template-columns: 76px minmax(0, 1fr);
	gap: 12px;
	padding: 10px;
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 13px;
	background: rgba(255, 255, 255, 0.055);
}

.np-side-recent--midnight-cards .np-side-story__media {
	width: 76px;
	height: 68px;
	border-radius: 10px;
}

.np-side-recent--midnight-cards .np-side-story small {
	color: #aebed4;
}

/* 62 — Electric neon outlines. */
.np-side-recent--neon-outline {
	border-color: #40d9ff;
	background: #050b18;
	color: #f4fbff;
	box-shadow: 0 0 26px rgba(64, 217, 255, 0.14);
}

.np-side-recent--neon-outline .np-section-heading__dot {
	background: #f04dff;
	box-shadow: 0 0 14px #f04dff;
}

.np-side-recent--neon-outline .np-side-list {
	display: grid;
	gap: 10px;
}

.np-side-recent--neon-outline .np-side-story {
	grid-template-columns: 74px minmax(0, 1fr);
	gap: 12px;
	padding: 10px;
	border: 1px solid #40d9ff;
	border-radius: 4px 14px 4px 14px;
	background: rgba(64, 217, 255, 0.04);
	box-shadow: inset 0 0 16px rgba(64, 217, 255, 0.06);
}

.np-side-recent--neon-outline .np-side-story:nth-child(even) {
	border-color: #f04dff;
}

.np-side-recent--neon-outline .np-side-story__media {
	width: 74px;
	height: 66px;
	border-radius: 3px;
}

.np-side-recent--neon-outline .np-side-story small {
	color: #91a7c1;
}

/* 63 — Two-column glass grid. */
.np-side-recent--glass-grid {
	padding: 14px;
	border-color: color-mix(in srgb, var(--np-blue) 22%, transparent);
	background: linear-gradient(145deg, color-mix(in srgb, var(--np-surface-raised) 76%, transparent), color-mix(in srgb, var(--np-blue) 10%, transparent));
	backdrop-filter: blur(18px) saturate(1.15);
}

.np-side-recent--glass-grid .np-side-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
}

.np-side-recent--glass-grid .np-side-story {
	display: flex;
	min-width: 0;
	flex-direction: column;
	gap: 8px;
	padding: 8px 8px 11px;
	border: 1px solid color-mix(in srgb, var(--np-border) 58%, transparent);
	border-radius: 14px;
	background: color-mix(in srgb, var(--np-surface-raised) 55%, transparent);
	box-shadow: 0 10px 22px rgba(7, 21, 39, 0.09);
}

.np-side-recent--glass-grid .np-side-story__media {
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	border-radius: 10px;
}

.np-side-recent--glass-grid .np-side-story strong {
	font-size: 11.5px;
	-webkit-line-clamp: 4;
}

.np-side-recent--glass-grid .np-side-story__category--overlay {
	display: inline-flex;
}

/* 64 — Dark editorial mosaic. */
.np-side-recent--dark-mosaic {
	padding: 14px;
	border-color: #26374d;
	background: #0a121f;
	color: #f7f9fc;
}

.np-side-recent--dark-mosaic .np-side-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 9px;
}

.np-side-recent--dark-mosaic .np-side-story {
	display: flex;
	min-width: 0;
	flex-direction: column;
	gap: 8px;
	padding: 0 0 10px;
	overflow: hidden;
	border: 1px solid #27384f;
	border-radius: 11px;
	background: #111e30;
}

.np-side-recent--dark-mosaic .np-side-story:first-child {
	grid-column: 1 / -1;
}

.np-side-recent--dark-mosaic .np-side-story__media {
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	border-radius: 0;
}

.np-side-recent--dark-mosaic .np-side-story:first-child .np-side-story__media {
	aspect-ratio: 16 / 8;
}

.np-side-recent--dark-mosaic .np-side-story__content {
	padding: 0 9px;
}

.np-side-recent--dark-mosaic .np-side-story strong {
	font-size: 11.5px;
}

.np-side-recent--dark-mosaic .np-side-story:first-child strong {
	font-size: 15px;
}

.np-side-recent--dark-mosaic .np-side-story small {
	color: #a5b4c8;
}

.np-side-recent--dark-mosaic .np-side-story__category--overlay {
	display: inline-flex;
}

/* 65 — Carbon-fiber inspired list. */
.np-side-recent--carbon-list {
	border-color: #3a424d;
	background-color: #11161d;
	background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.025) 25%, transparent 25%, transparent 75%, rgba(255, 255, 255, 0.025) 75%), linear-gradient(45deg, rgba(255, 255, 255, 0.025) 25%, transparent 25%, transparent 75%, rgba(255, 255, 255, 0.025) 75%);
	background-position: 0 0, 6px 6px;
	background-size: 12px 12px;
	color: #f3f6f9;
}

.np-side-recent--carbon-list .np-side-story {
	grid-template-columns: minmax(0, 1fr) 70px;
	gap: 12px;
	border-color: #39434f;
}

.np-side-recent--carbon-list .np-side-story__media {
	order: 2;
	width: 70px;
	height: 64px;
	border: 1px solid #596676;
	border-radius: 6px;
}

.np-side-recent--carbon-list .np-side-story__content {
	order: 1;
}

.np-side-recent--carbon-list .np-side-story small {
	color: #9aa9b9;
}

/* 66 — Cards cut by a diagonal accent. */
.np-side-recent--diagonal-accent .np-side-list {
	display: grid;
	gap: 10px;
}

.np-side-recent--diagonal-accent .np-side-story {
	grid-template-columns: 76px minmax(0, 1fr);
	gap: 14px;
	padding: 11px 12px 11px 9px;
	overflow: hidden;
	border: 1px solid var(--np-border);
	border-radius: 13px;
	background: var(--np-surface);
}

.np-side-recent--diagonal-accent .np-side-story::before {
	position: absolute;
	z-index: -1;
	top: -25px;
	bottom: -25px;
	left: -38px;
	width: 118px;
	content: "";
	background: color-mix(in srgb, var(--np-blue) 18%, transparent);
	transform: skewX(-15deg);
}

.np-side-recent--diagonal-accent .np-side-story:nth-child(even)::before {
	background: color-mix(in srgb, var(--np-accent) 25%, transparent);
}

.np-side-recent--diagonal-accent .np-side-story__media {
	width: 76px;
	height: 68px;
	border-radius: 10px;
}

/* 67 — Thumbnails anchored outside the card edge. */
.np-side-recent--edge-thumbnails .np-side-list {
	display: grid;
	gap: 18px;
	padding: 8px 0 4px 18px;
}

.np-side-recent--edge-thumbnails .np-side-story {
	display: block;
	min-height: 90px;
	padding: 14px 13px 14px 72px;
	border: 1px solid var(--np-border);
	border-radius: 13px;
	background: var(--np-surface);
	box-shadow: 0 8px 20px rgba(7, 21, 39, 0.07);
}

.np-side-recent--edge-thumbnails .np-side-story__media {
	position: absolute;
	top: 50%;
	left: -18px;
	width: 76px;
	height: 68px;
	border: 4px solid var(--np-surface-raised);
	border-radius: 12px;
	box-shadow: 0 9px 20px rgba(7, 21, 39, 0.17);
	transform: translateY(-50%);
}

.np-side-recent--edge-thumbnails .np-side-story__category--inline {
	display: inline-flex;
}

/* 68 — Circular thumbnails connected like orbits. */
.np-side-recent--floating-orbs .np-side-list {
	position: relative;
	padding-left: 7px;
}

.np-side-recent--floating-orbs .np-side-list::before {
	position: absolute;
	top: 24px;
	bottom: 24px;
	left: 39px;
	width: 1px;
	content: "";
	background: color-mix(in srgb, var(--np-blue) 35%, var(--np-border));
}

.np-side-recent--floating-orbs .np-side-story {
	grid-template-columns: 68px minmax(0, 1fr);
	gap: 14px;
	align-items: center;
	padding: 12px 0;
	border: 0;
}

.np-side-recent--floating-orbs .np-side-story__media {
	z-index: 1;
	width: 68px;
	height: 68px;
	border: 4px solid var(--np-surface-raised);
	border-radius: 50%;
	box-shadow: 0 0 0 2px var(--np-blue), 0 8px 18px rgba(7, 21, 39, 0.14);
}

.np-side-recent--floating-orbs .np-side-story:nth-child(even) .np-side-story__media {
	box-shadow: 0 0 0 2px var(--np-accent), 0 8px 18px rgba(7, 21, 39, 0.14);
}

/* 69 — Images zig-zag from left to right. */
.np-side-recent--zigzag .np-side-list {
	display: grid;
	gap: 8px;
}

.np-side-recent--zigzag .np-side-story {
	grid-template-columns: 82px minmax(0, 1fr);
	gap: 13px;
	align-items: center;
	padding: 12px 0;
}

.np-side-recent--zigzag .np-side-story__media {
	width: 82px;
	height: 72px;
	border-radius: 14px 4px 14px 4px;
}

.np-side-recent--zigzag .np-side-story:nth-child(even) {
	grid-template-columns: minmax(0, 1fr) 82px;
}

.np-side-recent--zigzag .np-side-story:nth-child(even) .np-side-story__media {
	order: 2;
	border-radius: 4px 14px 4px 14px;
}

.np-side-recent--zigzag .np-side-story:nth-child(even) .np-side-story__content {
	order: 1;
	text-align: right;
}

.np-side-recent--zigzag .np-side-story:nth-child(even) small {
	align-self: flex-end;
}

/* 70 — Stacked cards with category ribbons. */
.np-side-recent--ribbon-stack .np-side-list {
	display: grid;
	gap: 14px;
}

.np-side-recent--ribbon-stack .np-side-story {
	display: flex;
	flex-direction: column;
	gap: 9px;
	padding: 10px 10px 13px;
	overflow: visible;
	border: 1px solid var(--np-border);
	border-radius: 14px;
	background: var(--np-surface);
}

.np-side-recent--ribbon-stack .np-side-story__media {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	overflow: visible;
	border-radius: 10px;
}

.np-side-recent--ribbon-stack .np-side-story__media .np-card__image,
.np-side-recent--ribbon-stack .np-side-story__media .np-card__fallback {
	overflow: hidden;
	border-radius: 10px;
}

.np-side-recent--ribbon-stack .np-side-story__category--overlay {
	top: 12px;
	left: -17px;
	display: inline-flex;
	padding-right: 15px;
	border-radius: 0 999px 999px 0;
	box-shadow: 0 6px 14px rgba(7, 21, 39, 0.2);
}

/* 71 — First two stories featured, remaining stories compact. */
.np-side-recent--first-two-featured .np-side-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
}

.np-side-recent--first-two-featured .np-side-story:nth-child(-n + 2) {
	display: flex;
	min-width: 0;
	flex-direction: column;
	gap: 8px;
	padding: 0 0 10px;
	overflow: hidden;
	border: 1px solid var(--np-border);
	border-radius: 12px;
	background: var(--np-surface);
}

.np-side-recent--first-two-featured .np-side-story:nth-child(-n + 2) .np-side-story__media {
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	border-radius: 0;
}

.np-side-recent--first-two-featured .np-side-story:nth-child(-n + 2) .np-side-story__content {
	padding: 0 9px;
}

.np-side-recent--first-two-featured .np-side-story:nth-child(-n + 2) strong {
	font-size: 12px;
	-webkit-line-clamp: 4;
}

.np-side-recent--first-two-featured .np-side-story:nth-child(n + 3) {
	grid-column: 1 / -1;
	grid-template-columns: 38px minmax(0, 1fr);
	gap: 10px;
	padding: 11px 0;
}

.np-side-recent--first-two-featured .np-side-story:nth-child(n + 3) .np-side-story__number {
	display: block;
	color: var(--np-blue);
	font-size: 19px;
	font-weight: 950;
}

.np-side-recent--first-two-featured .np-side-story__category--overlay {
	display: inline-flex;
}

/* 72 — Cover story plus a numbered contents deck. */
.np-side-recent--story-deck .np-side-story:first-child {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 0 0 15px;
}

.np-side-recent--story-deck .np-side-story:first-child .np-side-story__media {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 10;
	border-radius: 16px;
}

.np-side-recent--story-deck .np-side-story:first-child .np-side-story__category--overlay {
	display: inline-flex;
}

.np-side-recent--story-deck .np-side-story:first-child strong {
	font-size: 18px;
}

.np-side-recent--story-deck .np-side-story:not(:first-child) {
	grid-template-columns: 40px minmax(0, 1fr);
	gap: 11px;
	align-items: center;
}

.np-side-recent--story-deck .np-side-story:not(:first-child) .np-side-story__number {
	display: block;
	padding-right: 10px;
	border-right: 2px solid var(--np-blue);
	color: var(--np-blue);
	font-size: 17px;
	font-weight: 950;
}

/* 73 — One hero image followed by compact chips. */
.np-side-recent--hero-and-chips .np-side-list {
	display: grid;
	gap: 9px;
}

.np-side-recent--hero-and-chips .np-side-story:first-child {
	display: block;
	min-height: 215px;
	padding: 0;
	overflow: hidden;
	border: 0;
	border-radius: 16px;
	background: #071426;
}

.np-side-recent--hero-and-chips .np-side-story:first-child::after {
	position: absolute;
	z-index: 1;
	inset: 0;
	content: "";
	background: linear-gradient(180deg, transparent 25%, rgba(3, 10, 19, 0.9));
}

.np-side-recent--hero-and-chips .np-side-story:first-child .np-side-story__media {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border-radius: 0;
}

.np-side-recent--hero-and-chips .np-side-story:first-child .np-side-story__content {
	position: absolute;
	z-index: 2;
	right: 0;
	bottom: 0;
	left: 0;
	padding: 18px;
	color: #fff;
}

.np-side-recent--hero-and-chips .np-side-story:first-child strong {
	font-size: 17px;
}

.np-side-recent--hero-and-chips .np-side-story:first-child small {
	color: rgba(255, 255, 255, 0.76);
}

.np-side-recent--hero-and-chips .np-side-story:not(:first-child) {
	display: block;
	padding: 11px 14px;
	border: 1px solid color-mix(in srgb, var(--np-blue) 22%, var(--np-border));
	border-radius: 999px;
	background: var(--np-recent-soft);
}

.np-side-recent--hero-and-chips .np-side-story:not(:first-child) small {
	display: none;
}

/* 74 — Every image receives a pronounced editorial frame. */
.np-side-recent--image-frame .np-side-story {
	grid-template-columns: 88px minmax(0, 1fr);
	gap: 15px;
	align-items: center;
	padding: 14px 0;
}

.np-side-recent--image-frame .np-side-story__media {
	width: 88px;
	height: 78px;
	padding: 5px;
	border: 1px solid var(--np-ink);
	border-radius: 2px;
	background: var(--np-surface-raised);
	box-shadow: 5px 5px 0 color-mix(in srgb, var(--np-blue) 24%, var(--np-border));
}

.np-side-recent--image-frame .np-side-story__media .np-card__image,
.np-side-recent--image-frame .np-side-story__media .np-card__fallback {
	border-radius: 0;
}

.np-side-recent--image-frame .np-side-story__category--inline {
	display: inline-flex;
}

/* 75 — A continuous vertical rail of thumbnails. */
.np-side-recent--thumbnail-rail .np-side-list {
	position: relative;
	padding-left: 3px;
}

.np-side-recent--thumbnail-rail .np-side-list::before {
	position: absolute;
	top: 12px;
	bottom: 12px;
	left: 35px;
	width: 4px;
	border-radius: 999px;
	background: color-mix(in srgb, var(--np-blue) 25%, var(--np-border));
	content: "";
}

.np-side-recent--thumbnail-rail .np-side-story {
	grid-template-columns: 68px minmax(0, 1fr);
	gap: 14px;
	align-items: center;
	padding: 10px 0;
	border: 0;
}

.np-side-recent--thumbnail-rail .np-side-story__media {
	z-index: 1;
	width: 68px;
	height: 58px;
	border: 4px solid var(--np-surface-raised);
	border-radius: 10px;
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--np-blue) 65%, var(--np-border));
}

/* 76 — Borderless pill list. */
.np-side-recent--capsule-list {
	padding: 14px;
	border: 0;
	background: transparent;
}

.np-side-recent--capsule-list .np-side-list {
	display: grid;
	gap: 8px;
}

.np-side-recent--capsule-list .np-side-story {
	display: block;
	padding: 12px 16px;
	border: 1px solid color-mix(in srgb, var(--np-blue) 20%, var(--np-border));
	border-radius: 999px;
	background: var(--np-surface-raised);
}

.np-side-recent--capsule-list .np-side-story__content {
	align-items: center;
	text-align: center;
}

.np-side-recent--capsule-list .np-side-story small {
	display: none;
}

/* 77 — Airy, borderless typographic composition. */
.np-side-recent--borderless-air {
	padding: 4px;
	border: 0;
	background: transparent;
}

.np-side-recent--borderless-air .np-side-story {
	display: block;
	padding: 19px 4px;
	border: 0;
}

.np-side-recent--borderless-air .np-side-story + .np-side-story {
	border-top: 1px solid color-mix(in srgb, var(--np-border) 70%, transparent);
}

.np-side-recent--borderless-air .np-side-story__category--inline {
	display: inline-flex;
}

.np-side-recent--borderless-air .np-side-story strong {
	font-size: 15px;
	line-height: 1.42;
}

.np-side-recent--borderless-air .np-side-story__excerpt {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

/* 78 — Restrained clean journal. */
.np-side-recent--clean-journal {
	padding: 15px;
	border-radius: 0;
	background: var(--np-surface-raised);
}

.np-side-recent--clean-journal .np-section-heading {
	padding: 8px 0 12px;
	border-top: 1px solid var(--np-ink);
	border-bottom: 1px solid var(--np-ink);
}

.np-side-recent--clean-journal .np-section-heading__dot {
	display: none;
}

.np-side-recent--clean-journal .np-side-story {
	display: block;
	padding: 15px 0;
}

.np-side-recent--clean-journal .np-side-story strong {
	font-family: Georgia, "Times New Roman", serif;
	font-size: 14.5px;
	line-height: 1.36;
}

.np-side-recent--clean-journal .np-side-story__category--inline {
	display: inline-flex;
}

/* 79 — Ultra-compact newsroom ticker. */
.np-side-recent--compact-newsroom {
	padding: 13px;
}

.np-side-recent--compact-newsroom .np-section-heading {
	margin-bottom: 3px;
}

.np-side-recent--compact-newsroom .np-side-story {
	display: block;
	padding: 9px 54px 9px 0;
}

.np-side-recent--compact-newsroom .np-side-story strong {
	font-size: 11.5px;
	line-height: 1.25;
	-webkit-line-clamp: 2;
}

.np-side-recent--compact-newsroom .np-side-story small {
	position: absolute;
	top: 10px;
	right: 0;
	margin: 0;
	color: var(--np-blue);
	font-size: 9.5px;
	font-weight: 850;
}

/* 80 — Numbered editorial index. */
.np-side-recent--editorial-index {
	padding: 15px;
	border-top: 5px solid var(--np-ink);
	border-radius: 0;
}

.np-side-recent--editorial-index .np-section-heading__dot {
	display: none;
}

.np-side-recent--editorial-index .np-side-story {
	grid-template-columns: 52px minmax(0, 1fr);
	gap: 14px;
	align-items: start;
	padding: 14px 0;
}

.np-side-recent--editorial-index .np-side-story__number {
	display: block;
	padding-top: 2px;
	border-top: 3px solid var(--np-blue);
	color: var(--np-ink);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 22px;
	font-weight: 800;
}

.np-side-recent--editorial-index .np-side-story strong {
	font-family: Georgia, "Times New Roman", serif;
	font-size: 14px;
}

.np-side-recent--editorial-index .np-side-story__category--inline {
	display: inline-flex;
}

/* Preserve the configurable homepage edge after every preset decoration. */
.np-home-recent {
	border-left: 5px solid var(--np-breaking-border);
}

.np-home-hero .np-home-recent {
	height: var(--np-hero-height);
	min-height: 0;
	max-height: var(--np-hero-height);
	overflow: hidden;
}

.np-home-recent:is(.np-side-recent--dark-panel, .np-side-recent--terminal-feed, .np-side-recent--lime-signal, .np-side-recent--midnight-cards, .np-side-recent--neon-outline, .np-side-recent--dark-mosaic, .np-side-recent--carbon-list, .np-side-recent--monochrome-overlay) .np-breaking__all {
	border-color: currentColor;
	color: #e7f2ff;
}

@media (max-width: 420px) {
	.np-side-recent:is(.np-side-recent--square-duo, .np-side-recent--portrait-duo, .np-side-recent--three-up, .np-side-recent--checkerboard, .np-side-recent--glass-grid, .np-side-recent--dark-mosaic, .np-side-recent--first-two-featured) .np-side-list {
		grid-template-columns: 1fr;
	}

	.np-side-recent--first-two-featured .np-side-story:nth-child(n + 3),
	.np-side-recent--dark-mosaic .np-side-story:first-child {
		grid-column: auto;
	}

	.np-side-recent:is(.np-side-recent--wide-left, .np-side-recent--wide-right, .np-side-recent--cobalt-cards) .np-side-story {
		grid-template-columns: 88px minmax(0, 1fr);
	}

	.np-side-recent:is(.np-side-recent--wide-left, .np-side-recent--wide-right, .np-side-recent--cobalt-cards) .np-side-story__media {
		order: 0;
		width: 88px;
		height: 72px;
	}

	.np-side-recent:is(.np-side-recent--wide-left, .np-side-recent--wide-right, .np-side-recent--cobalt-cards) .np-side-story__content {
		order: 1;
	}
}

@media (max-width: 980px) {
	.np-home-hero .np-home-recent {
		height: auto;
		min-height: 340px;
		max-height: 520px;
	}
}