:root {
  /* Brand / Background */
  --bg-primary: #05070F;
  --bg-card: #0E1427;
  --bg-secondary: #0A0F1F;
  --bg-elevated: #10182E;

  /* Primary colors — RGB components used by rgba() derivatives */
  --color-primary: #00e5ff;
  --color-primary-dark: #00a3cc;
  --color-primary-rgb: 0, 229, 255;
  --color-primary-dark-rgb: 0, 163, 204;
  --bg-primary-rgb: 5, 7, 15;
  --bg-card-rgb: 14, 20, 39;
  --color-primary-soft: rgba(var(--color-primary-rgb), 0.12);
  --color-primary-border: rgba(var(--color-primary-rgb), 0.25);

  /* Overlay neutro (skeleton/spinner) — branco em tema escuro, preto em tema
     claro. tenant-branding.js recalcula isso a partir do brilho do bgCardColor. */
  --surface-tint-rgb: 255, 255, 255;

  /* Semantic */
  --color-success: #10b981;
  --color-success-soft: rgba(16, 185, 129, 0.15);

  --color-danger: #C8102E;
  --color-danger-soft: rgba(200, 16, 46, 0.15);

  --color-warning: #f59e0b;
  --color-warning-soft: rgba(245, 158, 11, 0.15);

  /* Text */
  --text-primary: #F0F4FA;
  --text-secondary: #A0B3D9;
  --text-muted: #8EA3C2;
  --text-strong: #FFFFFF;

  /* Borders */
  --border-soft: rgba(var(--color-primary-rgb), 0.25);
  --border-strong: rgba(var(--color-primary-rgb), 0.45);
  --border-neutral: #232842;

  /* Radius */
  --radius-xs: 10px;
  --radius-sm: 16px;
  --radius-md: 20px;
  --radius-lg: 28px;
  --radius-xl: 32px;
  --radius-pill: 999px;

  /* Shadows */
  --shadow-soft: 0 15px 30px -12px rgba(var(--color-primary-rgb), 0.10);
  --shadow-card: 0 10px 25px rgba(0, 0, 0, 0.35);
  --shadow-primary-glow: 0 0 18px rgba(var(--color-primary-rgb), 0.25);

  /* Typography */
  --font-main: 'Inter', sans-serif;
  --font-heading: 'Poppins', sans-serif;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.4rem;
  --text-2xl: 1.8rem;

  /* Spacing */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --space-10: 40px;

  /* Layout */
  --container-width: 1400px;
  --sidebar-width: 280px;
  --topbar-height: 84px;

  /* Motion */
  --transition-fast: 0.2s ease;
  --transition-base: 0.25s ease;
  --transition-slow: 0.35s ease;
}