/* Form I-130 Bulletin: wire-service front page.
   Newsprint paper, black ink, one alert red reserved for "updated" signals. */
:root {
  --paper: #f3f1eb;
  --paper-2: #e7e4db;
  --paper-3: #d9d5c9;
  --white: #fbfaf7;
  --ink: #111111;
  --ink-2: #2b2a28;
  --mute: #5c5850;
  --hair: #c6c1b4;
  --red: #c81e17;
  --slab: "Roboto Slab", Rockwell, "Courier New", Georgia, serif;
  --sans: Roboto, "Helvetica Neue", Arial, sans-serif;
  --cond: "Roboto Condensed", "Arial Narrow", Roboto, Arial, sans-serif;
  --gut: 16px;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--paper); color: var(--ink-2);
  font: 400 16px/1.55 var(--sans); font-kerning: normal;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
h1, h2, h3, h4 { color: var(--ink); margin: 0; }
p { margin: 0; }
ol, ul { margin: 0; padding: 0; }
.wrap { width: 100%; max-width: 1328px; margin: 0 auto; padding: 0 var(--gut); }
.skip { position: absolute; left: -9999px; top: 0; background: var(--ink); color: var(--paper); padding: 10px 14px; z-index: 10; }
.skip:focus { left: 8px; }
:focus-visible { outline: 3px solid var(--ink); outline-offset: 2px; }

/* ---------- shared labels & tags ---------- */
.label {
  font: 700 12.5px/1.2 var(--cond); text-transform: uppercase; letter-spacing: .12em; color: var(--ink);
}
.label--rule { border-top: 3px solid var(--ink); padding-top: 8px; margin-bottom: 4px; display: flex; align-items: center; gap: 10px; }
.label--rule::after { content: ""; flex: 1; border-top: 1px solid var(--hair); }
.kicker {
  font: 700 12.5px/1.2 var(--cond); text-transform: uppercase; letter-spacing: .09em; color: var(--ink);
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin-bottom: 10px;
}
.kicker a { text-decoration: none; border-bottom: 1px solid var(--ink); }
.tag-updated {
  display: inline-flex; align-items: center; gap: 6px; background: var(--red); color: #fff;
  font: 700 11px/1 var(--cond); letter-spacing: .12em; text-transform: uppercase; padding: 5px 8px 4px;
}
.tag-updated__dot { width: 6px; height: 6px; background: #fff; animation: blink 1.6s steps(2, start) infinite; }
@keyframes blink { to { opacity: .15; } }
.tag-effective {
  display: inline-block; border: 1.5px solid var(--ink); color: var(--ink);
  font: 700 11px/1 var(--cond); letter-spacing: .1em; text-transform: uppercase; padding: 3px 6px 2px;
}
.byline { font: 500 12.5px/1.4 var(--cond); letter-spacing: .06em; text-transform: uppercase; color: var(--mute); margin-top: 10px; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; }
.dateline { font: 700 .82em/1 var(--cond); letter-spacing: .1em; text-transform: uppercase; color: var(--ink); }
.more {
  display: inline-flex; align-items: center; gap: 8px; margin-top: 14px;
  font: 700 13px/1 var(--cond); text-transform: uppercase; letter-spacing: .1em; color: var(--ink);
  text-decoration: none; border-bottom: 2px solid var(--ink); padding-bottom: 4px;
}
.more::after { content: ""; width: 14px; height: 10px; background: currentColor; clip-path: polygon(0 40%, 60% 40%, 60% 0, 100% 50%, 60% 100%, 60% 60%, 0 60%); }
.more:hover { background: var(--ink); color: var(--paper); }
.more--inline { margin-top: 0; }
.empty { font: 400 16px/1.5 var(--sans); color: var(--mute); padding: 16px 0; }

/* ---------- plates (generated image + halftone fallback) ---------- */
.plate {
  position: relative; margin: 0; overflow: hidden; aspect-ratio: 3 / 2;
  background-color: var(--paper-2);
  background-image:
    linear-gradient(118deg, var(--paper-2) 8%, rgba(231,228,219,.55) 42%, rgba(231,228,219,0) 78%),
    radial-gradient(circle, rgba(17,17,17,.62) 0 1.15px, transparent 1.7px);
  background-size: 100% 100%, 6px 6px;
  border: 1px solid var(--ink);
}
.plate::after { /* registration corner marks, like a press plate */
  content: ""; position: absolute; inset: 8px; pointer-events: none;
  background:
    linear-gradient(var(--ink), var(--ink)) left top / 14px 1.5px no-repeat,
    linear-gradient(var(--ink), var(--ink)) left top / 1.5px 14px no-repeat,
    linear-gradient(var(--ink), var(--ink)) right bottom / 14px 1.5px no-repeat,
    linear-gradient(var(--ink), var(--ink)) right bottom / 1.5px 14px no-repeat;
}
.plate__icon {
  position: absolute; left: 50%; top: 50%; width: 76px; height: 76px; transform: translate(-50%, -50%);
  background: var(--paper); border: 2px solid var(--ink); padding: 12px; box-shadow: 6px 6px 0 var(--ink);
}
.plate__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1; }
.plate--hero { aspect-ratio: 16 / 9; }
.plate--hero .plate__icon { width: 104px; height: 104px; padding: 16px; box-shadow: 8px 8px 0 var(--ink); }
.plate--wide { aspect-ratio: 3 / 2; }
.plate--desk { aspect-ratio: 4 / 3; }
.plate--story { aspect-ratio: 21 / 9; margin: 28px 0 8px; }

