/* ==========================================================================
   XT.PT 2.0 — the Claude Design redesign (direction 2a), every page.
   Values from the handoff README (project "XT.pt redesign options").
   Border radius 0, no shadows. Theme: theme.js sets data-theme on <html>
   before first paint; with no saved choice the OS decides.
   Section colours are only swatches, desk top borders, the active nav
   underline and the selected rail item: never text.
   ========================================================================== */

:root {
  color-scheme: light;
  --ink: #151619; --paper: #f6f4ef;
  --rule: #d6d3cc; --rule2: #e4e1da; --rule3: #cfcbc2; --sub: #e8e5de; --input: #fbfaf7;
  --t2: #3a3c42; --t3: #55575c; --t4: #6b6d72; --t5: #8a8c91; --t6: #a3a097;
  --ai: #5b4bd6; --software: #0e7c66; --hardware: #a8660b; --security: #c0352b;

  --serif: 'Newsreader', Georgia, serif;
  --sans:  'IBM Plex Sans', system-ui, sans-serif;
  --mono:  'IBM Plex Mono', ui-monospace, Menlo, monospace;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --ink: #ecebe6; --paper: #1c1d21;
    --rule: #393b41; --rule2: #2b2d32; --rule3: #4a4c53; --sub: #2a2c31; --input: #232429;
    --t2: #c9c7c1; --t3: #aeaca6; --t4: #9a9893; --t5: #86858a; --t6: #6f7176;
    --ai: #9a8ff5; --software: #3cc1a0; --hardware: #e0a03c; --security: #f07565;
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --ink: #ecebe6; --paper: #1c1d21;
  --rule: #393b41; --rule2: #2b2d32; --rule3: #4a4c53; --sub: #2a2c31; --input: #232429;
  --t2: #c9c7c1; --t3: #aeaca6; --t4: #9a9893; --t5: #86858a; --t6: #6f7176;
  --ai: #9a8ff5; --software: #3cc1a0; --hardware: #e0a03c; --security: #f07565;
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { overflow-x: clip; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--paper); color: var(--ink);
  font: 400 16px/1.5 var(--sans); -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
a:hover { color: var(--security); }
h1, h2, p { margin: 0; }
button { font: inherit; cursor: pointer; }
img { display: block; max-width: 100%; }
:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }

.nx-skip { position: absolute; left: -9999px; }
.nx-skip:focus { left: 16px; top: 16px; z-index: 10; background: var(--ink); color: var(--paper); padding: 8px 12px; }

