/* ════════════════════════════════════════════════════════════════
   The actors in AI alignment — site styles
   Designed for a 13–14" laptop: sidebar 240px, content ~900–1000px.
   ════════════════════════════════════════════════════════════════ */

/* ── Self-hosted fonts (shared with the Censorship & moderation site) ──
   Body prose: Adobe Caslon Pro. Headings / sidebar / UI: Test National. */
@font-face { font-family: "ACaslon Pro"; src: url("fonts/ACaslonPro-Regular.otf") format("opentype");
  font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "ACaslon Pro"; src: url("fonts/ACaslonPro-Italic.otf") format("opentype");
  font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "ACaslon Pro"; src: url("fonts/ACaslonPro-Semibold.otf") format("opentype");
  font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "ACaslon Pro"; src: url("fonts/ACaslonPro-SemiboldItalic.otf") format("opentype");
  font-weight: 600; font-style: italic; font-display: swap; }
@font-face { font-family: "ACaslon Pro"; src: url("fonts/ACaslonPro-Bold.otf") format("opentype");
  font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "ACaslon Pro"; src: url("fonts/ACaslonPro-BoldItalic.otf") format("opentype");
  font-weight: 700; font-style: italic; font-display: swap; }
@font-face { font-family: "Test National"; src: url("fonts/TestNational-Regular.otf") format("opentype");
  font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Test National"; src: url("fonts/TestNational-BookItalic.otf") format("opentype");
  font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Test National"; src: url("fonts/TestNational-Semibold.otf") format("opentype");
  font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Test National"; src: url("fonts/TestNational-Semibold.otf") format("opentype");
  font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Test National Medium"; src: url("fonts/TestNational-Medium.otf") format("opentype");
  font-weight: 500; font-style: normal; font-display: swap; }

