/* Saudi Flash: screen styles. Mobile first; logical properties only (the Arabic edition is RTL).
   Palette: paper #fff, ink #111, signal #ffb000 (FLASH only), rule #8a8f98, muted #5b6068. */

:root {
	--sf-paper: #fff;
	--sf-ink: #111;
	--sf-signal: #ffb000;
	--sf-rule: #8a8f98;
	--sf-muted: #5b6068;
	--sf-hair: #e1e3e6;
	--sf-tint: #f3f4f5;
	--sf-sub: #2b2e33;

	--sf-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--sf-mono: "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
	--sf-arab: "Noto Sans Arabic", "IBM Plex Sans", Tahoma, sans-serif;
	--sf-arab-sys: "Segoe UI", Tahoma, system-ui, sans-serif;

	--sf-face: var(--sf-sans);
	--sf-label: var(--sf-mono);
	--sf-case: uppercase;
	--sf-track: .08em;
	--sf-track-tag: .1em;
	--sf-tight: -.012em;
	--sf-tighter: -.022em;
	--sf-label-size: .75rem;
	--sf-label-size-s: .6875rem;
	--wh: 600;
	--wr: 500;
	--k: 1;
	--lh: 1.55;
	--lh-head: 1.14;
	--lh-title: 1.1;
	--lh-copy: 1.62;
	--lh-lead: 1.12;
	--lh-tight: 1.24;
	--lh-row: 1.36;

	--sf-wrap: 78rem;
	--sf-pad: 1rem;
}

/* Arabic edition: Noto Sans Arabic, ~1.12x the Latin size, taller lines, no tracking or caps. */
html[lang|="ar"] {
	--sf-face: var(--sf-arab);
	--sf-label: var(--sf-arab);
	--sf-case: none;
	--sf-track: 0;
	--sf-track-tag: 0;
	--sf-tight: 0;
	--sf-tighter: 0;
	--sf-label-size: .875rem;
	--sf-label-size-s: .8125rem;
	--wh: 700;
	--wr: 600;
	--k: 1.12;
	--lh: 1.85;
	--lh-head: 1.42;
	--lh-title: 1.36;
	--lh-copy: 1.95;
	--lh-lead: 1.42;
	--lh-tight: 1.5;
	--lh-row: 1.62;
}

@media (min-width: 960px) {
	:root { --sf-pad: 2rem; }
}

/* ---------------------------------------------------------------- base (zero-specificity) */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: 1rem; }
body {
	margin: 0;
	background: var(--sf-paper);
	color: var(--sf-ink);
	font-family: var(--sf-face);
	font-size: 1rem;
	line-height: var(--lh);
	font-synthesis-weight: none;
	-webkit-tap-highlight-color: transparent;
}
:where(img, svg, video, iframe) { max-width: 100%; }
:where(img) { height: auto; }
:where(h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd) { margin: 0; }
:where(a) { color: inherit; }
:where(button, input, select, textarea) { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--sf-ink); outline-offset: 2px; }
.sf-main:focus { outline: none; }

.sf-wrap { width: 100%; max-width: var(--sf-wrap); margin-inline: auto; padding-inline: var(--sf-pad); }
.sf-vh {
	position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden;
	clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
}
.sf-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.sf-skip {
	position: absolute; inset-inline-start: .75rem; top: -5rem; z-index: 50;
	padding: .75rem 1rem; background: var(--sf-ink); color: #fff; font-weight: 600; text-decoration: none;
}
.sf-skip:focus { top: .75rem; }
.sf-i { display: inline-block; flex: none; vertical-align: middle; }
.sf-i--back { transform: scaleX(-1); }
[dir="rtl"] .sf-i--dir { transform: scaleX(-1); }
[dir="rtl"] .sf-i--dir.sf-i--back { transform: none; }

