:root {
  --el-color-primary: #1d4ed8 !important;
  --el-color-primary-light-3: #6183e4 !important;
  --el-color-primary-light-5: #8ea7ec !important;
  --el-color-primary-light-7: #bbcaf3 !important;
  --el-color-primary-light-8: #d2dcf7 !important;
  --el-color-primary-light-9: #e8edfb !important;
  --el-color-primary-dark-2: #173eac !important;
  --el-color-success: #28c76f;
  --el-color-success-light-3: #6bd89b;
  --el-color-success-light-9: #e2f6e9;
  --el-color-warning: #ff9f43;
  --el-color-warning-light-3: #ffbd79;
  --el-color-warning-light-9: #fff3d9;
  --el-color-danger: #ea5455;
  --el-color-danger-light-3: #f18889;
  --el-color-danger-light-9: #ffe0e6;
  --el-color-error: #ea5455;
  --el-color-error-light-3: #f18889;
  --el-color-error-light-9: #ffe0e6;
  --el-color-info: #06b6d4;
  --el-color-info-light-3: #6ed4e8;
  --el-color-info-light-9: #d9f4fa;
  --el-bg-color: #ffffff;
  --el-bg-color-page: #f4f7fc;
  --el-bg-color-overlay: #ffffff;
  --el-fill-color-blank: #ffffff;
  --el-fill-color: #e9f0fa;
  --el-fill-color-light: #dee8f7;
  --el-text-color-primary: #34405c;
  --el-text-color-regular: #3d4a68;
  --el-text-color-secondary: #66728f;
  --el-border-color: #d9e2f2;
  --el-border-color-light: #dce4f3;
  --el-border-color-lighter: #e7edf7;
  --keel-brand-gradient-from: #1d4ed8;
  --keel-brand-gradient-to: #2563eb;
  --keel-glow: rgba(29, 78, 216, 0.3);
  --keel-card-shadow: 0 0 20px 0 rgba(29, 78, 216, 0.05), 0 2px 8px 0 rgba(0, 0, 0, 0.04);
  --keel-card-shadow-dark: 0 0 20px 0 rgba(0, 0, 0, 0.35);
  --keel-sidebar-active-shadow: 0 17px 20px -8px rgba(29, 78, 216, 0.22);
}

html.dark {
  --el-color-primary: #3b82f6 !important;
  --el-color-primary-light-3: #163ba2 !important;
  --el-color-primary-light-5: #112f82 !important;
  --el-color-primary-light-7: #0d2361 !important;
  --el-color-primary-light-8: #0a1b4c !important;
  --el-color-primary-light-9: #061130 !important;
  --el-color-primary-dark-2: #3a6ae7 !important;
  --el-color-success-light-3: #2e7d5b;
  --el-color-success-light-9: #14302a;
  --el-color-warning-light-3: #8a6a3a;
  --el-color-warning-light-9: #3a2a17;
  --el-color-danger-light-3: #8a3a4d;
  --el-color-danger-light-9: #3a1f2b;
  --el-color-error-light-3: #8a3a4d;
  --el-color-error-light-9: #3a1f2b;
  --el-color-info-light-3: #0b7b93;
  --el-color-info-light-9: #0e2a33;
  --el-bg-color: #101b38;
  --el-bg-color-page: #0b1226;
  --el-bg-color-overlay: #172246;
  --el-fill-color-blank: #101b38;
  --el-fill-color: #16224a;
  --el-fill-color-light: #1d2b57;
  --el-text-color-primary: #c9d6f2;
  --el-text-color-regular: #b7c6eb;
  --el-text-color-secondary: #93a5d4;
  --el-border-color: #243561;
  --el-border-color-light: #2a3d6e;
  --el-border-color-lighter: #1d2b57;
}

