:root {
  --bg:#0B1020;
  --panel:rgba(255,255,255,0.04);
  --glass:rgba(255,255,255,0.08);
  --text:#E5EAF5;
  --muted:#99A3B3;
  --violet:#6C5CE7;
  --mint:#00E5A8;
  --pink:#FF3D9A;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--text);font:15px/1.5 system-ui,Segoe UI,Roboto,Arial}
.shell{display:grid;grid-template-columns:260px 1fr;min-height:100vh}
.sidebar{background:linear-gradient(180deg,#0c1226 0%, #0b1020 70%);border-right:1px solid #151a35;padding:18px;display:flex;flex-direction:column}
.brand{font-weight:700;font-size:18px;letter-spacing:.5px;margin-bottom:12px;color:#cfd7ff}
.sidebar nav{display:flex;flex-direction:column;gap:6px}
.sidebar nav a{padding:10px 12px;border-radius:10px;color:#d7dcff;text-decoration:none;border:1px solid transparent}
.sidebar nav a:hover{background:#10183a;border-color:#1c2550}
.sidebar nav a.active{background:linear-gradient(90deg,#141d3b,#10183a);border-color:#29336b}
.foot{margin-top:auto;display:flex;flex-direction:column;gap:8px}
.why{font-size:12px;color:#cfe;background:#0f1530;border:1px dashed #27306a;border-radius:10px;padding:10px}
.btn{display:inline-block;padding:10px 14px;border-radius:10px;background:var(--violet);color:white;text-decoration:none;border:0;cursor:pointer}
.btn.tiny{padding:6px 10px;font-size:12px}
.main{padding:22px}
.card{background:var(--panel);border:1px solid var(--glass);backdrop-filter:blur(6px);border-radius:16px;padding:18px;margin-bottom:16px}
.h1{font-size:22px;margin:0 0 6px}
.grid{display:grid;gap:12px}
.grid.cols-2{grid-template-columns:1fr 1fr}
.grid.cols-3{grid-template-columns:1fr 1fr 1fr}
label{display:block;margin:8px 0 6px}
input,select,textarea{width:100%;padding:10px 12px;border-radius:10px;border:1px solid #1a2145;background:rgba(255,255,255,0.02);color:var(--text)}
.badge{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;background:#141935;border:1px solid #262d5a;margin:4px 6px 0 0}
.kpi{display:flex;gap:12px;align-items:center}
.kpi .num{font-size:24px;font-weight:700}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.progress{height:10px;background:#12172c;border-radius:999px;overflow:hidden}
.progress > div{height:100%;background:linear-gradient(90deg,#6C5CE7,#FF3D9A,#00E5A8);width:0%}
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:10px;border-bottom:1px solid #1a2145;font-size:14px;text-align:left}
.center{display:flex;justify-content:center;align-items:center}
.alert{padding:10px 12px;border-radius:10px;border:1px solid #27306a;background:#10163a;color:#cfe}
.link{color:#a9b6ff;text-decoration:none}
.confetti{position:relative}
.confetti:after{content:'';position:absolute;inset:-4px;pointer-events:none;background:
  radial-gradient(circle at 20% 20%,#6C5CE7 2px,transparent 3px),
  radial-gradient(circle at 60% 40%,#00E5A8 2px,transparent 3px),
  radial-gradient(circle at 80% 70%,#FF3D9A 2px,transparent 3px);
  opacity:.0;transition:.4s}
.confetti.done:after{opacity:.9}
.form-actions{display:flex;gap:10px;margin-top:10px}
.small{font-size:12px;color:var(--muted)}