:root {
  /* Brand */
  --primary: #7C3AED;
  --primary-hover: #6D28D9;
  --primary-light: #F5F3FF;
  --accent-pink: #EC4899;

  /* Semantic */
  --success: #16A34A;
  --success-light: #F0FDF4;
  --danger: #DC2626;
  --danger-light: #FEF2F2;
  --warning: #D97706;
  --warning-light: #FFFBEB;
  --info: #0891B2;
  --info-light: #ECFEFF;

  /* Surfaces */
  --bg: #F8FAFC;
  --surface: #FFFFFF;
  --surface-hover: #F1F5F9;
  --border: #E2E8F0;
  --border-strong: #CBD5E1;

  /* Text */
  --text: #0F172A;
  --text-muted: #64748B;
  --text-subtle: #94A3B8;
  --text-on-dark: #E2E8F0;

  /* Sidebar */
  --sidebar-bg: #0F172A;
  --sidebar-bg-hover: #1E293B;
  --sidebar-text: #94A3B8;
  --sidebar-text-active: #FFFFFF;
  --sidebar-active-bg: #7C3AED;

  /* Shape */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;

  /* Elevation */
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
  --shadow-md: 0 1px 3px rgba(15, 23, 42, 0.06), 0 4px 12px rgba(15, 23, 42, 0.05);
  --shadow-lg: 0 4px 16px rgba(15, 23, 42, 0.08), 0 16px 40px rgba(15, 23, 42, 0.08);

  /* Motion */
  --transition-fast: 150ms ease;
  --transition: 200ms ease;

  /* Type */
  --font-family: "Cairo", "Segoe UI", sans-serif;

  /* Layout */
  --sidebar-width: 260px;
  --topbar-height: 64px;
}