:root{ --primary:#7C3AED; --bg:#0b0b12; --card:#141426; --text:#e9e9ff; --muted:#a3a3c2; }
*{ box-sizing:border-box; }
body{ margin:0; font-family:Inter,system-ui,Arial,sans-serif; color:var(--text); background:radial-gradient(1200px 600px at 20% -10%, rgba(124,58,237,.35), transparent), linear-gradient(180deg,#0b0b12,#0a0a0f); }
.topbar{ position:sticky; top:0; z-index:50; display:flex; align-items:center; justify-content:space-between; padding:14px 18px; background:linear-gradient(90deg, var(--primary), #4c1d95); box-shadow:0 8px 30px rgba(0,0,0,.25); }
.topbar .brand{ font-weight:800; letter-spacing:.5px; }
.topbar nav a{ margin:0 8px; text-decoration:none; color:white; font-weight:600; padding:8px 12px; border-radius:12px; }
.topbar nav a:hover{ background:rgba(255,255,255,.14); }
.topbar nav .logout{ background:white; color:#1a102b; }
.container{ padding:24px; max-width:1100px; margin:0 auto; }
.card{ background:var(--card); border:1px solid rgba(255,255,255,.08); border-radius:18px; padding:18px; margin:16px 0; box-shadow:0 8px 30px rgba(0,0,0,.2); }
.grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:16px; }
.stat .stat-num{ font-size:32px; font-weight:800; }
.stat .stat-label{ color:var(--muted); }
.inline{ display:flex; gap:8px; align-items:center; }
label{ display:block; margin:8px 0 6px; font-weight:600; }
input[type=text], input[type=password], input[type=number]{ width:100%; padding:10px 12px; border-radius:12px; background:#0f0f1d; border:1px solid rgba(255,255,255,.12); color:var(--text); }
button{ padding:10px 16px; border-radius:12px; border:0; font-weight:700; background:var(--primary); color:white; cursor:pointer; }
button:hover{ filter:brightness(1.1); }
.alert{ background:#2a1239; border:1px solid rgba(255,255,255,.15); padding:10px 12px; border-radius:12px; margin:10px 0; }
.alert.success{ background:#15391a; }
.muted{ color:var(--muted); font-size:14px; }
.table{ display:grid; gap:6px; }
.tr{ display:grid; grid-template-columns: 60px 1fr 130px 120px 110px 170px 1fr; gap:8px; padding:10px; border:1px solid rgba(255,255,255,.08); border-radius:12px; }
.tr.th{ background:rgba(255,255,255,.06); font-weight:700; }
.login-page{ display:grid; place-content:center; min-height:100vh; }
.login-page .card{ width:360px; background:linear-gradient(180deg, rgba(124,58,237,.25), rgba(10,10,15,.9)); }