:root {
  --js-ink: #1A1430;
  --js-brand: #3F1D6E;
  --js-deep: #552D8A;
  --js-mid: #6B3FA0;
  --js-soft: #8B5FBF;
  --js-mist: #F5F2FB;
  --js-line: #E4DCF0;
  --js-fog: #5B8FD4;
}
/* Element primary → 聚烁紫 */
.el-button--primary,
.el-button--primary:focus {
  background-color: var(--js-brand) !important;
  border-color: var(--js-brand) !important;
}
.el-button--primary:hover,
.el-button--primary:active {
  background-color: var(--js-deep) !important;
  border-color: var(--js-deep) !important;
}
.el-menu-item.is-active,
.el-submenu__title:hover,
.el-menu-item:hover {
  color: #fff !important;
}
.sidebar-container,
.sidebar-logo-container {
  background: linear-gradient(180deg, #1A1430 0%, #2A1650 45%, #3F1D6E 100%) !important;
}
.sidebar-logo-link .sidebar-title,
.sidebar-logo-container .sidebar-title {
  color: #fff !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em;
}
.navbar, .tags-view-container {
  border-bottom-color: var(--js-line) !important;
}
.login-container {
  background:
    radial-gradient(900px 420px at 15% 10%, rgba(91,143,212,.35), transparent 55%),
    radial-gradient(700px 380px at 90% 80%, rgba(139,95,191,.28), transparent 50%),
    linear-gradient(145deg, #1A1430 0%, #3F1D6E 55%, #1A1430 100%) !important;
}
.login-container .el-form,
.login-form {
  background: rgba(26,20,48,.72) !important;
  border: 1px solid rgba(228,220,240,.18) !important;
  border-radius: 14px !important;
  box-shadow: 0 20px 50px rgba(0,0,0,.35) !important;
  backdrop-filter: blur(10px);
}
.login-container .title-container .title,
.login-container h3.title {
  color: #fff !important;
  font-weight: 750 !important;
  letter-spacing: 0.04em;
}
.login-container .el-input input {
  background: rgba(255,255,255,.06) !important;
  border-color: rgba(228,220,240,.22) !important;
  color: #fff !important;
}
.login-container .el-button--primary {
  background: linear-gradient(90deg, #3F1D6E, #552D8A 55%, #5B8FD4) !important;
  border: 0 !important;
  font-weight: 650;
}
.el-pagination.is-background .el-pager li:not(.disabled).active {
  background-color: var(--js-brand) !important;
}
.el-switch.is-checked .el-switch__core {
  border-color: var(--js-brand) !important;
  background-color: var(--js-brand) !important;
}
.el-checkbox__input.is-checked .el-checkbox__inner,
.el-radio__input.is-checked .el-radio__inner {
  background-color: var(--js-brand) !important;
  border-color: var(--js-brand) !important;
}
.tags-view-item.active {
  background-color: var(--js-brand) !important;
  border-color: var(--js-brand) !important;
}