:root {
  /* --- Backgrounds --- */
  --bg: #fafbfc;
  --bg-alt: #fff;
  --bg-dark: #0f172a;
  --bg-dark-alt: #1e293b;

  /* --- Accents --- */
  --accent: #2563eb;
  --accent-hover: #1d4ed8;
  --accent-light: #dbeafe;
  --accent-subtle: #eff6ff;

  /* --- Text --- */
  --text: #1e293b;
  --text-sec: #475569;
  --text-lt: #64748b;
  --white: #fff;

  /* --- Borders --- */
  --border: #e2e8f0;
  --border-lt: #f1f5f9;

  /* --- Feedback Colors --- */
  --success: #059669;
  --success-bg: #ecfdf5;
  --purple: #7c3aed;
  --purple-lt: #ede9fe;
  --purple-subtle: #f5f3ff;
  --warn: #d97706;
  --warn-bg: #fffbeb;

  /* --- Shadows --- */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.06);
  --shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.08);
  --shadow-xl: 0 20px 60px rgba(0, 0, 0, 0.1);

  /* --- Layout Tokens --- */
  --r: 12px;
  --rl: 16px;
  --container-width: 1180px;
  --nav-height: 72px;
}