:root {
  color-scheme: light;
  --desk-canvas: #ecf0f4;
  --desk-surface: #ffffff;
  --desk-surface-muted: #f7f8fa;
  --desk-surface-strong: #edf1f5;
  --desk-sidebar: #0b132b;
  --desk-sidebar-hover: #17233f;
  --desk-sidebar-text: #d7deea;
  --desk-border: #e4e8ee;
  --desk-border-strong: #d3d9e2;
  --desk-text: #202342;
  --desk-body: #44526c;
  --desk-muted: #7f92a9;
  --desk-primary: #1b00ff;
  --desk-primary-hover: #100099;
  --desk-success: #28a745;
  --desk-warning: #f5a623;
  --desk-danger: #dc3545;
  --desk-shadow-card: 0 0 28px rgb(0 0 0 / 8%);
  --desk-shadow-menu: 0 12px 35px rgb(0 0 0 / 16%);
  --desk-radius: 10px;
  --desk-radius-sm: 8px;
  --desk-sidebar-width: 280px;
  --desk-sidebar-collapsed: 76px;
  --desk-header-height: 70px;
  --desk-content-width: 1440px;
  --desk-page-pad: 28px;
  --desk-section-gap: 28px;
  --desk-card-gap: 20px;
  --desk-card-pad: 22px;
  --desk-font: "Inter", "Segoe UI Variable", "Segoe UI", sans-serif;
}

body:not(.light-theme) {
  color-scheme: dark;
  --desk-canvas: #101828;
  --desk-surface: #182230;
  --desk-surface-muted: #1d2939;
  --desk-surface-strong: #243244;
  --desk-border: #344054;
  --desk-border-strong: #475467;
  --desk-text: #f2f4f7;
  --desk-body: #d0d5dd;
  --desk-muted: #98a2b3;
  --desk-shadow-card: 0 0 28px rgb(0 0 0 / 18%);
  --desk-shadow-menu: 0 16px 40px rgb(0 0 0 / 32%);
}