:root {
  /* Editorial palette — paper-style, warm. */
  --ink:        #1c1a18;
  --paper:      #fbf8f2;
  --paper-alt:  #f5efe5;   /* sidebar — lightened, same warm tone as the page */
  --muted:      #6c655c;
  --border:     #d5cdbf;
  --rule:       #b3a999;

  --accent:     #c0431f;  /* "you are here" + active states */

  /* Actor-type palette — vibrant but not strenuous.            */
  /* (matches the order in docs/data.json actor_types)          */
  --c-internal:                       #7585BE;
  --c-private:                        #80C2CA;
  --c-academic:                       #EFCE44;
  --c-research-institute:             #ECB280;
  --c-governmental:                   #8EDE78;
  --c-nonprofit:                      #ADD672;
  --c-public:                         #53B3AD;
  --c-public-consultation:            #53B3AD;   /* merged with public */
  --c-ai-company:                     #6DA5D8;
  --c-industry-consortium:            #BECF54;
  --c-public-benefit-corporation:     #9193C4;
  --c-public-deliberation-platform:   #4146C3;
  --c-multiple:                       #E69FC1;
  --c-other:                          #BABABA;
  --c-unknown:                        #BABABA;

  --ink-soft:   #3c3934;
  --page:       #faf7f0;   /* very light warm off-white — same tone as the sidebar */
  --dim:      0.10;
  --sb-w:     230px;
  --right-w:  280px;
  --rail-w:   0px;

  --serif:    "ACaslon Pro", "Adobe Caslon Pro", "Iowan Old Style", "EB Garamond", Garamond, Georgia, "Times New Roman", serif;
  --sans:     "Test National", "Helvetica Neue", Inter, "Segoe UI", Arial, sans-serif;
  --mono:     ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
html { background: var(--page); }
body {
  font-family: var(--serif);
  color: var(--ink);
  background: var(--page);             /* very light off-white page */
  font-size: 15px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { color: inherit; }
button { font: inherit; cursor: pointer; }

/* Sans-serif (Test National) for chrome: sidebar, headings, table/figure UI. */
.brand h1, .masthead-title,
.prose h2, .prose h3, .prose h4,
.side-nav, .side-block h4, .block-head h3, .block-sub,
.sidebar, .company-list, .legend-chip,
.stacks-controls, .stack-legend {
  font-family: var(--sans);
}
/* Prose stays in the serif. */
.prose, .prose p, .prose li, .lede, .block-caption { font-family: var(--serif); }

/* ─────────────────────────── Sidebars ─────────────────────────── */
.sidebar {
  position: fixed; top: 0; bottom: 0;
  padding: 1.5rem 1.2rem;
  background: var(--paper-alt);
  overflow-y: auto;
  font-size: 13px;
}
/* Left rail — document navigation only. */
.sidebar-left {
  left: 0; width: var(--sb-w);
  border-right: 1px solid var(--border);
}
/* Right rail — search, figure keys, filters, companies. */
.sidebar-right {
  right: 0; width: var(--right-w);
  border-left: 1px solid var(--border);
}
.brand h1 {
  font-size: 1.05rem; font-weight: 700; margin: 0 0 0.35em 0;
  letter-spacing: 0.01em; line-height: 1.2;
}
.brand-sub {
  font-size: 11.5px; color: var(--muted); margin: 0 0 1.4rem 0;
  font-style: italic;
}

.side-nav { display: flex; flex-direction: column; margin-bottom: 1.6rem; }
.side-nav > a {
  text-decoration: none; padding: 0.25em 0;
  font-style: italic; color: var(--muted);
  border-left: 2px solid transparent; padding-left: 0.6rem; margin-left: -0.6rem;
}
.side-nav > a.active {
  color: var(--ink); border-left-color: var(--accent); font-style: normal;
  font-weight: 600;
}
.side-nav .sub-nav {
  list-style: none; padding: 0; margin: 0.1rem 0 0.1rem 0.8rem;
  font-size: 12px;
}
.side-nav .sub-nav a {
  display: block; text-decoration: none; padding: 0.18em 0;
  color: var(--muted);
  border-left: 2px solid transparent; padding-left: 0.6rem; margin-left: -0.6rem;
}
.side-nav .sub-nav a.active {
  color: var(--ink); border-left-color: var(--accent); font-weight: 600;
}

.side-toggle { display: flex; align-items: center; gap: 0.45em;
               font-size: 12px; cursor: pointer; padding: 0.2em 0; }
.side-toggle input { margin: 0; }

.side-block { margin-bottom: 1.6rem; }
.side-block h4 {
  font-size: 11px; font-weight: 700; letter-spacing: 0.10em;
  text-transform: uppercase; color: var(--muted);
  margin: 0 0 0.6rem 0; padding-bottom: 0.35rem;
  border-bottom: 1px solid var(--rule);
}

/* Legend */
.legend { display: flex; flex-direction: column; gap: 0.25em; }
.legend-chip {
  display: flex; align-items: center; gap: 0.55em;
  font-size: 12px; cursor: pointer; user-select: none;
  padding: 0.15em 0.25em; border-radius: 2px;
}
.legend-chip:hover { background: rgba(0,0,0,0.04); }
.legend-chip.active { background: var(--ink); color: var(--paper); }
.legend-chip.active .swatch { outline: 1px solid var(--paper); }
.legend-chip .chip-mode {
  margin-left: auto; padding-left: 0.6em;
  font-size: 9.5px; letter-spacing: 0.06em; font-weight: 700;
  color: var(--paper);
}
.legend-chip:not(.active) .chip-mode { display: none; }
.legend-chip .swatch {
  width: 12px; height: 12px; border: 1px solid var(--border); border-radius: 2px;
  flex: 0 0 12px;
}

/* Filters — dropdown multiselect via <details> */
.filters .filter-dd { margin-bottom: 0.35em; border: 1px solid var(--border); border-radius: 3px; background: var(--paper); }
.filters summary {
  list-style: none; cursor: pointer;
  padding: 0.3em 0.5em; font-size: 12px;
}
.filters summary::-webkit-details-marker { display: none; }
.filters summary::after { content: " ▾"; color: var(--muted); }
.filters details[open] summary::after { content: " ▴"; }
.filters .multi {
  max-height: 160px; overflow-y: auto;
  border-top: 1px solid var(--border);
  padding: 0.35em 0.5em; font-size: 12px;
}
.filters .multi label {
  display: flex; align-items: center; gap: 0.4em;
  padding: 0.1em 0; cursor: pointer;
}
.filters .multi input { margin: 0; }
.filters button#reset-filters {
  width: 100%; margin-top: 0.5em; padding: 0.35em 0.5em;
  background: var(--paper); border: 1px solid var(--border); border-radius: 3px;
  font-size: 12px;
}
.filters button#reset-filters:hover { background: var(--ink); color: var(--paper); }

/* Companies list */
.company-list { list-style: none; padding: 0; margin: 0; font-size: 12px; }
.company-list li {
  display: flex; align-items: center; gap: 0.5em;
  padding: 0.22em 0.4em; border-radius: 2px; cursor: pointer; user-select: none;
}
/* Explicit checkbox affordance so it's clear companies can be selected. */
.company-list li::before {
  content: ""; flex: 0 0 12px; width: 12px; height: 12px;
  border: 1px solid var(--rule); border-radius: 2px; background: #fff;
}
.company-list li.active::before {
  background: var(--accent); border-color: var(--accent);
  /* white check mark */
  background-image: 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 2 4.8-5' fill='none' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: 12px 12px; background-repeat: no-repeat; background-position: center;
}
.company-list li:hover { background: rgba(0,0,0,0.04); }
.company-list li.active { color: var(--ink); font-weight: 600; }
.company-list li .ct { color: var(--muted); font-size: 10.5px; margin-left: auto; }
.side-hint-companies { margin: 0 0 0.5rem; }

/* (Progress rail removed) */
.progress-rail { display: none; }

/* ─────────────────────────── Main ─────────────────────────────── */
main {
  margin-left: var(--sb-w);
  margin-right: var(--right-w);
  /* top padding matches the sidebar's top padding so the masthead title's
     first line sits at the same y as the sidebar's brand heading. */
  padding: 1.5rem 3rem 6rem;
  max-width: calc(100vw - var(--sb-w) - var(--right-w));
}
main > section { margin-bottom: 5rem; scroll-margin-top: 80px; }

/* ── Masthead (paper title + byline) ───────────────────────────── */
.masthead {
  margin-bottom: 3.5rem;
  padding-bottom: 0;
}
.masthead-title {
  font-size: 1.85rem; font-weight: 600;
  letter-spacing: -0.005em; line-height: 1.2;
  margin: 0 0 0.5rem;
}
.byline {
  font-size: 15px; color: var(--muted);
  font-style: italic; max-width: none; margin: 0;
}
.byline a { color: var(--ink); }

/* ── Sidebar search ───────────────────────────────────────────── */
.side-search { margin-bottom: 1.6rem; }
.side-search input[type="search"] {
  width: 100%; font: inherit; font-size: 13px;
  padding: 0.45em 0.6em;
  border: 1px solid var(--border); border-radius: 3px;
  background: var(--paper);
}
.side-search input[type="search"]:focus { outline: none; border-color: var(--ink); }
.side-hint { color: var(--muted); font-size: 10.5px; font-style: italic; margin: 0.35em 0 0; }
.side-hint kbd {
  font-family: ui-monospace, Menlo, monospace;
  border: 1px solid var(--border); border-radius: 2px;
  padding: 0 4px; background: var(--paper-alt);
  font-size: 10px;
}

/* ── References ───────────────────────────────────────────────── */
.references {
  list-style: decimal inside; padding: 0; margin: 0;
}
.references li {
  padding: 0.4em 0; border-bottom: 1px dotted var(--border);
  font-size: 14px;
}
.references li:last-child { border-bottom: none; }

/* ── Conceptual-clusters block ────────────────────────────────── */
.cluster-controls {
  display: flex; gap: 1.5rem; flex-wrap: wrap;
  margin: 0.8rem 0 1.2rem;
  font-size: 13px; color: var(--muted);
}
.cluster-controls label { display: flex; flex-direction: column; gap: 0.25em; }
.cluster-controls select {
  font: inherit; padding: 0.35em 0.6em; min-width: 220px;
  border: 1px solid var(--border); border-radius: 3px;
  background: var(--paper);
}
.pane-toggle {
  display: inline-flex; align-items: center; gap: 0.45em;
  font-size: 12px; color: var(--muted); cursor: pointer;
  margin: 0 0 0.5rem 0;
}
.pane-toggle input { margin: 0; }
.cluster-panes {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem;
  margin-top: 1rem;
}
.cluster-pane { background: var(--paper-alt); padding: 1rem; border-radius: 4px;
                border: 1px solid var(--border); }
.cluster-pane:first-child { grid-column: 1 / -1; }
.cluster-pane h4 { margin: 0 0 0.5rem; font-size: 14px; font-weight: 700; }
.cluster-help { font-size: 12px; color: var(--muted); font-style: italic; margin: 0 0 0.5rem; }
/* ── Timeline: dotted vertical track + inline cards ────────────────── */
.cluster-timeline { position: relative; }
.tl-summary {
  padding: 0.5rem 0.7rem; margin-bottom: 1rem;
  background: var(--paper-alt);
  border: 1px solid var(--border); border-radius: 3px;
  font-size: 13px;
}

.tl-axis { position: relative; padding: 0.4rem 0; }
.tl-row {
  display: grid;
  /* year | dot | company | card (card to the right of company) */
  grid-template-columns: 70px 24px 170px 1fr;
  align-items: start;
  padding: 4px 0;
}
.tl-year-cell { text-align: right; padding: 4px 16px 0 0; }
.tl-year-label {
  font-size: 22px; font-weight: 700; color: var(--ink); line-height: 1;
}

.tl-dot-cell {
  position: relative;
  align-self: stretch;
  display: flex; justify-content: center; padding-top: 9px;
}
.tl-dot {
  width: 6px; height: 6px; border-radius: 50%;       /* smaller dot */
  background: var(--ink);
  cursor: pointer;
  transition: transform 0.12s ease;
  position: relative; z-index: 2;
}
.tl-dot:hover { transform: scale(1.8); }
.tl-dot.pinned { background: var(--accent); transform: scale(2); }

.tl-company {
  font-size: 14px; color: var(--ink); white-space: nowrap;
  padding-top: 3px; cursor: pointer;
}
.tl-company:hover { color: var(--accent); }

/* Definition cards — collapsed by default; open when pinned or hovered. */
.tl-def-card {
  display: none;
  margin: 0; padding: 0.65rem 0.85rem;
  background: var(--paper-alt);
  border: 1px solid var(--border); border-radius: 3px;
  font-size: 13.5px; line-height: 1.5;
  max-height: 60vh; overflow-y: auto;                /* long cards scroll */
}
.tl-row.is-pinned .tl-def-card,
.tl-row.is-hover .tl-def-card { display: block; }
.tl-card-head {
  font-size: 13.5px; color: var(--accent); margin-bottom: 0.25rem;
  font-weight: 600;
}
.tl-card-src { font-size: 12px; color: var(--muted); margin-bottom: 0.4rem; }
.tl-card-src a { color: var(--muted); }
.tl-def {
  font-style: italic; font-size: 13.5px; line-height: 1.55;
  padding: 0.2em 0 0.2em 0.6em; border-left: 2px solid var(--rule);
  margin: 0.5rem 0;
}
.tl-step {
  font-size: 12.5px; color: var(--ink); margin: 0.3rem 0;
  display: flex; gap: 0.6em; align-items: baseline;
}
.tl-step-tag {
  display: inline-block; min-width: 100px;
  font-size: 10px; font-weight: 700; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--accent);
}
.tl-step-body { flex: 1; }
.tl-meta { color: var(--muted); font-size: 11.5px; }
.actor-pill {
  display: inline-block;
  font-size: 12px;
  padding: 1px 6px 1px 4px;
  margin: 1px 3px 1px 0;
  background: var(--paper);
  border: 1px solid var(--border); border-radius: 10px;
  white-space: normal;
  max-width: 100%;
  overflow-wrap: anywhere;
}
.actor-pill .type-chip {
  display: inline-block; width: 8px; height: 8px;
  border-radius: 50%; border: none;
  margin-right: 0.35em; vertical-align: middle;
}
.cluster-pane { position: relative; }
.cluster-pane .cluster-graph {
  width: 100%; height: 360px;
  min-height: 240px;
  background: var(--paper); border-radius: 3px;
  display: block; overflow: hidden;
  resize: vertical;                    /* user can drag-resize the graph height */
}
.cluster-graph .node-label {
  font-size: 10.5px; pointer-events: none; user-select: none;
}
.cluster-graph .node circle { cursor: grab; }
.cluster-graph .link { stroke: var(--rule); stroke-opacity: 0.7; }

