:root {
  --font: 'IBM Plex Sans Arabic', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --navy-950: #081426;
  --navy-900: #0d203b;
  --navy-800: #17345b;
  --blue-700: #1f56c3;
  --blue-600: #2f6fec;
  --blue-500: #4b84f3;
  --blue-200: #bdd3ff;
  --blue-100: #dce9ff;
  --blue-50: #f0f5ff;

  --green-700: #147a4b;
  --green-100: #dff7ea;
  --green-50: #f0fbf5;
  --amber-700: #a96107;
  --amber-100: #fff0c9;
  --amber-50: #fff9eb;
  --red-700: #b33131;
  --red-100: #ffe0e0;
  --red-50: #fff4f4;

  --slate-950: #101828;
  --slate-900: #182230;
  --slate-800: #253247;
  --slate-700: #344054;
  --slate-600: #475467;
  --slate-500: #667085;
  --slate-400: #98a2b3;
  --slate-300: #c9d0da;
  --slate-200: #e4e8ef;
  --slate-150: #edf0f4;
  --slate-100: #f2f4f7;
  --slate-50: #f8fafc;
  --white: #ffffff;

  --page: #f6f8fc;
  --surface: #ffffff;
  --surface-muted: #fbfcfe;
  --surface-raised: rgba(255, 255, 255, .9);
  --border: #e5eaf1;
  --border-strong: #d6dde7;

  --shadow-xs: 0 1px 2px rgba(16, 24, 40, .04);
  --shadow-sm: 0 4px 14px rgba(16, 24, 40, .06);
  --shadow-md: 0 14px 36px rgba(16, 24, 40, .09);
  --shadow-lg: 0 28px 70px rgba(16, 24, 40, .16);

  --radius-xs: 8px;
  --radius-sm: 11px;
  --radius-md: 15px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-pill: 999px;

  --sidebar-width: 286px;
  --topbar-height: 74px;
  --content-max: 1500px;
  --ease: 180ms cubic-bezier(.2, .8, .2, 1);
}