/* ==========================================================================
   Article detail (D-58). Ported from redesign-sample/article.html.
   Rules of the house: colours only from tokens.css; sizes from --fs-* (the article's own fluid
   sizes are the --article-* properties below); motion multiplied by --m; z-index from --z-*.
   ========================================================================== */

/* Article type sizes, in one place so the phone sizes are easy to change later (client request:
   the phone article stays as small as the old design). At <= 640px every value sits on its minimum;
   from 641px each one ramps linearly (no jump) to the sample's desktop size:
   h1 25 -> 40px (reached at 1200px), dek 18 -> 20 and h2 22 -> 24 (both reached at 768px),
   pull-quote 22 -> 28 (reached at 1024px). Body text is --fs-body (18 -> 19px). */
.single-layout {
	--article-h1: clamp(1.5625rem, 0.49rem + 2.68vw, 2.5rem);
	--article-dek: clamp(1.125rem, 0.5rem + 1.5625vw, 1.25rem);
	--article-h2: clamp(1.375rem, 0.75rem + 1.5625vw, 1.5rem);
	--article-quote: clamp(1.375rem, 0.75rem + 1.5625vw, 1.75rem);
	--article-quote-lh: 1.5;
}

.single-layout:lang(en) { --article-quote-lh: 1.35; }

/* Breadcrumb (not on phones: the kicker above the headline already says where you are) */
.breadcrumb ol {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-1) var(--s-2);
	margin: 0 0 var(--s-4);
	padding: 0;
	list-style: none;
	color: var(--muted);
	font-size: var(--fs-7);
}

.breadcrumb li + li::before {
	content: "›";
	margin-right: var(--s-2);
}

.breadcrumb a { display: inline-block; padding: 10px 7px; margin: -10px -7px; }

@media (hover: hover) {
	.breadcrumb a:hover { text-decoration: underline; text-underline-offset: 0.25em; }
}

@media (max-width: 639px) {
	.breadcrumb { display: none; }
	/* Video and photo stories start with the dark band; with the breadcrumb hidden there is nothing above it to space from. */
	.site-main > .theater { margin-top: 0; }
}

/* Layout: article + 300px sidebar from 1024px */
.single-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--s-6);
	align-items: start;
}

@media (min-width: 1024px) {
	.single-layout { grid-template-columns: minmax(0, 1fr) 300px; gap: var(--s-7); }
}

.article { min-width: 0; }

/* Header ------------------------------------------------------------------- */
.article__header { display: grid; gap: var(--s-3); }

.article__kicker {
	position: relative;
	justify-self: start;
	min-width: 44px;
	padding-block: 12px;
	margin-block: -12px;
	color: var(--cat, var(--navy));
	font-size: var(--fs-7);
	font-weight: 700;
	line-height: var(--lh-ui);
}

@media (hover: hover) {
	.article__kicker:hover { text-decoration: underline; text-underline-offset: 0.25em; }
}

/* Pages (page.php, contact) reuse .article__title with the older type scale. Stories override it below. */
.article__title {
	color: var(--ink);
	font-size: var(--fs-1);
	line-height: 1.3;
}

.article__header .article__title {
	max-width: 860px;
	color: var(--heading);
	font-family: var(--font-display);
	font-size: var(--article-h1);
	line-height: var(--lh-display);
	text-wrap: balance;
}

.article__dek {
	max-width: 860px;
	color: var(--text);
	font-size: var(--article-dek);
	line-height: 1.6;
	text-wrap: pretty;
}

.article__byline {
	display: flex;
	align-items: center;
	gap: var(--s-3);
	margin-top: var(--s-2);
	padding-block: var(--s-4);
	border-block: 1px solid var(--line);
}

.article__author { flex: none; }

.article__byline-text { flex: 1; min-width: 0; }

.article__author-name {
	display: inline-block;
	padding-block: 12px;
	margin-block: -12px;
	color: var(--heading);
	font-size: var(--fs-6);
	font-weight: 700;
}

@media (hover: hover) {
	.article__author-name:hover { text-decoration: underline; text-underline-offset: 0.25em; }
}