/* Recenter button overlaid on each graph */
.graph-recenter {
  position: absolute; top: 8px; right: 8px;
  width: 28px; height: 28px; border-radius: 50%;
  background: var(--paper); border: 1px solid var(--border);
  font-size: 16px; line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  z-index: 5;
}
.graph-recenter:hover { background: var(--ink); color: var(--paper); }

/* Actor detail panel below the actor graph */
.actor-detail {
  position: relative;
  margin-top: 0.8rem; padding: 0.7rem 0.9rem;
  background: var(--paper); border: 1px solid var(--border); border-radius: 4px;
  font-size: 12.5px;
}
.actor-detail.hidden { display: none; }
.actor-detail h4 { margin: 0 0 0.4rem; font-size: 14px; }
.actor-detail dt {
  font-size: 10.5px; font-weight: 700; letter-spacing: 0.05em;
  text-transform: uppercase; color: var(--muted); margin-top: 0.5rem;
}
.actor-detail dd { margin: 0; }
.actor-detail .src-line { padding: 1px 0; }
.actor-detail .close {
  position: absolute; top: 4px; right: 6px;
  background: none; border: none; font-size: 16px; cursor: pointer;
  color: var(--muted); line-height: 1;
}
.actor-detail .close:hover { color: var(--ink); }

/* Hide Misuses block when toggled off */
body.hide-misuses #block-misuses { display: none; }

/* ── Top actors table ──────────────────────────────────────────── */
.top-actors-controls {
  display: flex; gap: 1.2rem; flex-wrap: wrap;
  margin-bottom: 0.8rem;
  font-size: 12.5px; color: var(--muted);
}
.top-actors-controls label { display: flex; flex-direction: column; gap: 0.25em; }
.top-actors-controls select {
  font: inherit; padding: 0.3em 0.55em;
  border: 1px solid var(--border); border-radius: 3px;
  background: var(--paper);
}
.top-actors-table-wrap { overflow-x: auto; }
.top-actors-table {
  border-collapse: collapse; width: 100%;
  font-size: 13px; table-layout: auto;
}
.top-actors-table th,
.top-actors-table td {
  text-align: left; vertical-align: top;
  padding: 6px 10px;
  border-bottom: 1px solid var(--border);
}
/* Predictable column widths so the table doesn't drift apart. */
.top-actors-table th:nth-child(1), .top-actors-table td:nth-child(1) { width: 32px; }
.top-actors-table th:nth-child(2), .top-actors-table td:nth-child(2) { width: 180px; }
.top-actors-table th:nth-child(3), .top-actors-table td:nth-child(3) { width: 130px; white-space: nowrap; }
.top-actors-table th:nth-child(4), .top-actors-table td:nth-child(4) { width: 80px;  white-space: nowrap; }
.top-actors-table th:nth-child(5), .top-actors-table td:nth-child(5) { width: 110px; }
.top-actors-table th:nth-child(6), .top-actors-table td:nth-child(6) { width: 180px; }
.top-actors-table th:nth-child(8), .top-actors-table td:nth-child(8) { width: 70px; text-align: right; }
.top-actors-table th {
  position: sticky; top: 0; background: var(--paper-alt);
  font-weight: 700; font-size: 11.5px;
  text-transform: uppercase; letter-spacing: 0.04em;
  color: var(--muted);
}
.top-actors-table .num { text-align: right; white-space: nowrap; }
.top-actors-table tr:hover { background: rgba(0,0,0,0.02); }
.top-actors-table .type-chip {
  display: inline-block; width: 9px; height: 9px;
  border: 1px solid var(--border); border-radius: 1.5px;
  margin-right: 0.35em; vertical-align: middle;
}
.top-actors-table .badge {
  display: inline-block; font-size: 10px; font-weight: 700;
  letter-spacing: 0.05em; padding: 1px 5px;
  border-radius: 2px; background: var(--paper-alt); color: var(--ink);
}
.top-actors-table .badge.AUTHOR { background: var(--ink); color: var(--paper); }
.top-actors-table .badge.CITED  { background: var(--paper-alt); color: var(--muted); }
.top-actors-table .badge.MIXED  { background: var(--accent); color: var(--paper); }
.top-actors-table .co-pill {
  display: inline-block; font-size: 11px; padding: 1px 5px;
  margin: 1px 2px 1px 0; background: var(--paper-alt);
  border: 1px solid var(--border); border-radius: 2px;
}

