{#- HDR supervision track record, driven by `criteria.supervision` in
    data/criteria.yaml. One column per cohort; each column draws `n` markers
    (so the count is legible at a glance) plus a label and sub-label, and the
    outcome cards underneath grow to fit their wrapped text. Column widths,
    marker spacing and canvas height are all computed — add / remove / reorder
    cohorts and outcomes freely and never edit the SVG. `shape` is one of
    filled | open | square | diamond. -#}
{%- set sv = criteria.supervision -%}
{%- set X0 = 15 -%}{%- set X1 = 705 -%}{%- set W = X1 - X0 -%}
{%- set groups = sv.groups or [] -%}
{%- set ng = groups | length -%}
{%- set COL_W = W / ng -%}
{%- set SPACING = sv.marker_spacing | default(18) -%}
{%- set MY = 27 -%}
{%- set COL_BOTTOM = 64 -%}
{%- set OUT_TOP = COL_BOTTOM + 10 -%}
{%- set OUT_GAP = 10 -%}
{%- set nout = sv.outcomes | length if sv.outcomes else 0 -%}
{%- set OUT_W = (W - (nout - 1) * OUT_GAP) / nout if nout else W -%}
{%- set OUT_WRAP = sv.outcome_wrap | default(64) -%}
{%- set OUT_LH = 10.5 -%}
{%- set nso = namespace(max_lines=1) -%}
{%- for o in (sv.outcomes or []) -%}
  {%- set ol = (o | wordwrap(OUT_WRAP, break_long_words=False)).split('\n') -%}
  {%- if ol | length > nso.max_lines -%}{%- set nso.max_lines = ol | length -%}{%- endif -%}
{%- endfor -%}
{%- set OUT_H = 12 + nso.max_lines * OUT_LH + 8 -%}
{%- set height = (OUT_TOP + OUT_H + 6) if nout else (COL_BOTTOM + 6) -%}
<p class="figcap">{{ sv.caption }}</p>
<svg viewBox="0 0 720 {{ height | round(1) }}" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="{{ sv.aria or sv.caption }}">
  {%- for g in groups %}
  {%- set cc = X0 + loop.index0 * COL_W + COL_W / 2 %}
  {%- set start = cc - (g.n - 1) * SPACING / 2 %}

  {%- if not loop.first %}
  <line x1="{{ (X0 + loop.index0 * COL_W) | round(1) }}" y1="12" x2="{{ (X0 + loop.index0 * COL_W) | round(1) }}" y2="{{ COL_BOTTOM - 6 }}" stroke="#e6edf7" stroke-width="1"/>
  {%- endif %}

  <g><title>{{ g.title or (g.n ~ ' — ' ~ g.label) }}</title>
    {%- for i in range(g.n) %}
    {%- set mx = start + i * SPACING %}
    {%- if g.shape == 'open' %}
    <circle cx="{{ mx | round(1) }}" cy="{{ MY }}" r="6" fill="#ffffff" stroke="#1a5faa" stroke-width="1.6"/>
    {%- elif g.shape == 'square' %}
    <rect x="{{ (mx - 5.6) | round(1) }}" y="{{ MY - 5.6 }}" width="11.2" height="11.2" rx="2.2" fill="#7ba3d0"/>
    {%- elif g.shape == 'diamond' %}
    <path d="M{{ mx | round(1) }} {{ MY - 7 }} L{{ (mx + 7) | round(1) }} {{ MY }} L{{ mx | round(1) }} {{ MY + 7 }} L{{ (mx - 7) | round(1) }} {{ MY }} Z" fill="#aac6e4" stroke="#7ba3d0" stroke-width="1"/>
    {%- else %}
    <circle cx="{{ mx | round(1) }}" cy="{{ MY }}" r="6" fill="#0f3f73"/>
    {%- endif %}
    {%- endfor %}
  </g>

  <text x="{{ cc | round(1) }}" y="50" text-anchor="middle" font-size="9.2" font-weight="700" fill="#1c1f23">{{ g.n }} — {{ g.label }}</text>
  {%- if g.sub %}
  <text x="{{ cc | round(1) }}" y="61" text-anchor="middle" font-size="8.2" fill="#8a9099">{{ g.sub }}</text>
  {%- endif %}
  {%- endfor %}

  {%- for o in (sv.outcomes or []) %}
  {%- set ox = X0 + loop.index0 * (OUT_W + OUT_GAP) %}
  {%- set ol = (o | wordwrap(OUT_WRAP, break_long_words=False)).split('\n') %}
  <rect x="{{ ox | round(1) }}" y="{{ OUT_TOP }}" width="{{ OUT_W | round(1) }}" height="{{ OUT_H | round(1) }}" rx="6" fill="#f2f6fb" stroke="#c6d4e4" stroke-width="0.8"/>
  <text x="{{ (ox + 11) | round(1) }}" y="{{ OUT_TOP + 15 }}" font-size="8.6" fill="#555b63">
    {%- for line in ol %}<tspan x="{{ (ox + 11) | round(1) }}" dy="{{ 0 if loop.first else OUT_LH }}">{{ line }}</tspan>{%- endfor %}
  </text>
  {%- endfor %}
</svg>