/*
 * Evolve + Lab — page-only layout tweaks. Every block on these pages
 * is a contract component (components/_*.css); this file holds only
 * the spacing between stacked components inside one card body and
 * two lineage-timeline affordances that _lineage.css lacks.
 */

/* Stacked components inside one card body (meter → stats → kv → table)
   get one rhythm; the components themselves carry no outer margin. */
[data-page="evolve"] .card__body > .meter + .stat-grid,
[data-page="evolve"] .card__body > .meter + .kv,
[data-page="evolve"] .card__body > .stat-grid + .kv,
[data-page="evolve"] .card__body > .evolve__badges + .kv,
[data-page="evolve"] .card__body > .more { margin-top: var(--sp-4); }
[data-page="evolve"] .card__body > .sparkline { margin: var(--sp-3) 0; }

/* A .table-wrap that shares its card body with other blocks keeps its
   own border instead of the only-child edge-to-edge bleed. */
[data-page="evolve"] .card__body > .table-wrap:not(:only-child) {
    margin: var(--sp-3) 0;
    width: 100%;
    max-width: 100%;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
}

/* Section labels inside a card body ("Instruction", "Regressed"). */
[data-page="evolve"] .card__body > h3.muted {
    margin: var(--sp-3) 0 var(--sp-1);
    font-size: var(--fs-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: var(--tracking-caps);
}
[data-page="evolve"] .card__body > h3.muted:first-child { margin-top: 0; }

/* Wrapping row of weak-category badges (Data · Curation breakdown). */
.evolve__badges { display: flex; flex-wrap: wrap; gap: var(--sp-1); margin-top: var(--sp-2); }

/* Lineage timeline: the row head wraps on a phone instead of clipping,
   and the chevron turns when the row is open. */
.lineage__head { flex-wrap: wrap; }
.lineage__head > .icon { transition: transform var(--t-fast); flex-shrink: 0; }
.lineage__head[aria-expanded="true"] > .icon { transform: rotate(90deg); }