/* /demos/bench-lab ----------------------------------------------------------
   A scoreboard, a prediction table, and an errata block. Every color is an
   existing estate token — no new hex — so both themes follow without a second
   palette.

   BOTH TABLE WRAPPERS ARE .table-responsive AND CARRY THEIR a11y ATTRIBUTES IN
   THE MARKUP, per the house rule css.css states at its .zk-table-wrap block and
   responsive.spec.js enforces since PF-S267: tabindex="0", role="region" and an
   aria-label. Nothing here re-declares the scroll behavior — the shared class
   already has it, with the edge cue and the focus ring. */

.bl-board .bl-num,
.bl-pred .bl-num {
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

/* The headline metric. USD per correct answer is the number the whole harness
   exists to produce — a model half the price that is right half as often costs
   the same — so it is the one weighted column. */
.bl-board .bl-headline {
  font-weight: 600;
}

.bl-board .bl-acc {
  font-variant-numeric: tabular-nums;
}

/* A FIGURE THE PAGE ASKS YOU NOT TO TRUST ACROSS ROWS, marked as such rather
   than removed. Removing it would hide the finding; presenting it like the
   others would let a reader take a metric artifact for a fact. The muting is
   paired with a caveat paragraph, because color alone is not a claim anyone
   can read aloud. */
.bl-board .bl-suspect {
  color: var(--ink-muted);
  font-style: italic;
}

.bl-pred .bl-verdict {
  font-weight: 600;
  overflow-wrap: anywhere;
}

.bl-caveat {
  border-left: 3px solid var(--accent);
  padding-left: 0.9rem;
  color: var(--ink-muted);
}

.bl-why {
  margin: 0.75rem 0;
  color: var(--ink-muted);
}

.bl-erratum {
  margin: 1.25rem 0;
  padding: 1rem 1.1rem;
  border: 1px solid var(--hairline);
  border-radius: var(--radius-card);
  background: var(--surface-alt);
}
.bl-erratum h3 {
  margin-top: 0;
  font-size: 1.05rem;
}
.bl-erratum__sev {
  font-size: 0.8rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-muted);
}
.bl-erratum__fix {
  margin-bottom: 0;
  color: var(--ink-muted);
}