/**
 * Progress Tracker token overrides — Layer 4 of the MFF architecture.
 *
 * Relationship to core: MFF core identity × performance instrument.
 * This scope inherits every core token in tokens.css and overrides only a
 * controlled subset — surface temperature and density — to feel more
 * technical/product-like without becoming a different brand.
 *
 * What is NOT overridden here (Level 1 core, per docs/governance):
 * logo usage, action/yellow, charcoal/bone as the base hue family,
 * typography families, accessibility minimums (focus ring, contrast, floors).
 *
 * Apply by wrapping the product root: <div data-mff-product="progress-tracker">
 */
[data-mff-product='progress-tracker'] {
  /* Cooler, blue-grey-leaning neutrals — derived from the CONFIRMED core
     blue-grey tokens (--mff-ink-eyebrow, --mff-data-label), not a new hue family. */
  --mff-color-surface: #ebeeec;
  --mff-color-surface-inverse: #20262a;
  --mff-color-background-inverse: #1c2226;

  /* Denser layout rhythm than the marketing site */
  --mff-space-section-h: var(--mff-space-6); /* 24px, vs core 80px desktop marketing padding */
  --mff-space-section-v: var(--mff-space-8); /* 32px */
  --mff-space-card-gap: var(--mff-space-3); /* 12px, tighter grid */

  /* Compact interactive controls */
  --mff-control-padding-y: 8px;
  --mff-control-padding-x: 14px;
  --mff-control-radius: var(--mff-radius-chip); /* 6px, slightly tighter than marketing buttons */

  /* Data hierarchy leans harder on mono — larger default mono scale than marketing use */
  --mff-text-mono-emphasis: 1.25rem;

  /* Subtle measurement-grid motif backing (used sparingly — see docs) */
  --mff-pt-grid-line: rgba(74, 90, 95, 0.08);
}