:root {
  color-scheme: light;

  --ui-color-primary: #7c3aed;
  --ui-color-success: #22c55e;
  --ui-color-warning: #f59e0b;
  --ui-color-destructive: #ef4444;
  --ui-color-info: #4a6298;
  --ui-color-primary-subtle: color-mix(in srgb, var(--ui-color-primary) 14%, transparent);
  --ui-color-success-subtle: color-mix(in srgb, var(--ui-color-success) 14%, transparent);
  --ui-color-warning-subtle: color-mix(in srgb, var(--ui-color-warning) 16%, transparent);
  --ui-color-destructive-subtle: color-mix(in srgb, var(--ui-color-destructive) 14%, transparent);
  --ui-color-info-subtle: color-mix(in srgb, var(--ui-color-info) 14%, transparent);

  --ui-color-background: #ffffff;
  --ui-color-foreground: #09090b;
  --ui-color-card: #ffffff;
  --ui-color-card-foreground: #09090b;
  --ui-color-muted: #f4f4f5;
  --ui-color-muted-foreground: #71717a;
  --ui-color-accent: #f4f4f5;
  --ui-color-accent-foreground: #09090b;
  --ui-color-border: #e4e4e7;
  --ui-color-border-soft: #ececf1;
  --ui-color-border-strong: #d4d4d8;
  --ui-color-input: #ffffff;
  --ui-color-overlay: rgba(0, 0, 0, 0.35);
  --ui-color-inverse: #09090b;
  --ui-color-ring: #18181b;
  --ui-color-on-brand: #ffffff;
  --ui-color-on-primary: #ffffff;

  --ui-text-primary: var(--ui-color-foreground);
  --ui-text-secondary: #71717a;
  --ui-text-muted: var(--ui-color-muted-foreground);
  --ui-text-placeholder: #a1a1aa;
  --ui-text-disabled: #a1a1aa;
  --ui-text-on-brand: var(--ui-color-on-brand);
  --ui-text-on-primary: var(--ui-color-on-primary);

  --el-font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --el-font-size-base: 14px;

  --el-border-radius-base: var(--ui-radius-control);
  --el-box-shadow: rgba(0, 0, 0, 0.05) 1px 1px 5px 1px;
  --el-menu-base-level-padding: 15px;
  --el-popover-border-radius: 4px;

  --el-color-primary: #7c3aed;
  --el-color-primary-rgb: 124, 58, 237;
  --el-color-primary-light-3: #9353f0;
  --el-color-primary-light-5: #a855f7;
  --el-color-primary-light-7: #c084fc;
  --el-color-primary-light-8: #ddd6fe;
  --el-color-primary-light-9: #ede9fe;
  --el-color-primary-light-10: #f5f3ff;
  --el-color-primary-dark-2: #6d28d9;

  --el-bg-color: #ffffff;
  --el-bg-color-page: var(--ui-color-muted);
  --el-bg-color-overlay: #ffffff;
  --el-fill-color: #f8f8fa;
  --el-fill-color-light: #f4f4f5;
  --el-fill-color-lighter: #f7f7f8;
  --el-fill-color-blank: #ffffff;

  --el-text-color-primary: var(--ui-text-primary);
  --el-text-color-regular: var(--ui-text-secondary);
  --el-text-color-secondary: var(--ui-text-muted);
  --el-text-color-placeholder: var(--ui-text-placeholder);
  --el-text-color-disabled: var(--ui-text-disabled);

  --el-border-color: #e4e4e7;
  --el-border-color-light: #ececf1;
  --el-border-color-lighter: #f1f1f4;
  --el-border-color-extra-light: #f4f4f5;

  --ui-font-heading: Manrope, var(--el-font-family);
  --ui-font-body: var(--el-font-family);
  --ui-font-mono: "IBM Plex Mono", "SFMono-Regular", ui-monospace, monospace;

  --ui-radius-sm: 4px;
  --ui-radius-control: 8px;
  --ui-radius-card: 12px;
  --ui-radius-modal: 24px;
  --ui-radius-pill: 9999px;
  --ui-body-radius: 16px 16px 0 0;
  --ui-sidebar-width: 15rem;

  --ui-space-xs: 4px;
  --ui-space-sm: 8px;
  --ui-space-md: 12px;
  --ui-space-base: 16px;
  --ui-space-lg: 20px;
  --ui-space-xl: 24px;
  --ui-space-2xl: 32px;
  --ui-space-3xl: 48px;
  --ui-space-inline: var(--ui-space-sm);
  --ui-space-control: var(--ui-space-md);
  --ui-space-card: var(--ui-space-lg);
  --ui-space-section: var(--ui-space-xl);

  --ui-shadow-xs: 0 1px 2px rgb(0 0 0 / 4%);
  --ui-shadow-card: 0 4px 10px rgba(9, 9, 11, 0.08);
  --ui-shadow-pop: 0 8px 24px rgba(9, 9, 11, 0.12);

  --ui-transition-fast: 150ms ease-out;
  --ui-transition-base: 200ms ease-out;

  --ui-layout-shell-bg: linear-gradient(133deg, #daeeff 0%, #f5faff 10%, #f9faff 58%, #fcfcff 100%);

  --ui-bg-page: var(--ui-color-background);
  --ui-bg-card: var(--ui-color-card);
  --ui-bg-muted: var(--ui-color-muted);
  --ui-bg-disabled: #fafafb;
  --ui-bg-overlay: var(--ui-color-overlay);
  --ui-bg-inverse: var(--ui-color-inverse);

  --ui-border-default: var(--ui-color-border);
  --ui-border-soft: var(--ui-color-border-soft);
  --ui-border-strong: var(--ui-color-border-strong);
  --ui-border-interactive: #8f8f8f;
  --ui-ring: var(--ui-color-ring);
  --ui-dialog-border: color-mix(in srgb, var(--ui-border-strong) 78%, var(--ui-border-default));
  --ui-dialog-shadow: 0 20px 64px color-mix(in srgb, var(--ui-text-primary) 14%, transparent);
  --ui-modal-overlay-bg: var(--el-overlay-color-lighter, var(--ui-bg-overlay));
  --ui-drawer-border: var(--ui-border-default);
  --ui-drawer-shadow: var(--ui-shadow-pop);
  --ui-table-horizontal-scrollbar-track: color-mix(in srgb, var(--ui-bg-muted) 58%, transparent);
  --ui-table-horizontal-scrollbar-thumb: color-mix(in srgb, var(--ui-text-muted) 42%, transparent);
  --ui-table-horizontal-scrollbar-thumb-hover: color-mix(in srgb, var(--ui-text-muted) 58%, transparent);

  --ui-interactive-hover-bg: #f0f0f1;
  --ui-interactive-hover-fg: var(--ui-text-primary);
  --ui-interactive-selected-bg: color-mix(in srgb, var(--ui-color-primary) 12%, var(--ui-bg-card));
  --ui-interactive-selected-fg: #7c3aed;

  --ui-topnav-bg: #2d2241;
  --ui-topnav-accent: #2d2240;
  --ui-topnav-foreground: #f0edf5;
  --ui-topnav-muted: #e1daed;
  --ui-topnav-border: rgba(240, 237, 245, 0.12);
  --ui-topnav-hover: rgba(240, 237, 245, 0.12);
  --ui-topnav-surface: rgba(240, 237, 245, 0.08);
  --ui-topnav-shadow: 0 14px 40px rgba(0, 0, 0, 0.35);
  --ui-topnav-avatar-bg: #7c3aed;
  --ui-topnav-avatar-fg: #ffffff;
  --ui-avatar-bg: #ede9fe;
  --ui-avatar-fg: #7c3aed;
  --ui-avatar-border: rgba(124, 58, 237, 0.2);
  --ui-topnav-active-bg: #312870;
  --ui-topnav-active-fg: #c4bdff;

  --ui-sidebar-bg: #fafafa;
  --ui-sidebar-accent: #f4f4f5;
  --ui-sidebar-foreground: #09090b;
  --ui-sidebar-section-fg: #52525b;
  --ui-sidebar-border: #e4e4e7;
  --ui-sidebar-active-bg: var(--ui-interactive-selected-bg);
  --ui-sidebar-active-fg: var(--ui-interactive-selected-fg);
  --ui-sidebar-hover-bg: var(--ui-interactive-hover-bg);
  --ui-sidebar-hover-fg: var(--ui-interactive-hover-fg);
  --ui-sidebar-section-title-fg: var(--ui-sidebar-foreground, #09090b);
  --ui-sidebar-section-title-active-fg: var(--ui-color-primary);
  --ui-sidebar-section-line: var(--ui-sidebar-border, #e4e4e7);
  --ui-sidebar-section-line-active: #c084fc;
  --ui-sidebar-section-tag-bg: #ede9fe;
  --ui-sidebar-section-tag-border: transparent;
  --ui-sidebar-section-tag-fg: #7c3aed;
  --ui-sidebar-section-tag-dot: #22c55e;
  --ui-sidebar-title-glow: rgba(124, 58, 237, 0.35);

  --ui-badge-purple-bg: #f2eef8;
  --ui-badge-purple-fg: #6a4e9a;
  --ui-badge-blue-bg: #eef1f8;
  --ui-badge-blue-fg: #4a6298;
  --ui-badge-green-bg: #eef5f0;
  --ui-badge-green-fg: #3a7252;
  --ui-badge-orange-bg: #f8f1ec;
  --ui-badge-orange-fg: #8a5e38;
  --ui-badge-yellow-bg: #f7f4ea;
  --ui-badge-yellow-fg: #7a6228;

  --ui-table-header-bg: #f4f4f5;
  --ui-table-row-bg: var(--ui-bg-card);
  --ui-table-row-alt-bg: #fafafa;
}

html.dark {
  color-scheme: dark;

  --ui-color-primary: #c4b5fd;
  --ui-color-success: #4ade80;
  --ui-color-warning: #fbbf24;
  --ui-color-destructive: #f87171;
  --ui-color-info: #7a9ac8;

  --ui-color-background: #09090b;
  --ui-color-foreground: #fafafa;
  --ui-color-card: #18181b;
  --ui-color-card-foreground: #fafafa;
  --ui-color-muted: #27272a;
  --ui-color-muted-foreground: #8b93a5;
  --ui-color-accent: #27272a;
  --ui-color-accent-foreground: #fafafa;
  --ui-color-border: #323238;
  --ui-color-border-soft: #27272a;
  --ui-color-border-strong: #52525b;
  --ui-color-input: #18181b;
  --ui-color-overlay: rgba(0, 0, 0, 0.5);
  --ui-color-inverse: #fafafa;
  --ui-color-ring: #d4d4d8;
  --ui-color-on-brand: #f0edf5;
  --ui-color-on-primary: #0f0d17;

  --ui-text-primary: var(--ui-color-foreground);
  --ui-text-secondary: #d4d4d8;
  --ui-text-muted: var(--ui-color-muted-foreground);
  --ui-text-placeholder: #71717a;
  --ui-text-disabled: #71717a;
  --ui-text-on-brand: var(--ui-color-on-brand);
  --ui-text-on-primary: var(--ui-color-on-primary);

  --el-color-primary: #c4b5fd;
  --el-color-primary-rgb: 196, 181, 253;
  --el-color-primary-light-3: #ddd6fe;
  --el-color-primary-light-5: rgba(196, 181, 253, 0.45);
  --el-color-primary-light-7: rgba(196, 181, 253, 0.35);
  --el-color-primary-light-8: rgba(196, 181, 253, 0.2);
  --el-color-primary-light-9: rgba(196, 181, 253, 0.1);
  --el-color-primary-light-10: rgba(196, 181, 253, 0.05);
  --el-color-primary-dark-2: #a78bfa;

  --el-bg-color: #09090b;
  --el-bg-color-page: var(--ui-color-muted);
  --el-bg-color-overlay: #18181b;
  --el-fill-color: #303030;
  --el-fill-color-light: #27272a;
  --el-fill-color-lighter: #323238;
  --el-fill-color-blank: #18181b;

  --el-text-color-primary: var(--ui-text-primary);
  --el-text-color-regular: var(--ui-text-secondary);
  --el-text-color-secondary: var(--ui-text-muted);
  --el-text-color-placeholder: var(--ui-text-placeholder);
  --el-text-color-disabled: var(--ui-text-disabled);

  --el-border-color: #323238;
  --el-border-color-light: #27272a;
  --el-border-color-lighter: #3f3f46;
  --el-border-color-extra-light: #323238;

  --ui-layout-shell-bg: linear-gradient(180deg, #09090b 0%, #111114 18%, #09090b 100%);

  --ui-bg-page: var(--ui-color-background);
  --ui-bg-card: var(--ui-color-card);
  --ui-bg-muted: var(--ui-color-muted);
  --ui-bg-disabled: #202024;
  --ui-bg-overlay: var(--ui-color-overlay);
  --ui-bg-inverse: var(--ui-color-inverse);

  --ui-border-default: var(--ui-color-border);
  --ui-border-soft: var(--ui-color-border-soft);
  --ui-border-strong: var(--ui-color-border-strong);
  --ui-border-interactive: #71717a;
  --ui-ring: var(--ui-color-ring);
  --ui-dialog-border: color-mix(in srgb, var(--ui-border-strong) 58%, color-mix(in srgb, var(--ui-text-primary) 10%, transparent));
  --ui-dialog-shadow: 0 40px 156px color-mix(in srgb, var(--ui-bg-page) 98%, transparent), 0 20px 68px color-mix(in srgb, var(--ui-bg-page) 90%, transparent);
  --ui-modal-overlay-bg: color-mix(in srgb, var(--ui-bg-page) 78%, transparent);
  --ui-drawer-border: var(--ui-dialog-border);
  --ui-drawer-shadow: -10px 0 28px color-mix(in srgb, var(--ui-bg-page) 54%, transparent);
  --ui-table-horizontal-scrollbar-track: color-mix(in srgb, var(--ui-bg-page) 72%, transparent);
  --ui-table-horizontal-scrollbar-thumb: color-mix(in srgb, var(--ui-text-muted) 38%, transparent);
  --ui-table-horizontal-scrollbar-thumb-hover: color-mix(in srgb, var(--ui-text-muted) 56%, transparent);

  --ui-interactive-hover-bg: #303036;
  --ui-interactive-hover-fg: var(--ui-text-primary);
  --ui-interactive-selected-bg: color-mix(in srgb, var(--ui-color-primary) 20%, var(--ui-bg-card));
  --ui-interactive-selected-fg: color-mix(in srgb, var(--ui-color-primary) 40%, var(--ui-text-primary));

  --ui-topnav-bg: #2d2241;
  --ui-topnav-accent: #2d2240;
  --ui-topnav-foreground: #f0edf5;
  --ui-topnav-muted: #e1daed;
  --ui-topnav-border: rgba(240, 237, 245, 0.12);
  --ui-topnav-hover: rgba(240, 237, 245, 0.12);
  --ui-topnav-surface: rgba(240, 237, 245, 0.08);
  --ui-topnav-shadow: 0 14px 40px rgba(0, 0, 0, 0.35);
  --ui-topnav-avatar-bg: #7c3aed;
  --ui-topnav-avatar-fg: #ffffff;
  --ui-avatar-bg: rgba(168, 85, 247, 0.16);
  --ui-avatar-fg: #c4b5fd;
  --ui-avatar-border: rgba(196, 181, 253, 0.25);

  --ui-sidebar-bg: #18181b;
  --ui-sidebar-accent: #27272a;
  --ui-sidebar-foreground: #fafafa;
  --ui-sidebar-section-fg: #a1a1aa;
  --ui-sidebar-border: #27272a;
  --ui-sidebar-active-bg: var(--ui-interactive-selected-bg);
  --ui-sidebar-active-fg: #c4b5fd;
  --ui-sidebar-hover-bg: var(--ui-interactive-hover-bg);
  --ui-sidebar-hover-fg: var(--ui-interactive-hover-fg);
  --ui-sidebar-section-title-fg: var(--ui-sidebar-foreground, #fafafa);
  --ui-sidebar-section-title-active-fg: var(--ui-color-primary);
  --ui-sidebar-section-line: rgba(255, 255, 255, 0.25);
  --ui-sidebar-section-line-active: rgba(196, 181, 253, 0.70);
  --ui-sidebar-section-tag-bg: rgba(124, 58, 237, 0.25);
  --ui-sidebar-section-tag-border: rgba(196, 181, 253, 0.45);
  --ui-sidebar-section-tag-fg: #ede9fe;
  --ui-sidebar-section-tag-dot: #4ade80;
  --ui-sidebar-title-glow: rgba(196, 181, 253, 0.65);

  --ui-badge-purple-bg: rgba(168, 85, 247, 0.16);
  --ui-badge-purple-fg: #e9d5ff;
  --ui-badge-blue-bg: rgba(59, 130, 246, 0.16);
  --ui-badge-blue-fg: #bfdbfe;
  --ui-badge-green-bg: rgba(34, 197, 94, 0.16);
  --ui-badge-green-fg: #bbf7d0;
  --ui-badge-orange-bg: rgba(249, 115, 22, 0.16);
  --ui-badge-orange-fg: #fed7aa;
  --ui-badge-yellow-bg: rgba(234, 179, 8, 0.16);
  --ui-badge-yellow-fg: #fef08a;

  --ui-table-header-bg: #1f1f22;
  --ui-table-row-bg: var(--ui-bg-card);
  --ui-table-row-alt-bg: #111114;
}