/* The dateline: dots between items are drawn here, so a missing "updated" never leaves an orphan one. */
.article__dateline {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0 var(--s-3);
	margin-top: 2px;
	color: var(--muted);
	font-size: var(--fs-7);
	line-height: var(--lh-ui);
}

.article__dateline > * + *::before {
	content: "";
	display: inline-block;
	width: 3px;
	height: 3px;
	margin-right: var(--s-3);
	border-radius: 50%;
	background: currentColor;
	vertical-align: middle;
}

/* The BS + AD date is a signature, not grey filler. */
.article__date { color: var(--heading); font-weight: 700; }
.article__date span + span::before { content: "|"; margin-inline: var(--s-2); font-weight: 400; color: var(--muted); }

/* Avatars: initials in a navy disc, or an uploaded photo */
.article__byline .avatar,
.author-box .avatar {
	display: inline-grid;
	flex: none;
	place-items: center;
	width: var(--size, 40px);
	height: var(--size, 40px);
	border-radius: 50%;
	background: var(--fill-selected);
	color: var(--white);
	font-size: var(--fs-6);
	font-weight: 700;
	object-fit: cover;
}

.author-box .avatar { font-size: var(--fs-3); }

/* One tool row ---------------------------------------------------------------- */
.article-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--s-2);
	margin-top: var(--s-3);
}

.article-toolbar__group {
	display: inline-flex;
	align-items: center;
	gap: var(--s-1);
	padding-right: var(--s-3);
	margin-right: var(--s-1);
	border-right: 1px solid var(--line);
}

.article-toolbar__group:last-of-type { padding-right: 0; margin-right: 0; border-right: 0; }

.tool-btn,
.article-toolbar .share__btn--save {
	position: relative;
	display: inline-grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border: 1px solid var(--line-strong);
	border-radius: var(--radius-lg);
	background: none;
	color: var(--heading);
	font-size: var(--fs-6);
	font-weight: 700;
	line-height: 1;
	text-decoration: none;
	--icon-size: 20px;
	transition: transform var(--dur-press) var(--ease-out), background-color var(--dur-hover) ease, color var(--dur-hover) ease;
}

.tool-btn:active,
.article-toolbar .share__btn--save:active { transform: scale(calc(1 - 0.05 * var(--m))); }

@media (hover: hover) {
	.tool-btn:hover,
	.article-toolbar .share__btn--save:hover { background: color-mix(in srgb, currentColor 10%, transparent); }
}

.tool-btn[aria-pressed="true"],
.article-toolbar .share__btn--save[aria-pressed="true"] {
	border-color: var(--fill-selected);
	background: var(--fill-selected);
	color: var(--white);
}

.tool-btn[aria-disabled="true"] { opacity: var(--disabled-opacity); cursor: default; transform: none; }

.share__status { color: var(--success-text); font-size: var(--fs-7); }
.share__status:empty { display: none; }

/* "…" menu: a disclosure, opened by single.js */
.share__more { position: relative; }

.share__menu {
	position: absolute;
	top: calc(100% + var(--s-1));
	right: 0;
	z-index: var(--z-menu);
	min-width: 220px;
	max-width: calc(100vw - 2 * var(--page-gutter));
	padding: var(--s-2);
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	background: var(--bg);
	box-shadow: var(--shadow-pop);
	opacity: 0;
	visibility: hidden;
	transform: translateY(calc(-6px * var(--m)));
	transform-origin: top right;
	transition: opacity 110ms ease-out, transform 110ms ease-out, visibility 0s 110ms;
}

[aria-expanded="true"] + .share__menu {
	opacity: 1;
	visibility: visible;
	transform: none;
	transition: opacity var(--dur-hover) var(--ease-out), transform var(--dur-hover) var(--ease-out), visibility 0s;
}

.share__menu a,
.share__menu button {
	display: flex;
	align-items: center;
	gap: var(--s-3);
	width: 100%;
	min-height: 44px;
	padding: 0 var(--s-3);
	border-radius: var(--radius);
	color: var(--heading);
	font-size: var(--fs-6);
	text-align: left;
}

@media (hover: hover) {
	.share__menu a:hover,
	.share__menu button:hover { background: var(--tint); }
}

