:root {
  /* Typography */
  --font-family: 'Manrope', 'Space Grotesk', 'Segoe UI', sans-serif;
  --font-family-display: 'Space Grotesk', 'Manrope', 'Segoe UI', sans-serif;
  --font-size-base: 14px;
  --line-height-base: 1.5;

  /* Colors */
  --color-bg: #f3f6fb;
  --color-bg-alt: #eef2f8;
  --color-surface: #ffffff;
  --color-surface-alt: #f8fafc;
  --color-border: rgba(15, 23, 42, 0.12);
  --color-border-muted: rgba(15, 23, 42, 0.08);
  --color-text: #0f172a;
  --color-text-muted: #64748b;

  --color-primary: #2563eb;
  --color-primary-hover: #1d4ed8;
  --color-accent: #14b8a6;
  --color-danger: #dc2626;
  --color-danger-hover: #b91c1c;
  --color-warning: #f59e0b;

  --bg-gradient:
    radial-gradient(900px 480px at 15% -10%, rgba(37, 99, 235, 0.16), transparent 60%),
    radial-gradient(900px 500px at 110% 0%, rgba(20, 184, 166, 0.14), transparent 55%);

  /* Sidebar default (light, professional) */
  --brand-sidebar-bg: #f8fafc;
  --brand-sidebar-surface: #eef2f7;
  --brand-sidebar-border: rgba(15, 23, 42, 0.12);
  --brand-sidebar-text: #0f172a;
  --brand-sidebar-muted: #64748b;
  --brand-sidebar-accent: #2563eb;
  --brand-sidebar-accent-soft: rgba(37, 99, 235, 0.12);
  --brand-sidebar-accent-strong: rgba(37, 99, 235, 0.25);
  --brand-sidebar-hover: rgba(15, 23, 42, 0.06);

  /* Spacing */
  --space-xs: 6px;
  --space-sm: 10px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;

  /* Radius */
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 18px;

  /* Shadows */
  --shadow-sm: 0 4px 10px -8px rgba(15, 23, 42, 0.4);
  --shadow-md: 0 10px 28px -18px rgba(15, 23, 42, 0.55);
  --shadow-lg: 0 18px 40px -22px rgba(15, 23, 42, 0.6);

  /* Focus */
  --focus-ring: 0 0 0 3px rgba(37, 99, 235, 0.25);

  /* Table */
  --table-header-bg: var(--color-surface-alt);
  --table-row-hover-bg: rgba(37, 99, 235, 0.06);

  /* Form */
  --form-bg: var(--color-surface);
  --form-border: var(--color-border);
  --form-radius: var(--radius-sm);
  --form-padding: 10px;
}