:root {
  --bg: #f4f7ff;
  --bg-soft: #eef3ff;
  --surface: rgba(255,255,255,0.82);
  --surface-solid: #ffffff;
  --text: #1a2540;
  --muted: #6f7a96;
  --primary: #5a67ff;
  --primary-2: #7c3aed;
  --success: #059669;
  --warning: #d97706;
  --danger: #dc2626;
  --border: rgba(130, 145, 190, 0.28);
  --radius-lg: 18px;
  --radius-md: 12px;
  --shadow-1: 0 10px 35px rgba(74, 95, 170, 0.10);
  --shadow-2: 0 18px 48px rgba(63, 42, 120, 0.16);
  --space-1: 6px;
  --space-2: 10px;
  --space-3: 14px;
  --space-4: 18px;
  --space-5: 26px;
}

body.theme-dark {
  --bg: #0d1324;
  --bg-soft: #121b33;
  --surface: rgba(17,26,49,0.84);
  --surface-solid: #141f3c;
  --text: #edf2ff;
  --muted: #9aa6cb;
  --border: rgba(132, 153, 220, 0.25);
  --shadow-1: 0 16px 45px rgba(0,0,0,0.42);
  --shadow-2: 0 20px 56px rgba(25, 16, 57, 0.50);
}

* { transition: background-color .2s ease, border-color .2s ease, color .2s ease, box-shadow .2s ease, transform .2s ease; }
body { font-family: 'Inter', system-ui, sans-serif; background: radial-gradient(circle at top right, #dce6ff 0%, transparent 40%), var(--bg); color: var(--text); }
.theme-dark { background: radial-gradient(circle at top right, #1a2d5f 0%, transparent 38%), var(--bg); }

.panel {
  border: 1px solid var(--border);
  background: var(--surface);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-1);
}
.panel-soft { background: linear-gradient(145deg, rgba(255,255,255,0.68), rgba(246,249,255,0.84)); }
.theme-dark .panel-soft { background: linear-gradient(145deg, rgba(27,38,69,0.65), rgba(16,24,44,0.84)); }

.btn { border-radius: 12px; padding: 10px 14px; font-size: .9rem; font-weight: 600; border: 1px solid transparent; display: inline-flex; align-items: center; gap: 8px; }
.btn:hover { transform: translateY(-1px); box-shadow: 0 7px 20px rgba(40,50,90,.16); }
.btn-primary { background: linear-gradient(135deg,var(--primary),var(--primary-2)); color: #fff; }
.btn-muted { background: var(--bg-soft); color: var(--text); border-color: var(--border); }
.btn-success { background: linear-gradient(135deg,#10b981,#059669); color: #fff; }
.btn-danger { background: linear-gradient(135deg,#ef4444,#b91c1c); color: #fff; }

.input, .select, .textarea {
  width: 100%; border-radius: 12px; border: 1px solid var(--border); background: var(--surface-solid);
  padding: 11px 13px; color: var(--text);
}
.input:focus, .select:focus, .textarea:focus { outline: none; border-color: rgba(99,102,241,.65); box-shadow: 0 0 0 4px rgba(99,102,241,.14); }

.kpi-card { position: relative; overflow: hidden; }
.kpi-card::after { content: ''; position: absolute; inset: auto -25% -35% auto; width: 130px; height: 130px; border-radius: 999px; background: rgba(122,94,255,.13); }
.badge { border-radius: 999px; padding: 4px 10px; font-size: .72rem; font-weight: 700; border: 1px solid var(--border); }
.badge-success { background: rgba(16,185,129,.12); color: #047857; }
.badge-warning { background: rgba(245,158,11,.16); color: #b45309; }
.badge-muted { background: var(--bg-soft); color: var(--muted); }

.table-wrap { overflow: auto; border-radius: 14px; border: 1px solid var(--border); }
.table { width: 100%; min-width: 760px; }
.table thead { background: var(--bg-soft); }
.table th, .table td { padding: 12px; text-align: left; font-size: .9rem; }
.table tbody tr { border-top: 1px solid var(--border); }
.table tbody tr:hover { background: rgba(99,102,241,.07); }

.empty-state { border: 1px dashed var(--border); border-radius: 14px; padding: 26px; text-align: center; color: var(--muted); background: var(--bg-soft); }

.q-card { border: 1px solid var(--border)!important; background: var(--surface)!important; border-radius: 16px!important; box-shadow: var(--shadow-1); }
.q-card input, .q-card select { border-color: var(--border)!important; border-radius: 10px!important; }
.q-card .move-up,.q-card .move-down { background: var(--bg-soft)!important; border: 1px solid var(--border); }

.sidebar-glass { background: linear-gradient(180deg,#131b35 0%, #0f1630 100%); }
.theme-dark .sidebar-glass { background: linear-gradient(180deg,#0a1022 0%, #090f1e 100%); }

@media (max-width: 768px) {
  .btn { width: 100%; justify-content: center; }
}

body.contrast-plus, body.contrast-plus * { filter: contrast(1.18) saturate(1.05); }