/* Degenerate Friendly — design tokens (Modernist)
   Drop this in once and reference the variables everywhere.
   Never hard-code a hex in page CSS; use var(--df-*). */

:root {
  /* Ground + ink */
  --df-bg:          #f3f2f2;
  --df-surface:     #eae9e9;
  --df-ink:         #201e1d;
  --df-ink-soft:    #2d2b2b;

  /* Neutrals */
  --df-n-300:       #d7d3d3;
  --df-n-400:       #bab6b6;
  --df-n-500:       #9b9797;
  --df-n-600:       #7d7979;
  --df-n-700:       #605d5d;

  /* Accent (single red — mono scheme) */
  --df-accent:      #ec3013;  /* fields, primary action, 8px quote rules */
  --df-accent-100:  #fff2ef;  /* tinted fills, row hover */
  --df-accent-300:  #ffc4b8;  /* meter track */
  --df-accent-400:  #ff9783;  /* accent text on ink */
  --df-accent-600:  #dd2b0f;  /* pressed on light ground */
  --df-accent-700:  #ae1800;  /* accent text at body size, links */

  /* Type — Archivo only, 400/500/600/700/800/900 */
  --df-font: "Archivo", system-ui, sans-serif;

  /* Spacing scale (4px base) */
  --df-1: 4px;  --df-2: 8px;  --df-3: 12px; --df-4: 16px;
  --df-6: 24px; --df-8: 32px; --df-10: 40px; --df-13: 52px;

  /* Structure */
  --df-radius: 0;                    /* never round a corner */
  --df-rule: 2px solid var(--df-ink);      /* major section divider */
  --df-rule-hair: 1px solid var(--df-n-300); /* table row rule only */
  --df-page: 1180px;                 /* max content width */
}