/* qipu data: graph slice pages. Site tokens only; one colour per kind of record, one style per kind of line. */
:root { --g-org: var(--c-org); --g-gov: var(--c-gov); --g-project: var(--c-project); --g-event: var(--c-event); --g-place: var(--c-place); --g-person: var(--c-person); --g-hub: #dfe1e5; }
:root[data-theme="dark"] { --g-hub: #2a2e35; }
.g-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 360px; border: 1px solid var(--rule); border-radius: var(--r); margin-top: 14px; background: var(--bg); }
.g-bar-unused { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px 22px; align-items: center; padding: 9px 14px; border-bottom: 1px solid var(--rule); font-size: 13px; color: var(--ink2); }
.g-bar label { display: inline-flex; gap: 6px; align-items: center; cursor: pointer; }
.g-canvas { position: relative; min-height: 540px; border-right: 1px solid var(--rule); background: var(--bg2); }
.g-view .g-canvas { min-height: calc(100vh - 270px); }
.g-svg { display: block; width: 100%; height: 100%; position: absolute; inset: 0; }
.g-panel { padding: 14px 16px; font-size: 13px; max-height: 600px; overflow-y: auto; }
.g-view .g-panel { max-height: calc(100vh - 270px); }
.g-panel h3 { font: 600 15px/1.35 var(--ui); margin: 2px 0 8px; }
.g-panel .g-rel { font-weight: 400; color: var(--ink2); }
.g-panel .g-kind { color: var(--ink3); font-size: 12px; }
.g-panel .g-acts { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 6px 0 10px; align-items: center; }
.g-panel table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.g-panel td { padding: 5px 6px 5px 0; border-bottom: 1px solid var(--rule2); vertical-align: top; }
.g-panel td.nw { white-space: nowrap; color: var(--ink2); }
.g-panel p.n { color: var(--ink3); font-size: 12px; margin: 4px 0 8px; }
.g-btn { font: 500 12.5px var(--ui); color: var(--link); background: none; border: 1px solid var(--rule); border-radius: var(--r); padding: 2px 8px; cursor: pointer; }
.g-btn:hover { border-color: var(--link); }
.g-e { stroke: var(--ink3); opacity: .6; stroke-linecap: round; }
.g-loose { stroke-dasharray: 4 3; }
.g-hit { stroke: transparent; stroke-width: 11; }
.g-ln { cursor: pointer; } .g-ln:hover .g-e, .g-ln:focus-visible .g-e { opacity: 1; } .g-ln:focus-visible { outline: none; }
.g-ln.g-sel .g-e { opacity: 1; stroke: var(--link-h); }
.g-n { cursor: pointer; }
.g-n circle, .g-n rect { stroke-width: 1.4; stroke: var(--bg); }
.g-org circle { fill: var(--g-org); stroke: var(--ink); }
.g-gov circle { fill: var(--g-gov); stroke: var(--ink2); }
.g-person circle { fill: var(--g-person); }
.g-project rect { fill: var(--g-project); }
.g-event rect { fill: var(--g-event); }
.g-place circle { fill: var(--g-place); }
.g-hub circle { fill: var(--g-hub); stroke: var(--ink3); }
.g-focus circle, .g-focus rect { stroke: var(--ink); stroke-width: 2.6; }
.g-n:focus-visible { outline: none; } .g-n:focus-visible circle, .g-n:focus-visible rect { stroke: var(--focus); stroke-width: 3; }
.g-l { font: 500 11px var(--ui); fill: var(--ink); paint-order: stroke; stroke: var(--bg2); stroke-width: 3.5px; pointer-events: none; }
.g-lf { font-weight: 600; font-size: 12.5px; }
.g-lh { fill: var(--link-h); }
.g-key { display: flex; flex-wrap: wrap; gap: 5px 16px; font-size: 12px; color: var(--ink2); margin-top: 8px; align-items: center; }
.g-key i { display: inline-block; width: 10px; height: 10px; margin-right: 5px; vertical-align: -1px; border-radius: 50%; border: 1.4px solid transparent; }
.g-key i.k-org { background: var(--g-org); border-color: var(--ink); }
.g-key i.k-gov { background: var(--g-gov); border-color: var(--ink2); }
.g-key i.k-person { background: var(--g-person); }
.g-key i.k-place { background: var(--g-place); }
.g-key i.k-project { background: var(--g-project); border-radius: 0; transform: rotate(45deg) scale(.85); }
.g-key i.k-event { background: var(--g-event); border-radius: 0; transform: rotate(45deg) scale(.85); }
.g-key b { display: inline-block; width: 20px; height: 0; border-top: 2.5px solid var(--ink2); margin-right: 5px; vertical-align: 3px; }
.g-key b.l-moved { border-color: var(--g-person); } .g-key b.l-about { border-color: var(--g-project); opacity: .5; }
.g-key b.l-responds_to { border-color: var(--g-event); } .g-key b.l-located_at { border-color: var(--g-place); }
.g-key b.l-loose { border-top-style: dashed; border-color: var(--ink3); }
.g-key .k-sep { width: 100%; height: 0; }
.g-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.g-note { color: var(--ink2); font-size: 13px; max-width: 760px; margin-top: 8px; }
.amt { text-align: right; white-space: nowrap; }
@media (max-width: 900px) { .g-wrap { grid-template-columns: 1fr; } .g-canvas { border-right: 0; border-bottom: 1px solid var(--rule); min-height: 440px; } .g-panel { max-height: none; } }

/* families of relations: colour and a second cue (arrow or dash) */
/* line families: ink and two hues, each with its own dash or arrow, never the outcome colours */
:root { --f-money: #0b0b0c; --f-contract: #2a5db0; --f-land: #178a62; --f-moved: #545a64; --f-about: #2a3680; --f-place: #178a62; --f-named: #7a808a; }
:root[data-theme="dark"] { --f-money: #ecebe6; --f-contract: #7d9ff0; --f-land: #3fb68a; --f-moved: #a3a9b4; --f-about: #9fb0ff; --f-place: #3fb68a; --f-named: #8c93a0; }
.g-e.f-money { stroke: var(--f-money); opacity: .75; } .g-e.f-contract { stroke: var(--f-contract); opacity: .8; }
.g-e.f-land { stroke: var(--f-land); stroke-dasharray: 8 3 2 3; opacity: .85; } .g-e.f-moved { stroke: var(--f-moved); stroke-dasharray: 2 3; opacity: .85; }
.g-e.f-about { stroke: var(--f-about); opacity: .7; } .g-e.f-place { stroke: var(--f-place); opacity: .6; } .g-e.f-named { stroke: var(--f-named); opacity: .55; stroke-dasharray: 5 4; }
.g-e.g-loose { stroke-dasharray: 3 4; opacity: .45; }
.ar { stroke: none; } .ar-money { fill: var(--f-money); } .ar-contract { fill: var(--f-contract); } .ar-land { fill: var(--f-land); } .ar-moved { fill: var(--f-moved); }
.ar-about { fill: var(--f-about); } .ar-place { fill: var(--f-place); } .ar-named { fill: var(--f-named); }
.g-key b { border-top-width: 2.5px; } .g-key b.l-money { border-color: var(--f-money); } .g-key b.l-contract { border-color: var(--f-contract); }
.g-key b.l-land { border-color: var(--f-land); border-top-style: dashed; } .g-key b.l-moved { border-color: var(--f-moved); border-top-style: dotted; }
.g-key b.l-about { border-color: var(--f-about); opacity: 1; } .g-key b.l-place { border-color: var(--f-place); } .g-key b.l-named { border-color: var(--f-named); border-top-style: dashed; }
.g-key b.l-succ { border-color: var(--ink); border-top-style: double; border-top-width: 3px; }
/* story */
details.grp { border-top: 1px solid var(--rule); } details.grp:last-of-type { border-bottom: 1px solid var(--rule); }
details.grp summary { display: grid; grid-template-columns: minmax(0, 1fr) 90px 110px; gap: 12px; padding: 10px 0; cursor: pointer; list-style: none; font-size: 14px; }
details.grp summary::-webkit-details-marker { display: none; } details.grp summary::before { content: "▸"; position: absolute; margin-left: -16px; color: var(--ink3); }
details.grp[open] summary::before { content: "▾"; } .grp-t { font-weight: 600; } .grp-n { text-align: right; font-variant-numeric: tabular-nums; } .grp-y { color: var(--ink3); font-family: var(--mono); font-size: 12px; }
details.grp > *:not(summary) { margin-bottom: 14px; } .grp-who { font-size: 13px; color: var(--ink2); }
table.dec td, table.cp td { font-size: 13px; vertical-align: top; } .cp-x td { background: var(--bg2); padding: 6px 10px; }
.tier { display: inline-block; font-size: 11px; line-height: 1; padding: 3px 6px; border-radius: 3px; border: 1px solid var(--rule); color: var(--ink2); white-space: nowrap; }
.tier.tR { border-color: var(--ink3); } .tier.tM { border-style: dashed; } .tier.tV { border-color: var(--ok); color: var(--ok); }
.tiers-line { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 13px; margin-top: 10px; }
p.tiers { margin-top: 18px; font-size: 13px; color: var(--ink2); max-width: 820px; }
ul.succ { margin: 0 0 12px 18px; padding: 0; font-size: 13.5px; } ul.succ li { margin: 4px 0; }
.scan-tip { position: absolute; z-index: 60; width: 270px; padding: 5px; background: var(--bg); border: 1px solid var(--rule); border-radius: var(--r); box-shadow: 0 4px 18px rgba(0,0,0,.12); display: none; pointer-events: none; }
.scan-tip.on { display: block; } .scan-tip img { display: block; width: 260px; min-height: 120px; background: var(--bg3); } .scan-tip span { display: block; font-size: 11px; color: var(--ink3); margin-top: 4px; }
.vh { position: absolute; left: 0; top: 0; display: block; width: 1px; height: 1px; max-width: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.g-none { margin-top: 10px; }
.g-wrap { grid-template-columns: minmax(0, 1fr) 360px; } .g-canvas { min-height: 520px; }
.cx-pick { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; margin: 18px 0 6px; font-size: 13.5px; }
.cx-pick label { display: inline-flex; gap: 8px; align-items: center; } .cx-pick input { font: inherit; padding: 6px 8px; width: 340px; max-width: 80vw; border: 1px solid var(--field-rule); border-radius: var(--r); background: var(--field); color: var(--ink); }
.cx-out h2 { margin-top: 26px; }

tr.sub td { background: var(--bg2); color: var(--ink3); font-size: 12px; padding: 6px 8px; }
.tier-key { display: flex; gap: 6px 10px; flex-wrap: wrap; align-items: center; font-size: 12px; color: var(--ink3); margin: 6px 0 4px; }
.tier[title] { cursor: help; }

/* growth + UX pass 19/10 (data agent): finder, pager, year rows, list tabs, unconfirmed tag; the design agent restyles these */
.finder{position:relative;max-width:560px;margin:14px 0 22px}
.finder input{width:100%;box-sizing:border-box;font:inherit;font-size:16px;padding:10px 12px;border:1px solid currentColor;border-radius:4px;background:transparent;color:inherit}
.finder-list{position:absolute;z-index:20;left:0;right:0;top:100%;margin:2px 0 0;padding:0;list-style:none;background:var(--bg,#fff);border:1px solid #8888;border-radius:4px;box-shadow:0 6px 18px #0002;max-height:70vh;overflow:auto}
.finder-list li a{display:block;padding:9px 12px;text-decoration:none;min-height:24px}
.finder-list li[aria-selected=true] a,.finder-list li a:hover{background:#8881}
.finder-list .f-n{font-weight:500}
.pager{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:8px 0 14px}
.pager .g-btn,nav.pager a.g-btn{min-height:36px;padding:6px 12px}
table.dec tr.yr th{text-align:left;font-weight:600;padding-top:14px;font-size:13px;letter-spacing:.02em}
.tag-unconf{display:inline-block;font-size:12px;padding:0 6px;border:1px dashed #8889;border-radius:3px;margin-left:4px;cursor:help}
ul.start{padding-left:18px}ul.start li{margin:6px 0}
.all-kinds{display:flex;flex-wrap:wrap;gap:6px 14px;margin:6px 0 10px}
.all-kinds a{padding:6px 2px;text-decoration:none;border-bottom:2px solid transparent}
.all-kinds a[aria-selected=true]{border-bottom-color:currentColor;font-weight:600}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (max-width:700px){
  .st-filters{display:flex;flex-wrap:wrap;gap:4px 12px}
  .st-filters label{min-height:36px;display:inline-flex;align-items:center}
  table.dec thead{display:none}
  table.dec tr:not(.yr):not(.sub){display:grid;grid-template-columns:auto 1fr;gap:2px 10px;padding:8px 0;border-bottom:1px solid #8883}
  table.dec td{display:block;border:0;padding:0}
  table.dec td:nth-child(2){grid-column:1/-1}
  .g-wrap,.g-key,.g-note,.g-head{display:none}
}
.how{margin-top:22px;max-width:760px}
details.rec-details{margin:10px 0 28px}details.rec-details summary{cursor:pointer;color:var(--muted,#666)}
code.idv{font-size:12px;color:var(--muted,#666);user-select:all}
/* ── design system pass (19/10): story layout on ds.css tokens ─────────────────────────── */
.st .ds-filters.sticky { margin-top: var(--sp-5); }
.tl-chart { margin: var(--sp-4) 0 0; }
.tl-chart.tl-s .ds-yr-plot { max-width: 100%; }
/* connected to: one row per relation, a bar for its share */
details.grp summary { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(60px, 160px) 64px 92px 84px; gap: 14px; align-items: center; padding: 11px 0 11px 18px; }
details.grp summary::before { position: absolute; left: 0; top: 11px; margin: 0; font-size: 11px; }
details.grp summary:hover .grp-t { color: var(--link); }
details.grp summary:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.grp-bar { display: block; height: 8px; background: var(--bg3); border-radius: 0 2px 2px 0; position: relative; }
.grp-bar i { position: absolute; left: 0; top: 0; bottom: 0; min-width: 2px; background: var(--chart); border-radius: 0 2px 2px 0; }
.grp-n { font-weight: 600; }
.grp-y { font-family: var(--ui) !important; font-size: var(--fs-s) !important; color: var(--ink2) !important; font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.grp-p { text-align: right; font-size: var(--fs-xs); color: var(--ink2); white-space: nowrap; }
details.grp > *:not(summary) { margin-left: 18px; }
.grp-who { margin: 0 0 8px; }
table.cp td { padding: 7px 12px 7px 0 !important; vertical-align: middle; }
table.cp td.cp-b { width: 28%; min-width: 80px; }
table.cp .g-btn { min-width: 52px; text-align: right; font-variant-numeric: tabular-nums; }
/* the evidence: date, the page itself, the decision */
table.ds-ev { table-layout: auto; }
table.ds-ev td.ds-dt { width: 96px; font-size: var(--fs-s); }
table.ds-ev td.th { width: 58px; padding-right: 12px !important; }
table.ds-ev .t2 a { font-size: var(--fs-xs); }
table.ds-ev tbody tr:hover td { background: none; }
.pager { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; padding: 10px 0 2px; font-size: var(--fs-s); color: var(--ink2); }
tr.yr th { position: static; text-align: left; font-size: var(--fs-s) !important; text-transform: none !important; letter-spacing: 0 !important; color: var(--ink) !important; padding: 14px 0 6px !important; }
/* tiers: quiet chips */
.tier { font-size: 11px; padding: 2px 6px; background: var(--bg); }
.ds-side .tiers { margin: 6px 0 0; font-size: var(--fs-s); color: var(--ink2); line-height: 1.5; }
.ds-side p { margin: 4px 0; }
/* the map: secondary, with its own toggles in its heading */
.g-head { align-items: center; margin-top: var(--sp-7); }
.g-head h2 { margin: 0 !important; }
.g-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-left: auto; }
.g-open { font-size: var(--fs-s); }
.g-wrap { border-radius: var(--r-l); overflow: hidden; }
details.tech { margin-top: var(--sp-7); border-top: 1px solid var(--rule); padding-top: 12px; }
details.tech summary { cursor: pointer; font-weight: 600; font-size: var(--fs-b); }
details.tech .kv { margin-top: 12px; }
.cx-pick input { width: min(340px, 100%); }
@media (max-width: 700px) {
  details.grp summary { grid-template-columns: minmax(0, 1fr) 56px; row-gap: 6px; }
  .grp-bar { grid-column: 1 / -1; grid-row: 2; } .grp-y, .grp-p { display: none; }
  table.cp td.cp-b { display: none; }
  table.ds-ev thead { display: none; }
  table.ds-ev tr, table.dec.ds-ev tr:not(.yr):not(.sub) { display: grid; grid-template-columns: 58px minmax(0, 1fr); column-gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--rule2); }
  table.ds-ev td { border: 0 !important; padding: 0 !important; width: auto !important; }
  table.ds-ev td.ds-dt { grid-column: 2; grid-row: 1; color: var(--ink2); }
  table.ds-ev td.th { grid-column: 1; grid-row: 1 / span 2; }
  table.ds-ev td:last-child { grid-column: 2; }
  table.ds-ev tr.sub { display: block; }
  .g-chips { margin-left: 0; width: 100%; }
  .g-canvas { min-height: 360px; } .g-panel { max-height: 420px; }
  .cx-pick label { width: 100%; } .cx-pick input { width: 100%; max-width: none; }
}
.g-canvas { overflow: hidden; } .g-svg { overflow: hidden; }
table tr[hidden] { display: none !important; }
@media (max-width: 700px) {
  table.cx-dec thead { display: none; }
  table.cx-dec tr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 2px 12px; padding: 10px 0; border-bottom: 1px solid var(--rule2); }
  table.cx-dec td { border: 0 !important; padding: 0 !important; text-align: left !important; }
  table.cx-dec td:nth-child(2) { grid-column: 1 / -1; grid-row: 2; }
  table.cx-dec td:nth-child(1) { color: var(--ink2); }
  table.cx-dec td:nth-child(3), table.cx-dec td:nth-child(4) { font-size: var(--fs-xs); color: var(--ink2); }
}

/* ── design pass on the 19/10 growth pages (finder, list tabs, pager, tags, record details) ── */
.finder input { font: var(--fs-b) var(--ui); height: 44px; padding: 0 14px; border: 1px solid var(--field-rule); border-radius: var(--r-l); background: var(--field); }
.finder input:focus { outline: 2px solid var(--focus); outline-offset: 1px; border-color: var(--ink3); }
.finder-list { background: var(--bg); border: 1px solid var(--rule); border-radius: var(--r-l); box-shadow: var(--pop); padding: 6px 0; margin-top: 4px; }
.finder-list li a { padding: 8px 14px; color: var(--ink); }
.finder-list li[aria-selected=true] a, .finder-list li a:hover { background: var(--bg2); text-decoration: none; }
.pager { font-size: var(--fs-s); color: var(--ink2); }
.pager .g-btn, nav.pager a.g-btn { min-height: 32px; padding: 0 12px; display: inline-flex; align-items: center; border: 1px solid var(--rule); border-radius: var(--r); color: var(--ink); background: var(--bg); font: 500 var(--fs-s) var(--ui); }
.pager .g-btn:hover, nav.pager a.g-btn:hover { border-color: var(--ink3); text-decoration: none; }
.all-kinds { gap: 6px; margin: 10px 0 16px; }
.all-kinds a { padding: 4px 12px; border: 1px solid var(--rule); border-radius: 999px; font-size: var(--fs-s); color: var(--ink2); }
.all-kinds a:hover { color: var(--ink); border-color: var(--ink3); text-decoration: none; }
.all-kinds a[aria-selected=true] { color: var(--ink); background: var(--accent-wash); border-color: var(--accent-line); font-weight: 600; }
.tag-unconf { font-size: 11px; color: var(--ink3); border: 1px dashed var(--rule); padding: 0 6px; }
.how { font-size: var(--fs-s); color: var(--ink2); }
details.rec-details { margin-top: var(--sp-6); border-top: 1px solid var(--rule); padding-top: 10px; }
details.rec-details summary { font-weight: 600; color: var(--ink); }
code.idv { font: 12px var(--mono); color: var(--ink2); }
.g-law path, .g-law rect { fill: var(--c-person); }

/* ── the top of a record page, readable from the back of a room (19/10, for the talk): name, one sentence, key numbers, the year chart across the page ── */
.st-hero { margin-bottom: var(--sp-3); }
.st-hero .ds-eyebrow { font-size: 15px; margin-top: 8px; }
.st-hero h1 { font-size: 44px !important; letter-spacing: -.03em; margin: 4px 0 0 !important; max-width: none !important; text-wrap: wrap; }
.st-hero .ds-lead { font-size: 21px; line-height: 1.45; max-width: 62ch; margin-top: 12px; }
.st-hero .ds-stats { margin-top: 22px; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.st-hero .ds-stats > div { padding: 14px 20px 14px 0; }
.st-hero .ds-stats > div + div { padding-left: 20px; }
.st-hero .ds-stats .v { font-size: 36px; letter-spacing: -.022em; line-height: 1.1; }
.st-hero .ds-stats .l { font-size: 14px; margin-top: 5px; }
.st-hero .ds-stats-note { font-size: 14px; }
.tl-hero { margin-top: var(--sp-5); }
.tl-hero .ds-yr-head .ds-yt { font-size: 17px; }
.tl-hero .ds-yr-head .r { font-size: 14px; }
.tl-hero .xtick, .tl-hero .ytick { font-size: 13px !important; }
.tl-hero .nt { font-size: 14.5px; }
.tl-hero .cap { font-size: 13px; }
.st-hero + .ds-rec .ds-filters.sticky { margin-top: var(--sp-4); }
@media (max-width: 700px) {
  .st-hero h1 { font-size: 30px !important; }
  .st-hero .ds-lead { font-size: 17px; }
  .st-hero .ds-stats { grid-template-columns: 1fr 1fr; }
  .st-hero .ds-stats > div { padding: 12px 12px 12px 0; }
  .st-hero .ds-stats > div:nth-child(even) { padding-left: 14px; }
  .st-hero .ds-stats > div:nth-child(odd) { padding-left: 0; border-left: 0; }
  .st-hero .ds-stats .v { font-size: 26px; }
  .st-hero .ds-stats .l { font-size: 13px; }
  .tl-hero .nt { font-size: 12px; }
  .tl-hero .xtick, .tl-hero .ytick { font-size: 11px !important; }
}

/* Connected to, at a glance: companies across the column, then agencies and supervisors side by side */
.st-glance { margin-top: var(--sp-2); }
.gl { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 4px 40px; }
.gl-col:first-child { grid-column: 1 / -1; }
.gl-col h3 { font-size: 15px; font-weight: 600; color: var(--ink); margin: 14px 0 4px; }
.gl-col h3 span { font-weight: 400; color: var(--ink3); font-size: 13px; margin-left: 4px; }
.gl .ds-bars li { font-size: 15px; padding: 7px 0; }
.gl .ds-bars .lb small { font-size: 12.5px; color: var(--ink2); }
.gl .ds-bars .bt { height: 10px; }
.gl-col + .gl-col .ds-bars li { grid-template-columns: minmax(0, 1fr) minmax(48px, 96px) 40px; gap: 10px; }
.gl-n { font-size: 13px; color: var(--ink3); margin-top: 10px; }

/* key decisions, each with its printed page large */
.pk-list { list-style: none; margin: 10px 0 0; padding: 0; }
.pk-list li { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 22px; padding: 16px 0; border-top: 1px solid var(--rule2); }
.pk-list li:first-child { border-top-color: var(--rule); }
.pk-th { display: block; width: 120px; height: 160px; border: 1px solid var(--rule); border-radius: 2px; background: var(--bg2); overflow: hidden; }
.pk-th img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top; }
a.pk-th:hover { border-color: var(--ink3); }
.pk-d { display: block; font-size: 14px; font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; }
.pk-s { display: block; font-size: 18px; line-height: 1.42; color: var(--ink); margin-top: 4px; text-wrap: pretty; text-decoration: none; }
.pk-s:hover { color: var(--link); text-decoration: underline; }
.pk-tx .t2 { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; margin-top: 10px; font-size: 13px; color: var(--ink3); }
@media (max-width: 600px) {
  .pk-list li { grid-template-columns: 84px minmax(0, 1fr); gap: 14px; }
  .pk-th { width: 84px; height: 112px; }
  .pk-s { font-size: 16px; }
}

/* from the Internet Archive: a few items about the place, each with its image */
.ar-list { list-style: none; margin: 14px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 22px 20px; }
.ar-list a { display: flex; flex-direction: column; color: var(--ink); text-decoration: none; }
.ar-im { display: block; aspect-ratio: 4 / 3; background: var(--bg2); border: 1px solid var(--rule); border-radius: 2px; overflow: hidden; }
.ar-im img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 22%; }
.ar-list a:hover .ar-im { border-color: var(--ink3); }
.ar-list a:hover .ar-t { color: var(--link); text-decoration: underline; }
.ar-k { font-size: 12.5px; color: var(--ink2); margin-top: 9px; font-variant-numeric: tabular-nums; }
.ar-t { font-size: 15px; font-weight: 600; line-height: 1.35; margin-top: 2px; }
.ar-q { font-size: 13px; color: var(--ink2); line-height: 1.4; margin-top: 4px; }
.ar-h { font-size: 12px; color: var(--ink3); margin-top: 5px; }
@media (max-width: 600px) { .ar-list { grid-template-columns: 1fr 1fr; gap: 16px 12px; } }
/* 19/10 simplification: the map waits behind one button; one decisions list by decade */
.g-mapbox { margin: 28px 0 8px; }
.g-mapbox > summary { display: inline-block; cursor: pointer; list-style: none; }
.g-mapbox > summary::-webkit-details-marker { display: none; }
.g-mapbox[open] > summary { margin-bottom: 10px; }
.dec-dec > summary { cursor: pointer; }
.dec-dec > summary { display: flex; gap: 14px; align-items: baseline; }
.dec-dec > summary .grp-n { white-space: nowrap; color: var(--ink2); }
/* talk 21/10: "By kind" rows under Who was involved, closed */
.st-kinds { margin: 26px 0 8px; } .kd-h { font-size: 15px; margin: 0 0 6px; } .kd-h span { font-weight: 400; color: var(--ink2); margin-left: 8px; font-size: var(--fs-s); }
.st-kinds details.grp:last-of-type { border-bottom: 1px solid var(--rule); } .st-kinds .ds-bars { margin: 2px 0 14px 18px; max-width: 640px; }
.kd-more > div { margin-left: 18px; } .kd-sub { font-weight: 400; color: var(--ink2); margin-left: 8px; }
/* talk 21/10: the graph itself in the sticky side column */
.ds-rec.has-mini { grid-template-columns: minmax(0, 1fr) 340px; gap: 44px; }
.st-mini { margin: 0 0 18px; padding-bottom: 14px; border-bottom: 1px solid var(--rule); } .st-mini h3 { margin: 0 0 2px; }
.g-mini { display: block; width: 100%; height: auto; overflow: visible; } .g-mini a { text-decoration: none; }
.g-lm { font-size: 12.5px; font-weight: 500; } .g-mini .g-lf { font-size: 14px; font-weight: 650; }
.st-mini-n { font-size: var(--fs-xs); color: var(--ink2); margin: 2px 0 0 !important; line-height: 1.4; }
@media (max-width: 900px) { .ds-rec.has-mini { grid-template-columns: minmax(0, 1fr); } .st-mini { max-width: 360px; } }
.g-svg.g-mini { position: static; height: auto; aspect-ratio: 340 / 440; margin-top: 4px; }
.st-mini h3 { font-size: 14px; color: var(--ink); }
.g-mini .g-lm { font-size: 14px; } .g-mini .g-lf { font-size: 16px; }
.g-mini line, .g-mini .g-n, .g-mini text { transition: opacity .2s, stroke .2s; }
.g-hl-on line:not(.g-hl), .g-hl-on .g-n:not(.g-hl):not(.g-focus), .g-hl-on .g-lm:not(.g-hl):not(.g-lf) { opacity: .18; }
.g-mini line.g-hl { stroke: var(--link-h, #1a3fd6); opacity: 1; } .g-mini .g-n.g-hl circle, .g-mini .g-n.g-hl rect { stroke: var(--ink); stroke-width: 3; } .g-mini text.g-hl { font-weight: 700; }