/* ---------------------------------------------------------------- masthead */
.sf-mast { position: relative; z-index: 5; background: var(--sf-paper); }
.sf-mast__bar {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	grid-template-areas: "logo tools" "tag clock";
	align-items: center;
	column-gap: .75rem;
	row-gap: .25rem;
	padding-block: .75rem .625rem;
}
.sf-mast__logo { grid-area: logo; justify-self: start; display: block; padding-block: .25rem; line-height: 0; color: var(--sf-ink); }
.sf-logo { display: block; width: auto; height: 22px; }
html[lang|="ar"] .sf-logo { height: 30px; }
.sf-mast__tag {
	grid-area: tag; min-width: 0; margin: 0;
	font-size: calc(var(--k) * .8125rem); font-weight: 500; line-height: 1.3; color: var(--sf-muted);
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sf-clock {
	grid-area: clock; margin: 0; white-space: nowrap;
	font-family: var(--sf-mono); font-size: .75rem; line-height: 1.3; letter-spacing: .04em;
	text-transform: uppercase; color: var(--sf-muted);
}
html[lang|="ar"] .sf-clock { font-family: var(--sf-arab); font-size: .8125rem; letter-spacing: 0; }
.sf-clock__d { display: none; }
.sf-clock__t { font-family: var(--sf-mono); color: var(--sf-ink); }
.sf-mast__tools { grid-area: tools; display: flex; align-items: center; gap: .5rem; }

.sf-lang {
	display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding-inline: .75rem;
	border: 1px solid var(--sf-hair); color: var(--sf-ink); text-decoration: none;
	font-family: var(--sf-face); font-size: .9375rem; font-weight: 600; line-height: 1;
}
html[lang|="ar"] .sf-lang { font-size: 1rem; }
.sf-lang:hover { border-color: var(--sf-ink); }

.sf-find { display: block; }
.sf-find__btn {
	display: grid; place-items: center; width: 44px; height: 44px; list-style: none; cursor: pointer;
	border: 1px solid var(--sf-hair); color: var(--sf-ink);
}
.sf-find__btn::-webkit-details-marker { display: none; }
.sf-find__btn:hover { border-color: var(--sf-ink); }
.sf-find[open] .sf-find__btn { background: var(--sf-ink); border-color: var(--sf-ink); color: #fff; }
.sf-find__panel {
	position: absolute; inset-inline: 0; top: 100%; padding-block: 1rem;
	background: var(--sf-paper); border-bottom: 2px solid var(--sf-ink);
	box-shadow: 0 18px 24px -18px rgb(17 17 17 / .35);
}

.sf-nav { border-top: 2px solid var(--sf-ink); border-bottom: 1px solid var(--sf-hair); }
.sf-nav__list {
	display: flex; gap: 1.375rem; margin: 0; padding-block: 0; padding-inline: 0 2.5rem; list-style: none;
	overflow-x: auto; scrollbar-width: none;
	-webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 2.5rem), transparent);
	mask-image: linear-gradient(90deg, #000 calc(100% - 2.5rem), transparent);
}
[dir="rtl"] .sf-nav__list {
	-webkit-mask-image: linear-gradient(270deg, #000 calc(100% - 2.5rem), transparent);
	mask-image: linear-gradient(270deg, #000 calc(100% - 2.5rem), transparent);
}
.sf-nav__list::-webkit-scrollbar { display: none; }
.sf-nav__link {
	display: block; margin-bottom: -1px; padding-block: .75rem .625rem;
	border-bottom: 3px solid transparent; color: var(--sf-ink); text-decoration: none; white-space: nowrap;
	font-size: calc(var(--k) * .9375rem); font-weight: var(--wh); line-height: 1.3;
}
.sf-nav__link:hover { border-bottom-color: var(--sf-rule); }
.sf-nav__link[aria-current="page"], .sf-nav__link--in { border-bottom-color: var(--sf-ink); }

@media (min-width: 960px) {
	.sf-mast__bar {
		grid-template-columns: auto minmax(0, 1fr) auto auto;
		grid-template-areas: "logo tag clock tools";
		column-gap: 1.5rem;
		padding-block: 1.25rem 1.125rem;
	}
	.sf-logo { height: 30px; }
	html[lang|="ar"] .sf-logo { height: 40px; }
	.sf-mast__tag {
		align-self: stretch; display: flex; align-items: center;
		padding-inline-start: 1.5rem; border-inline-start: 1px solid var(--sf-hair);
		font-size: calc(var(--k) * .9375rem);
	}
	.sf-clock__d { display: inline; }
	.sf-nav__list { gap: 2.25rem; padding-inline: 0; -webkit-mask-image: none; mask-image: none; }
	[dir="rtl"] .sf-nav__list { -webkit-mask-image: none; mask-image: none; }
	.sf-nav__link { font-size: calc(var(--k) * 1rem); padding-block: .875rem .75rem; }
}

/* ---------------------------------------------------------------- shared labels */
.sf-sec {
	display: flex; align-items: baseline; justify-content: space-between; gap: 1rem;
	padding-top: .625rem; border-top: 2px solid var(--sf-ink);
}
.sf-sec__title, .sf-eyebrow, .sf-box__title, .sf-foot__h {
	margin: 0; font-family: var(--sf-label); font-size: var(--sf-label-size); font-weight: 500; line-height: 1.3;
	letter-spacing: var(--sf-track); text-transform: var(--sf-case);
}
.sf-sec__note {
	margin: 0; font-family: var(--sf-label); font-size: var(--sf-label-size-s); line-height: 1.3;
	letter-spacing: var(--sf-track); text-transform: var(--sf-case); color: var(--sf-muted); white-space: nowrap;
}
.sf-eyebrow { color: var(--sf-muted); margin-bottom: .5rem; }
html[lang|="ar"] :is(.sf-sec__title, .sf-eyebrow, .sf-box__title, .sf-foot__h, .sf-wire__date, .sf-kicker__cat) { font-weight: 700; }
html[lang|="ar"] .sf-sec__title { font-size: .9375rem; }

.sf-kicker {
	display: flex; flex-wrap: wrap; align-items: center; gap: .375rem .625rem; margin: 0 0 .625rem;
	font-family: var(--sf-label); font-size: var(--sf-label-size-s); line-height: 1.3;
	letter-spacing: var(--sf-track); text-transform: var(--sf-case); color: var(--sf-muted);
}
.sf-kicker__cat { color: var(--sf-ink); font-weight: 500; text-decoration: none; }
.sf-kicker__cat:hover { text-decoration: underline; text-underline-offset: .2em; }
.sf-kicker__time { font-family: var(--sf-mono); font-size: .6875rem; letter-spacing: .04em; }
.sf-kicker__cat + .sf-kicker__time::before { content: "·"; margin-inline-end: .625rem; color: var(--sf-rule); }

/* Priority labels: UPDATE is quiet; FLASH is the one place the amber signal appears. */
.sf-tag {
	display: inline-block; padding-block: .3125rem .25rem; white-space: nowrap;
	font-family: var(--sf-label); font-size: .6875rem; font-weight: 500; line-height: 1;
	letter-spacing: var(--sf-track-tag); text-transform: var(--sf-case); color: var(--sf-muted);
}
.sf-tag--flash { padding-inline: .4375rem; background: var(--sf-signal); color: var(--sf-ink); }
html[lang|="ar"] .sf-tag { font-size: .8125rem; padding-block: .25rem .1875rem; }

/* ---------------------------------------------------------------- top stories */
.sf-top { padding-block: 1.25rem .5rem; }
.sf-top__grid { display: grid; gap: 1.5rem; margin-top: 1rem; }
.sf-lead {
	display: grid; grid-template-columns: minmax(0, 1fr);
	grid-template-areas: "kick" "head" "media" "dek" "by"; align-content: start;
}
.sf-lead > .sf-kicker { grid-area: kick; }
.sf-lead__head {
	grid-area: head; margin: 0 0 1rem;
	font-size: calc(var(--k) * 1.75rem); font-weight: var(--wh); line-height: var(--lh-head);
	letter-spacing: var(--sf-tighter); text-wrap: pretty;
}
.sf-lead__head a, .sf-brief__head a { color: inherit; text-decoration: none; }
.sf-lead__head a:hover, .sf-brief__head a:hover { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .12em; }
.sf-lead__media { grid-area: media; display: block; margin: 0 0 1rem; }
.sf-cover { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; background: var(--sf-tint); }
.sf-lead__dek {
	grid-area: dek; margin: 0 0 .75rem; max-width: 62ch;
	font-size: calc(var(--k) * 1.0625rem); line-height: var(--lh); color: var(--sf-sub); text-wrap: pretty;
}
.sf-lead__by, .sf-dateline__by { margin: 0; font-size: calc(var(--k) * .8125rem); color: var(--sf-muted); }
.sf-lead__by { grid-area: by; }
.sf-lead__by a, .sf-dateline__by a { color: var(--sf-ink); text-decoration: none; font-weight: 500; }
.sf-lead__by a:hover, .sf-dateline__by a:hover { text-decoration: underline; }

.sf-top__more { display: grid; align-content: start; border-top: 1px solid var(--sf-hair); }
.sf-brief { padding-block: 1rem; border-bottom: 1px solid var(--sf-hair); }
.sf-brief__head {
	margin: 0 0 .5rem; font-size: calc(var(--k) * 1.1875rem); font-weight: var(--wh); line-height: var(--lh-tight);
	letter-spacing: var(--sf-tight); text-wrap: pretty;
}
.sf-brief__dek {
	margin: 0; font-size: calc(var(--k) * .9375rem); line-height: var(--lh); color: var(--sf-muted);
	display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}

@media (min-width: 960px) {
	.sf-top { padding-block: 1.75rem .75rem; }
	.sf-top__grid { grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); gap: 2rem; margin-top: 1.25rem; }
	.sf-lead {
		grid-template-columns: minmax(0, 4fr) minmax(0, 5fr);
		grid-template-areas: "kick media" "head media" "dek media" "by media";
		grid-template-rows: auto auto auto 1fr; column-gap: 1.75rem;
	}
	.sf-lead__head { font-size: calc(var(--k) * 2.125rem); line-height: var(--lh-lead); }
	.sf-lead__media { margin: 0; }
	.sf-top__more { border-top: 0; border-inline-start: 1px solid var(--sf-hair); padding-inline-start: 1.5rem; }
	.sf-brief { padding-block: 0 1.125rem; }
	.sf-brief + .sf-brief { padding-top: 1.125rem; }
	.sf-brief:last-child { border-bottom: 0; }
	.sf-top--solo .sf-lead { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); column-gap: 2rem; }
	.sf-top--solo .sf-lead__head { font-size: calc(var(--k) * 2.25rem); }
}

/* ---------------------------------------------------------------- the list */
.sf-split { display: grid; gap: 2.5rem; padding-block: 1.25rem 0; }
@media (min-width: 960px) {
	.sf-split { grid-template-columns: minmax(0, 1fr) 19.5rem; column-gap: 3.5rem; padding-block: 1.5rem 0; }
}
.sf-wire__day { margin-top: 1.25rem; }
.sf-wire > .sf-wire__day:first-of-type { margin-top: .875rem; }
.sf-wire__date {
	display: flex; flex-wrap: wrap; gap: .25rem .5rem; margin: 0; padding-block: .5rem;
	border-bottom: 1px solid var(--sf-ink);
	font-family: var(--sf-label); font-size: var(--sf-label-size-s); font-weight: 500; line-height: 1.3;
	letter-spacing: var(--sf-track); text-transform: var(--sf-case); color: var(--sf-ink);
}
.sf-wire__date [hidden] + .sf-wire__dot { display: none; }
.sf-wire__dot { color: var(--sf-rule); }
.sf-wire__list { margin: 0; padding: 0; list-style: none; }
.sf-wire__row { display: grid; grid-template-columns: 3.375rem minmax(0, 1fr); }

/* Time gutter on a rail: each row's time cell carries the rail and a square node on it. */
.sf-wire__time {
	position: relative; padding-block: .8125rem; padding-inline-end: .75rem;
	border-inline-end: 1px solid var(--sf-hair); text-align: end;
	font-family: var(--sf-mono); font-size: .8125rem; line-height: 1.45; color: var(--sf-ink);
	font-variant-numeric: tabular-nums;
}
.sf-wire__time::after {
	content: ""; position: absolute; top: 1.125rem; inset-inline-end: -4px; width: 7px; height: 7px;
	background: var(--sf-paper); border: 1px solid var(--sf-rule);
}
.sf-wire__body {
	display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "tag cat" "head head" "dek dek";
	align-items: baseline; column-gap: .625rem; min-width: 0;
	padding-block: .75rem .875rem; padding-inline-start: 1rem; border-bottom: 1px solid var(--sf-hair);
}
.sf-wire__body > .sf-tag { grid-area: tag; }
.sf-wire__cat {
	grid-area: cat; justify-self: start; color: var(--sf-muted); text-decoration: none;
	font-family: var(--sf-label); font-size: var(--sf-label-size-s); line-height: 1.3;
	letter-spacing: var(--sf-track); text-transform: var(--sf-case);
}
.sf-wire__cat::before { content: "·"; margin-inline-end: .625rem; color: var(--sf-rule); }
.sf-wire__cat:hover { color: var(--sf-ink); text-decoration: underline; }
.sf-wire__head {
	grid-area: head; margin-top: .3125rem; color: var(--sf-ink); text-decoration: none;
	font-size: calc(var(--k) * 1.0625rem); font-weight: var(--wr); line-height: var(--lh-row); text-wrap: pretty;
}
.sf-wire__head:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .16em; }
.sf-wire__dek {
	grid-area: dek; margin: .375rem 0 0; color: var(--sf-muted);
	font-size: calc(var(--k) * .9375rem); line-height: var(--lh); text-wrap: pretty;
}

