/* Cleared to Paid report: chart pieces the site stylesheet does not cover.
   Colours come only from site.css tokens; --accent-mark marks what is paid. */
.r-chart { min-width: 0; display: grid; gap: 10px; }
section[id] > .prose:first-child > h2 { margin-bottom: 12px; }  /* room between a section heading and the tiles under it */
.r-chart svg { display: block; width: 100%; height: auto; font-family: var(--sans); }
.r-chart svg text { fill: var(--ink-3); font-size: 12px; }
.r-chart svg .r-grid { stroke: var(--rule); stroke-width: 1; }
.r-chart svg .r-axis { stroke: var(--ink-3); stroke-width: 1; }
.r-chart svg [tabindex] { cursor: pointer; }
.r-chart svg [tabindex]:focus { outline: none; }
.r-chart svg [tabindex]:focus-visible rect { stroke: var(--focus); stroke-width: 2px; }
.r-tm-lab, .r-tm-val { paint-order: stroke; stroke: var(--paper); stroke-width: 3px; stroke-linejoin: round; }
.r-chart svg .r-tm-lab { fill: var(--ink); font-weight: 600; }
.r-chart svg .r-tm-val { fill: var(--ink-2); }
.r-paid { fill: var(--accent-mark); }
.r-soft { fill: var(--accent-soft); stroke: var(--accent-mark); stroke-width: 1px; }

/* Payment grid: country chips per type of AI and route */
.r-cgrid th.seg { background: var(--panel); color: var(--ink-2); font-size: 0.8rem; font-weight: 600; padding: 4px 8px; }
.r-cgrid th, .r-cgrid td { padding-right: 6px; }
.r-cgrid td:not(:first-child) { min-width: 2.4rem; }
.r-cgrid td.r-theory { outline: 2px dashed var(--ink-2); outline-offset: -3px; }
.r-chip { display: inline-block; margin: 1px 2px 1px 0; padding: 0 4px; border: 1px solid var(--rule); border-radius: 3px; font: 400 0.8rem/1.5 var(--sans); color: var(--ink-3); cursor: default; }
.r-chip.main { font-weight: 700; color: var(--ink); border-color: var(--ink-3); }
.r-chip.paid { border-color: var(--accent-mark); }
.r-toggle { display: flex; align-items: center; gap: 8px; font: 0.88rem/1.4 var(--sans); color: var(--ink-2); cursor: pointer; }
.r-toggle input { accent-color: var(--ink-2); margin: 0; }

/* Model table: one row per business model, evidence folded under it */
.r-models td, .r-models th { font-size: 0.85rem; }
.r-models th.seg { background: var(--panel); color: var(--ink-2); font-size: 0.8rem; font-weight: 600; padding: 4px 8px; }
.r-models tr.r-ev td { padding-top: 0; }
.r-models details > summary { cursor: pointer; font-size: 0.8rem; color: var(--ink-3); }
.r-models details ul { margin: 6px 0 4px; padding-left: 1.1em; display: grid; gap: 2px; color: var(--ink-2); }
.r-models details p { font-size: 0.85rem; color: var(--ink-2); margin-bottom: 6px; }

/* Money flow: who hands data to whom, and what the receiver pays */
.r-flow { margin: 0; padding-left: 1.4em; display: grid; gap: 14px; font-family: var(--sans); }
.r-flow > li { display: grid; gap: 4px; }
.r-flow-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.r-node { padding: 2px 8px; border: 1px solid var(--rule); border-left: 3px solid var(--ink-3); border-radius: 3px; font-weight: 600; font-size: 0.92rem; }
.r-arrow { font-size: 0.82rem; color: var(--ink-3); }
.r-pay { font-size: 0.9rem; color: var(--ink-2); }
.r-pay::before { content: ""; display: inline-block; width: 10px; height: 10px; margin-right: 6px; border-radius: 2px; border: 1.5px solid var(--accent-mark); vertical-align: -1px; }
.r-pay.cash::before { background: var(--accent-mark); }
.r-flow ul { margin: 0; padding-left: 1.1em; font-size: 0.85rem; color: var(--ink-3); display: grid; gap: 2px; }

/* Who buys what: markers on a log-scale track; colour = what is bought, shape = kind of figure */
.seg-gov, .sw.gov { background: var(--accent-soft); box-shadow: inset 0 0 0 1.5px var(--accent-mark); }
.seg-blue, .sw.blue { background: var(--accent); }
.seg-ring, .sw.ring { background: transparent; box-shadow: inset 0 0 0 1.5px var(--ink-3); }
.r-other { fill: var(--bar); }
.r-chart svg .r-tm-grp { fill: var(--ink-2); font: 600 0.75rem var(--sans); }
.conf { font: 600 0.7rem/1 var(--sans); letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-3); white-space: nowrap; margin-left: 4px; }