/* ---------- masthead ---------- */
.masthead { background: var(--paper); }
.utility {
  display: flex; justify-content: space-between; gap: 12px; padding: 9px 0 8px; border-bottom: 1px solid var(--hair);
  font: 500 11.5px/1.3 var(--cond); letter-spacing: .1em; text-transform: uppercase; color: var(--mute);
}
.utility a { color: var(--ink); text-decoration: none; }
.utility a:hover { text-decoration: underline; }
.utility__mid { display: none; }
.nameplate { display: grid; grid-template-columns: 1fr; justify-items: center; padding: 18px 0 14px; border-bottom: 5px solid var(--ink); position: relative; }
.nameplate::after { content: ""; position: absolute; left: 0; right: 0; bottom: -10px; border-top: 1px solid var(--ink); }
.nameplate__mark { display: flex; flex-direction: column; align-items: center; text-decoration: none; color: var(--ink); }
.nameplate__top { font: 700 clamp(12px, 3.4vw, 19px)/1 var(--cond); letter-spacing: .42em; text-transform: uppercase; margin-right: -.42em; }
.nameplate__big { font: 900 clamp(66px, 19vw, 156px)/.86 var(--slab); letter-spacing: -.035em; margin-top: 6px; position: relative; }
.nameplate__big::after { content: ""; display: inline-block; width: .12em; height: .12em; background: var(--red); margin-left: .03em; }
.nameplate__ear { display: none; }
.desks { margin-top: 10px; border-bottom: 1px solid var(--ink); }
.desks ul { list-style: none; display: flex; overflow-x: auto; scrollbar-width: none; gap: 0; }
.desks ul::-webkit-scrollbar { display: none; }
.desks li { flex: 0 0 auto; }
.desks li + li a { border-left: 1px solid var(--hair); }
.desks a {
  display: block; padding: 12px 14px 11px; white-space: nowrap; text-decoration: none; color: var(--ink);
  font: 700 12.5px/1 var(--cond); letter-spacing: .09em; text-transform: uppercase;
}
.desks li:first-child a { padding-left: 0; }
.desks a:hover { background: var(--paper-2); }
.desks a[aria-current="page"] { box-shadow: inset 0 -4px 0 var(--ink); }

