/* Engaging Data brand tokens, single source of truth for the dark-variant
   palette (see .claude/skills/engaging-data-frontend/references/dark.md).
   Pages should reference var(--edl-*) instead of hand-typing near-black hex
   values, which is how the background/card colors drifted across pages
   (#1a1a2e, #2a2a2a, #233240, #252525, ... all meant to be the same charcoal). */
:root {
  --edl-bg:        #2A2A2A;
  --edl-card:      #2B2F38;
  --edl-card-alt:  #2E3A57;
  --edl-text:      #F8F7F4;
  --edl-white:     #FFFFFF;
  --edl-muted:     #555568;
  --edl-blue:      #3967D9;
  --edl-blue-deep: #2952B8;
  --edl-teal:      #319795;
  --edl-divider:   rgba(255,255,255,0.12);

  /* Liquid-glass chrome, website only (see docs/design/website-design-system.md
     §7a). These are for surfaces that stay dark regardless of the band behind
     them (header, footer, mobile nav panel), as distinct from the band-scoped
     glass tokens in edl-site.css which flip light/dark with .band--light. */
  --edl-glass-chrome-bg:        rgba(26, 27, 31, 0.68);
  --edl-glass-chrome-border:    rgba(255, 255, 255, 0.14);
  --edl-glass-chrome-highlight: rgba(255, 255, 255, 0.22);
  --edl-glass-blur:    24px;
  --edl-glass-blur-sm: 14px;
}