.sf-wire__row--flash .sf-wire__time::after {
	top: 1rem; inset-inline-end: -6px; width: 11px; height: 11px; background: var(--sf-signal); border-color: var(--sf-signal);
}
.sf-wire__row--flash .sf-wire__head {
	font-size: calc(var(--k) * 1.3125rem); font-weight: var(--wh); line-height: var(--lh-tight); letter-spacing: var(--sf-tight);
}
.sf-wire__row--flash .sf-wire__body { padding-block: .875rem 1rem; }

@media (prefers-reduced-motion: no-preference) {
	.sf-wire__row--flash .sf-wire__time::after { animation: sf-beat 2.4s ease-in-out infinite; }
	@keyframes sf-beat { 50% { opacity: .35; } }
}

@media (min-width: 960px) {
	.sf-wire__row { grid-template-columns: 4.5rem minmax(0, 1fr); }
	.sf-wire__time { font-size: .875rem; padding-inline-end: 1rem; padding-block: .875rem; }
	.sf-wire__time::after { top: 1.25rem; }
	.sf-wire__body { padding-inline-start: 1.25rem; }
	.sf-wire--line .sf-wire__row:not(.sf-wire__row--flash) .sf-wire__body {
		grid-template-columns: 4.75rem minmax(0, 1fr) auto; grid-template-areas: "tag head cat"; column-gap: 1rem;
		padding-block: .875rem;
	}
	.sf-wire--line .sf-wire__row:not(.sf-wire__row--flash) .sf-wire__head { margin-top: 0; }
	.sf-wire--line .sf-wire__row:not(.sf-wire__row--flash) .sf-wire__cat { justify-self: end; text-align: end; white-space: nowrap; }
	.sf-wire--line .sf-wire__row:not(.sf-wire__row--flash) .sf-wire__cat::before { content: none; }
	.sf-wire__row--flash .sf-wire__time::after { top: 1.125rem; }
	.sf-wire__row--flash .sf-wire__head { font-size: calc(var(--k) * 1.625rem); }
	.sf-wire--context .sf-wire__head { font-size: calc(var(--k) * 1.1875rem); }
	.sf-wire--context .sf-wire__row--flash .sf-wire__head { font-size: calc(var(--k) * 1.5rem); }
}