/* ------------------------------------------------------------ preview bar */
.pvbar {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px;
  padding: 8px clamp(16px, 4vw, 40px); background: #fff3c4; color: #151619;
  font: 500 12px/1.3 var(--mono); border-bottom: 1px solid #e0cf86;
}
.pvbar__tag { text-transform: uppercase; letter-spacing: .08em; font-weight: 600; }
.pvbar__opt { padding: 4px 8px; border: 1px solid #151619; color: #151619; }
.pvbar__opt.is-on { background: #151619; color: #fff3c4; }
.pvbar__live { margin-left: auto; color: #151619; text-decoration: underline; }
.pvbar__live:hover { color: #151619; }
.pvbar a:hover { color: #151619; }

/* --------------------------------------------------------------- masthead */
/* Fixed colours: the masthead and footer are dark in both themes. */
.nx-head { background: #151619; color: #f6f4ef; }
.nx-head a:hover { color: #fff; }
.nx-head__util {
  padding: 0 40px; height: 34px; display: flex; align-items: center; justify-content: space-between; gap: 16px;
  font: 400 12px/1 var(--mono); color: #a9abb0; border-bottom: 1px solid #2a2c31;
}
.nx-head__utillinks { display: flex; gap: 20px; align-items: center; }
.nx-head__utillinks a { color: #a9abb0; }
.nx-themebtn {
  height: 24px; padding: 0 10px; border: 1px solid #3a3c42; background: transparent; color: #d6d3cc;
  font: 400 11px/1 var(--mono); display: flex; align-items: center; gap: 6px;
}
.nx-themebtn[hidden] { display: none; }
.nx-head__main { padding: 0 40px; height: 72px; display: flex; align-items: stretch; justify-content: space-between; gap: 24px; }
.nx-logo { display: flex; align-items: center; gap: 14px; color: #f6f4ef; }
.nx-logo__mark { font: 500 26px/1 var(--mono); letter-spacing: -.02em; color: #f6f4ef; }
.nx-logo__mark--sm { font-size: 22px; }
.nx-logo__mark--foot { font-size: 20px; }
.nx-logo__dot { color: #e5533f; }
.nx-logo__sub { font: 400 11px/1 var(--mono); color: #a9abb0; text-transform: uppercase; letter-spacing: .1em; }
.nx-nav { display: flex; align-items: stretch; gap: 4px; }
.nx-nav__item {
  display: flex; align-items: center; gap: 8px; padding: 0 14px;
  font: 500 15px/1 var(--sans); color: #d6d3cc;
  border-top: 3px solid transparent; border-bottom: 3px solid transparent;
}
.nx-nav__div { width: 1px; background: #3a3c42; margin: 22px 10px; }
.nx-nav__fmt { display: flex; align-items: center; padding: 0 12px; font: 400 15px/1 var(--sans); color: #a9abb0; }
.nx-nav__search {
  display: flex; align-items: center; gap: 24px; margin: 16px 0 16px 12px; padding: 0 12px;
  border: 1px solid #3a3c42; font: 400 13px/1 var(--mono); color: #a9abb0;
}
.nx-nav__key { border: 1px solid #3a3c42; padding: 1px 5px; font-size: 11px; }
.nx-head__compact, .nx-strip { display: none; }
.nx-head__compact { height: 56px; padding: 0 8px 0 16px; align-items: center; justify-content: space-between; }
.nx-head__icons { display: flex; }
.nx-iconbtn {
  width: 44px; height: 44px; display: flex; align-items: center; justify-content: center;
  border: 0; background: transparent; color: #f6f4ef; font-size: 18px;
}
.nx-strip {
  overflow-x: auto; border-top: 1px solid #2a2c31; padding: 0 8px; scrollbar-width: none;
}
.nx-strip::-webkit-scrollbar { display: none; }
.nx-strip__item {
  flex: none; height: 44px; display: flex; align-items: center; gap: 7px; padding: 0 12px;
  font: 500 14px/1 var(--sans); color: #d6d3cc; border-bottom: 3px solid transparent;
}
.nx-strip__fmt.nx-strip__fmt { color: #a9abb0; font-weight: 400; }

/* Active section: white text and a 3px underline in its masthead swatch. */
.nx-nav__item.is-active, .nx-strip__item.is-active { color: #fff; }
.nx-nav__item.is-ai, .nx-strip__item.is-ai { border-bottom-color: #7c6ff0; }
.nx-nav__item.is-software, .nx-strip__item.is-software { border-bottom-color: #1fa386; }
.nx-nav__item.is-hardware, .nx-strip__item.is-hardware { border-bottom-color: #d08a1c; }
.nx-nav__item.is-security, .nx-strip__item.is-security { border-bottom-color: #e0503f; }

@media (max-width: 1039px) {
  .nx-head__util, .nx-head__main { display: none; }
  .nx-head__compact, .nx-strip { display: flex; }
}

/* ------------------------------------------------------- swatches, labels */
.nx-sw { display: inline-block; width: 8px; height: 8px; flex: none; }
.nx-sw--ai { background: var(--ai); }
.nx-sw--software { background: var(--software); }
.nx-sw--hardware { background: var(--hardware); }
.nx-sw--security { background: var(--security); }
/* The masthead is always dark, so it gets the lighter swatches. */
.nx-sw--mast.nx-sw--ai { background: #7c6ff0; }
.nx-sw--mast.nx-sw--software { background: #1fa386; }
.nx-sw--mast.nx-sw--hardware { background: #d08a1c; }
.nx-sw--mast.nx-sw--security { background: #e0503f; }

.nx-label {
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px;
  font: 400 11px/1.3 var(--mono); letter-spacing: .06em;
}
.nx-label__sec { display: inline-flex; align-items: center; gap: 6px; text-transform: uppercase; font-weight: 500; }
.nx-label__sep { color: var(--t6); }
.nx-label__topic { color: var(--t3); letter-spacing: .02em; }
.nx-label__extra { color: var(--t5); letter-spacing: .02em; }
.nx-label--sm { font-size: 10px; }
.nx-label--lg { font-size: 12px; }
.nx-label--lg .nx-sw { width: 9px; height: 9px; }
.nx-sw--lg { width: 12px; height: 12px; }
.nx-label--sm .nx-sw { width: 7px; height: 7px; }

.nx-meta { font: 400 12px/1.3 var(--mono); color: var(--t4); }

/* ----------------------------------------------------------------- images */
.nx-img { display: block; background: var(--rule2); overflow: hidden; }
.nx-img--169 { aspect-ratio: 16 / 9; }
.nx-img--32  { aspect-ratio: 3 / 2; margin-bottom: 6px; }
.nx-img--sq  { aspect-ratio: 1; }
.nx-img picture, .nx-img img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ------------------------------------------------------------------- page */
.nx-main {
  width: 100%; max-width: 1280px; margin: 0 auto;
  padding: 28px clamp(16px, 4vw, 40px) 56px;
  display: flex; flex-direction: column; gap: 48px;
}

.nx-top { display: flex; flex-direction: column; gap: 28px; border-top: 3px solid var(--ink); padding-top: 24px; }
.nx-lead {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
  gap: 20px 36px; padding-bottom: 28px; border-bottom: 1px solid var(--rule); align-items: start;
}
.nx-lead__text { display: flex; flex-direction: column; gap: 14px; }
.nx-lead__h {
  font: 500 clamp(28px, 3.4vw, 40px)/1.06 var(--serif); letter-spacing: -.015em; text-wrap: balance;
}
.nx-lead__dek { font: 400 19px/1.45 var(--serif); color: var(--t2); text-wrap: pretty; }
.nx-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 28px 32px; }
.nx-card { display: flex; flex-direction: column; gap: 8px; }
.nx-card__h { font: 500 22px/1.2 var(--serif); text-wrap: pretty; }

/* ------------------------------------------------------------- four desks */
.nx-desks { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 36px 28px; }
.nx-desk { display: flex; flex-direction: column; border-top: 4px solid var(--ink); padding-top: 14px; }
.nx-desk--ai { border-top-color: var(--ai); }
.nx-desk--software { border-top-color: var(--software); }
.nx-desk--hardware { border-top-color: var(--hardware); }
.nx-desk--security { border-top-color: var(--security); }
.nx-desk__name { font: 500 15px/1.2 var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.nx-desk__desc { margin: 6px 0 4px; font: 400 13px/1.45 var(--sans); color: var(--t3); }
.nx-desk__item { padding: 12px 0; border-bottom: 1px solid var(--rule2); display: flex; flex-direction: column; gap: 5px; }
.nx-desk__when { font: 400 11px/1.3 var(--mono); color: var(--t3); }
.nx-desk__h { font: 500 17px/1.24 var(--serif); }
.nx-desk__all {
  margin-top: 12px; min-height: 32px; display: flex; justify-content: space-between; align-items: center;
  font: 400 12px/1.2 var(--mono);
}
.nx-desk__count { color: var(--t4); }

/* ---------------------------------------------------- archive and sidebar */
.nx-lower { display: flex; flex-wrap: wrap; gap: 48px 56px; align-items: flex-start; }
.nx-archive { flex: 999 1 520px; min-width: 0; display: flex; flex-direction: column; scroll-margin-top: 16px; }
.nx-blockhead {
  display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
  border-top: 3px solid var(--ink); padding-top: 14px;
}
.nx-blockhead__h { font: 500 14px/1.3 var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.nx-blockhead__sub { color: var(--t4); font-weight: 400; }
.nx-day { display: flex; flex-wrap: wrap; gap: 10px 24px; padding: 16px 0; border-bottom: 1px solid var(--rule); }
.nx-day__label { flex: 1 1 140px; display: flex; flex-direction: column; gap: 4px; font: 400 12px/1.3 var(--mono); }
.nx-day__name { font-weight: 500; text-transform: uppercase; letter-spacing: .06em; }
.nx-day__count { color: var(--t4); }
.nx-day__items { flex: 999 1 320px; display: flex; flex-direction: column; gap: 14px; }
.nx-day__item { display: flex; flex-direction: column; gap: 5px; }
.nx-day__h { font: 500 19px/1.24 var(--serif); }

.nx-loadmore { margin-top: 24px; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.nx-loadmore__btn { width: 100%; min-height: 48px; color: var(--ink); }
.nx-loadmore__btn:hover { background: var(--ink); color: var(--paper); }
.nx-loadmore__btn[aria-busy="true"] { color: var(--t4); pointer-events: none; }


.nx-side { flex: 1 1 280px; display: flex; flex-direction: column; gap: 40px; }
.nx-sidebox { border-top: 3px solid var(--ink); padding-top: 14px; }
.nx-sidebox > .nx-blockhead__h { margin-bottom: 4px; }
.nx-mr { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 6px; padding: 12px 0; border-bottom: 1px solid var(--rule2); }
.nx-mr__n { font: 400 13px/1.3 var(--mono); color: var(--t4); }
.nx-mr__body { display: flex; flex-direction: column; gap: 5px; align-items: flex-start; }
.nx-mr__h { font: 500 17px/1.25 var(--serif); }
.nx-lr { padding: 14px 0; border-bottom: 1px solid var(--rule2); display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 14px; }
.nx-lr__body { display: flex; flex-direction: column; gap: 5px; }
.nx-lr__label { font: 400 10px/1.4 var(--mono); letter-spacing: .06em; color: var(--t3); }
.nx-lr__sec { text-transform: uppercase; font-weight: 500; color: var(--ink); }
.nx-lr__h { font: 500 18px/1.2 var(--serif); }

/* ----------------------------------------------------------------- footer */
.nx-foot { background: #151619; color: #a9abb0; font: 400 14px/1.5 var(--sans); }
.nx-foot a { color: #f6f4ef; }
.nx-foot a:hover { color: #fff; text-decoration: underline; }
.nx-foot__grid {
  max-width: 1280px; margin: 0 auto; padding: 36px clamp(16px, 4vw, 40px);
  display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 28px;
}
.nx-foot__brand { grid-column: 1 / -1; max-width: 420px; display: flex; flex-direction: column; gap: 10px; }
.nx-foot__col { display: flex; flex-direction: column; gap: 8px; }
.nx-foot__h { font: 400 11px/1.3 var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.nx-foot__bar {
  border-top: 1px solid #2a2c31; padding: 14px clamp(16px, 4vw, 40px);
  display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; font: 400 12px/1.3 var(--mono);
}
.nx-foot__bar a { color: #a9abb0; }
.nx-foot__legal { display: flex; gap: 16px; }

/* ================================================================ 2.0 pages */

.nx-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.nx-u { text-decoration: underline; text-underline-offset: 2px; }
.nx-dim { color: var(--t3); }
.nx-meta--t3 { color: var(--t3); }
.nx-kick {
  display: flex; align-items: center; gap: 8px; margin: 0;
  font: 400 12px/1.3 var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--t3);
}
.nx-kick--ink { color: var(--ink); }
.nx-h1 { font: 500 clamp(44px, 6vw, 64px)/1 var(--serif); }
.nx-h1--topic { font-size: clamp(40px, 5.5vw, 60px); }
.nx-h1--search { font-size: 40px; }
.nx-h1--colo { font-size: clamp(36px, 5vw, 52px); line-height: 1.04; }
.nx-h2 { font: 500 26px/1.2 var(--serif); }

.nx-main--narrow { max-width: 880px; gap: 20px; }
.nx-main--section { gap: 32px; }

/* Header band on section and topic pages */
.nx-band { border-bottom: 1px solid var(--ink); }
.nx-band__in { max-width: 1280px; margin: 0 auto; padding: 32px clamp(16px, 4vw, 40px) 24px; }
.nx-band__in--split {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr));
  gap: 16px 40px; align-items: end;
}
.nx-band__in--topic { max-width: 880px; display: flex; flex-direction: column; gap: 14px; }
.nx-band__title { display: flex; flex-direction: column; gap: 10px; }
.nx-band__desc { font: 400 19px/1.45 var(--serif); color: var(--t2); }

/* Section page */
.nx-lead--section { grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); }
.nx-lead--section .nx-lead__text { gap: 12px; }
.nx-lead__h--section { font-size: clamp(26px, 3vw, 36px); line-height: 1.1; }
.nx-lead__dek--sm { font-size: 18px; }
.nx-secbody { display: flex; flex-wrap: wrap; gap: 24px 48px; align-items: flex-start; }
.nx-rail { flex: 0 0 240px; display: flex; flex-direction: column; }
.nx-rail__h { margin: 0 0 8px; font: 500 12px/1.3 var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.nx-rail__item {
  display: flex; justify-content: space-between; align-items: center; gap: 8px;
  min-height: 36px; padding: 6px 10px; border-left: 3px solid transparent;
  font: 400 14px/1.3 var(--sans); color: var(--ink);
}
.nx-rail__item.is-on { background: var(--sub); font-weight: 600; }
.nx-rail__item--ai.is-on { border-left-color: var(--ai); }
.nx-rail__item--software.is-on { border-left-color: var(--software); }
.nx-rail__item--hardware.is-on { border-left-color: var(--hardware); }
.nx-rail__item--security.is-on { border-left-color: var(--security); }
.nx-rail__n { font: 400 11px/1 var(--mono); color: var(--t4); }
.nx-seclist { flex: 999 1 480px; min-width: 0; display: flex; flex-direction: column; scroll-margin-top: 16px; }
.nx-seclist__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.nx-seclist__tools { display: flex; gap: 14px; align-items: baseline; }

@media (max-width: 759px) {
  /* The rail becomes a row of scrolling chips; the selected one is filled. */
  .nx-rail {
    flex: 1 1 100%; flex-direction: row; gap: 6px; overflow-x: auto; scrollbar-width: none;
    margin: 0 -16px; padding: 0 16px;
  }
  .nx-rail::-webkit-scrollbar { display: none; }
  .nx-rail__h { display: none; }
  .nx-rail__item {
    flex: none; min-height: 44px; padding: 0 14px; border: 1px solid var(--rule3);
    font-size: 13px; font-weight: 500; white-space: nowrap;
  }
  .nx-rail__item.is-on { background: var(--ink); color: var(--paper); border-color: var(--ink); font-weight: 500; }
  .nx-rail__item.is-on .nx-rail__n { color: var(--paper); opacity: .7; }
}

/* Month/day group headers and list rows (section, topic, search) */
.nx-group {
  margin: 22px 0 0; padding-bottom: 8px; border-bottom: 1px solid var(--ink);
  display: flex; justify-content: space-between; gap: 12px;
  font: 500 12px/1.3 var(--mono); text-transform: uppercase; letter-spacing: .08em;
}
.nx-group--light { margin-top: 14px; padding-bottom: 6px; border-bottom-color: var(--rule); }
.nx-group__n { color: var(--t4); font-weight: 400; }
.nx-row {
  display: grid; grid-template-columns: 60px minmax(0, 1fr); gap: 14px;
  padding: 14px 0; border-bottom: 1px solid var(--rule2); align-items: baseline;
}
.nx-row__date { font: 400 12px/1.3 var(--mono); color: var(--t4); }
.nx-row__body { display: flex; flex-direction: column; gap: 5px; }
.nx-row__meta { font: 400 11px/1.3 var(--mono); color: var(--t3); }
.nx-row__h, .nx-hit__h { font: 500 20px/1.22 var(--serif); text-wrap: pretty; }

/* Chips: section filters, "Filed in", topics */
.nx-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.nx-chip {
  min-height: 40px; display: inline-flex; align-items: center; gap: 8px; padding: 0 12px;
  border: 1px solid var(--rule3); font: 500 13px/1.2 var(--sans); color: var(--ink);
}
.nx-chip.is-on { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.nx-chip.is-on:hover { color: var(--paper); }
.nx-chip.is-on .nx-chip__n { color: var(--paper); opacity: .7; }
.nx-chip--ink { border-color: var(--ink); min-height: 36px; }
.nx-chip--sec {
  min-height: 32px; padding: 4px 10px; font: 500 11px/1 var(--mono);
  letter-spacing: .06em; text-transform: uppercase;
}
.nx-chip__n { font: 400 11px/1 var(--mono); color: var(--t4); letter-spacing: 0; }
.nx-filedin { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; font: 400 13px/1.3 var(--sans); color: var(--t3); }
.nx-related { display: flex; flex-direction: column; gap: 10px; margin-top: 36px; }

/* Article */
.nx-progress { position: sticky; top: 0; z-index: 5; height: 3px; background: var(--rule2); }
.nx-progress__bar { height: 100%; background: var(--ink); transform: scaleX(0); transform-origin: 0 50%; }
.nx-crumb { border-bottom: 1px solid var(--rule); }
.nx-crumb__in {
  max-width: 1280px; margin: 0 auto; min-height: 52px; padding: 0 clamp(16px, 4vw, 40px);
  display: flex; align-items: center;
}
.nx-art {
  width: 100%; max-width: 1280px; margin: 0 auto; padding: 40px clamp(16px, 4vw, 40px) 56px;
  display: flex; flex-wrap: wrap; gap: 40px 48px; align-items: flex-start; justify-content: space-between;
}
.nx-art__left {
  flex: 0 0 190px; display: flex; flex-direction: column; gap: 22px;
  font: 400 13px/1.5 var(--sans); position: sticky; top: 20px;
}
.nx-fact { display: flex; flex-direction: column; gap: 2px; }
.nx-fact__k { font: 400 11px/1.4 var(--mono); text-transform: uppercase; letter-spacing: .08em; color: var(--t4); }
.nx-toc { display: flex; flex-direction: column; border-top: 1px solid var(--ink); padding-top: 10px; counter-reset: toc; }
.nx-toc .nx-fact__k { margin-bottom: 4px; }
.nx-toc a { padding: 6px 0 6px 10px; border-left: 2px solid var(--rule); color: var(--t2); counter-increment: toc; }
.nx-toc a::before { content: counter(toc, decimal-leading-zero) "  "; font: 400 11px/1 var(--mono); color: var(--t4); white-space: pre; }
.nx-art__main { flex: 1 1 560px; max-width: 700px; min-width: 0; display: flex; flex-direction: column; gap: 20px; }
.nx-art__h { font: 500 clamp(30px, 4vw, 46px)/1.07 var(--serif); letter-spacing: -.015em; text-wrap: balance; }
.nx-art__dek { font: 400 clamp(18px, 2vw, 22px)/1.4 var(--serif); color: var(--t2); text-wrap: pretty; }
.nx-art__strip {
  display: none; flex-wrap: wrap; gap: 4px 14px; padding: 12px 0;
  border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule);
  font: 400 12px/1.4 var(--mono); color: var(--t3);
}
.nx-art__fig { margin: 4px 0 0; }
.nx-art__cap { margin-top: 8px; font: 400 12px/1.5 var(--mono); color: var(--t4); }
.nx-art__right { flex: 1 1 240px; max-width: 300px; min-width: min(100%, 240px); display: flex; flex-direction: column; gap: 28px; }
.nx-art__foot {
  border-top: 1px solid var(--ink); padding-top: 16px;
  font: 400 14px/1.5 var(--sans); color: var(--t2);
}
.nx-next { margin-top: 12px; border: 1px solid var(--ink); padding: 16px 18px; display: flex; flex-direction: column; gap: 6px; }
.nx-next .nx-kick { font-size: 11px; }
.nx-next__h { font: 500 20px/1.22 var(--serif); }
.nx-corr { border: 1px solid var(--ink); padding: 14px 16px; display: flex; flex-direction: column; gap: 10px; }
.nx-corr__row { display: flex; flex-direction: column; gap: 4px; font: 400 15px/1.5 var(--sans); }
.nx-corr__row p { margin: 0; }

.nx-filed { border: 1px solid var(--ink); display: flex; flex-direction: column; }
.nx-filed__h { padding: 10px 14px; border-bottom: 1px solid var(--ink); font: 400 11px/1.3 var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.nx-filed__row { padding: 12px 14px; display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.nx-filed__row + .nx-filed__row { border-top: 1px solid var(--rule); }
.nx-filed__k { font: 400 10px/1.3 var(--mono); color: var(--t4); text-transform: uppercase; letter-spacing: .08em; }
.nx-filed__v { display: flex; align-items: center; gap: 7px; font: 600 15px/1.3 var(--sans); }
.nx-more { display: flex; flex-direction: column; }
.nx-more__h {
  display: flex; align-items: center; gap: 7px; padding-bottom: 6px; border-bottom: 1px solid var(--ink);
  font: 400 11px/1.3 var(--mono); text-transform: uppercase; letter-spacing: .08em;
}
.nx-more__row { padding: 12px 0; border-bottom: 1px solid var(--rule2); display: flex; flex-direction: column; gap: 4px; }
.nx-more__row .nx-meta { font-size: 11px; }
.nx-more__t { font: 500 17px/1.24 var(--serif); }

@media (max-width: 759px) {
  .nx-art { padding-top: 24px; }
  .nx-art__left { display: none; }
  .nx-art__strip { display: flex; }
}

/* Story body. The HTML comes from the Markdown renderer: leadin spans,
   h2.rule-h with ids, tables in .table-wrap, code, blockquote > cite. */
.nx-prose {
  font: 400 clamp(18px, 1.6vw, 20px)/1.6 var(--serif); color: var(--ink);
  display: flex; flex-direction: column; gap: 18px; padding-top: 8px; counter-reset: h2;
}
.nx-prose > * { margin: 0; }
.nx-prose p { text-wrap: pretty; }
.nx-prose a { text-decoration: underline; text-underline-offset: 2px; }
.nx-prose .leadin { font-variant: small-caps; letter-spacing: .02em; font-weight: 500; }
.nx-prose h2 {
  margin-top: 14px; display: flex; gap: 12px; align-items: baseline; scroll-margin-top: 20px;
  font: 600 21px/1.3 var(--sans); counter-increment: h2;
}
.nx-prose h2::before { content: counter(h2, decimal-leading-zero); font: 400 14px/1 var(--mono); color: var(--t4); }
.nx-prose h3 { font: 600 18px/1.35 var(--sans); }
.nx-prose ul, .nx-prose ol { padding-left: 22px; display: flex; flex-direction: column; gap: 8px; }
.nx-prose blockquote { padding: 4px 0 4px 22px; border-left: 3px solid var(--ink); font-style: italic; color: var(--t2); }
.nx-prose blockquote p { margin: 0; }
.nx-prose blockquote cite { display: block; margin-top: 8px; font: normal 400 12px/1.4 var(--mono); color: var(--t4); }
.nx-prose code {
  font: 400 .82em/1.4 var(--mono); background: var(--sub); padding: 1px 4px; overflow-wrap: anywhere;
}
.nx-prose pre { background: var(--input); border: 1px solid var(--rule); padding: 14px 16px; overflow-x: auto; }
.nx-prose pre code { background: none; padding: 0; font-size: 13px; line-height: 1.6; overflow-wrap: normal; }
.nx-prose .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.nx-prose table { width: 100%; border-collapse: collapse; font: 400 15px/1.45 var(--sans); }
.nx-prose th, .nx-prose td { padding: 9px 12px; border-bottom: 1px solid var(--rule2); text-align: left; vertical-align: top; }
.nx-prose thead th {
  border-bottom: 1px solid var(--ink); font: 500 11px/1.3 var(--mono);
  text-transform: uppercase; letter-spacing: .06em; color: var(--t3);
}
.nx-prose th:first-child, .nx-prose td:first-child { padding-left: 0; }
.nx-prose td[align="right"], .nx-prose th[align="right"] { text-align: right; }
.nx-prose td[align="center"], .nx-prose th[align="center"] { text-align: center; }

/* Search */
.nx-field { display: flex; border: 2px solid var(--ink); background: var(--input); }
.nx-field__in {
  flex: 1; min-width: 0; height: 52px; padding: 0 16px; border: 0; background: transparent;
  font: 400 17px/1 var(--sans); color: var(--ink); outline: none;
}
.nx-field__in::-webkit-search-cancel-button { display: none; }
.nx-field:focus-within { outline: 2px solid var(--ink); outline-offset: 2px; }
.nx-field__x {
  width: 52px; display: flex; align-items: center; justify-content: center;
  border-left: 1px solid var(--rule); font-size: 20px; color: var(--t3);
}
.nx-field__go {
  border: 0; border-left: 1px solid var(--rule); background: var(--ink); color: var(--paper);
  padding: 0 18px; font: 400 13px/1 var(--mono);
}
.nx-search__sum { font: 400 12px/1.4 var(--mono); color: var(--t4); border-bottom: 1px solid var(--ink); padding-bottom: 8px; }
.nx-empty { display: flex; flex-direction: column; gap: 12px; padding: 12px 0; }
.nx-empty__p { font: 400 20px/1.4 var(--serif); }
.nx-hit { padding: 12px 0; border-bottom: 1px solid var(--rule2); display: flex; flex-direction: column; gap: 5px; }
.nx-hit__h { font-size: 19px; line-height: 1.24; }

/* Colophon */
.nx-main--colophon { max-width: 1100px; padding-top: 40px; flex-direction: row; flex-wrap: wrap; gap: 40px 56px; align-items: flex-start; }
.nx-colo { flex: 999 1 520px; min-width: 0; display: flex; flex-direction: column; gap: 18px; }
.nx-colo__lede { font: 400 22px/1.4 var(--serif); color: var(--t2); }
.nx-prose--colo { font-size: 19px; padding-top: 0; counter-reset: none; }
.nx-prose--colo h2 { counter-increment: none; margin-top: 16px; }
.nx-prose--colo h2::before { content: none; }
.nx-log { display: flex; flex-direction: column; font: 400 14px/1.5 var(--sans); }
.nx-log__head, .nx-log__row { display: grid; grid-template-columns: 100px minmax(0, 1fr) 100px; gap: 12px; padding: 10px 0; }
.nx-log__head {
  border-top: 2px solid var(--ink); border-bottom: 1px solid var(--ink); padding: 8px 0;
  font: 400 11px/1.3 var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--t3);
}
.nx-log__row { border-bottom: 1px solid var(--rule2); }
.nx-log__row--none { grid-template-columns: 1fr; color: var(--t3); }
.nx-log__what { display: block; color: var(--t2); }
.nx-colo__side { flex: 1 1 260px; display: flex; flex-direction: column; gap: 20px; }
.nx-pull { margin: 0; border-top: 3px solid var(--ink); padding-top: 16px; font: 500 28px/1.2 var(--serif); }
.nx-pull__src { display: block; margin-top: 10px; font: 400 12px/1.4 var(--mono); color: var(--t4); }
.nx-staff { border: 1px solid var(--ink); display: flex; flex-direction: column; font-size: 14px; }
.nx-staff a { padding: 12px 14px; display: flex; justify-content: space-between; gap: 12px; }
.nx-staff a + a { border-top: 1px solid var(--rule); }
.nx-staff__n { font-weight: 600; }
.nx-btn {
  min-height: 48px; display: flex; align-items: center; justify-content: center;
  border: 1px solid var(--ink); font: 400 13px/1 var(--mono);
}
.nx-btn--fill { background: var(--ink); color: var(--paper); }
.nx-btn--fill:hover { color: var(--paper); opacity: .85; }
@media (max-width: 759px) {
  .nx-log__head, .nx-log__row { grid-template-columns: 84px minmax(0, 1fr); }
  .nx-log__head > :last-child, .nx-log__row > :last-child { display: none; }
  .nx-log__row--none { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

/* ===================================== author, wire, contact, legal, reviews */

.nx-pad { display: block; padding: 10px 0; }
.nx-chips--pad { padding-top: 12px; }
.nx-staff__row { padding: 12px 14px; display: flex; justify-content: space-between; gap: 12px; }
.nx-staff__row + .nx-staff__row { border-top: 1px solid var(--rule); }

/* Author counts */
.nx-counts { display: flex; flex-wrap: wrap; gap: 14px 32px; margin-top: 16px; }
.nx-counts > div { display: flex; flex-direction: column; gap: 4px; }
.nx-counts__n { font: 500 32px/1 var(--serif); }

/* Wire. These row classes are also built by app.js's poll: keep in step. */
.nx-wire { display: flex; flex-direction: column; }
.nx-wire .wire__row {
  display: grid; grid-template-columns: 60px minmax(0, 1fr); gap: 14px; align-items: baseline;
  padding: 12px 0; border-bottom: 1px solid var(--rule2); scroll-margin-top: 16px;
}
.nx-wire .wire__time { font: 400 12px/1.3 var(--mono); color: var(--t4); }
.nx-wire .wire__title { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; font: 500 18px/1.3 var(--serif); }
.nx-wire .wire__row:target { background: var(--sub); }
.nx-wire .wire__row.is-new { animation: nx-in .6s ease-out; }
@keyframes nx-in { from { background: var(--sub); } to { background: transparent; } }

/* Contact form */
.nx-form { display: flex; flex-direction: column; gap: 8px; font-family: var(--sans); }
.nx-form__label { margin-top: 12px; font: 400 11px/1.3 var(--mono); text-transform: uppercase; letter-spacing: .08em; color: var(--t3); }
.nx-form__in {
  width: 100%; min-height: 48px; padding: 10px 14px; border: 1px solid var(--ink); border-radius: 0;
  background: var(--input); color: var(--ink); font: 400 16px/1.4 var(--sans);
}
.nx-form__in:focus { outline: 2px solid var(--ink); outline-offset: 2px; }
.nx-form__ta { min-height: 200px; resize: vertical; }
.nx-form__go { margin-top: 18px; align-self: flex-start; padding: 0 24px; cursor: pointer; }
.nx-error { border-left: 3px solid var(--security); padding: 8px 14px; background: var(--sub); font: 500 15px/1.4 var(--sans); }
.nx-done { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; border-top: 3px solid var(--ink); padding-top: 16px; }

/* Reviews */
.nx-score { font: 500 15px/1 var(--mono); padding: 4px 6px; border: 1px solid var(--ink); vertical-align: middle; }
.nx-score--lg { font-size: 22px; padding: 6px 8px; }
.nx-legend { display: grid; grid-template-columns: max-content 1fr; gap: 8px 14px; margin: 0; padding: 12px 14px; font: 400 13px/1.4 var(--sans); }
.nx-legend dt { font: 500 12px/1.4 var(--mono); }
.nx-legend dd { margin: 0; color: var(--t2); }
.nx-more .nx-legend { padding: 12px 0; }
.nx-measures { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 16px; }
.nx-filed__row .nx-bar { display: grid; grid-template-columns: minmax(0, 1.2fr) 1fr auto; gap: 10px; align-items: center; font: 400 13px/1.3 var(--sans); color: var(--t3); }
.nx-bar--subject { color: var(--ink); font-weight: 600; }
.nx-bar__track { display: block; height: 6px; background: var(--rule2); }
.nx-bar__fill { display: block; height: 100%; background: var(--t5); }
.nx-bar--subject .nx-bar__fill { background: var(--ink); }
.nx-bar__v { font: 400 12px/1 var(--mono); }
.nx-rubric { display: flex; flex-direction: column; font: 400 14px/1.4 var(--sans); }
.nx-rubric__head, .nx-rubric__row { display: grid; grid-template-columns: minmax(0, 1fr) 60px minmax(60px, 160px) 40px; gap: 12px; align-items: center; padding: 10px 0; }
.nx-rubric__head { border-bottom: 1px solid var(--ink); font: 400 11px/1.3 var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--t3); }
.nx-rubric__row { border-bottom: 1px solid var(--rule2); }
.nx-rubric__row .nx-bar__fill { background: var(--ink); }
.nx-rubric__row.is-low .nx-bar__fill { background: var(--security); }
.nx-rubric__s { font: 500 13px/1 var(--mono); text-align: right; }
.nx-verdict__top { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.nx-verdict .nx-filed__row { gap: 8px; font-size: 14px; }
.nx-verdict__list { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 4px; }
.nx-art__main--wide { max-width: 760px; }
.nx-art__strip--always { display: flex; }
.nx-row .nx-score { justify-self: start; }
.nx-band__in--top { align-items: start; }
