/* qipu data design system (19/10): tokens, type scale, layout and components shared by the portal and the graph pages.
   Loaded after site.css and before graph.css. One family (Inter), one monospace for identifiers only.
   Chart colours are validated (dataviz validate_palette.js): one series hue for counts, three hues + neutrals for kinds of record;
   the status colours (passed / not passed) are reserved for outcomes and always carry a mark and a word. */
:root {
  --fs-xs: 12px; --fs-s: 13px; --fs-ui: 14px; --fs-b: 15px; --fs-lead: 17px; --fs-h3: 15px; --fs-h2: 19px; --fs-h1: 34px;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px; --sp-7: 48px;
  --r: 4px; --r-l: 6px; --hd-h: 52px;
  --accent: #2a3680; --accent-wash: #eef0f8; --accent-line: #b9c0e0;
  --chart: #2a3680; --chart-dim: #d3d6de; --chart-sel: rgba(42, 54, 128, .07); --grid: #eceef1; --axis: #b9bec6;
  --c-project: #2a5db0; --c-event: #c4622d; --c-place: #178a62; --c-person: #5c626c; --c-org: #ffffff; --c-gov: #c9ccd2;
  --ok-bg: #e8f1e7; --no-bg: #f7e7e5; --mid-bg: #eff0f2;
  --pop: 0 1px 2px rgba(16, 24, 40, .06), 0 6px 20px rgba(16, 24, 40, .10);
}
:root[data-theme="dark"] {
  --accent: #9fb0ff; --accent-wash: #1c2235; --accent-line: #3b4670;
  --chart: #7088e0; --chart-dim: #343a45; --chart-sel: rgba(112, 136, 224, .10); --grid: #22262d; --axis: #4a505a;
  --c-project: #5b82dc; --c-event: #cf6838; --c-place: #24996f; --c-person: #8c93a0; --c-org: #15181c; --c-gov: #4a505a;
  --ok-bg: #16281a; --no-bg: #2e1a19; --mid-bg: #1d2127;
  --pop: 0 1px 2px rgba(0, 0, 0, .4), 0 8px 24px rgba(0, 0, 0, .45);
}

/* ── type: sentence-case section headings, no shouting labels ─────────────────────────────── */
body { font-size: var(--fs-ui); }
h1 { font-size: var(--fs-h1) !important; line-height: 1.14 !important; font-weight: 650; letter-spacing: -.026em; }
h2 { font-size: var(--fs-h2) !important; font-weight: 600 !important; text-transform: none !important; letter-spacing: -.012em !important;
     color: var(--ink) !important; border-bottom: 0 !important; padding: 0 !important; margin: var(--sp-7) 0 var(--sp-3) !important; line-height: 1.3; }
h2 .n { font-size: var(--fs-s) !important; font-weight: 400; color: var(--ink3); letter-spacing: 0; }
h3 { font-size: var(--fs-h3); font-weight: 600; }
.ds-eyebrow { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; font-size: var(--fs-s); color: var(--ink2); margin: 4px 0 0; }
.ds-eyebrow .k { color: var(--ink); font-weight: 600; }
.ds-eyebrow .id { font: 12px var(--mono); color: var(--ink3); }
.ds-lead { font-size: var(--fs-lead); line-height: 1.55; color: var(--ink); max-width: 68ch; margin: var(--sp-4) 0 0; text-wrap: pretty; }
.ds-meta { font-size: var(--fs-s); color: var(--ink2); }
.ds-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ds-note { font-size: var(--fs-s); color: var(--ink2); line-height: 1.5; max-width: 72ch; }

/* ── record layout: the story column and a quiet side column (identifiers, files, how to cite) ── */
.ds-rec { display: grid; grid-template-columns: minmax(0, 1fr) 272px; gap: 56px; align-items: start; }
.ds-rec > .ds-main { min-width: 0; }
.ds-side { position: sticky; top: calc(var(--hd-h) + 20px); font-size: var(--fs-s); color: var(--ink2); padding-top: 6px; }
.ds-side h3 { font-size: var(--fs-xs); font-weight: 600; color: var(--ink2); margin: 0 0 6px; }
.ds-side section + section { margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--rule); }
.ds-side-l { margin: 14px 0 0; padding-top: 12px; border-top: 1px solid var(--rule2); }
.ds-stats-note { margin-top: 8px; }
.ds-side dl { display: grid; grid-template-columns: auto 1fr; gap: 5px 12px; margin: 0; }
.ds-side dt { color: var(--ink3); } .ds-side dd { margin: 0; color: var(--ink); overflow-wrap: anywhere; }
.ds-side .id { font: 12px var(--mono); }
@media (max-width: 1080px) { .ds-rec { grid-template-columns: minmax(0, 1fr); gap: 0; } .ds-side { position: static; margin-top: var(--sp-7); } }

