/* Design tokens — single source of truth for color, type, spacing. */
:root {
  /* Color */
  --color-bg:           #FAFAF7;
  --color-surface:      #FFFFFF;
  --color-fg:           #1A1A1A;
  --color-muted:        #5A5A5A;
  --color-subtle:       #8A8A85;
  --color-border:       #D7D7D2;
  --color-border-soft:  #E8E8E3;

  --color-primary:      #1E5FA8;
  --color-primary-fg:   #FFFFFF;
  --color-primary-soft: #E8F0FB;
  --color-primary-hover:#174780;

  --color-success:      #2E7D32;
  --color-success-soft: #E6F4EA;
  --color-warning:      #B45309;
  --color-warning-soft: #FEF3C7;
  --color-danger:       #B91C1C;
  --color-danger-soft:  #FEE2E2;
  --color-accent:       #785EF0;
  --color-accent-soft:  #ECE5FB;

  /* IBM colorblind-safe statuses */
  --status-easy:        #648FFF;
  --status-medium:      #FFB000;
  --status-hard:        #DC267F;
  --status-l4:          #785EF0;
  --status-board:       #FE6100;

  /* Typography */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               "Helvetica Neue", Arial, sans-serif;
  --font-serif: Georgia, "Iowan Old Style", "Times New Roman", serif;
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  --text-sm:    14px;
  --text-base:  17px;
  --text-md:    18px;
  --text-lg:    20px;
  --text-xl:    24px;
  --text-2xl:   28px;
  --text-3xl:   32px;

  --leading-tight:  1.25;
  --leading-normal: 1.55;
  --leading-loose:  1.75;

  --weight-regular: 400;
  --weight-medium:  500;
  --weight-semibold:600;
  --weight-bold:    700;

  /* Spacing — 8px grid */
  --space-0: 0;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 32px;
  --space-6: 48px;
  --space-7: 64px;

  /* Layout */
  --radius:      6px;
  --radius-sm:   4px;
  --radius-lg:   12px;
  --shadow:      0 1px 3px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.04);
  --shadow-md:   0 4px 12px rgba(0,0,0,0.08), 0 2px 4px rgba(0,0,0,0.04);
  --shadow-lg:   0 10px 30px rgba(0,0,0,0.12);

  --nav-height:  64px;
  --max-content: 1280px;
  --sidebar-w:   240px;

  --tap-min:     44px;

  /* Motion */
  --t-fast:   120ms ease;
  --t-base:   200ms ease;
  --t-slow:   400ms ease;
}