/* ticker */
.ticker { display: flex; background: var(--ink); color: var(--paper); min-height: 42px; }
.ticker__label { flex: 0 0 auto; display: flex; align-items: stretch; }
.ticker__label .tag-updated { padding: 0 12px; font-size: 12px; }
.ticker__viewport { flex: 1; display: flex; overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 24px, #000 calc(100% - 40px), transparent); }
.ticker__track { list-style: none; display: flex; flex: 0 0 auto; animation: tick 110s linear infinite; }
.ticker:hover .ticker__track, .ticker:focus-within .ticker__track { animation-play-state: paused; }
.ticker__track li { display: flex; align-items: center; gap: 10px; padding: 0 22px; white-space: nowrap; }
.ticker__track li::after { content: ""; width: 6px; height: 6px; background: var(--paper); margin-left: 22px; opacity: .6; }
.ticker__track time { font: 700 12px/1 var(--cond); letter-spacing: .08em; color: #b9b4a9; font-variant-numeric: tabular-nums; }
.ticker__track a { font: 600 14px/1 var(--slab); text-decoration: none; color: var(--paper); }
.ticker__track a:hover { text-decoration: underline; }
@keyframes tick { to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) {
  .ticker__track { animation: none; }
  .ticker__track[aria-hidden] { display: none; }
  .ticker__viewport { overflow-x: auto; }
  .tag-updated__dot { animation: none; }
}

/* ---------- home: frontline hero strip ---------- */
.frontline { border-bottom: 1px solid var(--ink); }
.frontline__inner { display: grid; gap: 18px; padding-top: 26px; padding-bottom: 26px; }
.frontline__stamp { display: inline-grid; justify-self: start; border: 3px solid var(--ink); background: var(--white); }
.frontline__stamp-k { background: var(--red); color: #fff; font: 700 13px/1 var(--cond); letter-spacing: .3em; text-transform: uppercase; padding: 8px 12px 7px; text-align: center; }
.frontline__stamp-y { font: 900 44px/1 var(--slab); color: var(--ink); padding: 8px 14px 10px; letter-spacing: -.02em; text-align: center; font-variant-numeric: lining-nums; }
.frontline__h1 { font: 800 clamp(30px, 7.6vw, 58px)/1.02 var(--slab); letter-spacing: -.018em; max-width: 22ch; text-wrap: balance; }
.frontline__intro { margin-top: 16px; font: 400 16.5px/1.6 var(--sans); color: var(--ink-2); max-width: 74ch; }

/* ---------- home: three-column front page ---------- */
.front { display: grid; grid-template-columns: 1fr; gap: 32px; padding-top: 28px; padding-bottom: 20px; }
.front__lead { order: -1; }
.lead__plate { display: block; margin-bottom: 18px; }
.lead__h { font: 800 clamp(28px, 6.4vw, 44px)/1.06 var(--slab); letter-spacing: -.015em; text-wrap: balance; }
.lead__h a, .second__h a, .wire__h a, .deskfront__th a, .deskfront__ih a, .desklead__h a, .log__h a, .deskfront__h a { text-decoration: none; }
.lead__h a:hover, .second__h a:hover, .wire__h a:hover, .deskfront__th a:hover, .deskfront__ih a:hover, .desklead__h a:hover, .log__h a:hover, .deskfront__h a:hover { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.lead__standfirst { margin-top: 14px; font: 400 17px/1.58 var(--sans); color: var(--ink-2); }
.seconds { display: grid; gap: 0; margin-top: 26px; border-top: 3px solid var(--ink); }
.second { padding: 16px 0; }
.second + .second { border-top: 1px solid var(--hair); }
.second__h { font: 700 21px/1.18 var(--slab); letter-spacing: -.005em; }
.second__x { margin-top: 8px; font-size: 15px; line-height: 1.55; color: var(--ink-2); }

.wire { list-style: none; }
.wire__item { padding: 13px 0 14px; border-bottom: 1px dotted var(--mute); }
.wire__item:last-child { border-bottom: 0; }
.wire__meta { display: flex; flex-wrap: wrap; gap: 4px 10px; font: 700 11.5px/1.3 var(--cond); letter-spacing: .08em; text-transform: uppercase; color: var(--mute); margin-bottom: 5px; font-variant-numeric: tabular-nums; }
.wire__meta a { color: var(--ink); text-decoration: none; }
.wire__meta a:hover { text-decoration: underline; }
.wire__h { font: 600 17px/1.26 var(--slab); }

.deskindex { list-style: none; counter-reset: d; }
.deskindex a {
  display: grid; grid-template-columns: 26px 22px 1fr auto; align-items: center; gap: 10px;
  padding: 10px 0; border-bottom: 1px solid var(--hair); text-decoration: none; color: var(--ink);
}
.deskindex a:hover { background: var(--paper-2); }
.deskindex--compact a { grid-template-columns: 22px 1fr auto; }
.deskindex__n { font: 800 15px/1 var(--slab); color: var(--mute); font-variant-numeric: tabular-nums; }
.deskindex__name { font: 600 15px/1.25 var(--slab); }
.deskindex__c { font: 700 12px/1 var(--cond); min-width: 28px; text-align: center; border: 1.5px solid var(--ink); padding: 4px 5px 3px; font-variant-numeric: tabular-nums; }
.notebox { margin-top: 26px; background: var(--paper-2); border-top: 3px solid var(--ink); padding: 14px 16px 16px; }
.notebox p { margin-top: 8px; font-size: 14.5px; line-height: 1.55; }
.formula { list-style: none; counter-reset: f; margin-top: 10px; }
.formula li { counter-increment: f; display: grid; grid-template-columns: 26px 1fr; gap: 8px; padding: 7px 0; font-size: 14.5px; line-height: 1.45; border-top: 1px solid var(--hair); }
.formula li:first-child { border-top: 0; }
.formula li::before { content: counter(f); font: 800 18px/1.1 var(--slab); color: var(--ink); }
.formula strong { color: var(--ink); }

/* ---------- home: desk fronts ---------- */
.deskfront { padding-top: 40px; }
.deskfront:last-of-type { padding-bottom: 56px; }
.deskfront__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; border-top: 5px solid var(--ink); padding-top: 12px; margin-bottom: 18px; }
.deskfront__n { font: 700 12px/1 var(--cond); letter-spacing: .14em; text-transform: uppercase; color: var(--mute); width: 100%; }
.deskfront__h { font: 800 clamp(26px, 6vw, 36px)/1.05 var(--slab); letter-spacing: -.015em; flex: 1; }
.deskfront__all { font: 700 12.5px/1 var(--cond); letter-spacing: .1em; text-transform: uppercase; color: var(--ink); }
.deskfront__grid { display: grid; gap: 20px; }
.deskfront__top { display: grid; gap: 14px; }
.deskfront__top > a { display: block; }
.deskfront__th { font: 700 clamp(22px, 5vw, 27px)/1.14 var(--slab); letter-spacing: -.01em; }
.deskfront__x { margin-top: 10px; font-size: 15.5px; line-height: 1.58; }
.deskfront__item { border-top: 1px solid var(--hair); padding-top: 14px; }
.deskfront__ih { font: 600 18px/1.24 var(--slab); }
.deskfront__ix { margin-top: 8px; font-size: 14.5px; line-height: 1.55; color: var(--ink-2); }

/* ---------- breadcrumbs ---------- */
.crumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: 4px 0; padding: 16px 0 0; font: 500 12px/1.4 var(--cond); letter-spacing: .08em; text-transform: uppercase; color: var(--mute); }
.crumbs li { max-width: 100%; }
.crumbs li + li::before { content: "/"; margin: 0 9px; color: var(--hair); }
.crumbs a { color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--hair); }
.crumbs li[aria-current] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 48ch; }