/* ── key numbers: a plain row of facts, not hero numbers ─────────────────────────────────────── */
.ds-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); margin: var(--sp-5) 0 0; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.ds-stats > div { padding: 12px 16px 12px 0; }
.ds-stats > div + div { padding-left: 16px; border-left: 1px solid var(--rule2); }
.ds-stats .v { display: block; font-size: 22px; font-weight: 600; letter-spacing: -.015em; line-height: 1.2; color: var(--ink); font-variant-numeric: proportional-nums; }
.ds-stats .l { display: block; font-size: var(--fs-s); color: var(--ink2); margin-top: 2px; line-height: 1.35; }
@media (max-width: 600px) { .ds-stats { grid-template-columns: 1fr 1fr; } .ds-stats > div:nth-child(odd) { padding-left: 0; border-left: 0; } .ds-stats > div:nth-child(n+3) { border-top: 1px solid var(--rule2); } }

/* ── controls: segmented choice, toggle chips, quiet buttons ───────────────────────────────── */
.ds-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; padding: 10px 0; }
.ds-filters.sticky { position: sticky; top: var(--hd-h); z-index: 6; background: var(--bg); border-bottom: 1px solid var(--rule); padding: 10px 0; }
.ds-filters .ds-flab { font-size: var(--fs-s); color: var(--ink2); margin-right: -8px; }
.ds-filters .sum { margin-left: auto; font-size: var(--fs-s); color: var(--ink2); white-space: nowrap; }
.ds-filters .sum b { color: var(--ink); font-weight: 600; }
.ds-seg { display: inline-flex; padding: 2px; border: 1px solid var(--rule); border-radius: var(--r-l); background: var(--bg2); }
.ds-seg label { position: relative; cursor: pointer; }
.ds-seg input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.ds-seg span { display: block; padding: 4px 11px; font-size: var(--fs-s); color: var(--ink2); border-radius: 4px; white-space: nowrap; }
.ds-seg label:hover span { color: var(--ink); }
.ds-seg input:checked + span { background: var(--bg); color: var(--ink); font-weight: 600; box-shadow: 0 0 0 1px var(--rule), 0 1px 2px rgba(0, 0, 0, .06); }
.ds-seg input:focus-visible + span { outline: 2px solid var(--focus); outline-offset: 1px; }
.ds-chip { position: relative; display: inline-flex; cursor: pointer; }
.ds-chip input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.ds-chip span { display: inline-flex; align-items: center; gap: 6px; padding: 4px 11px 4px 9px; font-size: var(--fs-s); color: var(--ink2); border: 1px solid var(--rule); border-radius: 999px; background: var(--bg); white-space: nowrap; }
.ds-chip span::before { content: ""; width: 12px; height: 12px; border: 1px solid var(--ink3); border-radius: 3px; box-sizing: border-box; flex: none; }
.ds-chip:hover span { border-color: var(--ink3); color: var(--ink); }
.ds-chip input:checked + span { color: var(--ink); border-color: var(--accent-line); background: var(--accent-wash); }
.ds-chip input:checked + span::before { border-color: var(--accent); background: var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.3 2.3 4.7-5' fill='none' stroke='white' stroke-width='1.8'/%3E%3C/svg%3E") center/10px no-repeat; }
.ds-chip input:focus-visible + span { outline: 2px solid var(--focus); outline-offset: 2px; }
.ds-link { background: none; border: 0; padding: 0; font: inherit; color: var(--link); cursor: pointer; }
.ds-link:hover { color: var(--link-h); text-decoration: underline; text-underline-offset: 3px; }
.ds-btn { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 11px; border: 1px solid var(--rule); border-radius: var(--r); background: var(--bg); color: var(--ink); font: 500 var(--fs-s) var(--ui); cursor: pointer; white-space: nowrap; }
.ds-btn:hover { border-color: var(--ink3); }
.ds-btn[disabled] { opacity: .45; cursor: default; }

/* ── year range: a histogram of decisions per year with a brush and two handles ─────────────── */
.ds-yr { margin: var(--sp-3) 0 0; overflow-x: clip; }
.ds-yr-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; margin-bottom: 6px; }
.ds-yr-head .ds-yt { font-size: var(--fs-b); font-weight: 600; color: var(--ink); }
.ds-yr-head .r { font-size: var(--fs-s); color: var(--ink2); }
.ds-yr-head .r b { color: var(--ink); font-weight: 600; font-variant-numeric: tabular-nums; }
.ds-yr-head .ds-link { font-size: var(--fs-s); }
.ds-yr-plot { position: relative; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.ds-yr svg { display: block; width: 100%; overflow: visible; }
.ds-yr .grid line { stroke: var(--grid); shape-rendering: crispEdges; }
.ds-yr .base { stroke: var(--axis); shape-rendering: crispEdges; }
.ds-yr .ytick, .ds-yr .xtick { font: 11px var(--ui); fill: var(--ink3); font-variant-numeric: tabular-nums; }
.ds-yr .yb { fill: var(--chart-dim); }
.ds-yr .yb.on { fill: var(--chart); }
.ds-yr .yb.hot { fill: var(--ink); }
.ds-yr .sel { fill: var(--chart-sel); }
.ds-yr .edge { stroke: var(--chart); stroke-width: 1; shape-rendering: crispEdges; }
.ds-yr-track { position: relative; height: 28px; margin-top: 2px; }
.ds-yr-track .rail { position: absolute; left: 0; right: 10px; top: 13px; height: 2px; background: var(--rule); border-radius: 1px; }
.ds-yr-track .fill { position: absolute; top: 13px; height: 2px; background: var(--chart); }
.ds-yr-track .h { position: absolute; top: 5px; width: 18px; height: 18px; margin-left: -9px; border-radius: 50%; background: var(--bg); border: 2px solid var(--chart);
                  box-shadow: 0 1px 2px rgba(0, 0, 0, .15); cursor: grab; touch-action: none; }
.ds-yr-track .h:hover { border-width: 3px; }
.ds-yr-track .h:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.ds-yr-track .h::after { content: ""; position: absolute; inset: -12px; }   /* a 42 px touch target */
.ds-yr-tip, .ds-tip { position: fixed; z-index: 60; pointer-events: none; background: var(--bg); color: var(--ink); border: 1px solid var(--rule); border-radius: var(--r);
          box-shadow: var(--pop); padding: 6px 9px; font-size: var(--fs-s); line-height: 1.35; white-space: nowrap; }
.ds-yr-tip b, .ds-tip b { font-weight: 600; font-variant-numeric: tabular-nums; }
.ds-yr-tip span, .ds-tip span { color: var(--ink2); }
.ds-yr .cap { font-size: var(--fs-xs); color: var(--ink3); margin-top: 2px; }
.ds-yr details.tbl { margin-top: 4px; font-size: var(--fs-s); }
.ds-yr details.tbl summary { color: var(--ink2); cursor: pointer; display: inline-block; }
.ds-yr details.tbl table { margin-top: 6px; max-width: 420px; }
.ds-yr .busy { opacity: .55; transition: opacity .15s; }
/* year chart notes (yearRange o.notes): a few named moments above their bars, in the text tokens, each with a hairline leader */
.ds-yr .nt { font: 12.5px var(--ui); fill: var(--ink2); }
.ds-yr .nt .ny { fill: var(--ink); font-weight: 600; font-variant-numeric: tabular-nums; }
.ds-yr .nl { stroke: var(--ink3); stroke-width: 1; shape-rendering: crispEdges; }

/* ── bar list: counts by relation or by kind (horizontal bars, labels in ink) ────────────────── */
.ds-bars { list-style: none; margin: 0; padding: 0; }
.ds-bars li { display: grid; grid-template-columns: minmax(0, 1fr) minmax(80px, 180px) 64px; align-items: center; gap: 12px; padding: 6px 0; border-bottom: 1px solid var(--rule2); font-size: var(--fs-ui); }
.ds-bars .lb { min-width: 0; overflow-wrap: anywhere; }
.ds-bars .lb small { display: block; font-size: var(--fs-xs); color: var(--ink3); }
.ds-bars .bt { height: 8px; background: var(--bg3); border-radius: 0 2px 2px 0; position: relative; }
.ds-bars .bt i { position: absolute; left: 0; top: 0; bottom: 0; background: var(--chart); border-radius: 0 2px 2px 0; min-width: 2px; }
.ds-bars .nv { text-align: right; font-variant-numeric: tabular-nums; color: var(--ink); font-weight: 500; }
@media (max-width: 600px) { .ds-bars li { grid-template-columns: minmax(0, 1fr) 56px; } .ds-bars .bt { grid-column: 1 / -1; grid-row: 2; } }

/* ── outcome badges (status: a mark and a word, never colour alone) and evidence thumbnails ─── */
.ds-badge { display: inline-flex; align-items: center; gap: 4px; padding: 1px 7px 1px 6px; border-radius: 3px; font-size: var(--fs-xs); font-weight: 500; line-height: 1.6; white-space: nowrap; background: var(--mid-bg); color: var(--ink2); }
.ds-badge::before { font-size: 10px; }
.ds-badge.ok { background: var(--ok-bg); color: var(--ok); } .ds-badge.ok::before { content: "✓"; }
.ds-badge.no { background: var(--no-bg); color: var(--no); } .ds-badge.no::before { content: "✕"; }
.ds-badge.mid::before { content: "–"; }
.ds-thumb { display: block; width: 46px; height: 60px; border: 1px solid var(--rule); border-radius: 2px; background: var(--bg2) center/cover no-repeat; flex: none; }
.ds-thumb img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; border-radius: 1px; }
a.ds-thumb:hover { border-color: var(--ink3); }
.ds-ev td { vertical-align: top; }
.ds-ev .t1 { display: block; color: var(--ink); line-height: 1.45; }
.ds-ev .t2 { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin-top: 4px; font-size: var(--fs-xs); color: var(--ink3); }
.ds-ev .ds-dt { white-space: nowrap; font-variant-numeric: tabular-nums; color: var(--ink2); }