html[data-theme=teal] {
  --el-color-primary: #0e9384 !important;
  --el-color-primary-light-3: #4eada0 !important;
  --el-color-primary-light-5: #84c6bc !important;
  --el-color-primary-light-7: #badde7 !important;
  --el-color-primary-light-8: #d6ece8 !important;
  --el-color-primary-light-9: #e5f4f1 !important;
  --el-color-primary-dark-2: #0b7468 !important;
  --el-color-success: #28c76f;
  --el-color-success-light-3: #6bd89b;
  --el-color-success-light-9: #e2f6e9;
  --el-color-warning: #ff9f43;
  --el-color-warning-light-3: #ffbd79;
  --el-color-warning-light-9: #fff3d9;
  --el-color-danger: #ea5455;
  --el-color-danger-light-3: #f18889;
  --el-color-danger-light-9: #ffe0e6;
  --el-color-error: #ea5455;
  --el-color-error-light-3: #f18889;
  --el-color-error-light-9: #ffe0e6;
  --el-color-info: #06b6d4;
  --el-color-info-light-3: #6ed4e8;
  --el-color-info-light-9: #d9f4fa;
  --el-bg-color: #ffffff;
  --el-bg-color-page: #f3faf8;
  --el-bg-color-overlay: #ffffff;
  --el-fill-color-blank: #ffffff;
  --el-fill-color: #e6f1ee;
  --el-fill-color-light: #dceae7;
  --el-text-color-primary: #4b5563;
  --el-text-color-regular: #4b5563;
  --el-text-color-secondary: #6b7d85;
  --el-border-color: #dcede9;
  --el-border-color-light: #dcede9;
  --el-border-color-lighter: #ecf4f2;
  --keel-brand-gradient-from: #0e9384;
  --keel-brand-gradient-to: #06b6d4;
  --keel-glow: rgba(14, 147, 132, 0.3);
  --keel-card-shadow: 0 0 20px 0 rgba(14, 147, 132, 0.05), 0 2px 8px 0 rgba(0, 0, 0, 0.04);
  --keel-card-shadow-dark: 0 0 20px 0 rgba(0, 0, 0, 0.35);
  --keel-sidebar-active-shadow: 0 17px 20px -8px rgba(14, 147, 132, 0.22);
}

html[data-theme=teal].dark {
  --el-color-primary: #0e9384 !important;
  --el-color-primary-light-3: #0c7d70 !important;
  --el-color-primary-light-5: #0a6f63 !important;
  --el-color-primary-light-7: #086056 !important;
  --el-color-primary-light-8: #075249 !important;
  --el-color-primary-light-9: #06443d !important;
  --el-color-primary-dark-2: #2fa898 !important;
  --el-color-success-light-3: #2e7d5b;
  --el-color-success-light-9: #0f2e22;
  --el-color-warning-light-3: #8a6a3a;
  --el-color-warning-light-9: #3a2a17;
  --el-color-danger-light-3: #8a3a4d;
  --el-color-danger-light-9: #3a1f2b;
  --el-color-error-light-3: #8a3a4d;
  --el-color-error-light-9: #3a1f2b;
  --el-color-info-light-3: #0f7b93;
  --el-color-info-light-9: #0e2a33;
  --el-bg-color: #0e2421;
  --el-bg-color-page: #081815;
  --el-bg-color-overlay: #16302c;
  --el-fill-color-blank: #0e2421;
  --el-fill-color: #16302c;
  --el-fill-color-light: #1d3b37;
  --el-text-color-primary: #c7e2dd;
  --el-text-color-regular: #bfd8d3;
  --el-text-color-secondary: #8db0aa;
  --el-border-color: #23413c;
  --el-border-color-light: #23413c;
  --el-border-color-lighter: #1d3b37;
}

html[data-theme=graphite] {
  --el-color-primary: #b45309 !important;
  --el-color-primary-light-3: #c97832 !important;
  --el-color-primary-light-5: #db9e5e !important;
  --el-color-primary-light-7: #ebc395 !important;
  --el-color-primary-light-8: #f2d7b5 !important;
  --el-color-primary-light-9: #f9ecdd !important;
  --el-color-primary-dark-2: #8a3f07 !important;
  --el-color-success: #28c76f;
  --el-color-success-light-3: #6bd89b;
  --el-color-success-light-9: #e2f6e9;
  --el-color-warning: #ea580c;
  --el-color-warning-light-3: #f0894f;
  --el-color-warning-light-9: #fde3d6;
  --el-color-danger: #dc2626;
  --el-color-danger-light-3: #e35a5a;
  --el-color-danger-light-9: #fbe0e0;
  --el-color-error: #dc2626;
  --el-color-error-light-3: #e35a5a;
  --el-color-error-light-9: #fbe0e0;
  --el-color-info: #64748b;
  --el-color-info-light-3: #94a3b8;
  --el-color-info-light-9: #e2e8f0;
  --el-bg-color: #ffffff;
  --el-bg-color-page: #f2f3f5;
  --el-bg-color-overlay: #ffffff;
  --el-fill-color-blank: #ffffff;
  --el-fill-color: #e9ebee;
  --el-fill-color-light: #dfe2e6;
  --el-text-color-primary: #1f2937;
  --el-text-color-regular: #1f2937;
  --el-text-color-secondary: #6b7280;
  --el-border-color: #dce1e7;
  --el-border-color-light: #dce1e7;
  --el-border-color-lighter: #edf0f3;
  --keel-brand-gradient-from: #f59e0b;
  --keel-brand-gradient-to: #b45309;
  --keel-glow: rgba(217, 119, 6, 0.3);
  --keel-card-shadow: 0 0 20px 0 rgba(120, 80, 20, 0.06), 0 2px 8px 0 rgba(0, 0, 0, 0.04);
  --keel-card-shadow-dark: 0 0 20px 0 rgba(0, 0, 0, 0.35);
  --keel-sidebar-active-shadow: 0 17px 20px -8px rgba(217, 119, 6, 0.22);
}