.share__menu .share__menu-copy { display: none; }

@media (max-width: 639px) {
	.share__btn--copy { display: none; }
	.share__menu .share__menu-copy { display: flex; }
	.article-toolbar__group { padding-right: var(--s-2); margin-right: 0; }
}

/* The menu and copy need JavaScript. */
html:not(.js) .share__more,
html:not(.js) .share__btn--copy,
html:not(.js) .text-size { display: none; }

/* Lead media: 3:2, wider than the reading column, with an inset edge so pale photos keep their outline */
.article__media { margin-top: var(--s-5); }

.article__frame {
	position: relative;
	overflow: hidden;
	border-radius: var(--radius);
	background: var(--placeholder);
	aspect-ratio: 3 / 2;
}

.article__frame img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* A video story without a playable URL shows its poster in the dark band: 16:9 there, like the player. */
.theater .article__frame { aspect-ratio: 16 / 9; }

.article__frame::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	box-shadow: inset 0 0 0 1px var(--image-edge);
	pointer-events: none;
}

.article__frame img { filter: brightness(var(--img-dim)); }

.article__media figcaption {
	max-width: var(--measure);
	margin-top: var(--s-2);
	color: var(--muted);
	font-size: var(--fs-7);
	line-height: var(--lh-ui);
}

/* Body: 720px column (Nepali); English is held to about 67 characters a line (D-57). */
.article__body { margin-top: var(--s-6); max-width: var(--measure); }
.article__body:lang(en) { max-width: 33em; }

.entry-content .ad-slot--in-article-1,
.entry-content .ad-slot--in-article-2 { margin-block: var(--s-6); }

/* Ads: the label is body-sized text, never a ninth font size */
.article .ad-slot__label,
.article-sidebar .ad-slot__label { font: 400 var(--fs-7) / 1.2 var(--font-body); letter-spacing: 0; }

.article .ad-slot__box,
.article-sidebar .ad-slot__box { font-size: var(--fs-7); }

/* "Also read" card inside the story */
.entry-content .inline-related { margin-block: 1.8em; }

.entry-content .inline-related__link {
	display: flex;
	align-items: center;
	gap: var(--s-4);
	padding: var(--s-4);
	border-radius: var(--radius-lg);
	background: var(--bg-soft);
	color: var(--heading);
	text-decoration: none;
}

.inline-related__img {
	flex: none;
	width: 88px;
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: var(--radius);
}

.inline-related__text { display: block; flex: 1; min-width: 0; line-height: var(--lh-ui); }

.inline-related__label {
	display: block;
	color: var(--muted);
	font-size: var(--fs-7);
}

.inline-related__title {
	display: block;
	color: var(--heading);
	font-size: var(--fs-5);
	font-weight: 700;
	line-height: 1.4;
}

@media (hover: hover) {
	.inline-related__link:hover .inline-related__title { text-decoration: underline; text-underline-offset: 0.25em; }
}

/* Tags, author, related, comments, prev/next ---------------------------------- */
.article__tags {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--s-2);
	max-width: var(--measure);
	margin-top: var(--s-6);
}

.article__tags > span {
	color: var(--muted);
	font-size: var(--fs-7);
	font-weight: 700;
}

.article__tags .pill {
	position: relative;
	color: var(--heading);
	font-size: var(--fs-7);
	font-weight: 700;
}

.article__tags .pill::after { content: ""; position: absolute; inset: -6px -2px; }

.author-box {
	display: grid;
	grid-template-columns: 64px minmax(0, 1fr);
	gap: var(--s-4);
	align-items: start;
	max-width: var(--measure);
	margin-top: var(--s-6);
	padding: var(--s-5);
	border-radius: var(--radius-lg);
	background: var(--bg-soft);
}

.author-box__name { color: var(--heading); font-size: var(--fs-4); }
.author-box__name a { display: inline-block; max-width: 100%; padding-block: 8px; margin-block: -8px; overflow-wrap: anywhere; }

@media (hover: hover) {
	.author-box__name a:hover { text-decoration: underline; text-underline-offset: 0.25em; }
}

