/* ===== 上海徽成物流数据管理系统 — 浅色商务专业配色 ===== */
:root{
  /* 品牌色系：深蓝 + 炭灰 + 香槟金 */
  --brand:#1e3a5f; --brand-l:#2c5f8a; --brand-ll:#4a82b8;
  --charcoal:#3c4858; --charcoal-l:#5a6b7d; --charcoal-ll:#8a95a5;
  --gold:#c8a96e; --gold-l:#d9be85; --gold-d:#b08c50;

  /* 浅色背景层级 */
  --bg:#f5f7fa; --bg-l:#eef1f5; --bg-warm:#fafbfd;
  --card:#ffffff; --card-hover:#f8f9fc;

  /* 边框层级 */
  --border:#dfe3e8; --border-l:#e8ecf1; --border-d:#c4cad2;

  /* 文字层级 */
  --text:#1a2332; --text-l:#3c4858; --muted:#8a95a5;

  /* 状态色 */
  --red:#d63031; --red-bg:#fff5f5;
  --green:#27ae60; --green-bg:#f0faf4;
  --orange:#e67e22; --orange-bg:#fdf6ec;
  --blue:#2d6cb4; --blue-d:#1a4878; --blue-l:#e8f1fa; --blue-ll:#f4f8fc;

  /* 阴影层级 — 轻柔克制 */
  --shadow-s:0 1px 2px rgba(30,58,95,.04);
  --shadow:0 2px 8px rgba(30,58,95,.06);
  --shadow-l:0 8px 24px rgba(30,58,95,.09);
  --shadow-xl:0 16px 48px rgba(30,58,95,.12);

  --radius:8px; --radius-l:12px;
  --sidebar-w:240px;
  --transition:.22s ease;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:"Microsoft YaHei","PingFang SC","Helvetica Neue","Segoe UI",sans-serif;background:var(--bg);color:var(--text);font-size:14px;line-height:1.6;-webkit-font-smoothing:antialiased;letter-spacing:.3px}
a{color:var(--brand);text-decoration:none;transition:color var(--transition)}
a:hover{color:var(--brand-l)}
button{font-family:inherit;cursor:pointer;border:none;border-radius:var(--radius);transition:background-color var(--transition),border-color var(--transition),color var(--transition),box-shadow var(--transition)}
input,select{font-family:inherit;font-size:14px}

