/* 液态玻璃风格管理后台 */
* { margin:0; padding:0; box-sizing:border-box; }
:root {
  --bg1:#0f172a; --bg2:#1e293b;
  --glass:rgba(255,255,255,0.08);
  --glass-border:rgba(255,255,255,0.18);
  --accent:#38bdf8; --accent2:#818cf8;
  --green:#34d399; --red:#f87171; --yellow:#fbbf24;
  --text:#e2e8f0; --text-dim:#94a3b8;
}
body {
  font-family:'Segoe UI',system-ui,-apple-system,sans-serif;
  background:linear-gradient(135deg,var(--bg1),var(--bg2));
  background-attachment:fixed;
  color:var(--text);
  min-height:100vh;
}
body.login-body { display:flex; align-items:center; justify-content:center; }
.glass {
  background:linear-gradient(145deg,rgba(255,255,255,0.10),rgba(255,255,255,0.04));
  border:1px solid var(--glass-border);
  backdrop-filter:blur(20px);
  border-radius:20px;
  box-shadow:0 8px 32px rgba(0,0,0,0.35);
}
.login-card { width:380px; padding:40px 36px; text-align:center; }
.login-logo {
  width:64px;height:64px;margin:0 auto 16px;line-height:64px;
  font-size:30px;border-radius:50%;
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#fff;box-shadow:0 0 24px rgba(56,189,248,0.4);
}
.login-card h1 { font-size:22px; margin-bottom:4px; }
.login-card .sub { color:var(--text-dim); font-size:14px; margin-bottom:24px; }
.alert { padding:10px 14px;border-radius:10px;font-size:13px;margin-bottom:14px; }
.alert-red { background:rgba(248,113,113,0.15); color:#fca5a5; border:1px solid rgba(248,113,113,0.3); }
.alert-green { background:rgba(52,211,153,0.12); color:#6ee7b7; border:1px solid rgba(52,211,153,0.3); }
.alert-yellow { background:rgba(251,191,36,0.12); color:#fcd34d; border:1px solid rgba(251,191,36,0.3); }

.form-group { text-align:left; margin-bottom:16px; }
.form-group label { display:block; font-size:13px; color:var(--text-dim); margin-bottom:6px; }
input[type=text],input[type=password],input[type=number],select,textarea {
  width:100%;padding:10px 14px;border-radius:10px;
  background:rgba(255,255,255,0.07);border:1px solid var(--glass-border);
  color:var(--text);font-size:14px;outline:none;transition:border .2s;
}
input:focus,select:focus,textarea:focus { border-color:var(--accent); }
textarea { resize:vertical; min-height:80px; font-family:Consolas,monospace; font-size:13px; }
select option { background:#1e293b; }
.btn {
  display:inline-block;padding:10px 20px;border-radius:10px;border:none;
  font-size:14px;cursor:pointer;text-decoration:none;transition:all .2s;color:#fff;
}
.btn-primary { background:linear-gradient(135deg,var(--accent),var(--accent2)); }
.btn-green { background:linear-gradient(135deg,#10b981,#34d399); }
.btn-red { background:linear-gradient(135deg,#ef4444,#f87171); }
.btn-gray { background:rgba(148,163,184,0.3); }
.btn-yellow { background:linear-gradient(135deg,#f59e0b,#fbbf24); }
.btn-sm { padding:6px 12px; font-size:13px; border-radius:8px; }
.btn-block { width:100%; }
.btn:hover { opacity:0.85; transform:translateY(-1px); }

/* 布局 */
.layout { display:flex; min-height:100vh; }
.sidebar {
  width:220px;padding:20px 14px;flex-shrink:0;
  background:rgba(15,23,42,0.6);backdrop-filter:blur(20px);
  border-right:1px solid var(--glass-border);
  position:sticky;top:0;height:100vh;overflow-y:auto;
}
.sidebar .brand { font-size:17px;font-weight:700;padding:6px 12px 18px; }
.sidebar .brand span { background:linear-gradient(135deg,var(--accent),var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent; }
.sidebar nav a {
  display:flex;align-items:center;gap:10px;padding:11px 12px;margin:2px 0;
  color:var(--text-dim);text-decoration:none;border-radius:10px;font-size:14px;
  transition:all .2s;
}
.sidebar nav a:hover { background:var(--glass); color:var(--text); }
.sidebar nav a.active { background:linear-gradient(135deg,rgba(56,189,248,0.2),rgba(129,140,248,0.2)); color:#fff; border:1px solid rgba(56,189,248,0.3); }
.sidebar .nav-group { margin:2px 0; }
.sidebar .nav-group-head { display:flex;align-items:center;gap:10px;padding:11px 12px;color:var(--text-dim);border-radius:10px;font-size:14px;cursor:pointer;transition:all .2s;user-select:none; }
.sidebar .nav-group-head:hover { background:var(--glass);color:var(--text); }
.sidebar .nav-group-head.open { color:#fff;background:linear-gradient(135deg,rgba(56,189,248,0.15),rgba(129,140,248,0.15)); }
.sidebar .nav-group-head .g-arrow { margin-left:auto;font-size:11px;opacity:0.7; }
.sidebar .nav-group-body a { padding-left:26px;font-size:13px; }
.sidebar nav a.sub { display:flex;align-items:center;gap:8px;padding:8px 12px 8px 26px;margin:1px 0;color:var(--text-dim);text-decoration:none;border-radius:8px;font-size:13px;transition:all .2s; }
.sidebar nav a.sub:hover { background:var(--glass);color:var(--text); }
.sidebar nav a.sub.active { background:linear-gradient(135deg,rgba(56,189,248,0.18),rgba(129,140,248,0.18));color:#fff;border:1px solid rgba(56,189,248,0.25); }
.main { flex:1;padding:24px;min-width:0; }
.page-head { display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;flex-wrap:wrap;gap:12px; }
.page-head h2 { font-size:20px; }
.page-head .user-info { font-size:13px;color:var(--text-dim); }
.page-head .user-info a { color:var(--accent);text-decoration:none;margin-left:10px; }

/* 卡片 */
.card {
  background:linear-gradient(145deg,rgba(255,255,255,0.07),rgba(255,255,255,0.03));
  border:1px solid var(--glass-border);border-radius:16px;
  padding:20px;margin-bottom:20px;
}
.stats-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-bottom:20px; }
.stat-card { padding:18px; }
.stat-card .num { font-size:26px;font-weight:700; }
.stat-card .lbl { font-size:13px;color:var(--text-dim);margin-top:4px; }
.stat-card.blue .num { color:var(--accent); } .stat-card.green .num { color:var(--green); }
.stat-card.yellow .num { color:var(--yellow); } .stat-card.purple .num { color:var(--accent2); }
.stat-card.teal .num { color:#2dd4bf; } .stat-card.orange .num { color:#fb923c; }

/* 表格 */
.table-wrap { overflow-x:auto; }
table { width:100%;border-collapse:collapse;font-size:14px; }
th { text-align:left;padding:10px 12px;color:var(--text-dim);font-weight:600;font-size:13px;border-bottom:1px solid var(--glass-border);white-space:nowrap; }
td { padding:10px 12px;border-bottom:1px solid rgba(255,255,255,0.05); }
tr:hover td { background:rgba(255,255,255,0.03); }
.tag { display:inline-block;padding:3px 10px;border-radius:20px;font-size:12px; }
.tag-green { background:rgba(52,211,153,0.15);color:#6ee7b7; }
.tag-red { background:rgba(248,113,113,0.15);color:#fca5a5; }
.tag-yellow { background:rgba(251,191,36,0.15);color:#fcd34d; }
.tag-blue { background:rgba(56,189,248,0.15);color:#7dd3fc; }
.tag-purple { background:rgba(129,140,248,0.15);color:#a5b4fc; }
.tag-gray { background:rgba(148,163,184,0.15);color:#cbd5e1; }

/* 弹窗 */
.modal-mask { display:none;position:fixed;inset:0;background:rgba(0,0,0,0.5);z-index:100;align-items:center;justify-content:center;backdrop-filter:blur(4px); }
.modal-mask.show { display:flex; }
.modal { width:520px;max-width:92vw;padding:26px;max-height:86vh;overflow-y:auto; }
.modal h3 { margin-bottom:18px;font-size:17px; }
.modal .form-group { margin-bottom:14px; }
.modal-actions { display:flex;gap:10px;justify-content:flex-end;margin-top:20px; }

/* 搜索栏 */
.toolbar { display:flex;gap:10px;align-items:center;margin-bottom:16px;flex-wrap:wrap; }
.toolbar input { width:220px; }
.toolbar .spacer { flex:1; }
.pager { display:flex;gap:6px;align-items:center;justify-content:flex-end;margin-top:14px;font-size:13px;color:var(--text-dim); }
.pager a { color:var(--accent);text-decoration:none;padding:4px 10px;border-radius:6px;background:var(--glass); }
.pager a:hover { background:rgba(56,189,248,0.2); }
.tabs { display:flex;gap:4px;margin-bottom:18px;flex-wrap:wrap; }
.tabs a { padding:8px 18px;border-radius:20px;text-decoration:none;font-size:14px;color:var(--text-dim);background:var(--glass);border:1px solid transparent; }
.tabs a.active { background:linear-gradient(135deg,rgba(56,189,248,0.25),rgba(129,140,248,0.25));color:#fff;border-color:rgba(56,189,248,0.4); }
.empty { text-align:center;padding:40px;color:var(--text-dim); }
.cell-dim { color:var(--text-dim);font-size:13px; }
.mono { font-family:Consolas,monospace;font-size:12px;word-break:break-all; }
@media (max-width:800px){ .sidebar{width:60px;} .sidebar .brand span,.sidebar nav a span{display:none;} .sidebar nav a{justify-content:center;} .main{padding:14px;} }