.author-box__bio { margin-top: var(--s-1); color: var(--text); font-size: var(--fs-7); }

/* Three text-forward related stories */
.article__related { margin-top: var(--s-7); }

.related-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 var(--gutter); }

@media (min-width: 1024px) {
	.related-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.related-item {
	display: grid;
	gap: var(--s-1);
	align-content: start;
	padding: var(--s-4) 0;
	border-bottom: 1px solid var(--line);
}

.related-item__kicker {
	justify-self: start;
	min-width: 44px;
	padding-block: 12px;
	margin-block: -12px;
	color: var(--cat, var(--navy));
	font-size: var(--fs-7);
	font-weight: 700;
	line-height: var(--lh-ui);
}

.related-item__title { color: var(--heading); font-size: var(--fs-4); line-height: var(--lh-title); }

.related-item__title a { padding-block: 4px; text-decoration: underline transparent; text-decoration-thickness: 2px; text-underline-offset: 0.25em; transition: text-decoration-color var(--dur-hover) ease; }

@media (hover: hover) {
	.related-item__title a:hover { text-decoration-color: currentColor; }
}

.related-item__title a:focus-visible { text-decoration-color: currentColor; }

.related-item__live {
	display: inline-block;
	margin-right: var(--s-2);
	padding: 0 var(--s-2);
	border-radius: var(--radius);
	background: var(--live-fill);
	color: var(--white);
	font-size: var(--fs-7);
	font-weight: 700;
	line-height: var(--lh-ui);
	vertical-align: 2px;
}

.related-item__meta { color: var(--muted); font-size: var(--fs-7); line-height: var(--lh-ui); }

/* Facebook comments (ainn-core) */
.fb-comments-section { max-width: var(--measure); margin-top: var(--s-7); }
.fb-comments-section__title { margin-bottom: var(--s-3); color: var(--heading); font-size: var(--fs-4); }
.fb-comments { min-height: 120px; }

.article__prevnext { max-width: var(--measure); margin-top: var(--s-6); }

.article__prevnext .nav-links { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s-4); }

@media (min-width: 640px) {
	.article__prevnext .nav-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.article__prevnext .nav-next { grid-column: 2; }
}

.article__prevnext a {
	display: grid;
	gap: var(--s-1);
	padding: var(--s-4);
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	color: var(--heading);
	font-size: var(--fs-6);
	font-weight: 700;
	line-height: 1.4;
	transition: border-color var(--dur-hover) ease, transform var(--dur-press) var(--ease-out);
}

.article__prevnext a:active { transform: scale(calc(1 - 0.02 * var(--m))); }

@media (hover: hover) {
	.article__prevnext a:hover { border-color: var(--line-strong); }
}

.article__prevnext-label {
	color: var(--muted);
	font-size: var(--fs-7);
	font-weight: 400;
}

/* Sidebar: MPU, popular, newsletter, then a rail that holds the half-page ad, the only sticky part.
   (The whole group was sticky once: 1500px tall, so its last items, keyboard focus included, could never
   be scrolled into view on a laptop.) The rail takes the column's leftover height; the 600px ad sticks
   inside it, and only when the window is tall enough to show the whole ad. */
.article-sidebar {
	display: flex;
	flex-direction: column;
	gap: var(--s-6);
	align-self: stretch;
}

.article-sidebar > * { min-width: 0; }

.article-sidebar__rail { display: none; }

@media (min-width: 1024px) {
	.article-sidebar__rail { display: block; flex: 1; }
}

@media (min-width: 1024px) and (min-height: 720px) {
	.article-sidebar__rail .ad-slot { position: sticky; top: calc(var(--sticky-h) + var(--s-4)); }
}

.ranked { counter-reset: rank; margin: 0; padding: 0; list-style: none; }

.ranked__item {
	counter-increment: rank;
	display: grid;
	grid-template-columns: 40px minmax(0, 1fr);
	gap: var(--s-2);
	align-items: baseline;
	padding: var(--s-3) 0;
	border-bottom: 1px solid var(--line);
}