html[data-theme=graphite].dark {
  --el-color-primary: #d97706 !important;
  --el-color-primary-light-3: #b76a10 !important;
  --el-color-primary-light-5: #9a5a14 !important;
  --el-color-primary-light-7: #7e4b18 !important;
  --el-color-primary-light-8: #6e411a !important;
  --el-color-primary-light-9: #5e371c !important;
  --el-color-primary-dark-2: #e8a317 !important;
  --el-color-success-light-3: #2e7d5b;
  --el-color-success-light-9: #0f2e22;
  --el-color-warning-light-3: #8a4a2e;
  --el-color-warning-light-9: #3a1f14;
  --el-color-danger-light-3: #8a3a4d;
  --el-color-danger-light-9: #3a1f27;
  --el-color-error-light-3: #8a3a4d;
  --el-color-error-light-9: #3a1f27;
  --el-color-info-light-3: #41505e;
  --el-color-info-light-9: #202936;
  --el-bg-color: #1a212b;
  --el-bg-color-page: #14181f;
  --el-bg-color-overlay: #232b36;
  --el-fill-color-blank: #1a212b;
  --el-fill-color: #232b36;
  --el-fill-color-light: #2c3541;
  --el-text-color-primary: #e6e8ec;
  --el-text-color-regular: #dde0e6;
  --el-text-color-secondary: #9aa3ae;
  --el-border-color: #303946;
  --el-border-color-light: #303946;
  --el-border-color-lighter: #2c3541;
}

:root {
  --el-font-family: 'Public Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'PingFang SC',
    'Microsoft YaHei', sans-serif;
  --el-font-size-base: 14px;
  --el-border-radius-base: 8px;
  --el-border-radius-round: 999px;
  --keel-radius-md: 12px;
  --keel-radius-lg: 16px;
}

.el-card {
  --el-card-border-color: transparent;
  --el-card-border-radius: var(--keel-radius-md);
  border: none;
  border-radius: var(--keel-radius-md) !important;
  background-color: var(--el-bg-color) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04), 0 8px 22px -6px rgba(0, 0, 0, 0.06);
}

.el-card.is-never-shadow,
.el-card.is-always-shadow,
.el-card.is-hover-shadow {
  border-radius: var(--keel-radius-md) !important;
  background-color: var(--el-bg-color) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04), 0 8px 22px -6px rgba(0, 0, 0, 0.06);
}

html.dark .el-card,
html.dark .el-card.is-never-shadow,
html.dark .el-card.is-always-shadow,
html.dark .el-card.is-hover-shadow {
  background-color: var(--el-bg-color) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4), 0 8px 22px -6px rgba(0, 0, 0, 0.45);
}

.el-button {
  border-radius: var(--keel-radius-md) !important;
}

.el-button:not(.is-text):not(.is-link):not(.is-plain):hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.el-button:not(.is-text):not(.is-link):not(.is-plain):active {
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
}

.el-input__wrapper,
.el-select__wrapper,
.el-textarea__inner {
  border-radius: var(--keel-radius-lg) !important;
}

.el-dialog,
.el-message-box,
.el-popover,
.el-drawer__header,
.el-dropdown__popper .el-dropdown-menu {
  border-radius: var(--keel-radius-md) !important;
}

.el-tag {
  border-radius: 6px !important;
}