:root {
  --ui-bg: #f0f0f1;
  --ui-surface: #ffffff;
  --ui-soft: #f7f7f8;
  --ui-border: #dadde1;
  --ui-ink: #111827;
  --ui-muted: #475569;
  --ui-selected: #eef0f2;
}
.dark {
  --ui-bg: #05070b;
  --ui-surface: #0b1018;
  --ui-soft: #111827;
  --ui-border: #1f2937;
  --ui-ink: #f8fafc;
  --ui-muted: #cbd5e1;
  --ui-selected: #172033;
}
html, body, #app {
  background: var(--ui-bg) !important;
  color: var(--ui-ink);
}
.bg-mesh-gradient {
  display: none !important;
}
.sidebar + div {
  background-color: var(--ui-bg) !important;
  background-image:
    linear-gradient(to right, rgba(17, 24, 39, 0.035) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(17, 24, 39, 0.035) 1px, transparent 1px) !important;
  background-size: 56px 56px !important;
}
.dark .sidebar + div {
  background-image:
    linear-gradient(to right, rgba(248, 250, 252, 0.035) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(248, 250, 252, 0.035) 1px, transparent 1px) !important;
}
.sidebar {
  background: var(--ui-surface) !important;
  border-right: 1px solid var(--ui-border) !important;
}
.sidebar-header {
  border-bottom-color: transparent !important;
}
.sidebar-link {
  border-radius: 0.7rem !important;
  color: var(--ui-muted) !important;
  font-weight: 520;
}
.sidebar-link:hover {
  background: var(--ui-selected) !important;
  color: var(--ui-ink) !important;
}
.sidebar-link-active,
.sidebar-link.router-link-active {
  background: var(--ui-selected) !important;
  color: var(--ui-ink) !important;
  box-shadow: inset 3px 0 0 var(--ui-ink) !important;
}
header.glass {
  background: transparent !important;
  border-bottom-color: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
}
header.glass h1 {
  font-size: 1.05rem !important;
  font-weight: 650;
  letter-spacing: -0.02em;
  color: var(--ui-ink) !important;
}
.card,
.glass-card,
.card-glass,
.table-container,
.modal-content,
.dialog-container {
  background: var(--ui-surface) !important;
  border-color: var(--ui-border) !important;
  box-shadow: 0 1px 2px rgba(17, 24, 39, 0.04) !important;
}
.card {
  border-radius: 1rem !important;
}
.btn {
  border-radius: 0.7rem !important;
}
.btn-primary {
  background: #111827 !important;
  color: #fff !important;
  box-shadow: none !important;
}
.btn-primary:hover {
  background: #0b1220 !important;
}
.input,
.select,
textarea,
select {
  border-radius: 0.7rem !important;
  border-color: var(--ui-border) !important;
  background: var(--ui-surface) !important;
}
.sidebar-brand > .relative > span,
.sidebar-brand span.text-xs {
  display: none !important;
}