@if (metrics().length > 0) {
  <dl class="metric-list" [attr.aria-labelledby]="labelledBy()">
    @for (metric of metrics(); track metric.id) {
      <div class="metric glass-surface">
        <dt>{{ metric.value }}</dt>
        <dd>
          <span>{{ metric.label }}</span>
          @if (metric.note) {
            <small>{{ metric.note }}</small>
          }
        </dd>
      </div>
    }
  </dl>
}