/* ---------- category / desk page ---------- */
.deskhead { border-bottom: 5px solid var(--ink); margin-top: 14px; }
.deskhead__inner { display: grid; gap: 22px; padding-top: 12px; padding-bottom: 28px; }
.deskhead__n { background: var(--ink); color: var(--paper); padding: 5px 8px 4px; }
.deskhead__h1 { font: 900 clamp(38px, 10vw, 80px)/.98 var(--slab); letter-spacing: -.03em; text-wrap: balance; }
.deskhead__desc { margin-top: 16px; font: 400 19px/1.5 var(--sans); color: var(--ink-2); max-width: 52ch; }
.deskhead__meta { margin-top: 18px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font: 500 12.5px/1.3 var(--cond); letter-spacing: .08em; text-transform: uppercase; color: var(--mute); }
.desk { display: grid; gap: 36px; padding-top: 28px; padding-bottom: 36px; }
.desklead { padding-bottom: 26px; margin-bottom: 26px; border-bottom: 1px solid var(--ink); }
.desklead__h { font: 800 clamp(26px, 6vw, 40px)/1.08 var(--slab); letter-spacing: -.015em; text-wrap: balance; }
.desklead__cols { margin-top: 14px; font: 400 17px/1.6 var(--sans); }
.log { list-style: none; }
.log__row { display: grid; grid-template-columns: 64px 1fr; gap: 14px; padding: 16px 0; border-bottom: 1px solid var(--hair); }
.log__date { display: flex; flex-direction: column; font: 700 11px/1 var(--cond); letter-spacing: .1em; color: var(--mute); }
.log__date span { font: 800 22px/1 var(--slab); color: var(--ink); letter-spacing: -.02em; margin-bottom: 4px; font-variant-numeric: tabular-nums; }
.log__h { font: 700 19px/1.22 var(--slab); }
.log__x { margin-top: 6px; font-size: 15px; line-height: 1.55; }
.log__min { display: none; }

