:root {
  /* Brand colors: Blue + Yellow */
  --color-primary: #0b5fff;
  --color-primary-dark: #0846c2;
  --color-primary-light: #4c8bff;
  --color-accent: #ffc107;
  --color-accent-dark: #e6ab00;

  --color-bg: #ffffff;
  --color-bg-alt: #f5f8ff;
  --color-surface: #ffffff;
  --color-text: #10192e;
  --color-text-muted: #5b6478;
  --color-border: #e4e9f2;

  --color-success: #17b26a;
  --color-warning: #ffc107;
  --color-danger: #ef4444;
  --color-info: #0b5fff;

  --font-heading: "Poppins", "Segoe UI", sans-serif;
  --font-body: "Inter", "Segoe UI", sans-serif;

  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-pill: 999px;

  --shadow-sm: 0 2px 8px rgba(16, 25, 46, 0.06);
  --shadow-md: 0 8px 24px rgba(16, 25, 46, 0.1);
  --shadow-lg: 0 20px 48px rgba(16, 25, 46, 0.16);

  --glass-bg: rgba(255, 255, 255, 0.65);
  --glass-border: rgba(255, 255, 255, 0.35);

  --container-width: 1180px;
  --header-height: 76px;

  --transition-fast: 0.15s ease;
  --transition-base: 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 0.5s cubic-bezier(0.4, 0, 0.2, 1);

  --z-header: 100;
  --z-overlay: 200;
  --z-modal: 300;
  --z-toast: 400;
}

[data-theme="dark"] {
  --color-bg: #0b1120;
  --color-bg-alt: #0f172a;
  --color-surface: #131c30;
  --color-text: #eef2ff;
  --color-text-muted: #9aa4bf;
  --color-border: #223052;

  --glass-bg: rgba(19, 28, 48, 0.65);
  --glass-border: rgba(255, 255, 255, 0.08);
}