.sf-empty { margin: 1rem 0; padding: 1.25rem; border: 1px dashed var(--sf-rule); color: var(--sf-muted); }

.sf-pager {
	display: flex; align-items: center; justify-content: space-between; gap: 1rem;
	margin-top: 1.75rem; padding-top: .5rem; border-top: 2px solid var(--sf-ink);
}
.sf-pager__link { display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; font-weight: 600; color: var(--sf-ink); text-decoration: none; }
.sf-pager__link:hover { text-decoration: underline; text-underline-offset: .2em; }
.sf-pager__at { font-family: var(--sf-mono); font-size: .75rem; letter-spacing: .04em; color: var(--sf-muted); }
html[lang|="ar"] .sf-pager__at { font-family: var(--sf-arab); font-size: .875rem; letter-spacing: 0; }

/* ---------------------------------------------------------------- rail boxes */
.sf-rail { display: grid; gap: 2.25rem; align-content: start; }
.sf-box { padding-top: .625rem; border-top: 2px solid var(--sf-ink); }
.sf-box__title { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem .75rem; margin-bottom: .375rem; }

.sf-mini { margin: 0; padding: 0; list-style: none; }
.sf-mini__item { display: grid; grid-template-columns: 3.25rem minmax(0, 1fr); gap: .625rem; padding-block: .625rem; border-bottom: 1px solid var(--sf-hair); }
.sf-mini__time { font-family: var(--sf-mono); font-size: .75rem; line-height: 1.7; color: var(--sf-muted); white-space: nowrap; }
html[lang|="ar"] .sf-mini__item { grid-template-columns: 4.5rem minmax(0, 1fr); }
html[lang|="ar"] .sf-mini__time { font-family: var(--sf-arab); font-size: .8125rem; }
.sf-mini__head { color: var(--sf-ink); text-decoration: none; font-size: calc(var(--k) * .9375rem); font-weight: var(--wr); line-height: var(--lh-row); }
.sf-mini__head:hover { text-decoration: underline; text-underline-offset: .16em; }