/* ---------- article ---------- */
.story__head { padding-top: 18px; padding-bottom: 0; }
.story__h1 { font: 800 clamp(30px, 7.4vw, 58px)/1.04 var(--slab); letter-spacing: -.02em; max-width: 28ch; text-wrap: balance; }
.story__dek { margin-top: 14px; font: 400 19px/1.5 var(--sans); color: var(--mute); max-width: 62ch; }
.story__byline {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 22px; margin-top: 22px; padding: 11px 0 10px;
  border-top: 3px solid var(--ink); border-bottom: 1px solid var(--ink);
  font: 500 12.5px/1.3 var(--cond); letter-spacing: .08em; text-transform: uppercase; color: var(--ink);
}
.story__byline b { color: var(--mute); font-weight: 500; margin-right: 4px; }
.story__byline a { text-decoration: none; border-bottom: 1px solid var(--ink); }
.story__grid { display: grid; gap: 40px; padding-top: 28px; padding-bottom: 40px; }
.story__rail { display: none; }
.story__main { min-width: 0; }

.short { border: 2px solid var(--ink); background: var(--white); }
.short__label { display: flex; justify-content: space-between; align-items: center; background: var(--ink); color: var(--paper); padding: 9px 14px 8px; font: 700 12.5px/1 var(--cond); letter-spacing: .16em; text-transform: uppercase; }
.short__yr { border: 1.5px solid var(--paper); padding: 3px 6px 2px; letter-spacing: .1em; }
.short__body { padding: 16px 16px 18px; font: 500 17px/1.58 var(--sans); color: var(--ink); }

.body { font: 400 18px/1.68 var(--sans); color: var(--ink-2); max-width: 70ch; margin-top: 24px; }
.body > * + * { margin-top: 1.05em; }
.body > p:first-child::before { content: "The Netherlands \2014\00a0"; font: 700 .8em/1 var(--cond); letter-spacing: .1em; text-transform: uppercase; color: var(--ink); }
.story--about .body > p:first-child::before { content: none; }
.body h2 { font: 800 clamp(23px, 5vw, 29px)/1.16 var(--slab); letter-spacing: -.012em; margin-top: 2.1em; padding-top: 14px; border-top: 3px solid var(--ink); scroll-margin-top: 16px; text-wrap: balance; }
.body h3 { font: 700 20px/1.25 var(--slab); margin-top: 1.7em; }
.body h2 + *, .body h3 + * { margin-top: .6em; }
.body a { color: var(--ink); text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.body a:hover { background: var(--paper-2); }
.body strong { color: var(--ink); font-weight: 700; }
.body ul, .body ol { padding: 0; list-style: none; }
.body li { position: relative; padding-left: 26px; }
.body li + li { margin-top: .5em; }
.body ul > li::before { content: ""; position: absolute; left: 4px; top: .62em; width: 8px; height: 8px; background: var(--ink); }
.body ol { counter-reset: n; }
.body ol > li { counter-increment: n; padding-left: 34px; }
.body ol > li::before { content: counter(n, decimal-leading-zero); position: absolute; left: 0; top: .12em; font: 800 15px/1.4 var(--slab); color: var(--ink); }
.body blockquote { margin: 1.8em 0; padding: 18px 0 18px 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); font: 600 23px/1.35 var(--slab); color: var(--ink); }
.body blockquote::before { content: "\201C"; display: block; font: 900 56px/.6 var(--slab); height: 24px; }
.body blockquote p + p { margin-top: .6em; }
.body table { width: 100%; border-collapse: collapse; font: 400 15px/1.45 var(--sans); border-top: 3px solid var(--ink); border-bottom: 1.5px solid var(--ink); margin: 1.8em 0; font-variant-numeric: tabular-nums; background: var(--white); }
.body th { text-align: left; vertical-align: bottom; font: 700 12px/1.3 var(--cond); letter-spacing: .09em; text-transform: uppercase; color: var(--ink); padding: 11px 12px 9px; border-bottom: 1.5px solid var(--ink); background: var(--paper-2); }
.body td { padding: 11px 12px; vertical-align: top; border-bottom: 1px solid var(--hair); }
.body tbody tr:last-child td { border-bottom: 0; }
.body td:first-child { font-weight: 500; color: var(--ink); }
.body hr { border: 0; border-top: 1px solid var(--ink); margin: 2em 0; }

