:root {
  --orange: #f97316;
  --orange-dark: #ea580c;
  --orange-light: #fff7ed;
  --orange-border: #fed7aa;
  --text: #1c1917;
  --text-2: #78716c;
  --text-3: #a8a29e;
  --bg: #fafaf9;
  --card: #ffffff;
  --border: #e7e5e4;
  --green: #16a34a;
  --red: #dc2626;
  --shadow: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
  --shadow-lg: 0 10px 30px rgba(0,0,0,.10);
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html,body { height: 100%; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
  color: var(--text); background: var(--bg); font-size: 14px; line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
a { cursor: pointer; text-decoration: none; color: inherit; }
button { font-family: inherit; cursor: pointer; }

/* ---------- 登录 ---------- */
.login-wrap { min-height:100vh; display:flex; align-items:center; justify-content:center;
  background: linear-gradient(135deg,#fff7ed 0%,#ffedd5 50%,#fed7aa 100%); padding:20px; }
.login-card { background:#fff; border-radius:20px; box-shadow:var(--shadow-lg); padding:44px 48px;
  width:420px; text-align:center; }
.brand { display:flex; align-items:center; gap:14px; justify-content:center; margin-bottom:28px; }
.brand-logo { width:54px; height:54px; border-radius:14px; background:linear-gradient(135deg,#fb923c,#ea580c);
  color:#fff; font-size:26px; font-weight:700; display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 12px rgba(249,115,22,.35); }
.brand-logo.sm { width:40px; height:40px; font-size:20px; border-radius:10px; }
.brand h1 { font-size:24px; font-weight:700; letter-spacing:1px; }
.slogan { color:var(--orange); font-size:13px; margin-top:2px; }
.qr-area { border:1px solid var(--border); border-radius:14px; padding:20px; background:var(--orange-light); }
.qr-img { width:220px; height:220px; display:block; margin:0 auto; border-radius:8px; background:#fff; }
.qr-tip { color:var(--text-2); font-size:13px; margin-top:14px; }
#qr-refresh { margin-top:16px; }
.login-foot { color:var(--text-3); font-size:12px; margin-top:24px; }

/* ---------- 按钮 ---------- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:6px;
  background:var(--orange); color:#fff; border:none; border-radius:10px; padding:10px 20px;
  font-size:14px; font-weight:500; transition:.15s; }
.btn:hover { background:var(--orange-dark); }
.btn:disabled { opacity:.5; cursor:not-allowed; }
.btn-ghost { background:transparent; color:var(--text-2); border:1px solid var(--border);
  border-radius:10px; padding:8px 16px; font-size:13px; transition:.15s; }
.btn-ghost:hover { color:var(--orange); border-color:var(--orange); background:var(--orange-light); }
.btn-ghost.block { width:100%; }
.btn-sm { padding:6px 12px; font-size:13px; border-radius:8px; }

/* ---------- 布局 ---------- */
.layout { display:flex; min-height:100vh; }
.sidebar { width:232px; background:#1c1917; color:#d6d3d1; display:flex; flex-direction:column;
  position:sticky; top:0; height:100vh; flex-shrink:0; }
.side-brand { display:flex; align-items:center; gap:10px; padding:22px 20px; border-bottom:1px solid #292524; }
.side-name { color:#fff; font-weight:600; font-size:15px; }
.side-sub { color:#a8a29e; font-size:12px; }
.nav { flex:1; padding:14px 12px; display:flex; flex-direction:column; gap:2px; }
.nav-item { display:flex; align-items:center; gap:10px; padding:11px 14px; border-radius:9px;
  color:#d6d3d1; font-size:14px; transition:.15s; position:relative; }
.nav-item .ni { width:18px; text-align:center; opacity:.8; }
.nav-item:hover { background:#292524; color:#fff; }
.nav-item.active { background:var(--orange); color:#fff; }
.nav-item.active .ni { opacity:1; }
.badge { background:var(--red); color:#fff; font-style:normal; font-size:11px; min-width:18px; height:18px;
  border-radius:9px; display:inline-flex; align-items:center; justify-content:center; padding:0 5px; margin-left:auto;}
.badge.hide { display:none; }
.side-foot { padding:16px; border-top:1px solid #292524; }
.agency-box { margin-bottom:12px; }
.agency-label { color:#78716c; font-size:11px; }
.agency-name { color:#fafaf9; font-size:13px; font-weight:500; margin-top:2px; }

.content { flex:1; padding:28px 32px; max-width:1280px; }
.page-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:22px; }
.page-title { font-size:22px; font-weight:700; }
.page-desc { color:var(--text-2); font-size:13px; margin-top:3px; }

/* ---------- 卡片/统计 ---------- */
.card { background:var(--card); border:1px solid var(--border); border-radius:14px; padding:20px; box-shadow:var(--shadow); }
.stat-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:22px; }
.stat-card { background:#fff; border:1px solid var(--border); border-radius:14px; padding:18px 20px; }
.stat-num { font-size:28px; font-weight:700; color:var(--text); }
.stat-num.orange { color:var(--orange); }
.stat-num.red { color:var(--red); }
.stat-label { color:var(--text-2); font-size:13px; margin-top:4px; }

/* ---------- 上传 ---------- */
.dropzone { border:2px dashed var(--orange-border); border-radius:16px; background:var(--orange-light);
  padding:56px 30px; text-align:center; transition:.15s; cursor:pointer; }
.dropzone.drag { border-color:var(--orange); background:#ffedd5; }
.dropzone .dz-icon { font-size:44px; }
.dropzone h3 { margin:14px 0 6px; font-size:17px; }
.dropzone p { color:var(--text-2); font-size:13px; }
.upload-progress { margin-top:18px; }
.progress-bar { height:8px; background:#f5f5f4; border-radius:4px; overflow:hidden; }
.progress-bar i { display:block; height:100%; background:var(--orange); width:0; transition:.2s; }

.result-section { margin-top:22px; }
.result-summary { display:flex; gap:10px; margin-bottom:14px; flex-wrap:wrap; }
.chip { padding:6px 14px; border-radius:20px; font-size:13px; background:#f5f5f4; color:var(--text-2); }
.chip b { color:var(--text); }
.chip.ok { background:#dcfce7; color:#166534; }
.chip.pending { background:#fef3c7; color:#92400e; }
.chip.skip { background:#f1f5f9; color:#475569; }
.chip.fail { background:#fee2e2; color:#991b1b; }

/* ---------- 表格 ---------- */
.table-card { background:#fff; border:1px solid var(--border); border-radius:14px; overflow:hidden; }
table { width:100%; border-collapse:collapse; }
th,td { padding:13px 16px; text-align:left; font-size:13px; border-bottom:1px solid var(--border); }
th { background:#fafaf9; color:var(--text-2); font-weight:500; white-space:nowrap; }
tr:last-child td { border-bottom:none; }
tr:hover td { background:#fafaf9; }
.tag { display:inline-block; padding:2px 10px; border-radius:6px; font-size:12px; background:#f5f5f4; color:var(--text-2); }
.tag.auto { background:#dcfce7; color:#166534; }
.tag.lookup { background:#dbeafe; color:#1e40af; }
.tag.manual { background:#f3e8ff; color:#6b21a8; }
.tag.pending { background:#fef3c7; color:#92400e; }
.muted { color:var(--text-3); }
.empty { text-align:center; padding:60px 20px; color:var(--text-3); }
.empty .e-icon { font-size:40px; opacity:.5; }

/* ---------- 筛选条 ---------- */
.filter-bar { display:flex; gap:10px; margin-bottom:18px; flex-wrap:wrap; align-items:center; }
.input, select.input { border:1px solid var(--border); border-radius:9px; padding:9px 13px; font-size:13px;
  background:#fff; color:var(--text); outline:none; font-family:inherit; }
.input:focus { border-color:var(--orange); }
.input.grow { flex:1; min-width:180px; }

/* ---------- 分页 ---------- */
.pagination { display:flex; gap:6px; justify-content:flex-end; margin-top:16px; align-items:center; }
.pg-btn { min-width:34px; height:34px; border:1px solid var(--border); background:#fff; border-radius:8px;
  font-size:13px; color:var(--text-2); }
.pg-btn.active { background:var(--orange); color:#fff; border-color:var(--orange); }
.pg-btn:disabled { opacity:.4; cursor:not-allowed; }

/* ---------- 弹窗 ---------- */
.modal-mask { position:fixed; inset:0; background:rgba(0,0,0,.45); display:flex; align-items:center;
  justify-content:center; z-index:100; }
.modal { background:#fff; border-radius:16px; padding:26px; width:440px; box-shadow:var(--shadow-lg); }
.modal h3 { font-size:17px; margin-bottom:16px; }
.modal .input { width:100%; margin-bottom:16px; }
.modal-actions { display:flex; gap:10px; justify-content:flex-end; }

/* ---------- 套餐 ---------- */
.plan-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:8px; }
.plan-card { background:#fff; border:2px solid var(--border); border-radius:16px; padding:26px 22px; text-align:center; position:relative; }
.plan-card.hot { border-color:var(--orange); }
.plan-hot-tag { position:absolute; top:-11px; left:50%; transform:translateX(-50%); background:var(--orange);
  color:#fff; font-size:11px; padding:3px 12px; border-radius:10px; }
.plan-name { font-size:16px; font-weight:600; }
.plan-price { font-size:34px; font-weight:700; color:var(--orange); margin:12px 0 4px; }
.plan-price small { font-size:14px; font-weight:400; }
.plan-days { color:var(--text-2); font-size:13px; margin-bottom:18px; }
.status-banner { border-radius:12px; padding:16px 20px; margin-bottom:20px; display:flex; align-items:center; gap:12px; }
.status-banner.ok { background:#dcfce7; color:#166534; }
.status-banner.warn { background:#fff7ed; color:#9a3412; border:1px solid var(--orange-border); }
.status-banner .sb-title { font-weight:600; }
.status-banner .sb-sub { font-size:13px; opacity:.85; }

.toast { position:fixed; top:24px; left:50%; transform:translateX(-50%); background:#1c1917; color:#fff;
  padding:11px 22px; border-radius:10px; font-size:14px; z-index:200; box-shadow:var(--shadow-lg);
  animation:tin .2s; }
@keyframes tin { from{opacity:0; transform:translate(-50%,-10px);} }