/* Prose typography — full available width for Introduction / Method / Discussion */
.prose p, section.prose p { max-width: none; }
h2 {
  font-size: 1.75rem; font-weight: 700; margin: 0 0 1.2rem 0;
  letter-spacing: -0.01em;
  padding-bottom: 0.4rem; border-bottom: 1px solid var(--rule);
}
/* Uniform body type for Introduction / Method / Discussion / References */
.prose, .prose p, .prose li, .lede { font-size: 15px; line-height: 1.65; }
.lede { font-style: normal; }
.meta { color: var(--muted); font-style: italic; font-size: 13px; }
code { font-family: ui-monospace, Menlo, monospace; font-size: 12.5px;
       background: var(--paper-alt); padding: 1px 4px; border-radius: 2px; }

/* Method subheadings */
.prose h3 {
  font-size: 1.15rem; font-weight: 700;
  margin: 2.4rem 0 0.6rem;
  letter-spacing: -0.005em;
}
.prose ul { max-width: none; padding-left: 1.4rem; margin: 0.6rem 0 1rem; }
.prose ul li { margin-bottom: 0.4rem; }

/* ───────────────────────── Grid blocks ────────────────────────── */
.grid-block { margin-bottom: 5rem; padding-top: 0; }
/* Wide company-column grids scroll horizontally inside their block so the
   narrower two-sidebar layout never forces a page-level scrollbar. */
.grid-block .row-grid { overflow-x: auto; overflow-y: visible; padding-bottom: 6px; }
.block-head { margin-bottom: 0.3rem; }
.block-head h3 {
  font-size: 1.2rem; font-weight: 700; margin: 0;
  letter-spacing: -0.01em;
}
.block-sub { color: var(--muted); font-style: italic; margin: 0.1em 0 0; font-size: 13px; }
.block-caption {
  color: var(--muted); font-size: 12px; margin: 0.4rem 0 0.5rem;
  max-width: none; line-height: 1.5;
}
.block-caption code { font-size: 11.5px; }

.view-controls { margin-bottom: 1.2rem; font-size: 13px; color: var(--muted); }
.view-controls label { cursor: pointer; user-select: none; }
.view-controls input { vertical-align: middle; margin-right: 0.3em; }
.sort-bar { margin: 0.2rem 0 0.5rem; font-size: 12px; color: var(--muted);
            display: flex; gap: 1.2em; align-items: center; flex-wrap: wrap; }
.sort-bar select { font: inherit; padding: 0.15em 0.3em; margin-left: 0.4em; }
.sort-bar a { color: var(--muted); cursor: pointer; text-decoration: underline dotted; }
.sort-bar a:hover { color: var(--ink); }

/* Document-type key (under the Documents block) */
.doc-key {
  display: flex; flex-wrap: wrap; gap: 0.6em 1.5em;
  padding: 0.6em 0.8em; margin-bottom: 1rem;
  background: var(--paper-alt); border: 1px solid var(--border);
  border-radius: 4px; font-size: 12px;
}
.doc-key .key-item { display: flex; align-items: center; gap: 0.4em; color: var(--muted); }
.doc-key .doc { transform: scale(0.85); cursor: default; }
.doc-key .doc:hover { transform: scale(0.85); }

/* Transposed grid: rows = categories, columns = label + top-N companies.
   The very first row is a sticky company header. */
.row-grid {
  --label-w: 170px;
  --col-w:   95px;
  display: grid;
  /* grid-template-columns is set inline by JS */
  row-gap: 5px; column-gap: 8px;
  align-items: start;
}
body.view-named .row-grid { --col-w: 150px; }
.co-head {
  position: sticky; top: 0; z-index: 10;
  background: var(--page);
  height: 84px;              /* FIXED so all bottom borders align */
  padding: 6px 4px 4px;
  border-bottom: 1px solid var(--rule);
  font-size: 12.5px; font-weight: 700;
  text-align: left;
  cursor: pointer;
  display: flex; flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
}
.co-head.spacer { background: var(--page); cursor: default; }
.co-head:hover .co-name { color: var(--accent); }
.co-head .co-name { line-height: 1.15; }
.co-head .country { font-size: 10.5px; font-weight: 400; color: var(--muted);
                    margin-top: 2px; line-height: 1.2; }

.cat-row-label {
  font-size: 12.5px; color: var(--ink);
  font-style: normal;
  padding: 4px 12px 4px 0;
  text-align: left;
  white-space: nowrap; text-overflow: ellipsis; overflow: hidden;
  max-width: var(--label-w, 170px);
  cursor: pointer; user-select: none;
  line-height: 16px;
}
.cat-row-label:hover  { color: var(--accent); }
.cat-row-label.active { color: var(--accent); font-weight: 700; }

/* ── Cells holding squares / doc icons ──────────────────────────── */
.cat-cell {
  display: flex; flex-wrap: wrap; gap: 2px;
  align-content: flex-start;
  padding: 2px 0;
  min-height: 18px;
}
.docs-cell { gap: 3px; }

/* ───────────────────── Square markers & doc icons ─────────────── */
.sq {
  width: 16px; height: 16px;
  border: 1px solid var(--ink);
  background: var(--c-unknown);
  cursor: pointer;
  flex: 0 0 auto;
  border-radius: 2px;
  transition: transform 0.08s ease;
}
.sq:hover { transform: scale(1.4); z-index: 2; position: relative; }

