/* Layout block data_chart: inline SVG bar chart plus table. No reference page; type and colours from tokens.css.
   Bars --brand, text --ink/--ink-2, grid --line; „keine Angabe“ is a dashed empty box with text (--ink-3,
   because --line has no visible contrast on --bg). */
.chart-h { font-size: 20px; font-weight: 800; margin-bottom: 10px; }
.chart figure { margin: 0; }
.chart-basis { justify-self: start; display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-2); background: var(--sunk); padding: 5px 10px; border-radius: var(--r); line-height: 1.4; margin-bottom: 14px; }
.chart-svg { display: block; overflow: visible; font-family: var(--f-body); }
.chart-svg text { font-size: 13px; fill: var(--ink); }
.chart-svg .chart-label { font-weight: 500; paint-order: stroke; stroke: var(--bg); stroke-width: 4px; stroke-linejoin: round; }
.chart-svg .chart-value { font-weight: 600; font-variant-numeric: tabular-nums; }
.chart-svg .chart-ticks text { font-size: 12px; fill: var(--ink-3); font-variant-numeric: tabular-nums; }
.chart-svg .chart-none-text { fill: var(--ink-2); font-style: italic; }
.chart-grid line { stroke: var(--line); stroke-width: 1; }
.chart-grid .chart-axis { stroke: var(--ink-2); }
.chart-bar { fill: var(--brand); }
.chart-track { fill: var(--sunk); }
.chart-none { fill: none; stroke: var(--ink-3); stroke-width: 1; stroke-dasharray: 4 3; }
.chart-data { margin-top: 14px; border-top: 1px solid var(--line); }
.chart-data summary { cursor: pointer; font-weight: 600; font-size: 14px; padding: 10px 0; }
.chart-data table { width: 100%; border-collapse: collapse; font-size: 14px; margin-bottom: 8px; }
.chart-data th, .chart-data td { text-align: left; padding: 8px 8px 8px 0; border-bottom: 1px solid var(--line); vertical-align: top; }
.chart-data thead th { font-size: 12px; font-weight: 600; color: var(--ink-3); }
.chart-data tbody th { font-weight: 500; }
.chart-data td { font-variant-numeric: tabular-nums; }
.chart-data a { color: inherit; text-underline-offset: 2px; }
.chart figcaption { margin-top: 12px; display: grid; gap: 6px; font-size: 14px; color: var(--ink-2); line-height: 1.5; }
.chart-note { font-size: 13px; }
.chart-meta { font-size: 12px; color: var(--ink-3); display: flex; flex-wrap: wrap; gap: 4px 12px; }
.chart-meta a { color: inherit; text-underline-offset: 2px; }

@container page (min-width: 900px) {
  .chart-svg text { font-size: 14px; }
}