.sf-desk + .sf-desk { margin-top: 1rem; }
.sf-desk__name { margin: .25rem 0 0; font-size: calc(var(--k) * .9375rem); font-weight: var(--wh); line-height: 1.3; }
.sf-desk__name a { display: inline-flex; align-items: center; gap: .375rem; min-height: 32px; color: var(--sf-ink); text-decoration: none; }
.sf-desk__name a:hover { text-decoration: underline; }
.sf-desk__none { margin: 0; padding-block: .375rem .625rem; border-bottom: 1px solid var(--sf-hair); font-size: calc(var(--k) * .8125rem); color: var(--sf-muted); }

@media (max-width: 959px) {
	.sf-box--desks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1.25rem; }
	.sf-box--desks > .sf-box__title { grid-column: 1 / -1; }
	.sf-box--desks .sf-mini, .sf-box--desks .sf-desk__none { display: none; }
	.sf-desk + .sf-desk { margin-top: 0; }
	.sf-desk { border-bottom: 1px solid var(--sf-hair); }
	.sf-desk__name { margin: 0; }
	.sf-desk__name a { min-height: 48px; }
}
.sf-key { display: grid; gap: .625rem; margin: .5rem 0 0; }
.sf-key__row { display: grid; grid-template-columns: 4.75rem minmax(0, 1fr); align-items: baseline; gap: .5rem; }
.sf-key dt { margin: 0; }
.sf-key dd { margin: 0; font-size: calc(var(--k) * .875rem); line-height: 1.4; color: var(--sf-sub); }
.sf-key__time { margin: .875rem 0 0; font-size: calc(var(--k) * .8125rem); color: var(--sf-muted); }