/* Named-view: squares become labeled chips with the item name inside.
   Document cells (.docs-cell) keep their normal icon layout. */
body.view-named .sq {
  width: 100%; height: auto; min-height: 20px;
  padding: 3px 6px;
  font-size: 10.5px; line-height: 1.2;
  font-family: inherit;
  color: var(--ink);
  text-align: left;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  border-radius: 2px;
  border: 1px solid color-mix(in srgb, var(--sq-bg, var(--ink)) 55%, var(--paper));
  /* Soft tint of the actor colour rather than a solid block, so the dark
     label text stays legible. !important overrides the inline solid colour
     that the compact view sets. */
  background: color-mix(in srgb, var(--sq-bg, var(--c-unknown)) 24%, var(--paper)) !important;
}
body.view-named .sq:hover {
  transform: none;
  background: color-mix(in srgb, var(--sq-bg, var(--c-unknown)) 40%, var(--paper)) !important;
}
body.view-named .sq.hl {
  background: color-mix(in srgb, var(--sq-bg, var(--c-unknown)) 52%, var(--paper)) !important;
}
body.view-named .cat-cell:not(.docs-cell) {
  flex-direction: column; align-items: stretch; gap: 2px;
}

.doc {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 28px;
  border: 1.5px solid var(--ink); background: white;
  cursor: pointer; position: relative;
  font-size: 0.7rem; font-weight: 700; color: var(--ink);
  flex: 0 0 auto; border-radius: 1.5px;
  transition: transform 0.08s ease;
}
.doc::before {
  content: "";
  position: absolute; left: 3px; right: 3px; top: 5px; bottom: 5px;
  background-image:
    linear-gradient(to bottom,
      transparent 0, transparent 3px,
      currentColor 3px, currentColor 4px,
      transparent 4px, transparent 8px,
      currentColor 8px, currentColor 9px,
      transparent 9px, transparent 13px,
      currentColor 13px, currentColor 14px,
      transparent 14px);
  opacity: 0.25;
}
.doc:hover { transform: scale(1.18); z-index: 2; }

/* Doc-type glyphs (replaced if you drop SVGs into icons/) */
.doc.t-model-card::after        { content: ""; }
.doc.t-company-policy           { background: #f4ecd8; }
.doc.t-principle::after         { content: "§"; }
.doc.t-grant::after             { content: "$"; font-weight: 700; }
.doc.t-initiative::after        { content: "$"; font-weight: 700; }
.doc.t-report::after            { content: "R"; font-size: 0.7em; }
.doc.t-research::after,
.doc.t-research-paper::after    { content: "✎"; font-size: 0.95em; }
.doc.t-framework::after         { content: "⚙"; font-size: 0.95em; }
.doc.t-announcement::after      { content: "!"; font-weight: 700; }
.doc.t-audit::after             { content: "✓"; font-size: 0.8em; }
.doc.t-legislation::after       { content: "⚖"; font-size: 0.85em; }
.doc.t-other::after             { content: "?"; }
.doc::after { z-index: 1; position: relative; }

/* If a custom SVG is provided, swap the background */
.doc.has-svg::before { display: none; }
.doc.has-svg::after  { content: ""; }
.doc.has-svg { background: center / 70% no-repeat var(--svg-url, none) white; }

/* ───────────────────── Selection / dimming ────────────────────── */
body.has-selection .sq:not(.hl),
body.has-selection .doc:not(.hl) {
  opacity: var(--dim);
}
/* Highlighted elements stay at full opacity; non-highlighted fade.
   No coloured outlines — selection contrast comes from the dim alone. */
.sq.hl, .doc.hl { opacity: 1; }

/* ───────────────────── Info card (hover/click) ────────────────── */
.info-card {
  position: fixed; z-index: 100;
  background: #fffbe6;
  border: 1px solid var(--ink);
  padding: 0.8em 1em;
  width: min(440px, calc(100vw - 32px));
  font-size: 12.5px; line-height: 1.45;
  box-shadow: 3px 3px 0 rgba(0,0,0,0.08);
  pointer-events: none;
  max-height: 70vh; overflow-y: auto; overflow-x: hidden;
  overflow-wrap: anywhere; word-break: break-word;
}
.info-card dd { overflow-wrap: anywhere; }
.info-card.pinned { pointer-events: auto; }
.info-card.hidden   { display: none; }
.info-card h4       { margin: 0 0 0.5em 0; font-size: 13.5px; font-weight: 700; }
.info-card dt       { font-weight: 700; color: var(--muted); font-size: 10.5px;
                      text-transform: uppercase; letter-spacing: 0.05em; margin-top: 0.55em; }
.info-card dd       { margin: 0 0 0.3em 0; }
.info-card a        { color: var(--ink); }
.info-card .type-chip {
  display: inline-block; width: 9px; height: 9px;
  border: 1px solid var(--border); border-radius: 1.5px;
  margin-right: 0.3em; vertical-align: middle;
}
.info-card .quote {
  font-style: italic; color: var(--ink);
  margin: 0.4em 0 0.6em 0;
  padding: 0.1em 0 0.1em 0.6em;
  border-left: 2px solid var(--rule);
}
.info-card .src-line { margin-bottom: 0.2em; }
.info-card .src-line .pg { color: var(--muted); font-size: 11px; }

/* Hidden when filter excludes */
.hidden { display: none !important; }

/* ────────────────  Stack view  ──────────────── */
#block-stacks .stacks-controls {
  margin: 14px 0 8px;
  display: flex; gap: 18px; flex-wrap: wrap; align-items: flex-end;
  padding: 10px 12px; border: 1px solid #ddd; background: #fff;
}
#block-stacks .stacks-controls label {
  display: flex; flex-direction: column; font-size: 0.78rem; gap: 4px;
  font-family: inherit;
}
#block-stacks .stacks-controls label.inline {
  flex-direction: row; align-items: center; gap: 6px;
}
#block-stacks .stacks-controls select {
  font: inherit; padding: 3px 6px; border: 1px solid #aaa; background: #fff;
  min-width: 140px;
}
#block-stacks .stack-legend {
  display: flex; flex-wrap: wrap; gap: 8px 14px;
  margin: 8px 0 6px; font-size: 0.75rem;
}
#block-stacks .stack-legend .legend-item {
  display: inline-flex; align-items: center; gap: 5px;
}
#block-stacks .stack-legend .legend-swatch {
  width: 11px; height: 11px; border-radius: 50%;
  border: 1px solid #222; display: inline-block;
}
#stack-svg {
  width: 100%; height: auto; display: block;
  background: #fff; border: 1px solid #ddd;
}
#stack-svg .plane-top   { fill: rgba(255,255,250,0.78); stroke: #222; stroke-width: 1; }
#stack-svg .plane-front { fill: #d8d4c5; stroke: #222; stroke-width: 1; }
#stack-svg .plane-right { fill: #b9b3a1; stroke: #222; stroke-width: 1; }
#stack-svg .plane-shadow { fill: rgba(0,0,0,0.10); filter: blur(2px); }
#stack-svg text { font-family: inherit; }
#stack-svg .plane-label { font-size: 14px; fill: #222; font-style: italic; }
#stack-svg .stack-title { font-family: var(--sans); font-size: 14px; font-weight: 700; fill: #111;
  text-transform: uppercase; letter-spacing: 0.5px; }