/* ── tables: sticky header under the site header, readable rows, a pager ───────────────────── */
.ds-tbl thead th { position: sticky; top: var(--hd-h); z-index: 2; background: var(--bg); box-shadow: inset 0 -1px 0 var(--rule); }
.ds-pager { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; padding: 10px 0 2px; font-size: var(--fs-s); color: var(--ink2); }
.ds-pager .sp { flex: 1; }
.ds-pager b { color: var(--ink); font-weight: 600; font-variant-numeric: tabular-nums; }

/* ── grouped instant search ─────────────────────────────────────────────────────────────── */
.ds-cbx { position: relative; }
.ds-lb { position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 40; background: var(--bg); border: 1px solid var(--rule); border-radius: var(--r-l); box-shadow: var(--pop);
         max-height: min(70vh, 520px); overflow-y: auto; padding: 6px 0; }
.ds-lb[hidden] { display: none; }
.ds-lb .gh { display: flex; justify-content: space-between; padding: 8px 14px 4px; font-size: var(--fs-xs); font-weight: 600; color: var(--ink3); }
.ds-lb .gh span { font-weight: 400; }
.ds-lb [role="option"] { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; padding: 7px 14px; cursor: pointer; color: var(--ink); text-decoration: none; }
.ds-lb [role="option"] .ds-w { grid-column: 1 / -1; font-size: var(--fs-xs); color: var(--ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ds-lb [role="option"] .k { font-size: var(--fs-xs); color: var(--ink3); }
.ds-lb [role="option"][aria-selected="true"], .ds-lb [role="option"]:hover { background: var(--bg2); text-decoration: none; }
.ds-lb [role="option"] mark { background: none; color: inherit; font-weight: 600; }
.ds-lb .all { display: block; padding: 8px 14px; border-top: 1px solid var(--rule2); margin-top: 4px; font-size: var(--fs-s); }
.ds-lb .none { padding: 10px 14px; font-size: var(--fs-s); color: var(--ink2); }

/* results page: groups with a type index on the left (chips on a phone) */
.ds-res { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 40px; margin-top: var(--sp-5); }
.ds-res nav { position: sticky; top: calc(var(--hd-h) + 16px); align-self: start; display: flex; flex-direction: column; font-size: var(--fs-s); }
.ds-res nav a { display: flex; justify-content: space-between; gap: 10px; padding: 5px 10px; border-left: 2px solid var(--rule); color: var(--ink2); }
.ds-res nav a span { color: var(--ink3); font-variant-numeric: tabular-nums; }
.ds-res nav a[aria-current], .ds-res nav a:hover { color: var(--ink); border-left-color: var(--ink); text-decoration: none; }
@media (max-width: 800px) { .ds-res { grid-template-columns: minmax(0, 1fr); gap: 8px; } .ds-res nav { position: static; flex-direction: row; overflow-x: auto; gap: 6px; scrollbar-width: none; }
  .ds-res nav a { border: 1px solid var(--rule); border-radius: 999px; white-space: nowrap; padding: 4px 11px; } }

/* ── phones: nothing wider than the screen ─────────────────────────────────────────────── */
@media (max-width: 700px) {
  :root { --fs-h1: 27px; --fs-h2: 18px; --fs-lead: 16px; }
  .ds-filters { gap: 8px 10px; }
  .ds-filters .sum { margin-left: 0; width: 100%; }
  .ds-seg { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }
@media (forced-colors: active) { .ds-yr .yb.on { fill: CanvasText; } .ds-yr .yb { fill: GrayText; } .ds-bars .bt i { background: CanvasText; } }

/* grouped hits on the results page */
.ds-hg h2 { margin-top: 0 !important; }
.ds-hg + .ds-hg { margin-top: var(--sp-6); }
.ds-hits { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rule); }
.ds-hits li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 16px; padding: 10px 0; border-bottom: 1px solid var(--rule2); }
.ds-hits li[hidden] { display: none; }
.ds-hits a { font-size: var(--fs-b); font-weight: 500; }
.ds-hits .k { font-size: var(--fs-xs); color: var(--ink3); text-align: right; white-space: nowrap; }
.ds-hits .ds-w { grid-column: 1 / -1; font-size: var(--fs-s); color: var(--ink2); }
.ds-hmore { margin-top: 8px; font-size: var(--fs-s); }
.ds-dec { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rule); }
.ds-dec li { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 4px 14px; padding: 10px 0; border-bottom: 1px solid var(--rule2); font-size: var(--fs-ui); }
.ds-dec .ds-dt { color: var(--ink2); font-size: var(--fs-s); font-variant-numeric: tabular-nums; }
.ds-dec .t2 { grid-column: 2; display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: var(--fs-xs); color: var(--ink3); }
@media (max-width: 600px) { .ds-dec li { grid-template-columns: minmax(0, 1fr); } .ds-dec .t2 { grid-column: 1; } }

