/* Program timing chart (2026-10-20, scripts/timing-chart.js): theme tokens only, so light and dark both follow site-theme. */
.timing-chart-figure { margin: 16px 0 0; padding: 12px; border: 1px solid var(--border); border-radius: var(--radius-card); background: var(--bg); }
.timing-chart-heading { margin: 0 0 8px; font-weight: 600; }
.timing-chart { display: block; width: 100%; max-width: 520px; height: auto; overflow: visible; }
.timing-chart .tc-label { font-family: var(--font); font-size: 13px; fill: var(--text-2); }
.timing-chart .tc-label.tc-latest { fill: var(--accent); font-weight: 600; }
.timing-chart .tc-axis { font-family: var(--font); font-size: 12px; fill: var(--text-2); }
.timing-chart .tc-track { stroke: var(--border); stroke-width: 2; }
.timing-chart .tc-bar.tc-earlier, .timing-chart .tc-dot.tc-earlier { fill: var(--text-2); }
.timing-chart .tc-bar.tc-latest, .timing-chart .tc-dot.tc-latest { fill: var(--accent); }
.timing-chart .tc-dot { stroke: var(--bg); stroke-width: 2; }
.timing-chart-figure .timing-chart-note, .timing-chart-figure .timing-chart-sources { margin: 8px 0 0; color: var(--text-2); overflow-wrap: anywhere; }
.timing-chart-figure .timing-chart-sources a { display: inline-flex; align-items: center; min-block-size: 24px; }
/* 2026-10-20: an upper bound ("by <date>") is a bracket at the bound with a label; no bar and no start. */
.timing-chart .tc-bound { fill: none; stroke-width: 2.5; }
.timing-chart .tc-bound.tc-earlier { stroke: var(--text-2); }
.timing-chart .tc-bound.tc-latest { stroke: var(--accent); }
.timing-chart .tc-bound-label { font-family: var(--font); font-size: 12px; fill: var(--text-2); }
.timing-chart .tc-bound-label.tc-latest { fill: var(--accent); }