.ranked__item::before {
	content: counter(rank, devanagari);
	color: var(--muted);
	font-family: var(--font-display);
	font-size: var(--article-quote);
	line-height: 1;
}

:root:lang(en) .ranked__item::before { content: counter(rank); }

.ranked__title { color: var(--heading); font-size: var(--fs-5); line-height: var(--lh-title); }

.ranked__title a { padding-block: 4px; text-decoration: underline transparent; text-decoration-thickness: 2px; text-underline-offset: 0.25em; transition: text-decoration-color var(--dur-hover) ease; }

@media (hover: hover) {
	.ranked__title a:hover { text-decoration-color: currentColor; }
}

.ranked__title a:focus-visible { text-decoration-color: currentColor; }

/* Newsletter: a tinted panel in the sidebar (the footer form is navy) */
.newsletter-box {
	padding: var(--s-5);
	border-radius: var(--radius-lg);
	background: var(--tint);
	color: var(--text);
}

.newsletter-box h2 { color: var(--heading); font-size: var(--fs-3); }

.newsletter-box .newsletter-form label { color: var(--heading); font-size: var(--fs-7); font-weight: 700; }

.newsletter-box .newsletter-form input[type="email"] {
	min-height: 44px;
	padding: 0 var(--s-3);
	border: 1px solid var(--muted);
	border-radius: var(--radius-lg);
	background: var(--bg);
	color: var(--ink);
	font-size: var(--fs-6);
}

.newsletter-box .newsletter-form input::placeholder { color: var(--muted); }

.newsletter-box .newsletter-form .btn {
	border-radius: var(--radius-lg);
	background: var(--fill-selected);
	color: var(--white);
	font-size: var(--fs-6);
}

:root[data-theme="dark"] .newsletter-box .newsletter-form .btn { box-shadow: inset 0 0 0 1px var(--focus); }

.newsletter-box .newsletter-form__status { color: var(--text); font-size: var(--fs-7); }
.newsletter-box .newsletter-form__status.is-success { color: var(--success-text); }
.newsletter-box .newsletter-form__status.is-error { color: var(--brand-ink); }

/* Reading bar: the sticky nav cross-fades into it once the headline has scrolled away.
   template-parts/article/reading-bar.php; single.js toggles body.is-reading. It paints over the
   nav content, so its background is the nav's: white/dark on phones, navy from 1024px. */
.reading {
	--reading-bg: var(--bg);
	--reading-ink: var(--heading);
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	gap: var(--s-3);
	padding-inline: calc(var(--page-gutter) - 4px);
	background: var(--reading-bg);
	color: var(--reading-ink);
	opacity: 0;
	visibility: hidden;
	transform: translateY(calc(-8px * var(--m)));
	pointer-events: none;
	transition: opacity 120ms ease-out, transform 120ms ease-out, visibility 0s 120ms;
}

.is-reading .reading {
	opacity: 1;
	visibility: visible;
	transform: none;
	pointer-events: auto;
	transition: opacity 200ms var(--ease-out), transform 200ms var(--ease-out), visibility 0s;
}

/* Whatever the nav holds besides the bar fades out while the bar shows (single.js also makes it inert). */
.site-nav > :not(.reading, .reading-progress) { transition: opacity 120ms ease-out; }
.is-reading .site-nav > :not(.reading, .reading-progress) { opacity: 0; }

.reading__mark { display: none; flex: none; }

.reading__title {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: var(--fs-6);
	font-weight: 700;
	line-height: var(--lh-ui);
}

.reading__btn {
	position: relative;
	display: inline-grid;
	flex: none;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: var(--radius-lg);
	color: inherit;
	--icon-size: 20px;
	transition: transform var(--dur-press) var(--ease-out), background-color var(--dur-hover) ease;
}

.reading__btn:active { transform: scale(calc(1 - 0.05 * var(--m))); }

@media (hover: hover) {
	.reading__btn:hover { background: color-mix(in srgb, currentColor 10%, transparent); }
}

@media (min-width: 1024px) {
	.reading {
		--reading-bg: var(--navy);
		--reading-ink: var(--white);
		--focus: var(--sky);
		padding-inline: max(var(--page-gutter), calc((100% - var(--container)) / 2));
	}

	.reading__mark { display: block; }
}