/* ── portal pages: one look for fields, tables, outcomes and dates (loaded last, after page styles) ── */
th { text-transform: none !important; letter-spacing: 0 !important; font-size: var(--fs-xs) !important; font-weight: 600 !important; color: var(--ink2) !important; }
input[type="text"], input[type="search"], input[type="number"], select, textarea { border-radius: var(--r-l); }
.pl-f input, .pl-f select { height: 34px; border-color: var(--rule) !important; border-radius: var(--r-l) !important; font-family: var(--ui) !important; font-size: var(--fs-ui) !important; }
.pl-f input:focus, .pl-f select:focus, .cx-pick input:focus { outline: 2px solid var(--focus); outline-offset: 1px; border-color: var(--ink3) !important; }
.pl-f label { font-size: var(--fs-xs); color: var(--ink2); }
input[type="checkbox"], input[type="radio"] { accent-color: var(--accent); }
.srch input { border-radius: var(--r-l) 0 0 var(--r-l) !important; } .srch button { border-radius: 0 var(--r-l) var(--r-l) 0 !important; }
/* dates and small tags in the reading face, not the code face */
.pl-t td.c-y, .rt, .tier, td.nw, .grp-y { font-family: var(--ui) !important; font-variant-numeric: tabular-nums; }
.tier { font-size: 11px !important; }
/* outcomes in tables: a mark and a word */
table td span.ok, table td span.no, table td span.pend, .pl-t td.c-o > span, .decades td > span[class=""] {
  display: inline-flex; align-items: center; gap: 4px; padding: 0 7px 0 6px; border-radius: 3px; font-size: var(--fs-xs); font-weight: 500; line-height: 1.7; white-space: nowrap; background: var(--mid-bg); color: var(--ink2); }
