:root {
  --ui-bg-page: #eef2fb;
  --ui-bg-main: #f8faff;
  --ui-bg-panel: #ffffff;
  --ui-bg-surface: #eef2ff;
  --ui-bg-modal: #ffffff;
  --ui-bg-hover: #e6ebf8;
  --ui-bg-active: #dce5fb;
  --ui-text-primary: #0f172a;
  --ui-text-secondary: #475569;
  --ui-text-muted: #64748b;
  --ui-border: #d2daec;
  --ui-accent: #6366f1;
  --ui-accent-hover: #4f46e5;
  --ui-overlay: rgba(15, 23, 42, 0.52);
  --ui-overlay-strong: rgba(2, 6, 23, 0.84);
  --ui-modal-shadow: 0 24px 70px rgba(15, 23, 42, 0.26);
  --ui-popover-shadow: 0 16px 42px rgba(15, 23, 42, 0.2);
  --ui-scroll-thumb: #94a3b8;
  --ui-scroll-thumb-hover: #64748b;
  --ui-tooltip-bg: #0f172a;
  --ui-panel-glass: rgba(255, 255, 255, 0.76);
  --ui-panel-glass-strong: rgba(255, 255, 255, 0.9);
  --ui-panel-highlight: rgba(255, 255, 255, 0.76);
  --ui-panel-edge: rgba(99, 102, 241, 0.18);
  --ui-shell-shadow: 0 20px 48px rgba(15, 23, 42, 0.12);
  --ui-shell-shadow-strong: 0 28px 80px rgba(15, 23, 42, 0.18);
  --ui-shell-inset: inset 0 1px 0 rgba(255, 255, 255, 0.8), inset 0 -1px 0 rgba(148, 163, 184, 0.14);
  --ui-page-glow-1: rgba(99, 102, 241, 0.16);
  --ui-page-glow-2: rgba(14, 165, 233, 0.12);
}

html.dark {
  --ui-bg-page: #23262f;
  --ui-bg-main: #2b2e37;
  --ui-bg-panel: #242730;
  --ui-bg-surface: #1a1d24;
  --ui-bg-modal: #262a34;
  --ui-bg-hover: #343847;
  --ui-bg-active: #3b4152;
  --ui-text-primary: #f2f3f5;
  --ui-text-secondary: #dbdee1;
  --ui-text-muted: #949ba4;
  --ui-border: #3c4252;
  --ui-accent: #818cf8;
  --ui-accent-hover: #6366f1;
  --ui-overlay: rgba(3, 4, 5, 0.62);
  --ui-overlay-strong: rgba(2, 3, 4, 0.9);
  --ui-modal-shadow: 0 28px 76px rgba(0, 0, 0, 0.55);
  --ui-popover-shadow: 0 16px 44px rgba(0, 0, 0, 0.42);
  --ui-scroll-thumb: #4e5058;
  --ui-scroll-thumb-hover: #6b7280;
  --ui-tooltip-bg: #111214;
  --ui-panel-glass: rgba(27, 31, 40, 0.76);
  --ui-panel-glass-strong: rgba(31, 35, 45, 0.9);
  --ui-panel-highlight: rgba(255, 255, 255, 0.08);
  --ui-panel-edge: rgba(129, 140, 248, 0.18);
  --ui-shell-shadow: 0 26px 56px rgba(0, 0, 0, 0.36);
  --ui-shell-shadow-strong: 0 38px 96px rgba(0, 0, 0, 0.52);
  --ui-shell-inset: inset 0 1px 0 rgba(255, 255, 255, 0.07), inset 0 -1px 0 rgba(255, 255, 255, 0.02);
  --ui-page-glow-1: rgba(129, 140, 248, 0.18);
  --ui-page-glow-2: rgba(34, 211, 238, 0.08);
}