/* Design tokens: CSS variables for the design system.
   Loaded FIRST, before base.css. Change here -> whole UI updates.
   ASCII-only comments (Cyrillic in CSS breaks parsing on this Windows stack). */

:root {
  /* Palette */
  --color-bg:           #f7f8fa;
  --color-surface:      #ffffff;
  --color-surface-alt:  #f9fafb;
  --color-border:       #eceef2;
  --color-border-soft:  #f3f4f7;

  --color-text:         #11131a;
  --color-text-muted:   #6b7280;
  --color-text-subtle:  #9ca3af;

  --color-primary:      #6366f1;
  --color-primary-hover:#4f46e5;
  --color-primary-soft: #eef0ff;

  --color-success:      #16a34a;
  --color-success-soft: #dcfce7;
  --color-success-text: #15803d;

  --color-warning:      #d97706;
  --color-warning-soft: #fef3c7;
  --color-warning-text: #92400e;

  --color-danger:       #dc2626;
  --color-danger-soft:  #fee2e2;
  --color-danger-text:  #b91c1c;

  --color-vip:          #f59e0b;
  --color-vip-soft:     #fef3c7;
  --color-vip-text:     #78350f;

  --color-link:         #6366f1;
  --color-link-hover:   #4f46e5;

  /* Sidebar (graphite) */
  --color-sidebar:      #161922;
  --color-sidebar-soft: #1d212e;

  /* Shadows (soft) */
  --shadow-sm:          0 1px 2px rgba(16, 18, 27, 0.05);
  --shadow:             0 1px 3px rgba(16, 18, 27, 0.06), 0 8px 24px rgba(16, 18, 27, 0.05);
  --shadow-md:          0 12px 32px rgba(16, 18, 27, 0.10);

  /* Radii */
  --radius-sm: 8px;
  --radius:    10px;
  --radius-md: 14px;
  --radius-lg: 18px;
  --radius-xl: 20px;
  --radius-pill: 9999px;

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

  /* Typography */
  --font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                 "Helvetica Neue", Arial, sans-serif;
  --font-mono:   "SF Mono", "Cascadia Code", Consolas, monospace;

  --fs-xs:   11px;
  --fs-sm:   12px;
  --fs-base: 13px;
  --fs-md:   14px;
  --fs-lg:   16px;
  --fs-xl:   20px;
  --fs-2xl:  24px;
  --fs-3xl:  32px;

  --fw-regular: 400;
  --fw-medium:  500;
  --fw-semibold:600;
  --fw-bold:    700;

  /* Layout */
  --sidebar-width: 240px;
  --topbar-height: 56px;
  --content-max:   1280px;

  /* Animation */
  --ease:        cubic-bezier(0.4, 0, 0.2, 1);
  --transition:  150ms var(--ease);
}