.faq { margin-top: 48px; border-top: 5px solid var(--ink); padding-top: 12px; }
.faq__h { font: 800 clamp(24px, 5vw, 30px)/1.1 var(--slab); letter-spacing: -.012em; margin-bottom: 8px; }
.faq__item { padding: 18px 0; border-bottom: 1px solid var(--hair); }
.faq__q, .faq__a { display: grid; grid-template-columns: 30px 1fr; gap: 12px; }
.faq__q { font: 700 19px/1.3 var(--slab); }
.faq__a { margin-top: 10px; font: 400 16.5px/1.62 var(--sans); color: var(--ink-2); }
.faq__q > span, .faq__a > span { width: 28px; height: 28px; display: grid; place-items: center; font: 700 14px/1 var(--cond); margin-top: 1px; }
.faq__q > span { background: var(--ink); color: var(--paper); }
.faq__a > span { border: 1.5px solid var(--ink); color: var(--ink); }
.story__end { margin-top: 28px; font: 500 12.5px/1.5 var(--cond); letter-spacing: .08em; text-transform: uppercase; color: var(--mute); }
.story__end span { color: var(--ink); margin-right: 6px; }

.story__side .more { margin-top: 16px; }
.toc { list-style: none; counter-reset: t; }
.toc li { counter-increment: t; }
.toc a { display: grid; grid-template-columns: 24px 1fr; gap: 6px; padding: 9px 0; border-bottom: 1px solid var(--hair); font: 500 14px/1.35 var(--sans); color: var(--ink-2); text-decoration: none; }
.toc a::before { content: counter(t, decimal-leading-zero); font: 700 12px/1.6 var(--cond); color: var(--mute); }
.toc a:hover { color: var(--ink); background: var(--paper-2); }

.desknav { border-top: 1px solid var(--ink); padding: 26px 0 40px; background: var(--paper); }
.desknav__list { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; margin-top: 8px; }
.desknav__list a { display: grid; grid-template-columns: 28px 1fr; grid-template-rows: auto auto; column-gap: 10px; padding: 14px 0; border-bottom: 1px solid var(--hair); text-decoration: none; color: var(--ink); align-items: start; }
.desknav__list img { grid-row: span 2; }
.desknav__list span { font: 600 15px/1.25 var(--slab); }
.desknav__list small { font: 500 11.5px/1.4 var(--cond); letter-spacing: .08em; text-transform: uppercase; color: var(--mute); margin-top: 3px; }
.desknav__list a:hover { background: var(--paper-2); }
.desknav__list a[aria-current="page"] span { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }

/* ---------- 404 ---------- */
.notfound { display: grid; gap: 12px; padding-top: 40px; padding-bottom: 48px; }
.notfound__code { font: 900 clamp(110px, 30vw, 240px)/.8 var(--slab); color: transparent; -webkit-text-stroke: 2px var(--ink); letter-spacing: -.04em; }

