/* ─── LIGHT THEME ─────────────────────────────────────────────── */
body[data-theme="light"] {
  --bg:            #FFFFFF;
  --surface:       #F8FAFB;
  --surface-tint:  rgba(27, 112, 139, 0.04);
  --text-primary:  #334155;   /* dark grey — never black */
  --text-secondary: #64748b;
  --text-muted:    #94a3b8;
  --accent:        #1b708b;   /* teal: 4.6:1 on white, WCAG AA */
  --ghost-border:  rgba(27, 112, 139, 0.15);
  --rule:          #E2E8F0;
  --grid-line:     rgba(27, 112, 139, 0.08);
}

/* ─── DARK THEME ──────────────────────────────────────────────── */
body[data-theme="dark"] {
  --bg:            #0D1F2D;   /* deep teal-navy */
  --surface:       rgba(27, 112, 139, 0.10);
  --surface-tint:  rgba(27, 112, 139, 0.06);
  --text-primary:  #F1F5F9;   /* soft white — not pure white */
  --text-secondary:rgba(255, 255, 255, 0.60);
  --text-muted:    rgba(255, 255, 255, 0.35);
  --accent:        #2d9cba;   /* teal lightened: 4.8:1 on dark bg, WCAG AA */
  --ghost-border:  rgba(45, 156, 186, 0.25);
  --rule:          rgba(255, 255, 255, 0.10);
  --grid-line:     rgba(45, 156, 186, 0.06);
}

/* ─── SHARED TOKENS ───────────────────────────────────────────── */
:root {
  --font-main: 'Space Grotesk', system-ui, sans-serif;
  --radius: 6px;
  --transition: 0.2s ease;
}