:root{
  --bg:#0f1021;
  --card:#1a1b3a;
  --text:#e8e8ff;
  --muted:#a1a1c5;
  --accent:#6b4ae3;
  --accent-2:#2a1758;
  --border:#2b2c52;
  --err:#ff6b6b;
}
*{box-sizing:border-box}
body{margin:0;background:linear-gradient(135deg,var(--accent-2),var(--accent));color:var(--text);font:14px/1.5 system-ui,Segoe UI,Roboto,Helvetica,Arial}
header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;background:rgba(0,0,0,.15);backdrop-filter:saturate(1.2) blur(6px);border-bottom:1px solid rgba(255,255,255,.08)}
.brand{display:flex;align-items:center;gap:12px}
.logo{width:36px;height:36px;border-radius:8px;object-fit:contain;background:#fff;padding:4px}
h1{font-size:18px;margin:0}
.actions{display:flex;gap:10px}
button{appearance:none;border:1px solid var(--border);background:var(--card);color:var(--text);padding:10px 14px;border-radius:999px;cursor:pointer}
button.primary{background:var(--accent);border-color:transparent}
button.ghost{background:transparent;border-color:var(--border)}
button:hover{opacity:.95}
main{padding:20px;max-width:1100px;margin:0 auto}
.card{background:rgba(0,0,0,.15);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:18px}
.card h2{margin:0 0 8px 0}
.card form{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.card input{padding:10px;border-radius:10px;border:1px solid var(--border);background:var(--card);color:var(--text)}
.filters{display:flex;flex-wrap:wrap;gap:12px;align-items:end;margin-bottom:16px;background:rgba(0,0,0,.15);padding:12px;border-radius:12px;border:1px solid rgba(255,255,255,.08)}
label{display:flex;flex-direction:column;gap:6px;color:var(--muted)}
input,select{padding:10px;border-radius:10px;border:1px solid var(--border);background:var(--card);color:var(--text)}
.table-wrap{background:rgba(0,0,0,.15);border:1px solid rgba(255,255,255,.08);border-radius:12px;overflow:auto}
table{width:100%;border-collapse:collapse;min-width:900px}
thead th{position:sticky;top:0;background:var(--accent-2);color:#fff;padding:12px;border-bottom:1px solid var(--border);text-align:left}
tbody td{padding:12px;border-bottom:1px solid var(--border);vertical-align:top}
tbody tr:hover{background:rgba(255,255,255,.05)}
.muted{color:var(--muted);text-align:center}
.err{color:var(--err);margin-top:10px}
footer{padding:14px 20px;text-align:center;color:#eaeaff;background:rgba(0,0,0,.15);border-top:1px solid rgba(255,255,255,.08)}

.tabs{display:flex;gap:8px;margin:8px 0 6px 0}
.tab{border-radius:10px;padding:6px 10px;border:1px solid var(--border);background:transparent;color:var(--text);cursor:pointer}
.tab.active{background:var(--accent);border-color:transparent}