#stack-svg .stack-sub { font-family: var(--sans); font-size: 12px; fill: #555; }
#stack-svg .intra-edge { stroke: #6e6a5e; stroke-width: 0.5; stroke-opacity: 0.32; fill: none; }
#stack-svg .inter-edge { stroke: #b9b3a1; stroke-width: 0.7; stroke-opacity: 0.65; fill: none; }
#stack-svg .node { stroke: #1a1a1a; stroke-width: 0.7; cursor: pointer; }
#stack-svg .node:hover { stroke-width: 1.8; }
#stack-svg .node-label {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 10px;
  font-weight: 500;
  pointer-events: none;
  fill: #2a2b62;
  paint-order: stroke;
  stroke: #fbf7f0;
  stroke-width: 2.5px;
  stroke-linejoin: round;
}
/* Stack hover-card — matches the editorial .info-card look. */
#stack-tooltip {
  position: absolute; z-index: 100; opacity: 0; pointer-events: auto;
  background: #fffbe6; border: 1px solid var(--ink);
  padding: 0.8em 1em; width: min(360px, calc(100vw - 32px));
  font-family: var(--serif); font-size: 12.5px; line-height: 1.45; color: var(--ink);
  box-shadow: 3px 3px 0 rgba(0,0,0,0.08);
  max-height: 70vh; overflow-y: auto; overflow-wrap: anywhere;
}
#stack-tooltip h4 { margin: 0 0 0.15em 0; font-family: var(--sans);
  font-size: 13.5px; font-weight: 700; }
#stack-tooltip .st-sub { color: var(--muted); font-size: 11.5px; margin-bottom: 0.2em; }
#stack-tooltip dt { font-family: var(--sans); font-weight: 700; color: var(--muted);
  font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.05em; margin-top: 0.6em; }
#stack-tooltip dd { margin: 0.1em 0 0.3em 0; }
#stack-tooltip .quote { font-style: italic; color: var(--ink);
  margin: 0.3em 0; padding: 0.1em 0 0.1em 0.6em; border-left: 2px solid var(--rule); }
#stack-tooltip ul.st-docs { margin: 0.1em 0 0; padding-left: 1.1em; }
#stack-tooltip ul.st-docs li { margin: 0.15em 0; }
#stack-tooltip .st-more { color: var(--muted); font-style: italic; list-style: none; margin-left: -0.6em; }
#stack-tooltip a { color: var(--ink); }
#stack-tooltip a:hover { color: var(--accent); }
#stack-tooltip .tl-meta { color: var(--muted); }

/* Spine (vertical dashed back-wall between planes) removed by request. */

/* Stack-view how-to panel */
#block-stacks .stack-howto {
  margin: 10px 0 16px;
  border: 1px solid #d6d2c4;
  background: #fbf9f0;
  padding: 0;
}
#block-stacks .stack-howto > summary {
  cursor: pointer;
  padding: 10px 14px;
  font-size: 0.9rem;
  font-weight: 700;
  list-style: none;
  background: #f1ecdd;
  border-bottom: 1px solid #d6d2c4;
}
#block-stacks .stack-howto > summary::-webkit-details-marker { display: none; }
#block-stacks .stack-howto > summary::before {
  content: "▸ ";
  display: inline-block;
  transition: transform 0.15s;
}
#block-stacks .stack-howto[open] > summary::before {
  content: "▾ ";
}
#block-stacks .howto-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px 24px;
  padding: 14px 18px 18px;
  font-size: 0.82rem;
  line-height: 1.5;
}
#block-stacks .howto-grid section { min-width: 0; }
#block-stacks .howto-grid h4 {
  margin: 0 0 6px;
  font-size: 0.85rem;
  font-weight: 700;
  color: #2a2a2a;
  letter-spacing: 0.2px;
}
#block-stacks .howto-grid p { margin: 4px 0; color: #333; }
#block-stacks .howto-grid ul,
#block-stacks .howto-grid ol {
  margin: 4px 0 4px 18px; padding: 0;
}
#block-stacks .howto-grid li { margin: 2px 0; color: #333; }

/* Stack view — click-to-highlight network */
#stack-svg.has-selection .node          { opacity: 0.10; transition: opacity 0.15s; }
#stack-svg.has-selection .intra-edge,
#stack-svg.has-selection .inter-edge    { opacity: 0.06; transition: opacity 0.15s; }
#stack-svg.has-selection .node.hl-related { opacity: 0.85; }
#stack-svg.has-selection .node.hl       { opacity: 1; stroke: #c0431f; stroke-width: 2.2; }
#stack-svg.has-selection .intra-edge.hl { opacity: 0.85; stroke: #c0431f; stroke-width: 1.1; }
#stack-svg.has-selection .inter-edge.hl { opacity: 0.95; stroke: #c0431f; stroke-width: 1.3; }
#stack-svg .node { transition: opacity 0.15s; }

/* Selection banner */
#stack-selection-banner {
  display: none; align-items: center; gap: 8px;
  margin: 10px 0 6px; padding: 7px 12px;
  border: 1px solid #c0431f; background: #fff5ec;
  font-size: 0.82rem; line-height: 1.3;
}
#stack-selection-banner .sel-label { color: #6c655c; font-weight: 600;
                                     text-transform: uppercase; letter-spacing: 0.4px;
                                     font-size: 0.7rem; }
#stack-selection-banner strong     { color: #2a2a2a; }
#stack-selection-banner .sel-meta  { color: #6c655c; }
#stack-selection-banner button#stack-clear-sel {
  margin-left: auto; padding: 3px 10px; font-size: 0.75rem;
  background: #fff; border: 1px solid #c0431f; color: #c0431f;
  cursor: pointer;
}
#stack-selection-banner button#stack-clear-sel:hover {
  background: #c0431f; color: #fff;
}