/* ---------------------------------------------------------------- article */
.sf-story { padding-block: 1.25rem 2.5rem; }
.sf-story__head { max-width: 60rem; margin-bottom: 1.25rem; }
.sf-story__title {
	margin: 0; font-size: calc(var(--k) * 1.875rem); font-weight: var(--wh); line-height: var(--lh-title);
	letter-spacing: var(--sf-tighter); text-wrap: balance;
}
.sf-story__grid { display: grid; gap: 1.125rem; }
.sf-dateline {
	display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem 1rem; padding-block: .625rem;
	border-top: 2px solid var(--sf-ink); border-bottom: 1px solid var(--sf-hair);
	font-size: calc(var(--k) * .8125rem); line-height: 1.45; color: var(--sf-muted);
}
.sf-dateline__time { font-family: var(--sf-mono); font-size: .9375rem; line-height: 1.2; color: var(--sf-ink); }
.sf-dateline__z { font-size: .6875rem; letter-spacing: .06em; color: var(--sf-muted); }
html[lang|="ar"] .sf-dateline__z { font-family: var(--sf-arab); font-size: .8125rem; letter-spacing: 0; }
.sf-dateline__upd time { font-family: var(--sf-mono); font-size: .75rem; }
.sf-story__fig { margin: 0 calc(-1 * var(--sf-pad)) 1.5rem; }
.sf-story__cap { padding: .5rem var(--sf-pad) 0; font-size: calc(var(--k) * .8125rem); line-height: 1.45; color: var(--sf-muted); }

@media (min-width: 600px) {
	.sf-story__fig { margin-inline: 0; }
	.sf-story__cap { padding-inline: 0; }
}
@media (min-width: 960px) {
	.sf-story { padding-block: 2rem 3rem; }
	.sf-story__head { margin-bottom: 1.75rem; }
	.sf-story__title { font-size: calc(var(--k) * 2.875rem); }
	.sf-story__grid { grid-template-columns: 11.5rem minmax(0, 47.5rem); column-gap: 3rem; }
	.sf-dateline {
		position: sticky; top: 1.5rem; align-self: start; display: grid; gap: .5rem;
		padding-block: .875rem 0; border-bottom: 0;
	}
	.sf-dateline__time { font-size: 1.875rem; line-height: 1; letter-spacing: -.01em; }
	.sf-dateline__z { display: block; margin-top: .5rem; }
	.sf-dateline__date { padding-bottom: .5rem; border-bottom: 1px solid var(--sf-hair); color: var(--sf-ink); }
}

/* Body copy: Plex Sans 18-19px on a ~68ch measure. */
.sf-copy { max-width: 68ch; font-size: calc(var(--k) * 1.125rem); line-height: var(--lh-copy); color: var(--sf-ink); text-wrap: pretty; }
.sf-copy > * { margin-block: 0; }
.sf-copy > * + * { margin-top: 1.05em; }
.sf-copy > :first-child { margin-top: 0; }
.sf-copy > p:first-child { font-size: 1.08em; line-height: calc(var(--lh-copy) - .06); }
.sf-copy h2 { margin-top: 1.9em; font-size: 1.32em; font-weight: var(--wh); line-height: calc(var(--lh-head) + .08); letter-spacing: var(--sf-tight); }
.sf-copy h3 { margin-top: 1.6em; font-size: 1.12em; font-weight: var(--wh); line-height: var(--lh-tight); }
.sf-copy h2 + *, .sf-copy h3 + * { margin-top: .55em; }
.sf-copy a { color: var(--sf-ink); text-decoration-line: underline; text-decoration-thickness: 1px; text-decoration-color: var(--sf-rule); text-underline-offset: .2em; }
.sf-copy a:hover { text-decoration-color: var(--sf-ink); text-decoration-thickness: 2px; }
.sf-copy strong, .sf-copy b { font-weight: 600; }
html[lang|="ar"] .sf-copy strong, html[lang|="ar"] .sf-copy b { font-weight: 700; }
.sf-copy ul, .sf-copy ol { padding-inline-start: 1.35em; }
.sf-copy ul { list-style: square; }
.sf-copy li { padding-inline-start: .2em; }
.sf-copy li + li { margin-top: .45em; }
.sf-copy li::marker { color: var(--sf-rule); }
.sf-copy ol li::marker { font-family: var(--sf-mono); font-size: .86em; color: var(--sf-muted); }
.sf-copy blockquote { margin-inline: 0; padding-inline-start: 1.1em; border-inline-start: 3px solid var(--sf-ink); font-size: 1.06em; font-weight: 500; }
.sf-copy :where(img, video, iframe) { height: auto; }
.sf-copy figure { margin-inline: 0; }
.sf-copy figcaption { margin-top: .4em; font-size: .8em; color: var(--sf-muted); }
.sf-copy table { display: block; width: 100%; overflow-x: auto; border-collapse: collapse; font-size: .9em; }
.sf-copy th, .sf-copy td { padding: .5em .6em; border-bottom: 1px solid var(--sf-hair); text-align: start; vertical-align: top; }
.sf-copy th { font-weight: 600; border-bottom-color: var(--sf-ink); }
.sf-copy hr { margin-block: 2em; border: 0; border-top: 1px solid var(--sf-hair); }
@media (min-width: 960px) {
	.sf-copy { font-size: calc(var(--k) * 1.1875rem); }
}