/* 3px progress line at the top of the viewport (blue on light chrome, sky on navy) */
.reading-progress {
	position: fixed;
	top: var(--wp-admin--admin-bar--height, 0px);
	right: 0;
	left: 0;
	z-index: var(--z-skip);
	height: 3px;
	pointer-events: none;
}
@media (max-width: 600px) {
	.reading-progress { top: 0; } /* the admin bar has scrolled away */
}

.reading-progress span {
	display: block;
	height: 100%;
	background: var(--blue);
	transform: scaleX(var(--progress, 0));
	transform-origin: left;
}

@media (min-width: 1024px) {
	.reading-progress span { background: var(--sky); }
}

/* Static pages */
.page-article { max-width: 760px; }

/* Contact page (page-templates/contact.php) */
.contact__grid { margin-top: var(--s-6); align-items: start; }
.contact__grid .article__body { margin-top: 0; }

.contact__details {
	display: grid;
	gap: var(--s-4);
	margin: 0;
	padding: var(--s-5);
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
}
.contact__details dt { color: var(--muted); font-size: var(--fs-7); }
.contact__details dd { margin: 2px 0 0; color: var(--heading); font-weight: 700; overflow-wrap: anywhere; }
.contact__details a { color: var(--blue); }

.contact__map { margin: var(--s-5) 0 0; }
.contact__map iframe {
	width: 100%;
	aspect-ratio: 4 / 3;
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
}
.contact__map figcaption { margin-top: var(--s-2); font-size: var(--fs-7); }
.contact__map a { color: var(--blue); }

/* Password-protected story (core's the_password_form; inc/article.php gives the submit .btn .btn--primary) */
.post-password-form { display: grid; gap: var(--s-3); max-width: 28rem; }
.post-password-form p { display: grid; gap: var(--s-3); margin: 0; }
.post-password-form label { display: grid; gap: var(--s-1); color: var(--heading); font-weight: 700; }
.post-password-form input[type="password"],
.post-password-form input[type="text"] {
	width: 100%;
	min-height: 44px;
	padding: var(--s-2) var(--s-3);
	border: 1px solid var(--line-strong);
	border-radius: var(--radius);
	background: var(--bg);
	color: var(--ink);
	font-weight: 400;
}
.post-password-form .btn { justify-self: start; cursor: pointer; }

/* Contact Form 7 */
.wpcf7-form { display: grid; gap: var(--s-4); }
.wpcf7-form p { margin: 0; }
.wpcf7-form label { display: grid; gap: var(--s-1); color: var(--heading); font-weight: 700; }
.wpcf7-form-control-wrap { display: block; }
.wpcf7-form input:not([type="submit"], [type="checkbox"], [type="hidden"]),
.wpcf7-form textarea {
	width: 100%;
	min-height: 44px;
	padding: var(--s-2) var(--s-3);
	border: 1px solid var(--line-strong);
	border-radius: var(--radius);
	background: var(--bg);
	color: var(--ink);
	font-weight: 400;
}
.wpcf7-form textarea { min-height: 180px; resize: vertical; }
.wpcf7-form .wpcf7-not-valid { border-color: var(--brand-ink); }
.wpcf7-not-valid-tip { margin-top: var(--s-1); color: var(--brand-ink); font-size: var(--fs-7); font-weight: 400; }
.wpcf7 form .wpcf7-response-output { margin: 0; padding: var(--s-3); border-radius: var(--radius); }

/* Print: the article only (colour reset and the fixed bars are in base.css) */
@media print {
	.site-header, .site-nav, .site-nav-sentinel, .ticker, .breadcrumb, .article-toolbar, .article-sidebar, .article__related, .fb-comments-section,
	.article__prevnext, .ad-slot, .inline-related, .site-footer, .reading, .reading-progress, .sticky-ad { display: none !important; }
	body { background: Canvas; color: CanvasText; }
	.single-layout { display: block; }
	.article__kicker { color: CanvasText; }
	.article__body { max-width: none; font-size: 12pt; line-height: 1.6; }
	.entry-content a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 10pt; }
}