:root{
  --primary:#0e7490;
  --primary-2:#0891b2;
  --primary-soft:#e6f6f8;
  --primary-line:#bdeaf2;
  --ink:#0f172a;
  --ink-2:#475569;
  --muted:#94a3b8;
  --line:#e6ebf1;
  --bg:#eef2f6;
  --card:#ffffff;
  --danger:#dc2626;
  --danger-soft:#fdeced;
  --ok:#059669;
  --ok-soft:#e7f7f0;
  --radius:16px;
  --radius-sm:11px;
  --shadow:0 1px 3px rgba(15,23,42,.05),0 10px 30px rgba(15,23,42,.07);
  --shadow-sm:0 1px 2px rgba(15,23,42,.05),0 4px 14px rgba(15,23,42,.05);
  --brand:"资质文件下载中心";
}
* { box-sizing:border-box; margin:0; padding:0; }
html,body { height:100%; }
body {
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  background:var(--bg);
  color:var(--ink);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
a { color:var(--primary-2); }

/* ---------- 顶部品牌栏 ---------- */
.topbar {
  background:linear-gradient(135deg,var(--primary),var(--primary-2));
  color:#fff;
  padding:13px 26px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  box-shadow:0 3px 16px rgba(14,116,144,.28);
  position:sticky; top:0; z-index:20;
}
.topbar .brand { margin:0; justify-content:flex-start; }
.topbar .brand-name { color:#fff; font-size:16px; }
.topbar .brand-logo { height:34px; }
.topbar .who { font-size:13px; display:flex; align-items:center; gap:4px; }
.brand { display:flex; align-items:center; gap:11px; justify-content:center; }
.brand-logo { height:46px; width:auto; max-width:220px; object-fit:contain; }
.brand-name { font-size:20px; font-weight:700; letter-spacing:.5px; }
.admin-link { color:#fff; opacity:.9; font-size:13px; text-decoration:none; padding:5px 10px; border-radius:8px; transition:.15s; }
.admin-link:hover { background:rgba(255,255,255,.16); opacity:1; }

/* ---------- 布局 ---------- */
.container { max-width:1400px; margin:26px auto; padding:0 16px 40px; }
.card {
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:22px 26px;
  margin-bottom:18px;
  box-shadow:var(--shadow-sm);
}
.card:hover { box-shadow:var(--shadow); }

/* ---------- 登录 / 注册 ---------- */
.center-screen {
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:
    radial-gradient(900px 500px at 50% -10%, #d6f0f5 0%, rgba(214,240,245,0) 60%),
    linear-gradient(180deg,#eef4f8,#e6edf3);
}
.login-card { width:100%; max-width:410px; background:var(--card); border-radius:22px; padding:34px 32px; box-shadow:var(--shadow); border:1px solid #fff; }
.login-card h2 { font-size:21px; margin-bottom:4px; color:var(--ink); }
.login-card p.sub { color:var(--ink-2); font-size:13px; margin-bottom:22px; }
label { display:block; font-size:13px; color:var(--ink-2); margin:14px 0 7px; font-weight:500; }
input, select {
  width:100%;
  padding:11px 13px;
  border:1px solid #d4dbe4;
  border-radius:var(--radius-sm);
  font-size:14px;
  background:#fff;
  color:var(--ink);
  transition:.15s;
}
input::placeholder { color:#aab4c0; }
input:focus, select:focus { outline:none; border-color:var(--primary-2); box-shadow:0 0 0 3px rgba(8,145,178,.15); }
.btn-row { display:flex; gap:10px; margin-top:20px; }
.err { color:var(--danger); font-size:13px; margin-top:10px; min-height:18px; }
.muted { color:var(--muted); font-size:13px; }

/* ---------- 按钮 ---------- */
button {
  cursor:pointer; border:none; border-radius:var(--radius-sm);
  font-size:14px; padding:11px 18px;
  background:linear-gradient(135deg,var(--primary),var(--primary-2));
  color:#fff; font-weight:600; transition:.15s;
  box-shadow:0 3px 10px rgba(14,116,144,.25);
}
button:hover { filter:brightness(1.05); transform:translateY(-1px); box-shadow:0 6px 16px rgba(14,116,144,.3); }
button:active { transform:translateY(0); }
button.ghost { background:#eef2f6; color:var(--ink-2); box-shadow:none; border:1px solid var(--line); }
button.ghost:hover { background:#e3e9ef; }
button.danger { background:var(--danger); box-shadow:0 3px 10px rgba(220,38,38,.25); }
button.danger:hover { filter:brightness(1.05); }

/* ---------- 文件中心区块 ---------- */
.section-title {
  font-size:16px; font-weight:700; margin-bottom:14px; color:var(--ink);
  display:flex; align-items:center; gap:9px;
}
.section-title::before { content:""; width:4px; height:17px; background:linear-gradient(var(--primary),var(--primary-2)); border-radius:3px; }
.invoice-box { background:linear-gradient(180deg,#f1fbfd,#ffffff); border:1px solid var(--primary-line); }
.product-box { background:linear-gradient(180deg,#f3fbf6,#ffffff); border:1px solid #cdeeda; }

.cat-title { font-size:15px; font-weight:700; margin:22px 0 11px; display:flex; align-items:center; gap:8px; color:var(--ink); }
.badge {
  font-size:11px; background:#fff4d6; color:#92670a;
  padding:2px 9px; border-radius:20px; font-weight:600; border:1px solid #f3e0a8;
}
.file-item {
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:14px 16px; border:1px solid var(--line); border-radius:var(--radius-sm);
  margin-bottom:10px; background:var(--card); transition:.15s;
}
.file-item:hover { border-color:var(--primary-line); box-shadow:var(--shadow-sm); transform:translateY(-1px); }
/* 左侧图标+文件名区域占满剩余空间，长名换行不挤压按钮 */
.file-item > .file-left { display:flex; align-items:center; gap:12px; flex:1 1 auto; min-width:0; }
.file-item > .file-left .name-block { flex:1 1 auto; min-width:0; }
.file-item .name { font-size:14px; font-weight:600; display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.file-item .ico { width:34px; height:34px; border-radius:9px; background:var(--primary-soft); color:var(--primary); display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700; flex:0 0 auto; }
.file-item .meta { font-size:12px; color:var(--muted); margin-top:3px; word-break:break-all; }
.tag { font-size:11px; padding:3px 9px; border-radius:20px; background:var(--primary-soft); color:var(--primary); font-weight:600; }
.btn-dl {
  padding:7px 14px; font-size:13px; border-radius:8px; white-space:nowrap;
  border:1px solid transparent; cursor:pointer; font-weight:600;
  display:inline-flex; align-items:center; gap:5px;
  transition:transform .12s, box-shadow .12s, background .12s, border-color .12s;
}
.btn-dl:hover { transform:translateY(-1px); }
.btn-dl.preview {
  background:#fff; color:var(--primary); border-color:var(--primary-line);
  box-shadow:0 2px 6px rgba(15,39,108,.06);
}
.btn-dl.preview:hover { background:var(--primary-soft); border-color:var(--primary); }
.btn-dl.unlocked {
  background:linear-gradient(135deg,#0a8f5b,#059669); color:#fff;
  box-shadow:0 3px 10px rgba(5,150,105,.22);
}
/* 预览/下载按钮成组右对齐：固定成对、不分散，间距统一 */
.dl-actions {
  display:inline-flex; align-items:center; gap:7px; flex:0 0 auto;
  padding-left:14px; margin-left:6px;
  border-left:1px dashed var(--line);
}

/* ---------- 表格 ---------- */
table { width:100%; border-collapse:collapse; font-size:13px; }
th, td { text-align:left; padding:11px 10px; border-bottom:1px solid #eef1f5; }
th { color:var(--muted); font-weight:600; font-size:12px; text-transform:uppercase; letter-spacing:.4px; }
tr:hover td { background:#fafcfe; }

/* ---------- 统计小卡 ---------- */
.stat-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.stat { background:var(--card); border:1px solid var(--line); border-radius:var(--radius-sm); padding:16px 18px; box-shadow:var(--shadow-sm); }
.stat .num { font-size:28px; font-weight:800; color:var(--primary); line-height:1.1; }
.stat .lbl { font-size:12.5px; color:var(--muted); margin-top:4px; }

/* ---------- 待审卡片 ---------- */
.pend {
  border:1px solid var(--line); border-radius:var(--radius-sm);
  padding:16px 18px; margin-bottom:12px; display:flex; gap:16px; align-items:flex-start;
  background:#fff;
}
.pend .lic { width:120px; height:84px; object-fit:cover; border-radius:10px; border:1px solid var(--line); flex:0 0 auto; cursor:pointer; transition:.15s; }
.pend .lic:hover { border-color:var(--primary-2); box-shadow:var(--shadow-sm); }
.pend .info { flex:1; font-size:13px; }
.pend .info b { color:var(--ink); }
.pend .acts { display:flex; gap:8px; margin-top:10px; flex-wrap:wrap; }
.pend .reason { width:100%; margin-top:8px; }
.pending-empty { color:var(--muted); font-size:13px; padding:8px 2px; }

/* ---------- Toast ---------- */
.toast {
  position:fixed; bottom:26px; left:50%; transform:translateX(-50%) translateY(10px);
  background:var(--ink); color:#fff; padding:11px 20px; border-radius:10px;
  font-size:13px; opacity:0; transition:.25s; pointer-events:none; box-shadow:var(--shadow); z-index:50;
}
.toast.show { opacity:1; transform:translateX(-50%) translateY(0); }

.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:14px; }

/* ---------- 关联文件复选项（复选框与文字顶端对齐，长名换行不缩进） ---------- */
.fileopt { display:flex; align-items:flex-start; gap:8px; font-size:13px; line-height:1.5; margin:4px 0; cursor:pointer; }
.fileopt input[type=checkbox] { width:auto; flex:0 0 auto; margin:3px 2px 0 0; accent-color:var(--primary); }
.fileopt span { flex:1; }

/* ---------- 模态框 ---------- */
.modal-mask {
  position:fixed; inset:0; background:rgba(15,23,42,.45);
  display:flex; align-items:center; justify-content:center; padding:20px; z-index:100;
}
.modal { width:360px; max-width:100%; box-shadow:0 20px 60px rgba(15,23,42,.25); }
.modal h3 { color:var(--ink); }

/* ---------- 自定义可搜索下拉（用于⑧文件归属标注） ---------- */
.rp { position:relative; flex:0 0 280px; min-width:200px; max-width:100%; vertical-align:top; }
.rp-trigger {
  width:100%; box-sizing:border-box;
  border:1px solid var(--line); border-radius:8px;
  background:#fff; padding:6px 28px 6px 10px;
  font:inherit; color:var(--ink); text-align:left;
  cursor:pointer; min-height:32px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  position:relative;
}
.rp-trigger:hover { border-color:var(--primary); }
.rp-trigger::after {
  content:"\25BE"; position:absolute; right:8px; top:50%; transform:translateY(-50%);
  color:var(--ink-2); font-size:11px; pointer-events:none;
}
.rp-trigger.rp-empty { color:var(--muted); }
.rp-panel {
  position:absolute; z-index:50;
  top:calc(100% + 2px); left:0; right:0;
  background:#fff; border:1px solid var(--line); border-radius:8px;
  box-shadow:0 8px 24px rgba(15,23,42,.15);
  max-height:320px; display:flex; flex-direction:column;
}
.rp-search {
  flex:0 0 auto; border:0; border-bottom:1px solid var(--line);
  border-radius:8px 8px 0 0; padding:7px 10px;
  font:inherit; outline:none; background:#f7faf9;
}
.rp-search:focus { background:#fff; border-bottom-color:var(--primary); }
.rp-list { flex:1 1 auto; overflow:auto; padding:3px 0; }
.rp-item {
  padding:6px 10px; cursor:pointer; font-size:13px; line-height:1.4;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.rp-item:hover { background:#eef5ee; }
.rp-item.rp-cur { background:#eef5ee; font-weight:600; }
.rp-item.rp-suggest { color:#1a7a4f; }
.rp-item.rp-dirty { display:none; color:#a08060; font-style:italic; }
body.show-dirty .rp-item.rp-dirty { display:block; }
.rp-empty-list { padding:14px; text-align:center; color:var(--muted); font-size:12px; }
.rp-mark { color:#c0392b; font-weight:700; background:#fff3e0; padding:0 1px; border-radius:2px; }

/* ---------- 文件预览弹窗 ---------- */
.pv-modal { width:min(880px, 94vw); padding:0; overflow:hidden; }
.pv-body { padding:18px 22px 22px; background:#1f2430; border-radius:0 0 12px 12px; }
.pv-loading { color:#cfd6e4; font-size:13px; text-align:center; padding:20px; }

/* ---------- 订单证件下载弹窗 ---------- */
.dl-modal { width:420px; padding:0; overflow:hidden; }
.dl-head {
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 22px 0;
}
.dl-head h3 { margin:0; font-size:17px; }
.dl-close {
  background:none; box-shadow:none; color:var(--muted); font-size:24px; padding:0 4px; line-height:1;
}
.dl-close:hover { color:var(--ink); background:none; }
.dl-tabs {
  display:flex; gap:8px; padding:14px 22px 0;
  border-bottom:1px solid var(--line);
}
.dl-tab {
  padding:8px 14px; font-size:13px; color:var(--ink-2); cursor:pointer;
  border-bottom:2px solid transparent; margin-bottom:-1px; font-weight:500;
}
.dl-tab.active { color:var(--primary); border-bottom-color:var(--primary); }
.dl-body { padding:18px 22px; }
.dl-opt {
  display:flex; align-items:center; gap:10px;
  padding:12px 14px; border:1px solid var(--line); border-radius:var(--radius-sm);
  margin-bottom:10px; cursor:pointer; font-size:14px;
}
.dl-opt:hover { border-color:var(--primary-line); background:var(--primary-soft); }
.dl-opt input { width:auto; flex:0 0 auto; accent-color:var(--primary); }
.dl-count {
  background:#fff4d6; color:#92670a; font-size:11px; padding:2px 8px; border-radius:20px; margin-left:4px;
}
.dl-stamp {
  display:flex; align-items:center; gap:14px; margin-top:14px; padding-top:14px; border-top:1px solid var(--line);
  font-size:13px; color:var(--ink-2);
}
.dl-radio { display:flex; align-items:center; gap:6px; cursor:pointer; }
.dl-radio input { width:auto; accent-color:var(--primary); }
.dl-bar {
  display:flex; align-items:center; gap:12px; margin-bottom:14px; flex-wrap:wrap;
}

/* 下载生成中遮罩 */
.dl-loading {
  position:fixed; inset:0; background:rgba(15,23,42,.55);
  display:flex; align-items:center; justify-content:center; z-index:200;
  backdrop-filter:blur(2px);
}
.dl-loading-box {
  background:#fff; border-radius:var(--radius); padding:32px 36px;
  text-align:center; box-shadow:0 20px 60px rgba(15,23,42,.3);
  max-width:320px;
}
.dl-spinner {
  width:44px; height:44px; margin:0 auto 16px;
  border:4px solid var(--primary-soft); border-top-color:var(--primary);
  border-radius:50%; animation:spin 1s linear infinite;
}
@keyframes spin { to { transform:rotate(360deg); } }
.dl-loading-text { font-size:16px; font-weight:700; color:var(--ink); margin-bottom:6px; }
.dl-loading-sub { font-size:12.5px; color:var(--muted); line-height:1.5; }

.duo-row { display:flex; gap:18px; margin-bottom:18px; align-items:flex-start; }
.duo-left-col { flex:0 0 50%; display:flex; flex-direction:column; gap:18px; }
.duo-left-col > .card { margin-bottom:0; }
.duo-row > .card.duo-right { flex:1; min-width:0; }

@media (max-width:760px){
  .grid2 { grid-template-columns:1fr; }
  .stat-grid { grid-template-columns:1fr 1fr; }
  .duo-row { flex-direction:column; }
  .duo-left-col { flex:none; }
}