.sf-after { margin-top: .5rem; padding-block: .5rem 0; }

/* ---------------------------------------------------------------- archives, search, 410 */
.sf-arch { padding-block: 1.5rem .25rem; }
.sf-arch__title {
	margin: 0; font-size: calc(var(--k) * 2.25rem); font-weight: var(--wh); line-height: var(--lh-title);
	letter-spacing: var(--sf-tighter); text-wrap: balance;
}
.sf-arch__desc { margin: .625rem 0 0; max-width: 62ch; color: var(--sf-sub); }
.sf-arch__count { margin: .75rem 0 0; font-family: var(--sf-mono); font-size: .75rem; letter-spacing: .04em; color: var(--sf-muted); }
html[lang|="ar"] .sf-arch__count { font-family: var(--sf-arab); font-size: .875rem; letter-spacing: 0; }
.sf-arch--search .sf-qform { margin-top: 1.25rem; }
@media (min-width: 960px) {
	.sf-arch { padding-block: 2.25rem .5rem; }
	.sf-arch__title { font-size: calc(var(--k) * 3.25rem); }
}

.sf-qform { display: flex; max-width: 38rem; }
.sf-qform__in {
	flex: 1 1 auto; min-width: 0; min-height: 48px; padding-inline: .875rem;
	border: 1px solid var(--sf-ink); border-inline-end: 0; border-radius: 0; background: #fff; color: var(--sf-ink);
	font-size: 1rem; -webkit-appearance: none; appearance: none;
}
.sf-qform__go {
	flex: none; min-height: 48px; padding-inline: 1.25rem; border: 1px solid var(--sf-ink); border-radius: 0;
	background: var(--sf-ink); color: #fff; font-size: .9375rem; font-weight: 600; cursor: pointer;
}
.sf-qform__go:hover { background: var(--sf-sub); }
.sf-qform__in:focus-visible, .sf-qform__go:focus-visible { outline-offset: -4px; outline-color: var(--sf-signal); }

.sf-gone, .sf-gone__latest { max-width: 52rem; }
.sf-gone { padding-block: 2.5rem 1rem; }
.sf-gone__code { margin: 0 0 .75rem; font-family: var(--sf-mono); font-size: .875rem; letter-spacing: .14em; color: var(--sf-muted); }
.sf-gone__code::before { content: ""; display: inline-block; width: .62em; height: .62em; margin-inline-end: .6em; background: var(--sf-ink); vertical-align: .02em; }
.sf-gone__title { margin: 0; font-size: calc(var(--k) * 2.25rem); font-weight: var(--wh); line-height: var(--lh-title); letter-spacing: var(--sf-tighter); }
.sf-gone__text { margin: 1rem 0 1.5rem; max-width: 56ch; font-size: calc(var(--k) * 1.0625rem); color: var(--sf-sub); }
.sf-gone__home { display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; margin-top: .75rem; color: var(--sf-ink); font-weight: 600; text-underline-offset: .2em; }
.sf-gone__latest { padding-block: 1rem 0; }
@media (min-width: 960px) {
	.sf-gone { padding-block: 4rem 1.5rem; }
	.sf-gone__title { font-size: calc(var(--k) * 3.25rem); }
}

/* ---------------------------------------------------------------- pages + desk form */
.sf-page { padding-block: 1.5rem 2rem; }
.sf-page__head { max-width: 54rem; margin-bottom: 1.5rem; }
.sf-page__title { margin: 0; font-size: calc(var(--k) * 2rem); font-weight: var(--wh); line-height: var(--lh-title); letter-spacing: var(--sf-tighter); text-wrap: balance; }
.sf-page__grid { display: grid; gap: 1.5rem; }
.sf-page__nav ul {
	display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; margin: 0; padding: .5rem 0; list-style: none;
	border-top: 2px solid var(--sf-ink); border-bottom: 1px solid var(--sf-hair);
}
.sf-page__nav a { display: inline-block; padding-block: .375rem; color: var(--sf-muted); font-size: calc(var(--k) * .9375rem); font-weight: 500; text-decoration: none; }
.sf-page__nav a:hover { color: var(--sf-ink); text-decoration: underline; }
.sf-page__nav a[aria-current="page"] { color: var(--sf-ink); font-weight: var(--wh); }
@media (min-width: 960px) {
	.sf-page { padding-block: 2.25rem 3rem; }
	.sf-page__title { font-size: calc(var(--k) * 3rem); }
	.sf-page__grid { grid-template-columns: 11.5rem minmax(0, 47.5rem); column-gap: 3rem; }
	.sf-page__nav ul { position: sticky; top: 1.5rem; display: grid; gap: 0; padding-top: .625rem; border-bottom: 0; }
}