/* ===== 登录页 ===== */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--brand) 0%,var(--brand-l) 50%,#7fb3d8 100%);padding:20px;position:relative;overflow:hidden}
.login-wrap::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,var(--brand) 0%,var(--brand-l) 40%,var(--brand-ll) 100%);opacity:.85}
.login-wrap::after{content:'';position:absolute;inset:0;background:url('/images/login-bg.jpg') center/cover no-repeat;opacity:.12;mix-blend-mode:luminosity}
.login-card{background:var(--card);border-radius:var(--radius-l);box-shadow:var(--shadow-xl);width:100%;max-width:400px;overflow:hidden;position:relative;z-index:1}
.login-head{background:linear-gradient(135deg,var(--brand),var(--brand-l));color:#fff;padding:34px 28px 26px;text-align:center;position:relative}
.login-head::after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--gold),var(--gold-l),var(--gold))}
.login-head .login-logo{width:80px;height:80px;margin:0 auto 14px;border-radius:16px;object-fit:cover;background:#fff;padding:6px;box-shadow:0 4px 16px rgba(0,0,0,.15)}
.login-head h1{font-size:20px;font-weight:700;letter-spacing:2px}
.login-head p{font-size:12px;opacity:.8;margin-top:6px;letter-spacing:1px}
.login-body{padding:28px}
.login-body .field{margin-bottom:16px}
.login-body label{display:block;font-size:13px;color:var(--muted);margin-bottom:6px;font-weight:500}
.login-body input{width:100%;padding:12px 14px;border:1px solid var(--border);border-radius:8px;outline:none;transition:border-color var(--transition),box-shadow var(--transition);background:#fff}
.login-body input:focus{border-color:var(--brand-l);box-shadow:0 0 0 3px var(--blue-l)}
.btn-login{width:100%;padding:13px;background:var(--brand);color:#fff;font-size:15px;font-weight:600;border-radius:8px;transition:background-color var(--transition),border-color var(--transition),color var(--transition);letter-spacing:1px}
.btn-login:hover{background:var(--brand-l);transform:translateY(-1px);box-shadow:var(--shadow-l)}
.login-err{color:var(--red);font-size:13px;margin-bottom:12px;min-height:18px}
.login-hint{margin-top:18px;padding:12px 14px;background:var(--blue-ll);border-radius:8px;font-size:12px;color:var(--muted);text-align:center;border:1px solid var(--border-l)}

/* ===== 主框架 ===== */
.app-shell{display:flex;min-height:100vh}

/* ===== 侧边栏 — 浅色商务 ===== */
.sidebar{width:var(--sidebar-w);background:#fff;color:var(--text);position:fixed;top:0;left:0;bottom:0;display:flex;flex-direction:column;z-index:100;transition:transform .25s;border-right:1px solid var(--border)}
.sidebar .brand{padding:22px 20px;border-bottom:2px solid var(--gold);display:flex;align-items:center;gap:12px;background:linear-gradient(135deg,var(--brand),var(--brand-l));color:#fff}
.sidebar .brand .ico{width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;object-fit:contain;padding:5px;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.12)}
.sidebar .brand .txt{font-size:15px;font-weight:600;line-height:1.35;letter-spacing:1px}
.sidebar .brand .txt small{display:block;font-size:11px;font-weight:400;opacity:.6;margin-top:3px;letter-spacing:2px}
.nav{flex:1;padding:10px 12px;overflow-y:auto}
.nav-item{display:flex;align-items:center;gap:11px;padding:11px 14px;color:var(--charcoal);border-radius:8px;cursor:pointer;margin-bottom:2px;font-size:13.5px;font-weight:500;transition:background-color var(--transition),border-color var(--transition),color var(--transition);letter-spacing:.5px;border-left:3px solid transparent}
.nav-item:hover{background:var(--blue-ll);color:var(--brand);border-left-color:var(--brand-l)}
.nav-item.active{background:var(--blue-l);color:var(--brand);font-weight:600;border-left-color:var(--gold);box-shadow:0 1px 4px rgba(30,58,95,.08)}
.nav-item .ic{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;color:var(--charcoal-l);flex-shrink:0;transition:color var(--transition)}.nav-item .ic svg{width:100%;height:100%;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;fill:none}.nav-item:hover .ic{color:var(--brand)}.nav-item.active .ic{color:var(--brand)}.nav-item.nav-sub .ic{width:18px;height:18px;opacity:.7}.nav-group-label .ic{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;color:var(--charcoal-l);flex-shrink:0}.nav-group-label:hover .ic{color:var(--brand)}.nav-group-label .ic svg{width:100%;height:100%;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;fill:none}
.nav-group-label{padding:11px 14px;color:var(--charcoal);border-radius:8px;cursor:default;margin-bottom:2px;font-size:13.5px;font-weight:500;display:flex;align-items:center;gap:11px;transition:background-color var(--transition),border-color var(--transition),color var(--transition);letter-spacing:.5px;border-left:3px solid transparent}
.nav-group-label.nav-group-toggle{cursor:pointer;user-select:none}
.nav-group-label:hover{background:var(--blue-ll);color:var(--brand);border-left-color:var(--brand-l)}
.nav-group-label.active{background:var(--blue-l);color:var(--brand);font-weight:600;border-left-color:var(--gold);box-shadow:0 1px 4px rgba(30,58,95,.08)}
.nav-group-items{transition:max-height .3s ease,opacity .2s;max-height:120px;opacity:1;overflow:hidden}
.nav-group.collapsed .nav-group-items{max-height:0;opacity:0}
.nav-item.nav-sub{padding:9px 14px 9px 22px;font-size:12.5px;font-weight:500;border-left-width:2px}
.sidebar .foot{padding:14px 16px;border-top:1px solid var(--border-l);font-size:11px;color:var(--muted);letter-spacing:1px;text-align:center}

/* ===== 顶栏 — 浅色商务质感 ===== */
.main{flex:1;margin-left:var(--sidebar-w);display:flex;flex-direction:column;min-width:0}
.topbar{background:#fff;height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;position:sticky;top:0;z-index:50;border-bottom:1px solid var(--border)}
.topbar::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--gold),var(--gold-l),var(--gold))}
.topbar .tb-left{display:flex;align-items:center;gap:12px}
.topbar .hamb{display:none;font-size:22px;color:var(--text);background:none}
.topbar .title{font-size:16px;font-weight:600;color:var(--brand);letter-spacing:1px}
.topbar .company{font-size:12px;color:var(--charcoal-l);letter-spacing:1px}
.topbar .tb-right{display:flex;align-items:center;gap:14px}
.topbar .user{font-size:12px;color:var(--charcoal-l);letter-spacing:.5px}
.topbar .user b{color:var(--gold);font-weight:600}

/* ===== 按钮 — 商务克制 ===== */
.btn{padding:8px 16px;border-radius:var(--radius);font-size:13px;font-weight:500;transition:background-color var(--transition),border-color var(--transition),color var(--transition);letter-spacing:.5px}
.btn-primary{background:var(--brand);color:#fff;border:none}
.btn-primary:hover{background:var(--brand-l);box-shadow:var(--shadow)}
.btn-ghost{background:#fff;color:var(--text-l);border:1px solid var(--border)}
.btn-ghost:hover{border-color:var(--brand-l);color:var(--brand);background:var(--blue-ll)}
.btn-danger{background:#fff;color:var(--red);border:1px solid rgba(214,48,49,.3)}
.btn-danger:hover{background:var(--red);color:#fff}
.btn-sm{padding:6px 12px;font-size:12px;border-radius:6px}
.btn-xs{padding:3px 8px;font-size:11px;border-radius:5px;white-space:nowrap}

/* ===== 内容区 ===== */
.content{padding:24px;flex:1}
.view{display:none}
.view.active{display:block}

/* ===== 卡片 — 简洁克制 ===== */
.card{background:var(--card);border-radius:var(--radius-l);box-shadow:var(--shadow-s);padding:20px;margin-bottom:20px;border:1px solid var(--border-l)}
.card-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;flex-wrap:wrap;gap:10px}
.card-h h3{font-size:16px;font-weight:600;color:var(--text);letter-spacing:1px}
.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.toolbar .grow{flex:1}

/* ===== 统计卡片 — 金色点缀 ===== */
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:20px}
.stat{background:var(--card);border-radius:var(--radius-l);padding:20px;box-shadow:var(--shadow-s);border:1px solid var(--border-l);position:relative;overflow:hidden}
.stat::before{content:'';position:absolute;top:0;left:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--brand),var(--brand-l))}
.stat .lbl{font-size:12px;color:var(--muted);margin-bottom:8px;font-weight:500;letter-spacing:1px}
.stat .val{font-size:26px;font-weight:700;color:var(--text);letter-spacing:-.5px}
.stat .sub{font-size:11px;color:var(--muted);margin-top:6px}
.stat.clickable{cursor:pointer}
.stat.exc::before{background:linear-gradient(180deg,var(--red),#e17055)}
.stat.done::before{background:linear-gradient(180deg,var(--green),#6dd5a0)}
.stat.partial::before{background:linear-gradient(180deg,var(--orange),#f0a04b)}
.stat.none::before{background:linear-gradient(180deg,#c0392b,#e74c3c)}
.chart-box{position:relative;height:320px}

/* ===== 表格 — 深蓝表头 + 金色底边 ===== */
.table-wrap{overflow:auto;border-radius:var(--radius-l);border:1px solid var(--border);background:#fff;max-height:calc(100vh - 250px);box-shadow:var(--shadow-s)}
table.data{border-collapse:collapse;width:100%;font-size:13px}
table.data th{background:linear-gradient(180deg,var(--brand),var(--brand-l));color:#fff;font-weight:500;text-align:left;padding:10px 14px;white-space:nowrap;position:sticky;top:0;z-index:2;letter-spacing:.5px;border-bottom:2px solid rgba(200,169,110,.45);font-size:12.5px}
table.data th.g-filterable{cursor:default}
table.data th.g-filter-active{background:var(--brand-l);box-shadow:inset 0 -2px 0 0 var(--gold)}
table.data th.g-filterable select.g-header-filter{appearance:none;-webkit-appearance:none;-moz-appearance:none;background:transparent url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path fill='%23c8a96e' d='M0 0h10L5 6z'/></svg>") no-repeat right center;border:none;width:14px;height:14px;padding:0;margin:0;color:transparent;font-size:1px;cursor:pointer;position:absolute;right:6px;top:50%;transform:translateY(-50%)}
table.data th.g-filterable select.g-header-filter option{color:var(--text);background:#fff;font-size:13px}
table.data th.g-filterable select.g-header-filter:focus{outline:none}
table.data td{padding:10px 14px;border-bottom:1px solid var(--border-l);white-space:nowrap}
table.data tbody tr:hover td{background:var(--blue-ll)}
table.data tr.exc-row td{color:var(--red);background:var(--red-bg)}
table.data tr.exc-row:hover td{background:#ffe8e6}
table.data tr.dup-row td{color:#b45309;background:var(--orange-bg)}
table.data tr.dup-row:hover td{background:#ffedd5}
.tag{display:inline-block;padding:3px 10px;border-radius:12px;font-size:11px;font-weight:600;letter-spacing:.5px}
.tag-done{background:var(--green-bg);color:var(--green)}
.tag-partial{background:var(--orange-bg);color:var(--orange)}
.tag-none{background:var(--red-bg);color:var(--red)}
.empty{text-align:center;padding:50px 20px;color:var(--muted);font-size:14px}
.table-count{font-size:12px;color:var(--muted);letter-spacing:.5px}

/* ===== 表单 & 弹窗 — 商务质感 ===== */
.form-row{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.form-row .fg{flex:1;min-width:200px}
.form-row label{display:block;font-size:12px;color:var(--muted);margin-bottom:5px;font-weight:500;letter-spacing:.5px}
.form-row input,.form-row select{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:8px;outline:none;transition:background-color var(--transition),border-color var(--transition),color var(--transition)}
.form-row input:focus,.form-row select:focus{border-color:var(--brand-l);box-shadow:0 0 0 3px var(--blue-l)}
.modal-mask{position:fixed;inset:0;background:rgba(30,58,95,.45);display:none;align-items:center;justify-content:center;z-index:200;padding:20px}
.modal-mask.show{display:flex}
.modal{background:var(--card);border-radius:var(--radius-l);width:100%;max-width:460px;box-shadow:var(--shadow-xl);overflow:hidden;border:1px solid var(--border-l)}
.modal.wide{max-width:680px}
.modal-h{padding:16px 20px;border-bottom:1px solid rgba(200,169,110,.2);display:flex;align-items:center;justify-content:space-between;background:linear-gradient(90deg,var(--brand),var(--brand-l));color:#fff}
.modal-h::after{display:none}
.modal-h h3{font-size:16px;font-weight:600;color:#fff;letter-spacing:1px}
.modal-h .close{background:none;font-size:22px;color:rgba(255,255,255,.7);line-height:1;transition:color var(--transition)}
.modal-h .close:hover{color:#fff}
.modal-b{padding:20px}
.modal-f{padding:14px 20px;border-top:1px solid var(--border-l);display:flex;justify-content:flex-end;gap:10px;background:var(--bg)}

.toast{position:fixed;top:20px;left:50%;transform:translateX(-50%);background:var(--brand);color:#fff;padding:12px 24px;border-radius:var(--radius);z-index:300;font-size:14px;box-shadow:var(--shadow-xl);opacity:0;transition:opacity .3s,top .3s;pointer-events:none;letter-spacing:.5px;border:1px solid rgba(200,169,110,.2)}
.toast.show{opacity:1;top:30px}
.toast.err{background:var(--red);border-color:rgba(214,48,49,.3)}
.toast.ok{background:var(--green);border-color:rgba(39,174,96,.3)}

.upload-area{border:2px dashed var(--border);border-radius:var(--radius-l);padding:30px;text-align:center;color:var(--muted);transition:background-color var(--transition),border-color var(--transition),color var(--transition);cursor:pointer}
.upload-area:hover,.upload-area.drag{border-color:var(--brand-l);background:var(--blue-ll);color:var(--brand)}
.upload-area .big{font-size:36px;margin-bottom:8px}
.notice{background:var(--blue-ll);border-left:3px solid var(--brand-l);padding:12px 16px;border-radius:8px;font-size:12px;color:var(--text-l);margin-bottom:14px;letter-spacing:.5px}

/* ===== 月度看板 KPI 卡片 ===== */
.md-kpi-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-bottom:20px}
.md-kpi-item{background:var(--card);border-radius:var(--radius-l);padding:18px;box-shadow:var(--shadow-s);position:relative;overflow:hidden;border:1px solid var(--border-l)}
.md-kpi-icon{font-size:22px;margin-bottom:6px}
.md-kpi-body{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.md-kpi-val{font-size:26px;font-weight:700;color:var(--text);letter-spacing:-.5px}
.md-kpi-lbl{font-size:12px;color:var(--muted);letter-spacing:1px}
.md-kpi-tag{font-size:11px;padding:3px 8px;border-radius:6px;background:var(--blue-ll);color:var(--brand-l);margin-left:4px;letter-spacing:.5px}
.md-kpi-sub{font-size:11px;color:var(--muted);margin-top:4px}
.md-kpi-progress{height:5px;background:var(--border-l);border-radius:4px;margin-top:8px;overflow:hidden}
.md-kpi-progress-bar{height:100%;border-radius:4px;transition:width .6s ease}
.md-kpi-progress-green{background:linear-gradient(90deg,var(--green),#6dd5a0)}
.md-kpi-blue::before{content:'';position:absolute;top:0;left:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--brand),var(--brand-l))}
.md-kpi-blue{border-left:none}
.md-kpi-teal::before{content:'';position:absolute;top:0;left:0;bottom:0;width:4px;background:linear-gradient(180deg,#00897b,#26a69a)}
.md-kpi-teal{border-left:none}
.md-kpi-green::before{content:'';position:absolute;top:0;left:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--green),#6dd5a0)}
.md-kpi-green{border-left:none}
.md-kpi-red::before{content:'';position:absolute;top:0;left:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--red),#e17055)}
.md-kpi-red{border-left:none}
.md-kpi-orange::before{content:'';position:absolute;top:0;left:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--orange),#f0a04b)}
.md-kpi-orange{border-left:none}
.md-kpi-indigo::before{content:'';position:absolute;top:0;left:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--brand),var(--brand-l))}
.md-kpi-indigo{border-left:none}
.md-chart-card{border-radius:var(--radius-l)}

/* ===== 回单预警看板 ===== */
.rw-kpi-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-bottom:14px}
.rw-kpi-item{background:var(--card);border-radius:var(--radius-l);padding:18px 20px;box-shadow:var(--shadow-s);border:1px solid var(--border-l);display:flex;align-items:center;gap:14px;position:relative;overflow:hidden}
.rw-kpi-green::before{content:'';position:absolute;top:0;left:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--green),#6dd5a0)}
.rw-kpi-orange::before{content:'';position:absolute;top:0;left:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--orange),#f0a04b)}
.rw-kpi-red::before{content:'';position:absolute;top:0;left:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--red),#e17055)}
.rw-kpi-blue::before{content:'';position:absolute;top:0;left:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--brand),var(--brand-l))}
.rw-kpi-val{font-size:28px;font-weight:700;color:var(--text);letter-spacing:-.5px}
.rw-kpi-lbl{font-size:13px;color:var(--muted);margin-top:2px;letter-spacing:.5px}
.rw-kpi-tag{font-size:11px;color:var(--charcoal-l);margin-top:2px}

/* ===== 使用说明 ===== */
.guide-section{padding:4px 16px 8px;line-height:1.8}
.guide-section p{margin:6px 0;font-size:13px}
.guide-section b{color:var(--text)}
.guide-section ul{margin:4px 0 8px 20px;font-size:13px}
.guide-section li{margin:3px 0}

/* ===== 编辑弹窗字段 ===== */
.edit-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.edit-col{display:flex;flex-direction:column;gap:10px}
.edit-field label{display:block;font-size:12px;color:var(--muted);margin-bottom:4px;font-weight:500}
.edit-field input{width:100%;padding:8px 10px;border:1px solid var(--border);border-radius:6px;outline:none;font-size:13px;transition:background-color var(--transition),border-color var(--transition),color var(--transition)}
.edit-field input:focus{border-color:var(--brand-l);box-shadow:0 0 0 3px var(--blue-l)}
@media(max-width:480px){
  .edit-grid{grid-template-columns:1fr}
}

/* ===== 响应式 ===== */
@media(max-width:1024px){
  :root{--sidebar-w:220px}
  .stat-grid{grid-template-columns:repeat(2,1fr)}
  .chart-row{grid-template-columns:1fr!important}
  .md-kpi-grid{grid-template-columns:repeat(3,1fr)}
  .rw-kpi-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  .sidebar{transform:translateX(-100%)}
  .sidebar.open{transform:translateX(0)}
  .main{margin-left:0}
  .topbar{height:50px;padding:0 14px}
  .topbar .hamb{display:block}
  .topbar .company{display:none}
  .topbar .user{font-size:12px}
  .topbar .user b{font-size:12px}
  .topbar .btn-sm{padding:4px 8px;font-size:11px}
  .content{padding:12px}
  .card{padding:14px;margin-bottom:14px;border-radius:12px}
  .card-h{margin-bottom:10px;gap:6px}
  .card-h h3{font-size:14px}
  .stat-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .stat{padding:14px;border-radius:12px}
  .stat .val{font-size:20px}
  .stat .lbl{font-size:11px}
  .stat .sub{font-size:11px}
  .chart-box{height:220px}
  .table-wrap{max-height:calc(100vh - 180px)}
  .toolbar{gap:6px;margin-bottom:10px}
  .toolbar .grow{order:999;width:100%}
  .toolbar .search-input{min-width:0;max-width:100%;width:100%;order:1;margin-bottom:4px}
  .toolbar .table-count{font-size:11px}
  .toolbar select,.toolbar input[type="date"]{padding:5px 8px;font-size:12px;max-width:130px}
  .toolbar .btn-sm{padding:4px 8px;font-size:11px}
  .btn{padding:6px 12px;font-size:12px}
  .btn-sm{padding:4px 8px;font-size:11px}
  .notice{font-size:11px;padding:8px 10px;margin-bottom:10px}
  .modal{max-width:100%;border-radius:12px;margin:0 8px;max-height:90vh;overflow-y:auto}
  .modal.wide{max-width:100%}
  .modal-mask{padding:8px}
  .modal-b{padding:14px}
  .modal-h{padding:12px 16px}
  .modal-h h3{font-size:15px}
  .modal-f{padding:10px 16px;gap:8px}
  .form-row{gap:10px}
  .form-row .fg{min-width:0;flex:1 1 100%}
  .edit-grid{grid-template-columns:1fr}
  .edit-field input{padding:7px 10px;font-size:14px}
  #fStart,#fEnd{max-width:140px;font-size:13px}
  .pager-simplify .pager-size{display:none}
}
@media(max-width:480px){
  .stat-grid{grid-template-columns:1fr 1fr;gap:8px}
  .md-kpi-grid{grid-template-columns:1fr 1fr;gap:8px}
  .rw-kpi-grid{grid-template-columns:1fr 1fr;gap:8px}
  .md-kpi-val{font-size:20px}
  .rw-kpi-val{font-size:20px}
  .stat{padding:12px}
  .stat .val{font-size:18px}
  .topbar .title{font-size:14px}
  .toolbar{gap:4px}
  .content{padding:8px}
  .card{padding:10px;margin-bottom:8px;border-radius:10px}
  .login-card{border-radius:12px}
  .login-head{padding:24px 20px 18px}
  .login-head h1{font-size:16px}
  .login-body{padding:20px}
  .sidebar .brand{padding:16px 14px}
  .sidebar .brand .txt{font-size:13px}
  .nav-item{padding:10px 12px;font-size:13px}
  table.data{font-size:12px}
  table.data th,table.data td{padding:6px 8px}
  #gPager{padding:8px 12px;font-size:12px}
  #gPager input[type="number"]{width:44px;padding:3px;font-size:12px}
  .upload-area{padding:20px}
  .upload-area .big{font-size:28px}
}
@media(max-width:360px){
  .stat-grid{grid-template-columns:1fr}
  .stat .val{font-size:16px}
  .topbar .tb-right{gap:8px}
  .topbar .user{font-size:11px}
  .toolbar .btn-sm{padding:3px 6px;font-size:10px}
  table.data{font-size:11px}
  table.data th,table.data td{padding:4px 6px}
}

/* ===== GPS定位与轨迹回放 ===== */
.gps-tabs{display:flex;gap:6px}
.gps-tab{background:var(--blue-ll);color:var(--text-l);border:1px solid var(--border);padding:6px 14px;font-size:12px;cursor:pointer;border-radius:8px;transition:background var(--transition),border-color var(--transition),color var(--transition);letter-spacing:.5px;font-weight:500}
.gps-tab:hover{border-color:var(--brand-l);color:var(--brand)}
.gps-tab.active{background:var(--brand);color:#fff;border-color:var(--brand)}
.gps-search-bar{display:flex;gap:8px;margin-bottom:8px;align-items:center}
.gps-search-bar input{flex:1;padding:8px 12px;border:1px solid var(--border);border-radius:8px;font-size:13px;outline:none;transition:border-color var(--transition),box-shadow var(--transition);background:#fff}
.gps-search-bar input:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(26,58,95,.08)}
.gps-search-bar input::placeholder{color:var(--muted)}
.gps-search-bar .gps-search-btn{white-space:nowrap;flex-shrink:0}
.gps-search-coords{display:flex;align-items:center;gap:6px;margin-left:8px;font-size:12px;color:var(--text-l);white-space:nowrap}
.gps-search-coords code{background:var(--blue-ll);padding:2px 8px;border-radius:4px;font-family:monospace;font-size:12px;color:var(--brand)}
.gps-body{display:flex;gap:16px;margin-top:4px}
.gps-map-wrap{flex:1;min-width:0}
#gps-map{height:520px;width:100%;border-radius:var(--radius-l);border:1px solid var(--border);box-shadow:var(--shadow-s)}
.gps-info{width:260px;flex-shrink:0;overflow-y:auto;max-height:540px}
.gps-stats{background:var(--bg-warm);border-radius:var(--radius-l);padding:16px;border:1px solid var(--border-l);box-shadow:var(--shadow-s)}
.gps-stats h4{font-size:13px;font-weight:600;margin-bottom:10px;letter-spacing:.5px}
.gps-stat-row{display:flex;justify-content:space-between;align-items:center;padding:6px 10px;font-size:12px;border-radius:6px;margin-bottom:3px;background:#fff;transition:background-color var(--transition),border-color var(--transition),color var(--transition)}
.gps-stat-row span{color:var(--muted);font-weight:500}
.gps-stat-row b{font-weight:600;color:var(--text)}
.gps-stat-row.done b{color:var(--green)}
.gps-stat-row.partial b{color:var(--orange)}
.gps-stat-row.none b{color:var(--red)}
.gps-stat-row small{font-size:11px;color:var(--muted);margin-left:6px}
.gps-vehicle-item{padding:6px 10px;border-radius:6px;margin-bottom:3px;background:#fff;font-size:12px;display:flex;align-items:center;gap:6px;transition:background-color var(--transition),border-color var(--transition),color var(--transition)}
.gps-vehicle-item b{font-weight:600}
.gps-vehicle-item span{font-size:11px}
.gps-vehicle-item small{font-size:11px;color:var(--muted)}
.gps-legend{display:flex;gap:12px;font-size:12px;margin-bottom:8px}
.gps-tip{font-size:11px;color:var(--muted);margin-top:10px;padding:10px;background:var(--blue-ll);border-radius:8px;line-height:1.5;border:1px solid var(--border-l)}
.gps-setup{padding:30px;text-align:center}
.gps-detail hr{margin:8px 0;border-color:var(--border-l)}
.gps-stat-clickable{cursor:pointer;transition:background-color var(--transition),border-color var(--transition),color var(--transition)}
.gps-stat-clickable:hover{background:var(--blue-ll)!important}
.gps-stat-active{cursor:pointer;background:var(--blue-l)!important;box-shadow:0 0 0 2px var(--brand)}
.gps-vehicle-clickable{cursor:pointer;transition:background-color var(--transition),border-color var(--transition),color var(--transition)}
.gps-vehicle-clickable:hover{background:var(--blue-ll)!important}
.gps-vehicle-clickable:active{transform:translateX(0)}

@media(max-width:768px){
  .gps-body{flex-direction:column}
  .gps-info{width:100%;max-height:none}
  #gps-map{height:300px}
}
@media(max-width:480px){
  #gps-map{height:240px}
  .gps-tabs{gap:4px}
  .gps-tab{padding:4px 8px;font-size:11px}
}

/* ===== 厂家列表操作按钮 ===== */
.fac-actions{display:flex;gap:6px;align-items:flex-start}
.fac-action-group{display:flex;flex-direction:column;gap:4px}
.fac-action-group .btn-xs{width:100%;text-align:center}

.scrim{display:none;position:fixed;inset:0;background:rgba(30,58,95,.45);z-index:99}
.scrim.show{display:block}

/* ===== 商务装饰细节 ===== */
.gold-val{color:var(--gold);font-weight:700}
.card-h h3::before{content:'';display:inline-block;width:3px;height:16px;background:linear-gradient(180deg,var(--brand),var(--gold));border-radius:2px;margin-right:8px;vertical-align:middle}

/* ===== 商务预警横幅 — 浅色底 + 左侧色条 ===== */
.warn-banner{padding:12px 18px;border-radius:10px;font-weight:600;font-size:14px;display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;letter-spacing:1px;position:relative;overflow:hidden;border-left:4px solid transparent}
.warn-banner::before{content:'';position:absolute;top:0;left:0;bottom:0;width:4px;border-radius:2px 0 0 2px}
.warn-banner-green{background:var(--green-bg);color:var(--text);border-left-color:var(--green)}
.warn-banner-green::before{background:var(--green)}
.warn-banner-green .wb-label{color:var(--green)}
.warn-banner-amber{background:var(--orange-bg);color:var(--text);border-left-color:var(--orange)}
.warn-banner-amber::before{background:var(--orange)}
.warn-banner-amber .wb-label{color:var(--orange)}
.warn-banner-red{background:var(--red-bg);color:var(--text);border-left-color:var(--red)}
.warn-banner-red::before{background:var(--red)}
.warn-banner-red .wb-label{color:var(--red)}
.warn-banner-brand{background:var(--blue-ll);color:var(--text);border-left-color:var(--brand)}
.warn-banner-brand::before{background:var(--brand)}
.warn-banner-brand .wb-label{color:var(--brand)}
.warn-banner .wb-sub{font-size:12px;color:var(--muted);letter-spacing:.5px}

/* ===== 页面过渡动画 ===== */
/* 页面切换动画已移除以提升性能 */

/* ===== 工具栏输入框 ===== */
.toolbar select,.toolbar input[type="date"]{padding:7px 10px;border-radius:8px;border:1px solid var(--border);background:#fff;font-size:13px;transition:background-color var(--transition),border-color var(--transition),color var(--transition);color:var(--text)}
.toolbar select:focus,.toolbar input[type="date"]:focus{border-color:var(--brand-l);box-shadow:0 0 0 3px var(--blue-l)}

/* ===== ICP备案号底部 ===== */
.icp-footer{text-align:center;padding:12px 16px;font-size:12px;color:var(--muted);background:var(--bg);border-top:1px solid var(--border-l)}
.icp-footer a{color:var(--muted);text-decoration:none;transition:color var(--transition)}
.icp-footer a:hover{color:var(--brand-l)}
.icp-footer-app{position:fixed;bottom:0;left:0;right:0;z-index:50;padding:6px 16px;background:rgba(247,248,250,.98);font-size:11px}
@media(max-width:768px){.icp-footer-app{font-size:10px;padding:4px 10px}}

/* ===== 纯CSS图表（替代Chart.js，零JS开销）===== */
.css-bar-chart{display:flex;align-items:flex-end;gap:10px;height:100%;padding:8px 4px 0}
.css-bar-col{display:flex;flex-direction:column;align-items:center;flex:1;height:100%;justify-content:flex-end;min-width:40px}
.css-bar-val{font-size:12px;font-weight:700;color:var(--text);margin-bottom:2px}
.css-bar{width:70%;min-height:3px;max-height:100%;border-radius:6px 6px 0 0;transition:width .2s}
.css-bar-lbl{font-size:11px;color:var(--muted);margin-top:4px;text-align:center;white-space:nowrap}

.css-hbar-chart{display:flex;flex-direction:column;gap:8px;padding:8px 0}
.css-hbar-total{text-align:center;margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid var(--border-l)}
.css-hbar-total-val{display:block;font-size:24px;font-weight:800;color:var(--text)}
.css-hbar-total-lbl{font-size:11px;color:var(--muted)}
.css-hbar-row{display:flex;align-items:center;gap:8px}
.css-hbar-label{font-size:11px;color:var(--text-l);white-space:nowrap;min-width:65px;text-align:right}
.css-hbar-track{flex:1;height:18px;background:var(--bg-l);border-radius:9px;overflow:hidden}
.css-hbar-fill{height:100%;border-radius:9px;min-width:3px;transition:width .3s}
.css-hbar-count{font-size:11px;font-weight:600;color:var(--text);white-space:nowrap;min-width:35px}