/* Cardio fitness card on the Labs tab (static/cardio.js). Builds on body-comp.css (tiles, picker, charts, footer use
   its bc-* classes); only the threshold rows are new. Page tokens only; mobile first, nothing scrolls the page. */
#cardio-card[hidden] { display: none; }
.bc-foot a { color: var(--accent); font-weight: 600; }

/* Ventilatory thresholds and fat max: a name, then label/value pairs that wrap as whole items */
.cf-thr { display: grid; gap: 10px; }
.cf-thr-row { display: grid; gap: 6px; min-width: 0; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.cf-thr-name { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; font-size: 13px; min-width: 0; }
.cf-thr-vals { display: flex; flex-wrap: wrap; gap: 6px 22px; margin: 0; font-variant-numeric: tabular-nums; }
.cf-thr-vals div { min-width: 0; }
.cf-thr-vals dt { font-size: 12px; color: var(--ink-3); }
.cf-thr-vals dd { margin: 0; font-size: 15px; font-weight: 700; color: var(--ink); }
.cf-thr-vals .link-btn { font-weight: 700; font-size: 15px; }
.cf-fat { padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }

@media (min-width: 641px) {
  .cf-thr-row { grid-template-columns: minmax(170px, 260px) minmax(0, 1fr); align-items: center; column-gap: 14px; }
}