/* ════════════════════════════════════════════════════════════════
   Inline citations, hover reference cards & reader comments
   (ported from the Censorship & moderation site)
   ════════════════════════════════════════════════════════════════ */

/* Inline (Author, year) citation groups in the prose. */
.cite-grp {
  font-variant-numeric: oldstyle-nums;
  font-size: 0.95em;
  color: var(--ink-soft);
}
.cite-link {
  color: var(--accent);
  border-bottom: 1px dotted rgba(192, 67, 31, 0.30);
  text-decoration: none;
  cursor: pointer;
}
.cite-link:hover { color: var(--ink); border-bottom-color: var(--ink); }

/* References list: hanging indent + flash when jumped to. */
.references .ref-entry,
.prose .ref-entry { scroll-margin-top: 1.5rem; }
.references li:target,
.prose .ref-entry:target,
.prose .ref-entry.flash {
  background: rgba(192, 67, 31, 0.10);
  box-shadow: -4px 0 0 var(--accent), 0 0 0 4px rgba(192, 67, 31, 0.10);
  border-radius: 2px;
  animation: ref-flash 1.6s ease-out 1;
}
@keyframes ref-flash {
  0%   { background: rgba(192, 67, 31, 0.32); }
  100% { background: rgba(192, 67, 31, 0.10); }
}

/* Floating hover-card showing the full reference. */
#data-card {
  position: absolute; z-index: 220;
  max-width: 24rem;
  padding: 0.7rem 0.85rem;
  background: #ffffff; border: 1px solid var(--border);
  border-radius: 4px;
  box-shadow: 0 10px 30px rgba(28, 26, 24, 0.16);
  font-family: var(--sans);
  font-size: 12.5px; line-height: 1.45; color: var(--ink);
}
#data-card[hidden] { display: none; }
#data-card .dc-cite {
  padding: 0.45em 0; border-top: 1px solid var(--rule);
}
#data-card .dc-cite:first-child { border-top: none; padding-top: 0; }
#data-card .dc-cite em { font-style: italic; }
#data-card .dc-cite .ext {
  display: inline-block; margin-left: 0.35em; color: var(--accent);
  font-size: 11px; border-bottom: 1px dotted rgba(192, 67, 31, 0.4);
  white-space: nowrap;
}
#data-card .dc-cite .ext:hover { color: var(--ink); border-bottom-color: var(--ink); }

/* ── Reader comments — sidebar list, "+" button, popover, highlight ───── */
#chapter-comments[hidden] { display: none; }
#chapter-comments-list { list-style: none; margin: 0; padding: 0; }
#chapter-comments-list .cmt-rail-count { font-size: 11px; color: var(--muted); margin-bottom: 0.4rem; }
#chapter-comments-list .cmt-rail-item {
  font-size: 11.5px; color: var(--ink-soft); line-height: 1.35;
  padding: 0.3em 1.1rem 0.3em 0; border-top: 1px solid var(--rule);
  position: relative; cursor: pointer;
}
#chapter-comments-list .cmt-rail-item:hover { color: var(--ink); }
#chapter-comments-list .cmt-rail-who { font-weight: 700; color: var(--ink); }
#chapter-comments-list .cmt-rail-item:hover .cmt-rail-who { color: var(--accent); }
#chapter-comments-list .cmt-rail-del {
  position: absolute; top: 0.25em; right: 0; width: 1.1em; height: 1.1em;
  border: none; background: none; color: var(--muted); cursor: pointer;
  font-size: 14px; line-height: 1; padding: 0; opacity: 0; transition: opacity .12s;
}
#chapter-comments-list .cmt-rail-item:hover .cmt-rail-del { opacity: 1; }
#chapter-comments-list .cmt-rail-del:hover { color: #b00; }
.cmt-export {
  margin-top: 0.6rem; font-family: var(--sans); font-size: 11px;
  padding: 0.35em 0.6em; background: var(--paper);
  border: 1px solid var(--border); border-radius: 3px; color: var(--ink); cursor: pointer;
}
.cmt-export:hover { background: var(--ink); color: var(--paper); }

.cmt-plus {
  position: absolute; z-index: 150;
  width: 1.6rem; height: 1.6rem; border-radius: 50%;
  border: none; background: var(--accent); color: #fff;
  font-size: 1.1rem; line-height: 1; cursor: pointer;
  box-shadow: 0 2px 8px rgba(28,26,24,0.3);
}
.cmt-plus[hidden] { display: none; }
.cmt-plus:hover { filter: brightness(1.08); }

.cmt-pop {
  position: absolute; z-index: 230;
  width: 22rem; max-width: calc(100vw - 1.5rem);
  background: #ffffff; border: 1px solid var(--border);
  border-radius: 5px; padding: 0.9rem 1rem;
  box-shadow: 0 12px 34px rgba(28,26,24,0.22);
  font-family: var(--sans);
}
.cmt-pop .cmt-quote {
  font-family: var(--serif); font-style: italic; font-size: 0.9rem;
  color: var(--ink-soft); border-left: 2px solid var(--accent);
  padding-left: 0.55rem; margin-bottom: 0.65rem; line-height: 1.4;
}
.cmt-pop .cmt-name, .cmt-pop .cmt-text {
  width: 100%; box-sizing: border-box; font-family: var(--sans);
  font-size: 0.9rem; padding: 0.45em 0.55em; margin-bottom: 0.55rem;
  border: 1px solid var(--border); border-radius: 3px; background: #fff;
  color: var(--ink); resize: vertical;
}
.cmt-pop .cmt-name:focus, .cmt-pop .cmt-text:focus { outline: none; border-color: var(--ink); }
.cmt-pop .cmt-actions { display: flex; justify-content: flex-end; gap: 0.5rem; }
.cmt-pop .cmt-cancel {
  font-family: var(--sans); font-size: 12px; padding: 0.4em 0.8em;
  background: var(--paper); border: 1px solid var(--border);
  border-radius: 3px; color: var(--muted); cursor: pointer;
}
.cmt-pop .cmt-cancel:hover { color: var(--ink); }
.cmt-pop .cmt-save {
  font-family: var(--sans); font-size: 12.5px; font-weight: 600;
  padding: 0.4em 0.9em; background: var(--accent); color: #fff;
  border: 1px solid var(--accent); border-radius: 3px; cursor: pointer;
}
.cmt-pop.cmt-view .cmt-entry { margin-bottom: 0.7rem; }
.cmt-pop .cmt-meta { display: flex; gap: 0.5rem; align-items: baseline; margin-bottom: 0.25rem; }
.cmt-pop .cmt-who { font-weight: 700; font-size: 0.9rem; color: var(--ink); }
.cmt-pop .cmt-when { font-size: 11px; color: var(--muted); }
.cmt-pop .cmt-body {
  font-family: var(--serif); font-size: 0.95rem; line-height: 1.45;
  color: var(--ink); margin-bottom: 0.35rem;
}
.cmt-pop .cmt-del {
  font-family: var(--sans); font-size: 11px; padding: 0.2em 0.5em;
  background: none; border: none; color: var(--accent); cursor: pointer;
  text-decoration: underline;
}
mark.cmt {
  background: rgba(255, 214, 0, 0.34);
  border-bottom: 1px solid rgba(192, 67, 31, 0.5);
  cursor: pointer; padding: 0.02em 0;
  box-decoration-break: clone; -webkit-box-decoration-break: clone;
}
mark.cmt:hover { background: rgba(255, 214, 0, 0.55); }
mark.cmt.flash { animation: cmt-flash 1.6s ease-out 1; }
@keyframes cmt-flash {
  0%, 30% { background: rgba(192, 67, 31, 0.45); }
  100%    { background: rgba(255, 214, 0, 0.34); }
}