.sf-form {
	margin-top: 2rem; padding: 1.25rem; border: 1px solid var(--sf-hair); border-top: 2px solid var(--sf-ink);
	font-size: 1rem; line-height: 1.5;
}
.sf-copy > .sf-form { margin-top: 2rem; }
.sf-form .sf-form__title { margin: 0 0 1rem; padding: 0; border: 0; font-size: calc(var(--k) * 1.25rem); font-weight: var(--wh); line-height: 1.3; }
.sf-form__form { display: grid; gap: 1.125rem; margin: 0; }
.sf-form__field { display: grid; gap: .375rem; margin: 0; }
.sf-form label { font-size: calc(var(--k) * .875rem); font-weight: 600; }
.sf-form input, .sf-form select, .sf-form textarea {
	width: 100%; min-height: 48px; padding: .625rem .75rem; border: 1px solid var(--sf-rule); border-radius: 0;
	background: #fff; color: var(--sf-ink); font-size: 1rem; line-height: 1.4;
}
.sf-form textarea { min-height: 10rem; resize: vertical; line-height: var(--lh); }
.sf-form input:focus-visible, .sf-form select:focus-visible, .sf-form textarea:focus-visible { outline: 2px solid var(--sf-ink); outline-offset: 1px; border-color: var(--sf-ink); }
.sf-form__help { font-size: calc(var(--k) * .8125rem); color: var(--sf-muted); }
.sf-form__trap { position: absolute !important; inset-inline-start: -10000px; width: 1px; height: 1px; overflow: hidden; }
.sf-form__send { margin: 0; }
.sf-form__btn { min-height: 48px; padding: .75rem 1.5rem; border: 0; border-radius: 0; background: var(--sf-ink); color: #fff; font-weight: 600; cursor: pointer; }
.sf-form__btn:hover { background: var(--sf-sub); }
.sf-form__ok { margin: 0; padding: 1rem 1.125rem; border-inline-start: 4px solid var(--sf-ink); background: var(--sf-tint); font-weight: 500; }
.sf-form__again { color: var(--sf-ink); font-weight: 600; }
.sf-form__err { margin: 0 0 1.125rem; padding: 1rem 1.125rem; border: 2px solid var(--sf-ink); }
.sf-form__err p { margin: 0 0 .375rem; font-weight: 600; }
.sf-form__err ul { margin: 0; padding-inline-start: 1.25rem; }
@media (min-width: 600px) {
	.sf-form { padding: 1.5rem 1.75rem 1.75rem; }
}

/* ---------------------------------------------------------------- footer */
.sf-foot { margin-top: 3.5rem; background: var(--sf-ink); color: #fff; font-size: calc(var(--k) * .9375rem); }
.sf-foot a { color: #fff; text-decoration: none; }
.sf-foot a:hover { text-decoration: underline; text-underline-offset: .2em; }
.sf-foot :focus-visible { outline-color: #fff; }
.sf-foot__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 1.25rem; padding-block: 2.5rem 2rem; }
.sf-foot__brand { grid-column: 1 / -1; }
.sf-foot__logo { display: inline-block; margin-bottom: 1rem; color: #fff; line-height: 0; }
.sf-logo--foot { height: 20px; }
html[lang|="ar"] .sf-logo--foot { height: 28px; }
.sf-foot__about { margin: 0; max-width: 38ch; line-height: 1.55; color: #d9dce0; }
.sf-foot__time { margin: .75rem 0 0; font-size: calc(var(--k) * .8125rem); color: #a9aeb5; }
.sf-foot__h { margin-bottom: .75rem; color: #a9aeb5; }
.sf-foot__list { display: grid; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.sf-foot__lang { display: inline-flex; align-items: center; min-height: 44px; padding-inline: .875rem; border: 1px solid #3b3f45; font-weight: 700; }
.sf-foot__lang:hover { border-color: #fff; }
.sf-foot__note { margin: .75rem 0 0; max-width: 30ch; font-size: calc(var(--k) * .8125rem); line-height: 1.5; color: #a9aeb5; }
.sf-foot__base {
	display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem 1.5rem; padding-block: 1rem 1.5rem;
	border-top: 1px solid #2d3035; font-size: calc(var(--k) * .8125rem); color: #c4c8cd;
}
.sf-foot__base p { margin: 0; }
@media (min-width: 720px) {
	.sf-foot__grid { grid-template-columns: minmax(0, 2fr) repeat(3, minmax(0, 1fr)); }
	.sf-foot__brand { grid-column: auto; }
}
@media (min-width: 960px) {
	.sf-logo--foot { height: 24px; }
	html[lang|="ar"] .sf-logo--foot { height: 34px; }
}

/* ---------------------------------------------------------------- print */
@media print {
	.sf-mast__tools, .sf-nav, .sf-rail, .sf-after, .sf-foot__grid, .sf-pager, .sf-skip { display: none !important; }
	.sf-foot { background: none; color: #000; }
	.sf-dateline { position: static; }
	.sf-wire__row--flash .sf-wire__time::after { animation: none; }
}