*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --bg: #ffffff; --bg2: #f7f7f5; --bg3: #f0efe8;
  --text: #1a1a18; --text2: #6b6b67; --text3: #9b9b96;
  --border: rgba(0,0,0,0.1); --border2: rgba(0,0,0,0.18);
  --teal: #1D9E75; --teal-bg: #E1F5EE; --teal-text: #085041;
  --red-bg: #FCEBEB; --red-text: #791F1F;
  --amber-bg: #FAEEDA; --amber-text: #633806;
  --blue-bg: #E6F1FB; --blue-text: #0C447C;
  --radius: 8px; --radius-lg: 12px;
}
body { font-family: system-ui, -apple-system, sans-serif; background: var(--bg3); color: var(--text); font-size: 14px; line-height: 1.5; }
a { color: inherit; text-decoration: none; }
.btn { display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:var(--radius);font-size:13px;font-weight:500;cursor:pointer;border:0.5px solid var(--border2);background:transparent;color:var(--text);transition:background 0.1s; }
.btn:hover { background: var(--bg2); }
.btn-primary { background:var(--teal);color:#fff;border-color:var(--teal); }
.btn-primary:hover { background:#0F6E56; }
.btn-danger { background:var(--red-bg);color:var(--red-text);border-color:transparent; }
.btn-sm { padding:5px 12px;font-size:12px; }
.badge { display:inline-flex;align-items:center;padding:2px 10px;border-radius:20px;font-size:11px;font-weight:500; }
.badge-green { background:var(--teal-bg);color:var(--teal-text); }
.badge-red { background:var(--red-bg);color:var(--red-text); }
.badge-amber { background:var(--amber-bg);color:var(--amber-text); }
.badge-blue { background:var(--blue-bg);color:var(--blue-text); }
.badge-gray { background:var(--bg3);color:var(--text2); }
.card { background:var(--bg);border:0.5px solid var(--border);border-radius:var(--radius-lg);overflow:hidden; }
.card-header { padding:14px 20px;border-bottom:0.5px solid var(--border);display:flex;align-items:center;justify-content:space-between; }
.card-header h2 { font-size:14px;font-weight:500; }
table { width:100%;border-collapse:collapse;font-size:13px; }
th { text-align:left;padding:10px 20px;font-size:11px;font-weight:500;color:var(--text2);border-bottom:0.5px solid var(--border);white-space:nowrap; }
td { padding:12px 20px;border-bottom:0.5px solid var(--border); }
tbody tr:last-child td { border-bottom:none; }
tbody tr:hover td { background:var(--bg2); }
.avatar { width:32px;height:32px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:500;flex-shrink:0; }
.avatar-teal { background:var(--teal-bg);color:var(--teal-text); }
.avatar-blue { background:var(--blue-bg);color:var(--blue-text); }
.avatar-amber { background:var(--amber-bg);color:var(--amber-text); }
.avatar-purple { background:#EEEDFE;color:#3C3489; }
input,select,textarea { width:100%;padding:8px 12px;border:0.5px solid var(--border2);border-radius:var(--radius);font-size:13px;background:var(--bg);color:var(--text);outline:none;font-family:inherit; }
input:focus,select:focus,textarea:focus { border-color:var(--teal);box-shadow:0 0 0 3px rgba(29,158,117,0.12); }
label { font-size:12px;font-weight:500;color:var(--text2);display:block;margin-bottom:4px; }
.form-group { margin-bottom:16px; }
.form-row { display:grid;grid-template-columns:1fr 1fr;gap:12px; }
.stat-card { background:var(--bg2);border-radius:var(--radius);padding:14px 16px; }
.stat-label { font-size:12px;color:var(--text2);margin-bottom:4px; }
.stat-val { font-size:24px;font-weight:500; }
.empty { padding:48px;text-align:center;color:var(--text3);font-size:13px; }
.error-msg { color:var(--red-text);background:var(--red-bg);padding:10px 14px;border-radius:var(--radius);font-size:13px;margin-bottom:16px; }
.hidden { display:none!important; }