table td span.ok { background: var(--ok-bg); color: var(--ok); } table td span.ok::before { content: "✓"; font-size: 10px; }
table td span.no { background: var(--no-bg); color: var(--no); } table td span.no::before { content: "✕"; font-size: 10px; }
table td span.pend::before, .decades td > span[class=""]::before { content: "–"; font-size: 10px; }
/* source links never break */
td a[href*="archive.org/details"], td .lk, td a.scan { white-space: nowrap; }
/* disclosure rows: one chevron for every collapsible list */
.decades summary, details.tech > summary, .pl-sec > summary, .pl-also > summary, details.grp summary { list-style: none; }
.decades summary::-webkit-details-marker, details.tech > summary::-webkit-details-marker { display: none; }
.decades summary::before, details.tech > summary::before { content: ""; display: inline-block; width: 6px; height: 6px; margin: 0 10px 2px 2px; border-right: 1.5px solid var(--ink3); border-bottom: 1.5px solid var(--ink3); transform: rotate(-45deg); transition: transform .15s; }
.decades details[open] > summary::before, details.tech[open] > summary::before { transform: rotate(45deg); }
.decades summary:hover, details.tech > summary:hover { color: var(--link); }
.decades summary { padding: 9px 2px !important; }
/* capped lists: the "25 of 300 shown · Show 50 more · Show all" line */
.capbar { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; font-size: var(--fs-s); color: var(--ink2); padding: 8px 0 0; }
.linkbtn { text-decoration: none !important; font-size: var(--fs-s); } .linkbtn:hover { text-decoration: underline !important; }
input.dfilter { height: 34px; padding: 0 10px; border: 1px solid var(--rule); border-radius: var(--r-l); font: var(--fs-ui) var(--ui); background: var(--field); color: var(--ink); min-width: min(320px, 100%); }
.pl-sum { border: 0 !important; background: var(--bg2); border-radius: var(--r-l); }
.lead { font-size: var(--fs-lead) !important; line-height: 1.55; color: var(--ink); max-width: 68ch; }
/* decision tables (date · summary · outcome · page) stack on a phone: date, outcome and page on one line, the summary under them */
@media (max-width: 700px) {
  table.ds-dl thead, .decades table thead { display: none; }
  table.ds-dl tr, .decades table tr { display: grid; grid-template-columns: auto auto 1fr; gap: 4px 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--rule2); }
  table.ds-dl td, .decades table td { border: 0 !important; padding: 0 !important; }
  table.ds-dl td:nth-child(1), .decades table td:nth-child(1) { font-size: var(--fs-s); color: var(--ink2); }
  table.ds-dl td:nth-child(2), .decades table td:nth-child(2) { grid-column: 1 / -1; grid-row: 2; }
  table.ds-dl td:nth-child(4), .decades table td:nth-child(4) { justify-self: end; font-size: var(--fs-s); }
}
/* the place page's filter row */
.ds-fg { display: inline-flex; align-items: center; gap: 8px; }
.pl-f.ds-filters { align-items: center !important; padding: 12px 0 !important; }
.pl-f.ds-filters > label { flex-direction: row !important; align-items: center; gap: 8px !important; font-size: var(--fs-s) !important; }
.pl-yr { flex: 1 1 100%; }
.pl-yr .ds-yr { margin-top: 4px; }
@media (max-width: 700px) { .ds-fg { flex-wrap: wrap; } .pl-f.ds-filters > label { flex: 1 1 100%; } .pl-f.ds-filters select { flex: 1; } }
/* dated rows (record pages, votes, instrument steps): room for "28 September 1970"; on a phone the date sits above the text */
.rp-rows li { grid-template-columns: 9.5em minmax(0, 1fr) !important; }
.rp-rows .y { font-size: var(--fs-s) !important; }
@media (max-width: 700px) { .rp-rows li { grid-template-columns: minmax(0, 1fr) !important; } }
/* search results: a row of kinds to jump to */
.ds-jump { display: flex; flex-wrap: wrap; gap: 6px; margin: var(--sp-4) 0 0; }
.ds-jump a { display: inline-flex; gap: 6px; align-items: baseline; padding: 4px 11px; border: 1px solid var(--rule); border-radius: 999px; font-size: var(--fs-s); color: var(--ink); }
.ds-jump a span { color: var(--ink3); font-variant-numeric: tabular-nums; }
.ds-jump a:hover { border-color: var(--ink3); text-decoration: none; }
.ds-hg h3 { font-size: var(--fs-b); margin: var(--sp-5) 0 var(--sp-2); }
.ds-hg + .ds-hg { margin-top: var(--sp-3); }
/* code blocks scroll inside themselves, never the page */
pre { max-width: 100%; overflow-x: auto; white-space: pre; }
main pre.mono { background: var(--bg2); border: 1px solid var(--rule); border-radius: var(--r-l); padding: 12px 14px; font-size: 12.5px; line-height: 1.6; }