/* ── Commitment size key (sidebar) ──────────────────────────────────────── */
.commit-key { margin: 0.6rem 0 0.2rem; padding-top: 0.5rem; border-top: 1px solid var(--rule); }
.commit-key[hidden] { display: none; }
.commit-key h5 { margin: 0 0 0.3rem; font-family: var(--sans); font-size: 11px;
  font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.commit-key-sub { font-size: 11px; color: var(--muted); margin: 0 0 0.5rem; line-height: 1.35; }
.commit-key-row { display: flex; align-items: center; gap: 0.55em; font-size: 11.5px;
  color: var(--ink-soft); margin: 0.25rem 0; min-height: 30px; }
.commit-key .ck-sq { display: inline-block; flex: 0 0 auto; background: var(--muted);
  border: 1px solid var(--ink); border-radius: 2px; }

/* ════════════════════════════════════════════════════════════════
   Alluvial (Country → Type → Mentioned) — actor coverage
   ════════════════════════════════════════════════════════════════ */
.alluvial-host { margin-top: 0.6rem; }
.alluvial-host .placeholder { color: var(--muted); font-style: italic; padding: 2rem 0; }
.sankey {
  font-family: var(--sans);
  font-size: 12.5px; color: var(--ink);
}
.sankey .node rect {
  fill: #ffffff; stroke: #2a2724; stroke-width: 0.8px; cursor: pointer;
}
.sankey .node rect:hover { fill: #f5efe2; }
.sankey .node rect.term-yes { fill: #aed9c4; }   /* Mentioned = Yes */
.sankey .node rect.term-no  { fill: #e4ded2; }   /* Mentioned = No  */
.sankey .node text { fill: var(--ink); pointer-events: none; }
.sankey .node-label { font-size: 12.5px; }
.sankey .lbl-name { font-size: 12px; font-weight: 600; fill: var(--ink); }
.sankey .lbl-count { font-size: 11px; font-weight: 400; fill: var(--muted);
  font-variant-numeric: tabular-nums; }
.sankey .stage-headers text {
  font-size: 12px; font-style: italic; font-weight: 600;
  fill: var(--muted); letter-spacing: 0.02em; text-transform: none;
}
.sankey .link {
  fill: none; stroke-opacity: 0.62; transition: stroke-opacity 0.15s; cursor: pointer;
}
.sankey .link:hover { stroke-opacity: 0.9; }
.sankey .link.hi  { stroke-opacity: 0.95; }
.sankey .link.dim { stroke-opacity: 0.10; }
.sankey .node.dim { opacity: 0.25; }

/* Hover-card rows reused by the alluvial */
#data-card .dc-t { font-weight: 700; margin-bottom: 0.2rem; font-family: var(--sans); }
#data-card .dc-row { display: flex; justify-content: space-between; gap: 1rem;
  font-family: var(--sans); font-size: 12px; color: var(--ink-soft); }
#data-card .dc-row span { color: var(--muted); }

/* ── Commitment view: squares become circles ────────────────────────────── */
body.commitment .sq.sq-commit { border-radius: 50%; }

/* ── Test National Book (Conceptual-clusters pane headings) ─────────────── */
@font-face { font-family: "Test National Book"; src: url("fonts/TestNational-Book.otf") format("opentype");
  font-weight: 400; font-style: normal; font-display: swap; }
.cluster-pane h4 { font-family: "Test National Book", var(--sans); font-weight: 400; }

/* Card actor-pill dimmed to grey when it is NOT part of the sidebar selection */
.actor-pill.dim { opacity: 0.32; filter: grayscale(1); }
.actor-pill.dim .type-chip { background: #c8c8c8 !important; }

/* Stack tooltip — evidence quote */
#stack-tooltip .tip-quote {
  font-family: var(--serif); font-style: italic; font-size: 11px;
  color: var(--ink-soft); border-left: 2px solid var(--rule);
  padding: 1px 0 1px 6px; margin: 3px 0; line-height: 1.35;
}

/* Alluvial hover-card: example actors per stream */
#data-card .al-list { margin: 0.4rem 0 0; padding-left: 1rem; font-family: var(--sans);
  font-size: 11.5px; color: var(--ink); line-height: 1.4; }
#data-card .al-list li { margin: 1px 0; }
#data-card .al-where { color: var(--muted); }
#data-card .al-more { color: var(--muted); font-style: italic; list-style: none; margin-left: -0.6rem; }

/* Alluvial pinned full-actor list (click a stream) */
#data-card.dc-pinned { pointer-events: auto; max-height: 60vh; overflow-y: auto; }
#data-card .al-list-full { max-height: none; }
#data-card .al-close { margin-top: 0.5rem; font-family: var(--sans); font-size: 10.5px;
  color: var(--muted); font-style: italic; }

/* Alluvial node card extras */
#data-card .al-sub { font-family: var(--sans); font-size: 10.5px; color: var(--muted);
  margin-top: 0.1rem; text-transform: uppercase; letter-spacing: 0.3px; }
#data-card .al-cnt { color: var(--accent); font-size: 10.5px; }

/* Alluvial node card: per-category groups */
#data-card .al-groups { margin-top: 0.3rem; }
#data-card .al-group { margin: 0.35rem 0; }
#data-card .al-group-head { font-family: var(--sans); font-size: 11px; font-weight: 700;
  color: var(--ink); border-bottom: 1px solid var(--rule); padding-bottom: 1px; }
#data-card .al-group-head .al-group-n { color: var(--muted); font-weight: 400; }
#data-card .al-group .al-list { margin: 0.2rem 0 0; }