/* ---------- colophon ---------- */
.colophon { background: var(--paper-2); border-top: 6px solid var(--ink); padding: 34px 0 30px; margin-top: 8px; }
.colophon__top { display: grid; gap: 10px; padding-bottom: 22px; border-bottom: 1px solid var(--ink); }
.colophon__mark img { width: 240px; height: auto; }
.colophon__tag { font: 400 16px/1.5 var(--slab); color: var(--ink); max-width: 46ch; }
.colophon__grid { display: grid; gap: 26px; padding-top: 22px; }
.colophon__grid p { margin-top: 10px; font-size: 14.5px; line-height: 1.55; }
.colophon__grid a { color: var(--ink); }
.colophon__desks { list-style: none; margin-top: 8px; columns: 2; column-gap: 18px; }
.colophon__desks li { break-inside: avoid; padding: 5px 0; font: 500 14px/1.35 var(--sans); }
.colophon__desks a { text-decoration: none; }
.colophon__desks a:hover { text-decoration: underline; }
.legend { margin: 10px 0 0; }
.legend div { display: grid; grid-template-columns: 118px 1fr; gap: 10px; padding: 7px 0; border-top: 1px solid var(--hair); align-items: baseline; }
.legend div:first-child { border-top: 0; }
.legend dt { font: 700 11px/1 var(--cond); letter-spacing: .1em; justify-self: start; padding: 4px 6px 3px; border: 1.5px solid var(--ink); color: var(--ink); }
.legend div:first-child dt { background: var(--red); border-color: var(--red); color: #fff; }
.legend dd { margin: 0; font-size: 14px; line-height: 1.45; }
.legend--side { margin-bottom: 26px; }
.colophon__fine { margin-top: 26px; padding-top: 14px; border-top: 1px solid var(--hair); font: 500 12px/1.5 var(--cond); letter-spacing: .05em; text-transform: uppercase; color: var(--mute); }

/* ================= tablet ================= */
@media (min-width: 720px) {
  :root { --gut: 28px; }
  .utility__mid { display: inline; }
  .frontline__inner { grid-template-columns: auto 1fr; gap: 30px; align-items: start; }
  .frontline__stamp-y { font-size: 56px; }
  .frontline__intro { columns: 2; column-gap: 32px; column-rule: 1px solid var(--hair); }
  .lead__standfirst, .desklead__cols { columns: 2; column-gap: 28px; column-rule: 1px solid var(--hair); }
  .seconds { grid-template-columns: 1fr 1fr; }
  .second { padding: 16px 20px 6px 0; }
  .second + .second { border-top: 0; border-left: 1px solid var(--hair); padding-left: 20px; padding-right: 0; }
  .deskfront__n { width: auto; }
  .deskfront__top { grid-template-columns: 1.15fr 1fr; gap: 22px; align-items: start; }
  .deskfront__grid { grid-template-columns: repeat(3, 1fr); column-gap: 0; row-gap: 0; }
  .deskfront__top { grid-column: 1 / -1; padding-bottom: 20px; border-bottom: 1px solid var(--ink); }
  .deskfront__item { border-top: 0; padding: 16px 20px 0; border-left: 1px solid var(--hair); }
  .deskfront__item:nth-child(2) { border-left: 0; padding-left: 0; }
  .deskhead__inner { grid-template-columns: 1.35fr 1fr; align-items: end; gap: 40px; }
  .log__row { grid-template-columns: 84px 1fr 60px; gap: 20px; }
  .log__min { display: block; font: 700 12px/1 var(--cond); letter-spacing: .08em; text-transform: uppercase; color: var(--mute); text-align: right; padding-top: 5px; }
  .short__body { columns: 2; column-gap: 28px; column-rule: 1px solid var(--hair); padding: 18px 20px 20px; }
  .desknav__list { grid-template-columns: repeat(4, 1fr); }
  .colophon__top { grid-template-columns: auto 1fr; align-items: end; gap: 32px; }
  .colophon__grid { grid-template-columns: 1.1fr 1fr 1.1fr; gap: 40px; }
  .notfound { grid-template-columns: auto 1fr; align-items: center; gap: 40px; }
}

/* ================= desktop ================= */
@media (min-width: 1080px) {
  :root { --gut: 40px; }
  .nameplate { grid-template-columns: 1fr auto 1fr; align-items: center; padding: 22px 0 18px; }
  .nameplate__ear {
    display: block; max-width: 210px; border: 1.5px solid var(--ink); padding: 10px 12px;
    font: 700 13px/1.3 var(--cond); letter-spacing: .1em; text-transform: uppercase; color: var(--ink);
  }
  .nameplate__ear span { font-weight: 500; color: var(--mute); }
  .nameplate__ear--l { justify-self: start; }
  .nameplate__ear--r { justify-self: end; text-align: right; }
  .desks ul { display: grid; grid-template-columns: repeat(8, auto); overflow: visible; }
  .desks li:first-child { display: none; }
  .desks li { display: flex; }
  .desks a { flex: 1; display: flex; align-items: center; justify-content: center; text-align: center; white-space: normal; line-height: 1.2; padding: 11px 10px 10px; font-size: 12px; letter-spacing: .07em; }
  .desks li:first-child a { padding-left: 12px; }
  .frontline__h1 { max-width: 28ch; }
  .frontline__intro { columns: 3; max-width: none; }
  .ticker { min-height: 46px; }
  .ticker__label .tag-updated { padding: 0 18px; font-size: 13px; }

  .front { grid-template-columns: minmax(0, 1fr) minmax(0, 2.15fr) minmax(0, 1fr); gap: 0; padding-top: 30px; }
  .front > * { padding: 0 26px; }
  .front__wire { padding-left: 0; border-right: 1px solid var(--hair); order: 0; }
  .front__lead { order: 0; }
  .front__index { padding-right: 0; border-left: 1px solid var(--hair); }
  .lead__standfirst { font-size: 17.5px; }

  .deskfront__grid { display: flex; align-items: stretch; }
  .deskfront__grid > * { flex: 1 1 0; min-width: 0; }
  .deskfront__grid > .deskfront__top { flex: 2.2 1 0; }
  .deskfront__top { grid-column: auto; grid-template-columns: 1fr; border-bottom: 0; padding: 0 24px 0 0; border-right: 1px solid var(--ink); }
  .deskfront__top .plate { aspect-ratio: 16 / 9; }
  .deskfront__item { padding: 0 22px; }
  .deskfront__item:nth-child(2) { border-left: 0; padding-left: 22px; }
  .deskfront__item:last-child { padding-right: 0; }
  .deskfront--flip .deskfront__top { order: 2; border-right: 0; border-left: 1px solid var(--ink); padding: 0 0 0 24px; }
  .deskfront--flip .deskfront__item:nth-child(2) { padding-left: 0; }
  .deskfront--flip .deskfront__item:last-child { padding-right: 22px; }

  .desk { grid-template-columns: minmax(0, 1fr) 320px; gap: 0; }
  .desk__main { padding-right: 40px; border-right: 1px solid var(--hair); }
  .desk__side { padding-left: 32px; }

  .story__grid { grid-template-columns: 210px minmax(0, 720px) 1fr; gap: 0; }
  .story__grid > * { padding: 0 32px; }
  .story__rail { display: block; padding-left: 0; border-right: 1px solid var(--hair); align-self: start; position: sticky; top: 16px; }
  .story__side { padding-right: 0; border-left: 1px solid var(--hair); align-self: start; position: sticky; top: 16px; }
  .story__grid.story__grid--about { grid-template-columns: minmax(0, 760px) 1fr; }
  .story__grid--about .story__main { padding-left: 0; }
}
@media (min-width: 1280px) {
  .story__grid { grid-template-columns: 230px minmax(0, 740px) 1fr; }
}

@media (min-width: 1080px) {
  .deskfront--short .deskfront__top { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 26px; align-items: start; }
  .deskfront--short .deskfront__top .plate { aspect-ratio: 16 / 9; }
  .deskfront .deskfront__top:only-child { border: 0; padding: 0; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); }
  .deskfront .deskfront__top:only-child .plate { aspect-ratio: 21 / 9; }
}
/* narrow table overflow */
@media (max-width: 719px) {
  .body table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; font-size: 14px; }
  .body th, .body td { min-width: 130px; }
}
@media print {
  .ticker, .desks, .story__rail, .story__side, .desknav, .colophon__grid { display: none; }
  body { background: #fff; }
}
