:root {
  /* Typography — Red Hat Display everywhere (matches the login page's look);
     hierarchy comes from the size/weight scale below, not from mixing families. */
  --tm-font-sans: "Red Hat Display", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --tm-font-display: var(--tm-font-sans);
  --tm-type-2xs: 0.6875rem; /* 11px — caption floor, uppercase eyebrows */
  --tm-type-xs: 0.75rem;    /* 12px — captions, badges, pills */
  --tm-type-sm: 0.8125rem;  /* 13px — labels, secondary copy, buttons */
  --tm-type-md: 0.875rem;   /* 14px — body default */
  --tm-type-lg: 0.9375rem;  /* 15px — card titles, emphasized rows */
  --tm-type-xl: 1rem;       /* 16px */
  --tm-type-title: 1.125rem;   /* 18px — page titles */
  --tm-type-heading: 1.25rem;  /* 20px — section headings */
  --tm-type-metric: 1.5rem;    /* 24px — KPI values */
  --tm-type-display: 1.75rem;  /* 28px — large KPI values */
  --tm-type-hero: 2rem;        /* 32px — dialog / auth headlines */
  --tm-type-jumbo: 2.5rem;     /* 40px — oversized hero figures */

  --tm-leading-tight: 1.15;
  --tm-leading-title: 1.25;
  --tm-leading-body: 1.5;
  --tm-leading-relaxed: 1.65;

  --tm-tracking-tight: 0;
  --tm-tracking-normal: 0.004em;
  --tm-tracking-label: 0.018em;
  --tm-tracking-caps: 0.02em;

  --tm-weight-regular: 400;
  --tm-weight-medium: 500;
  --tm-weight-semibold: 600;
  --tm-weight-bold: 700;
  --tm-weight-heavy: 800;

  /* Semantic type roles */
  --tm-text-caption: var(--tm-type-xs);
  --tm-text-label: var(--tm-type-sm);
  --tm-text-body: var(--tm-type-md);
  --tm-text-button: var(--tm-type-sm);
  --tm-text-card-title: var(--tm-type-lg);
  --tm-text-page-title: var(--tm-type-title);
  --tm-text-section-title: var(--tm-type-heading);
  --tm-text-kpi: var(--tm-type-metric);

  /* Spacing */
  --tm-space-0: 0;
  --tm-space-1: 0.25rem;
  --tm-space-2: 0.5rem;
  --tm-space-3: 0.75rem;
  --tm-space-4: 1rem;
  --tm-space-5: 1.25rem;
  --tm-space-6: 1.5rem;
  --tm-space-8: 2rem;

  /* Controls and surfaces */
  --tm-control-xs: 1.75rem;
  --tm-control-sm: 2rem;
  --tm-control-md: 2.125rem;
  --tm-control-lg: 2.5rem;
  --tm-field-height: 2.75rem;
  --tm-textarea-min: 5.5rem;

  --tm-radius-xs: 0.375rem;
  --tm-radius-sm: 0.5rem;
  --tm-radius-md: 0.625rem;
  --tm-radius-lg: 0.75rem;
  --tm-radius-pill: 999rem;

  --tm-panel-padding: 1rem;
  --tm-panel-gap: 0.75rem;
  --tm-section-gap: 0.875rem;
  --tm-page-gap: 1rem;
  --tm-field-gap: 0.375rem;
  --tm-form-gap: 0.75rem;

  /* Dashboard composition */
  --tm-kpi-min-height: 6.5rem;
  --tm-overview-column: minmax(0, 1fr);
  --tm-dashboard-row-min: 12rem;
}
