:root{ --bg:#0f172a; --card:#111827; --muted:#94a3b8; --text:#e5e7eb; --accent:#22d3ee; --accent2:#4ade80; }
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; background:var(--bg); color:var(--text); font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial; }
.container{ max-width:1100px; margin:0 auto; padding:24px; }
.card{ background:var(--card); border:1px solid #1f2937; border-radius:16px; padding:20px; box-shadow:0 10px 30px rgba(0,0,0,.25); }
.header{ background:#0b1220; border-bottom:1px solid #1f2937; }
.nav{ display:flex; gap:16px; align-items:center; padding:14px 24px; }
.nav a{ color:var(--text); text-decoration:none; padding:8px 12px; border-radius:10px; }
.nav a.active, .nav a:hover{ background:rgba(255,255,255,.06); }
.btn{ background:linear-gradient(135deg,var(--accent),var(--accent2)); color:#0b1220; border:none; padding:10px 16px; border-radius:10px; cursor:pointer; font-weight:700; }
.btn:disabled{ opacity:.5; cursor:not-allowed; }
.input, select{ width:100%; padding:10px 12px; border-radius:10px; border:1px solid #1f2937; background:#0b1220; color:var(--text); }
.row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
hr{ border:0; border-top:1px solid #1f2937; margin:20px 0; }
.table-wrap{ overflow-x:auto; }
table{ width:100%; border-collapse:collapse; }
th,td{ padding:10px 8px; border-bottom:1px solid #1f2937; text-align:left; white-space:nowrap; }
th.sortable{ cursor:pointer; }
.badge{ padding:4px 8px; border-radius:999px; background:#192338; border:1px solid #1f2937; }
.center{ text-align:center; }
.small{ font-size:12px; color:var(--muted); }
.avatar{ width:96px; height:96px; border-radius:50%; object-fit:cover; border:2px solid #1f2937; }
.note{ color:var(--muted); font-size:13px; }
.chat{ height:260px; overflow:auto; background:#0b1220; border:1px solid #1f2937; border-radius:12px; padding:10px; }
.chat-input{ display:flex; gap:8px; margin-top:10px; }