/* ── SAIHM visual system ────────────────────────────────────────────────────
   Shared vocabulary for page diagrams and decision tables. Additive: linked
   per page, never from site.css, so no existing page can regress from it.
   Colours read from the site tokens in site.css rather than restating them. */

/* Horizontal scroll for wide content. The container scrolls; the page body
   never does — a table wider than a phone must not push the whole layout. */
.viz-wrap{overflow-x:auto;margin:10px 0 8px;border-radius:12px}

/* Comparison / decision tables */
.viz-table{width:100%;border-collapse:separate;border-spacing:0;font-size:.9rem;margin:0}
/* Only wide grids force a scroll floor; a 2-column table must not scroll on a phone. */
.viz-table--wide{min-width:760px}
.viz-table th,.viz-table td{padding:11px 12px;border-bottom:1px solid var(--border);text-align:center;vertical-align:middle}
.viz-table th:first-child,.viz-table td:first-child{text-align:left;min-width:264px;font-weight:500;color:var(--ink-primary)}
.viz-table thead th{color:var(--ink-muted);font-size:.78rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
/* The column describing SAIHM: tinted, never asserted in prose */
.viz-table .own{background:rgba(96,165,250,.07)}
.viz-table thead th.own{color:var(--accent);background:rgba(96,165,250,.12)}
/* Full-width grouping band, so a long table reads as phases not a wall */
.viz-table tr.phase td{background:#101010;color:var(--ink-muted);font-size:.71rem;letter-spacing:.1em;text-transform:uppercase;font-weight:700;padding:9px 12px}

/* Status pills — one vocabulary across every table on the site */
.pill{display:inline-block;min-width:70px;padding:3px 10px;border-radius:999px;font-size:.75rem;font-weight:600}
.p-yes{background:rgba(34,197,94,.13);color:#22c55e;border:1px solid rgba(34,197,94,.34)}
.p-var{background:rgba(245,158,11,.12);color:#f59e0b;border:1px solid rgba(245,158,11,.3)}
.p-no{background:rgba(148,163,184,.07);color:#94a3b8;border:1px solid var(--border)}
.p-na{color:#5b6675;font-size:.74rem}

.viz-legend{display:flex;gap:16px;flex-wrap:wrap;font-size:.8rem;color:var(--ink-muted);margin:6px 0 0}
figure{margin:14px 0}
figcaption{font-size:.82rem;color:var(--ink-muted);margin-top:6px}

/* Question/answer pairs (enterprise regulator questions, FAQ-shaped copy) */
dl.qa dt{font-weight:600;color:var(--ink-primary);margin:14px 0 5px}
dl.qa dd{margin:0 0 10px;color:var(--ink-muted)}
dl.qa dd a{color:var(--accent)}

/* Inconspicuous reuse/attribution block — deliberately quiet */
.viz-reuse{font-size:.8rem;color:var(--ink-muted);border-top:1px solid var(--border);margin-top:18px;padding-top:10px}
.viz-reuse a{color:var(--ink-muted);text-decoration:underline}
.viz-reuse a:hover{color:var(--accent)}