:root {
  --bg: #e7eaf2;
  --surface: #ffffff;
  --surface-soft: #f1f4fa;
  --ink: #1b2333;
  --muted: #69748a;
  --line: #dbe0ea;
  /* 主强调（变量名沿用 --teal，值改为现代蓝） */
  --teal: #3a63f0;
  --teal-dark: #2348c7;
  --mint: #e9eefe;
  /* 状态色：warning / danger / info / success */
  --gold: #c5871f;
  --rose: #e0564f;
  --blue: #5b76b5;
  --success: #1f9d6b;
  --shadow: 0 1px 2px rgba(27, 35, 51, 0.06), 0 6px 18px rgba(27, 35, 51, 0.08);
  --shadow-sm: 0 1px 2px rgba(27, 35, 51, 0.06);
  /* 间距系统（8pt 节奏；4 用于细节） */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px; --space-6: 24px; --space-8: 32px;
  /* 字号阶梯 */
  --text-xs: 11px; --text-sm: 12px; --text-md: 13px; --text-base: 14px; --text-lg: 16px; --text-xl: 20px; --text-2xl: 24px;
  /* 圆角 */
  --radius-sm: 8px; --radius: 11px;
}

* { box-sizing: border-box; }
html { background: var(--bg); }
body {
  margin: 0; color: var(--ink); background: var(--bg);
  font-family: "Inter", "PingFang SC", "Microsoft YaHei", "Segoe UI", Arial, sans-serif;
  font-size: var(--text-base); line-height: 1.5; letter-spacing: 0;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "cv05" 1, "ss01" 1;
}
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }

/* ===== 登录墙（专业高级，左品牌 + 右表单）===== */
.login-gate { position: fixed; inset: 0; z-index: 100; overflow: hidden;
  background: linear-gradient(120deg, #f3f7ff 0%, #ebf1fd 52%, #e7eef9 100%); }
/* 全宽连续氛围层：点阵 + 流动极光（左→右流过去，避免左右分模块） */
.login-gate::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background-image: radial-gradient(rgba(40,60,110,.055) 1px, transparent 1px); background-size: 24px 24px;
  -webkit-mask-image: radial-gradient(150% 120% at 50% 26%, #000 38%, transparent 86%);
  mask-image: radial-gradient(150% 120% at 50% 26%, #000 38%, transparent 86%); }
.login-gate::after { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background:
  radial-gradient(960px 760px at 26% 14%, rgba(122,150,255,.32) 0%, transparent 60%),
  radial-gradient(900px 820px at 90% 82%, rgba(96,150,255,.20) 0%, transparent 58%),
  radial-gradient(820px 680px at 64% 44%, rgba(120,196,255,.13) 0%, transparent 60%); }
.login-gate[hidden] { display: none; }
.login-gate:not([hidden]) { display: grid; grid-template-columns: 1.05fr .95fr; }
.login-aside {
  position: relative; z-index: 1; display: flex; flex-direction: column; justify-content: space-between; gap: 24px;
  padding: 48px 52px; color: #2a3550; overflow: hidden; background: transparent;
}
/* 点阵/极光已上移到 .login-gate（全宽连续），此处不再单独绘制 */
.login-aside-brand { display: flex; align-items: center; gap: 12px; position: relative; z-index: 1; }
.login-aside-brand strong { display: block; color: #16203a; font-size: 17px; font-weight: 800; letter-spacing: -.01em; }
.login-aside-brand span { display: block; margin-top: 2px; color: #6677a0; font-size: 11px; letter-spacing: .06em; }
.login-logo {
  display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px;
  background: linear-gradient(135deg, #3a63f0, #2348c7); color: #fff; font-weight: 800; font-size: 21px;
  box-shadow: 0 10px 22px rgba(58,99,240,.30);
}
.login-aside-copy { position: relative; z-index: 1; max-width: 60%; }
.login-eyebrow { color: #5566c4; font-size: 11px; font-weight: 700; letter-spacing: .22em; margin-bottom: 14px; }
.login-aside-copy h1 { font-size: 38px; font-weight: 800; letter-spacing: -.02em; line-height: 1.18; color: #16203a; }
.login-lead { margin-top: 16px; max-width: 300px; color: #56627e; font-size: 13.5px; line-height: 1.75; }
.login-features { list-style: none; margin: 30px 0 0; padding: 0; display: grid; gap: 13px; }
.login-features li { display: flex; align-items: center; gap: 12px; color: #3a4560; font-size: 13px; font-weight: 500; }
.login-features svg { width: 18px; height: 18px; flex: 0 0 auto; padding: 8px; border-radius: 10px;
  color: #3a63f0; background: rgba(58,99,240,.10); box-sizing: content-box; }
.login-aside-foot { position: relative; z-index: 1; color: #8090ad; font-size: 11px; }
.login-main { position: relative; z-index: 1; display: grid; place-items: center; padding: 32px 24px; background: transparent; }
.login-card { width: min(372px, 92vw); padding: 34px 32px; border-radius: 16px; background: var(--surface);
  border: 1px solid var(--line); box-shadow: 0 24px 70px rgba(27,35,51,.16); }
.login-title { font-size: 22px; font-weight: 800; letter-spacing: -.01em; }
.login-sub { margin-top: 6px; color: var(--muted); font-size: 13px; }
.login-field { display: block; margin-top: 18px; }
.login-field > span { display: block; margin-bottom: 6px; color: #3a4458; font-size: 12px; font-weight: 600; }
.login-field input { width: 100%; padding: 11px 12px; border: 1px solid #d7dce8; border-radius: 10px; outline: 0; font-size: 14px; }
.login-field input:focus { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(58,99,240,.14); }
.login-pass-wrap { position: relative; display: block; }
.login-pass-wrap input { padding-right: 40px; }
.login-eye { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 30px; height: 30px;
  border: 0; background: transparent; cursor: pointer; opacity: .55; font-size: 15px; }
.login-eye:hover { opacity: .9; }
.login-error { margin-top: 14px; padding: 9px 12px; border-radius: 9px; background: #fdecea; color: #b3261e;
  border: 1px solid #f5c6c0; font-size: 12.5px; }
.login-error[hidden] { display: none; }
.login-btn { width: 100%; margin-top: 22px; padding: 12px; border: 0; border-radius: 10px; color: #fff; font-size: 15px;
  font-weight: 700; letter-spacing: 2px; cursor: pointer; background: linear-gradient(135deg, var(--teal), var(--teal-dark));
  box-shadow: 0 8px 22px rgba(58,99,240,.32); transition: .15s ease; }
.login-btn:hover { transform: translateY(-1px); box-shadow: 0 12px 28px rgba(58,99,240,.4); }
.login-btn:active { transform: translateY(0); }
.login-btn.is-loading { pointer-events: none; opacity: .85; }
.login-tip { margin-top: 14px; color: #97a1b5; font-size: 11px; text-align: center; min-height: 14px; }
/* 左侧品牌图案（跨境物流节点网络，纯 SVG，蓝灰单色，装饰层，置于文案之下） */
.login-art { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; }
.login-eye { display: grid; place-items: center; color: #6b7689; }
.login-eye svg { width: 18px; height: 18px; }
@media (prefers-reduced-motion: no-preference) {
  .login-art .la-flow { animation: laFlow 5s linear infinite; }
  .login-art .la-pulse { transform-box: fill-box; transform-origin: center; animation: laPulse 3.4s ease-out infinite; }
}
@keyframes laFlow { to { stroke-dashoffset: -152; } }
@keyframes laPulse { 0% { transform: scale(1); opacity: .7; } 70% { transform: scale(3.6); opacity: 0; } 100% { opacity: 0; } }
@media (max-width: 860px) {
  .login-gate:not([hidden]) { grid-template-columns: 1fr; }
  .login-aside { display: none; }
}

.sidebar {
  position: fixed; inset: 0 auto 0 0; width: 224px; padding: 18px 14px;
  color: var(--ink); background: var(--surface); border-right: 1px solid var(--line);
  display: flex; flex-direction: column;
}
.brand { display: flex; align-items: center; gap: 11px; padding: 4px 8px 22px; }
.brand-mark {
  display: grid; place-items: center; width: 36px; height: 36px; border-radius: 9px;
  color: white; background: linear-gradient(135deg, var(--teal) 0%, #6a59f2 100%);
  font-family: "Inter", sans-serif; font-size: 19px; font-weight: 800; box-shadow: 0 4px 12px rgba(58,99,240,.28);
}
.brand strong, .brand span { display: block; }
.brand strong { color: var(--ink); font-size: 15px; font-weight: 700; letter-spacing: -.01em; }
.brand span { margin-top: 2px; color: var(--muted); font-size: 10px; letter-spacing: .04em; }
.nav { display: grid; gap: 2px; }
.nav-group { margin: 14px 0 4px; padding: 0 12px; color: #9aa3b6; font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.nav-group:first-child { margin-top: 4px; }
.nav-item {
  display: flex; align-items: center; gap: 11px; padding: 10px 12px; border: 0; border-radius: 8px;
  color: #545f74; background: transparent; text-align: left; font-size: 13px; font-weight: 500; transition: .15s ease;
}
.nav-item:hover { color: var(--ink); background: #f1f3f9; }
.nav-item.active { color: var(--teal); background: var(--mint); font-weight: 600; }
.nav-icon { display: grid; place-items: center; width: 18px; height: 18px; color: currentColor; flex: 0 0 auto; }
.nav-icon svg { width: 18px; height: 18px; stroke: currentColor; stroke-width: 1.8; fill: none; }
.sidebar-bottom { margin-top: auto; padding: 12px 10px 2px; color: var(--muted); border-top: 1px solid var(--line); }
.sidebar-bottom small { display: block; margin-top: 6px; color: #97a0b3; font-size: 11px; }
.status-line { font-size: 12px; font-weight: 600; }
.status-line i { display: inline-block; width: 7px; height: 7px; margin-right: 6px; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 3px rgba(31,157,107,.15); }

.main { min-width: 780px; margin-left: 224px; padding: 22px 30px 46px; }
.topbar, .filterbar, .section-title, .config-intro, .config-toolbar {
  display: flex; align-items: center; justify-content: space-between;
}
.topbar { margin-bottom: 16px; }
.crumb { display: flex; align-items: center; gap: 9px; min-width: 0; }
.crumb-root { color: var(--muted); font-size: 13px; font-weight: 600; flex: 0 0 auto; }
.crumb-sep { width: 14px; height: 14px; color: #c4cad9; flex: 0 0 auto; }
.crumb-current { color: var(--ink); font-size: 15px; font-weight: 700; letter-spacing: -.01em; flex: 0 0 auto; }
.crumb-sub { margin-left: 4px; padding-left: 11px; border-left: 1px solid var(--line); color: var(--muted); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.eyebrow { margin: 0 0 6px; color: var(--teal); font-size: 10px; font-weight: 700; letter-spacing: .16em; }
h1, h2, h3, p { margin: 0; }
h1 { font-size: 22px; font-weight: 700; letter-spacing: -.01em; }
h2 { font-size: 24px; font-weight: 700; letter-spacing: -.01em; }
h3 { font-size: 15px; font-weight: 600; }
.top-actions { display: flex; gap: 8px; }
.upload-button, .primary-button, .secondary-button, .danger-button, .icon-button {
  border: 1px solid transparent; border-radius: 8px; transition: .15s ease; font-weight: 600;
}
.upload-button, .primary-button {
  padding: 9px 15px; color: white; background: var(--teal); box-shadow: 0 1px 2px rgba(58,99,240,.25);
}
.upload-button:hover, .primary-button:hover { background: var(--teal-dark); }
.upload-button input { display: none; }
.secondary-button { padding: 9px 14px; color: #3a4458; background: var(--surface); border-color: var(--line); }
.secondary-button:hover { border-color: #cdd3e0; background: var(--surface-soft); }
.icon-button { width: 38px; color: #5a6478; background: white; border-color: var(--line); font-size: 18px; border-radius: 8px; }
.icon-button:hover { color: var(--teal); border-color: #cdd3e0; background: var(--surface-soft); }

.page { display: none; }
.page.active { display: block; }
.filterbar {
  gap: 12px; padding: 15px; border: 1px solid var(--line); border-radius: 11px;
  background: var(--surface); box-shadow: var(--shadow);
}
.filterbar label { flex: 1; }
label span { display: block; margin-bottom: 5px; color: var(--muted); font-size: 11px; font-weight: 600; }
input, select, textarea {
  width: 100%; padding: 9px 11px; border: 1px solid #d7dce8; border-radius: 8px; outline: 0; color: var(--ink); background: white;
}
input:focus, select:focus, textarea:focus { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(58,99,240,.13); }
.filterbar .primary-button { align-self: end; }
.notice {
  position: relative; display: flex; align-items: center; gap: 13px; margin: 13px 0; padding: 11px 39px 11px 14px;
  border-left: 3px solid var(--gold); color: #596b68; background: #fffcf5; font-size: 12px;
}
.notice strong { color: #88692e; }
.notice button { position: absolute; right: 10px; border: 0; color: #8c9a98; background: transparent; font-size: 19px; }

.report-head {
  display: flex; align-items: center; justify-content: space-between; min-height: 148px; margin: 16px 0;
  padding: 24px 28px; overflow: hidden; border-radius: 12px; color: white;
  background: linear-gradient(108deg, #1e2a52 0%, #2f3f86 55%, #3a63f0 130%);
  box-shadow: 0 8px 26px rgba(31,42,82,.22);
}
.report-head p { margin-bottom: 10px; color: #aebbf0; font-size: 10px; font-weight: 700; letter-spacing: .2em; }
.report-head h2 { margin-bottom: 10px; font-size: 27px; }
.report-head span { color: #d2dafa; font-size: 12px; }
.report-meta { display: grid; grid-template-columns: repeat(2, minmax(116px, 1fr)); gap: 8px; }
.report-meta div { padding: 11px; border: 1px solid rgba(255,255,255,.18); border-radius: 9px; background: rgba(255,255,255,.1); }
.report-meta span, .report-meta b { display: block; }
.report-meta span { margin-bottom: 4px; color: #c3cdf3; font-size: 10px; }
.report-meta b { font-size: 12px; }

.kpi-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 15px 0; }
.kpi-card, .section-block {
  border: 1px solid var(--line); border-radius: 11px; background: var(--surface); box-shadow: var(--shadow);
}
.kpi-card { padding: 17px 18px; }
.kpi-card span, .kpi-card small { display: block; color: var(--muted); }
.kpi-card span { font-size: 12px; font-weight: 600; }
.kpi-card strong { display: block; margin: 9px 0 7px; color: var(--ink); font-size: 27px; letter-spacing: -.02em; }
.kpi-card small { font-size: 11px; }
.section-block { margin-top: 13px; padding: 16px; }
.section-title { min-height: 28px; margin-bottom: 8px; }
.section-title > div { display: flex; align-items: center; gap: 8px; }
.section-title b { display: grid; place-items: center; width: 23px; height: 23px; border-radius: 7px; color: var(--teal); background: var(--mint); font-size: 10px; font-weight: 700; }
.segmented, .tab-buttons { display: flex; padding: 3px; border-radius: 5px; background: #eef1f8; }
.segmented button, .tab-buttons button, .config-tabs button {
  border: 0; color: #6e7e7c; background: transparent; font-size: 12px;
}
.segmented button, .tab-buttons button { padding: 6px 10px; border-radius: 3px; }
.segmented button.active, .tab-buttons button.active { color: var(--teal); background: white; box-shadow: 0 1px 3px rgba(0,0,0,.08); font-weight: 700; }
.structure-actions { display: flex; align-items: center; gap: 9px; }
.chart-legend { display: flex; align-items: center; gap: 13px; color: var(--muted); font-size: 11px; }
.chart-legend span { display: flex; align-items: center; gap: 5px; }
.chart-legend i { display: inline-block; }
.legend-toggle { display: flex; align-items: center; gap: 5px; color: var(--muted); cursor: pointer; user-select: none; }
.legend-toggle input { width: 13px; height: 13px; accent-color: var(--gold); }
.legend-bar { width: 9px; height: 9px; border-radius: 2px; background: #c2d0f7; }
.legend-line { position: relative; width: 15px; height: 2px; background: var(--teal); }
.legend-line::after { content: ""; position: absolute; top: -2px; left: 6px; width: 5px; height: 5px; border: 1px solid currentColor; border-radius: 50%; background: white; }
.legend-line.teal { color: var(--teal); background: var(--teal); }
.legend-line.gold { color: var(--gold); background: var(--gold); }
.chart { width: 100%; height: 265px; }
.chart-wide { height: 315px; }
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.distribution-table { table-layout: fixed; }
.distribution-table th, .distribution-table td { padding: 7px 8px; }
.distribution-table th:first-child { width: 22%; }
.dot { display: inline-block; width: 7px; height: 7px; margin-right: 6px; border-radius: 50%; }

.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 12px; }
th, td { padding: 10px 12px; border-bottom: 1px solid #eef0f5; text-align: left; white-space: nowrap; }
th { color: #707b91; background: var(--surface-soft); font-size: 11px; font-weight: 600; }
td.number, th.number { text-align: right; }
.group-head { border-left: 1px solid #dce7e4; color: var(--teal); text-align: center; }
.group-head.week, .week-cell { background: #eef2fb; }
.analysis-table { table-layout: fixed; }
.analysis-table th, .analysis-table td { padding: 8px 9px; }
.analysis-table th:nth-child(2) { width: 94px; }
.analysis-table th:nth-child(3) { width: 180px; }
.rank-col { width: 34px; color: #91a09d; text-align: center; }
/* 全局轻微 hover（作用于无底色单元格的行，如分析/分布表） */
tbody tr:hover { background: var(--surface-soft); }
/* 斑马纹 + 强 hover：仅纯操作型长表（无周对比底色），同特异性、hover 后定义确保覆盖 */
.order-table tbody tr:nth-child(even) td,
.config-table tbody tr:nth-child(even) td { background: #f7f9fd; }
.order-table tbody tr:hover td,
.config-table tbody tr:hover td { background: var(--mint); }
/* 主要长表格：粘性表头（仅单行表头的密集表，不动双行表头的分析/分布/矩阵表） */
.order-table thead th, .logistics-table thead th, .attention-table thead th, .pricing-table thead th, .config-table thead th {
  position: sticky; top: 0; z-index: 2;
}
.pill { display: inline-block; padding: 3px 8px; border-radius: 999px; color: var(--teal); background: var(--mint); font-size: 11px; font-weight: 600; }
.match-ok { color: #3e8665; font-size: 11px; font-weight: 700; }
.bar-cell { display: flex; align-items: center; gap: 8px; }
.mini-bar { width: 80px; height: 5px; overflow: hidden; border-radius: 4px; background: #eef1f8; }
.mini-bar i { display: block; height: 100%; border-radius: 4px; background: var(--teal); }
.structure-overview {
  display: grid; grid-template-columns: 190px 1fr; gap: 15px; align-items: center;
  margin: 9px 0 11px; padding: 11px 12px; border: 1px solid #e3e7f1; border-radius: 5px; background: #f6f8fd;
}
.overview-total span, .overview-total strong, .overview-total small { display: block; }
.overview-total span { color: var(--muted); font-size: 11px; font-weight: 700; }
.overview-total strong { margin: 4px 0 2px; font-size: 23px; }
.overview-total small { color: var(--teal); font-size: 11px; }
.overview-visual { min-width: 0; }
.stacked-bar { display: flex; height: 15px; overflow: hidden; border-radius: 3px; background: #eef1f8; }
.stacked-bar i { display: block; height: 100%; border-right: 1px solid rgba(255,255,255,.6); }
.overview-legend { display: flex; flex-wrap: wrap; gap: 5px 13px; margin-top: 8px; }
.overview-legend span { display: flex; align-items: center; gap: 5px; color: #657774; font-size: 11px; }
.overview-legend i { width: 7px; height: 7px; border-radius: 2px; }
.overview-legend b { color: var(--ink); }
.share-cell { display: flex; align-items: center; gap: 6px; min-width: 90px; }
.share-track { width: 54px; height: 6px; overflow: hidden; border-radius: 4px; background: #e7efed; }
.share-track i { display: block; height: 100%; border-radius: 4px; background: var(--teal); }
.share-cell b { min-width: 27px; color: var(--teal-dark); font-size: 11px; }

.config-intro { margin: 12px 0 18px; }
.config-intro span { display: block; margin-top: 7px; color: var(--muted); font-size: 12px; }
.config-intro-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.order-intro { gap: 18px; }
.prototype-tag {
  flex: 0 0 auto; margin-top: 0 !important; padding: 6px 9px; border: 1px solid #eadbbd; border-radius: 4px;
  color: #88692e !important; background: #fffaf0; font-size: 11px !important; font-weight: 700;
}
.order-filter-panel { padding: 13px; }
.order-search-main {
  display: grid; grid-template-columns: minmax(280px, 2.1fr) 145px 145px 170px auto auto; gap: 10px; align-items: end;
}
.order-query-field { min-width: 0; }
.order-more-filters {
  display: grid; grid-template-columns: repeat(4, minmax(150px, 1fr)) auto; gap: 10px; align-items: end;
  max-height: 0; margin-top: 0; overflow: hidden; opacity: 0; transition: .2s ease;
}
.order-more-filters.open { max-height: 90px; margin-top: 12px; opacity: 1; }
.text-button { padding: 9px 5px; border: 0; color: var(--teal); background: transparent; font-size: 12px; }
.batch-query-head {
  display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 13px; padding-top: 11px;
  border-top: 1px solid #e5ecea;
}
.batch-query-head b, .batch-query-head span { display: block; }
.batch-query-head b { margin-bottom: 4px; font-size: 12px; }
.batch-query-head span { color: var(--muted); font-size: 11px; }
.batch-query-panel { display: none; margin-top: 10px; }
.batch-query-panel.open { display: block; }
.batch-query-panel textarea { min-height: 82px; resize: vertical; line-height: 1.6; }
.order-workbench {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 13px;
  border-bottom: 1px solid var(--line); background: var(--surface);
}
.order-status-tabs { display: flex; min-width: 0; overflow-x: auto; }
.order-status-tabs button {
  display: flex; align-items: center; gap: 5px; flex: 0 0 auto; padding: 13px 12px 11px; border: 0; border-bottom: 2px solid transparent;
  color: #607370; background: transparent; font-size: 12px;
}
.order-status-tabs button:hover, .order-status-tabs button.active { color: var(--teal); border-bottom-color: var(--teal); font-weight: 700; }
.order-status-tabs b { color: inherit; font-size: 11px; }
.order-list-actions { display: flex; flex: 0 0 auto; gap: 7px; padding-right: 2px; }
.order-result-panel { margin-top: 10px; padding: 0; overflow: visible; }
.order-result-panel .section-title { margin: 0; padding: 12px 13px 8px; }
.order-table-scroll { overflow: visible; }
.order-table { width: 100%; min-width: 1240px; table-layout: fixed; }
.order-table-scroll .order-table thead th { z-index: 4; box-shadow: 0 1px 0 var(--line); }
.order-table th, .order-table td { padding: 10px 10px; vertical-align: middle; font-size: 13px; word-break: break-all; overflow: hidden; }
.order-table th:nth-child(1) { width: 36px; }                              /* 勾选 */
.order-table th:nth-child(2) { width: 116px; }                             /* 订单号 */
.order-table th:nth-child(3), .order-table th:nth-child(4) { width: 210px; } /* 内部单号 / 物流单号（长，给足并强制断行） */
.order-table th:nth-child(7) { width: 140px; }                             /* 店铺 / 营运 */
.order-table th:nth-child(11) { width: 172px; }                            /* 操作（去掉最新轨迹列后，其余列均分剩余宽） */
.order-table td:nth-child(3), .order-table td:nth-child(4) {
  padding-right: 18px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  line-height: 1.55;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.order-table td:last-child { white-space: normal; line-height: 1.5; }       /* 操作按钮多时紧凑换行 */
.order-table td:last-child .action-button { display: inline-block; margin: 1px 7px 1px 0; white-space: nowrap; }
.order-link { color: #2f6df6; font-weight: 700; cursor: pointer; text-decoration: none; border-bottom: 1px dashed rgba(47,109,246,.45); }
.order-link:hover { border-bottom-style: solid; }
.order-result-foot { position: fixed; left: 254px; right: 30px; bottom: 0; z-index: 30; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 13px; border: 1px solid var(--line); border-bottom: 0; background: var(--surface); box-shadow: 0 -4px 14px rgba(15,23,42,.1); font-size: 13px; color: var(--muted); }
.order-result-panel { padding-bottom: 58px; }
.order-result-foot b { color: var(--ink); font-size: 14px; }
.order-foot-summary, .order-pager { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.order-pager label { display: flex; align-items: center; gap: 5px; }
.order-pager select, .order-pager input, .pager-button { height: 32px; border: 1px solid var(--line); background: #fff; color: var(--ink); }
.order-pager select { padding: 0 6px; }
.order-pager input { width: 58px; padding: 0 6px; }
.pager-button { min-width: 32px; padding: 0 8px; cursor: pointer; }
.pager-button:disabled { opacity: .45; cursor: not-allowed; }
@media (max-width: 900px) {
  .order-result-foot { align-items: flex-start; flex-direction: column; }
}
.store-operator strong, .store-operator small, .latest-track strong, .latest-track small { display: block; }
.store-operator strong, .latest-track strong { color: var(--ink); font-size: 12px; }
.store-operator small, .latest-track small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.status-pill {
  display: inline-block; padding: 4px 7px; border-radius: 11px; color: #607370; background: #eef1f8; font-size: 10px; font-weight: 700;
}
.status-pill.waiting { color: #8b6d31; background: #fbf3df; }
.status-pill.transit { color: #3e7185; background: #e8f1f4; }
.status-pill.delivery { color: #65548a; background: #f0ebf7; }
.status-pill.signed { color: #3e8665; background: #e6f3eb; }
.status-pill.exception, .status-pill.returned { color: #a54d50; background: #fff0f0; }
.status-pill.archived { color: #5b6472; background: #eef0f3; }
.status-pill.deleted { color: #a54d50; background: #f6eced; }
.sync-tag {
  display: inline-flex;
  margin-top: 5px;
  padding: 2px 7px;
  border-radius: 10px;
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
}
.sync-tag.warn { color: #8b6d31; background: #fbf3df; }
.sync-tag.danger { color: #a54d50; background: #fff0f0; }
.tracking-sync-note {
  margin-top: 10px;
  padding: 9px 11px;
  border: 1px solid #f4d59e;
  background: #fffaf0;
  border-radius: 8px;
  color: #6f571f;
  font-size: 12px;
  line-height: 1.6;
}
.tracking-sync-note strong {
  display: block;
  color: #27334d;
  margin-bottom: 3px;
}
.tracking-sync-note code {
  font-family: inherit;
  background: #fff;
  border: 1px solid #ead9b4;
  border-radius: 4px;
  padding: 1px 4px;
}
.handoff-tag { color: var(--teal); font-size: 11px; font-weight: 700; }
.followup-tag { display: inline-block; margin-top: 5px; padding: 2px 7px; border-radius: 10px; font-size: 10px; font-weight: 700; white-space: nowrap; }
.followup-tag.stale { color: #8b6d31; background: #fbf3df; }
.followup-tag.pickup { color: #a4792d; background: #fdf1d9; }
.followup-tag.stuck { color: #a54d50; background: #fff0f0; }
.followup-tag.done { color: #3e8665; background: #e6f3eb; }
.followup-tag.archived { color: #5a6478; background: #eceef4; }
.order-scope-switch { display: flex; gap: 4px; flex: 0 0 auto; padding: 4px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); }
.order-scope-switch button { padding: 7px 13px; border: 0; border-radius: 6px; color: var(--muted); background: transparent; font-size: 12px; font-weight: 600; }
.order-scope-switch button.active { color: var(--teal); background: var(--mint); }
.order-scope-switch b { font-size: 11px; }
.followup-tab.has-alert { color: var(--rose); }
.followup-tab.has-alert b { color: var(--rose); }
.followup-tab.has-alert::after { content: ""; display: inline-block; width: 6px; height: 6px; margin-left: 5px; border-radius: 50%; background: var(--rose); vertical-align: middle; }
.drawer-mask { position: fixed; inset: 0; z-index: 20; display: none; background: rgba(27,35,51,.22); }
.drawer-mask.open { display: block; }
.tracking-drawer {
  position: fixed; top: 0; right: 0; z-index: 21; width: min(460px, 92vw); height: 100vh; padding: 20px;
  overflow-y: auto; border-left: 1px solid var(--line); background: var(--surface); box-shadow: -12px 0 34px rgba(27,35,51,.15);
  transform: translateX(102%); transition: transform .22s ease;
}
.tracking-drawer.open { transform: translateX(0); }
.tracking-drawer-head { display: flex; align-items: center; justify-content: space-between; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.tracking-summary { padding: 15px 0; }
.tracking-summary h4 { margin: 0 0 6px; font-size: 17px; }
.tracking-summary p { margin: 4px 0; color: var(--muted); font-size: 12px; }
.tracking-summary .status-pill { margin-top: 7px; }
/* 轨迹详情·起→终路线图（递四方风格） */
.track-route { display: flex; align-items: center; gap: 10px; padding: 14px; margin: 4px 0 14px; border: 1px solid var(--line); border-radius: 10px; background: #f6f8fd; }
.track-route-end { flex: 1; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.track-route-end.track-route-dest { text-align: right; align-items: flex-end; }
.track-route-label { font-size: 10px; color: var(--muted); }
.track-route-end strong { font-size: 15px; }
.track-route-end small { font-size: 10px; color: var(--muted); word-break: break-all; }
.track-route-line { flex: 1.1; display: flex; flex-direction: column; align-items: center; gap: 2px; }
.track-route-line::after { content: ""; display: block; width: 100%; border-top: 1px dashed #b9c6e8; margin-top: 3px; }
.track-route-carrier { font-size: 10px; color: #3a63f0; font-weight: 600; }
.track-route-plane { font-size: 16px; color: #3a63f0; line-height: 1; }
.tracking-meta-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin: 0 0 17px; }
.tracking-meta-grid div { padding: 9px; border: 1px solid var(--line); border-radius: 5px; background: #f6f8fd; }
.tracking-meta-grid span, .tracking-meta-grid b { display: block; }
.tracking-meta-grid span { margin-bottom: 4px; color: var(--muted); font-size: 10px; }
.tracking-meta-grid b { font-size: 12px; }
.timeline { margin: 12px 0 0; padding: 0; list-style: none; }
.timeline li { position: relative; margin-left: 7px; padding: 0 0 18px 22px; border-left: 1px solid #d8e5e2; }
.timeline li:last-child { border-left-color: transparent; }
.timeline li::before {
  content: ""; position: absolute; top: 1px; left: -5px; width: 9px; height: 9px; border: 2px solid white; border-radius: 50%; background: #a7b9b5; box-shadow: 0 0 0 1px #b9cbc7;
}
.timeline li:first-child::before { background: var(--teal); box-shadow: 0 0 0 1px var(--teal); }
.timeline time, .timeline strong, .timeline span { display: block; }
.timeline time { margin-bottom: 4px; color: var(--muted); font-size: 10px; }
.timeline strong { margin-bottom: 4px; font-size: 12px; }
.timeline span { color: #657774; font-size: 11px; line-height: 1.5; }
.drawer-line-table { margin: 4px 0 6px; }
.drawer-line-table th, .drawer-line-table td { padding: 7px 8px; font-size: 11px; }
.tracking-drawer h3 { margin: 16px 0 8px; font-size: 14px; }
.logistics-intro { gap: 18px; }
.logistics-intro-actions { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; }
.logistics-filterbar {
  display: grid; grid-template-columns: 145px 145px repeat(3, minmax(150px, 1fr)) auto auto; gap: 10px; align-items: end;
}
.logistics-window-note {
  display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 10px; padding: 10px 12px;
  border-left: 3px solid var(--gold); color: #6c603f; background: #fffaf0; font-size: 11px;
}
.logistics-window-note b, .logistics-window-note span { display: block; }
.logistics-window-note b { margin-bottom: 4px; color: #85662c; font-size: 12px; }
.logistics-window-note span { line-height: 1.55; }
.logistics-summary-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 13px; margin-top: 13px; }
.logistics-summary-card {
  position: relative; min-height: 116px; padding: 16px; border: 1px solid var(--line); border-top-width: 3px; border-radius: 7px;
  background: var(--surface); box-shadow: var(--shadow);
}
.logistics-summary-card span, .logistics-summary-card strong, .logistics-summary-card small { display: block; }
.logistics-summary-card span { color: var(--muted); font-size: 12px; font-weight: 700; }
.logistics-summary-card strong { margin: 12px 0 8px; font-size: 30px; }
.logistics-summary-card small { color: #8a9a97; font-size: 10px; }
.logistics-summary-card.blue { border-top-color: #4b83b6; }
.logistics-summary-card.green { border-top-color: #3e8665; }
.logistics-summary-card.gold { border-top-color: var(--gold); }
.logistics-summary-card.teal { border-top-color: var(--teal); }
.logistics-summary-card.blue strong { color: #356f9d; }
.logistics-summary-card.green strong { color: #3e8665; }
.logistics-summary-card.gold strong { color: #a4792d; }
.logistics-summary-card.teal strong { color: var(--teal); }
.carrier-overview-panel { padding-bottom: 15px; }
.carrier-overview-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; margin-top: 9px; }
.carrier-overview-card { padding: 12px; border: 1px solid var(--line); border-bottom: 3px solid var(--teal); border-radius: 6px; background: #f8fafd; }
.carrier-overview-card.medium { border-bottom-color: var(--gold); }
.carrier-overview-card.low { border-bottom-color: var(--rose); }
.carrier-overview-head, .region-carrier-head { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.carrier-overview-head strong { font-size: 18px; }
.carrier-overview-card > small { display: block; margin-top: 4px; color: var(--muted); font-size: 10px; }
.carrier-overview-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 13px; }
.carrier-overview-metrics span, .carrier-overview-metrics b { display: block; }
.carrier-overview-metrics span, .region-carrier-metrics span { margin-bottom: 5px; color: var(--muted); font-size: 10px; }
.carrier-overview-metrics b { font-size: 14px; }
.country-region-panel { padding: 0; overflow: hidden; }
.country-region-title { margin: 0; padding: 13px 14px; border-bottom: 1px solid var(--line); }
.country-switch { display: flex; max-width: 58%; gap: 5px; overflow-x: auto; }
.country-switch button {
  display: flex; align-items: center; gap: 6px; flex: 0 0 auto; padding: 7px 9px; border: 1px solid var(--line); border-radius: 4px;
  color: var(--muted); background: white; font-size: 11px;
}
.country-switch button.active { color: white; border-color: var(--teal); background: var(--teal); font-weight: 700; }
.country-switch b { font-size: 10px; }
.country-region-summary { display: flex; align-items: center; justify-content: space-between; padding: 13px 15px; background: #f6f8fd; }
.country-region-summary h3 { margin-bottom: 5px; font-size: 18px; }
.country-region-summary span { color: var(--muted); font-size: 11px; }
.country-region-summary > b { padding: 5px 8px; border-radius: 6px; color: var(--teal); background: var(--mint); font-size: 11px; }
.region-group-stack { display: grid; gap: 0; }
.region-group { padding: 14px 15px; border-top: 1px solid var(--line); }
.region-group:first-child { border-top: 0; }
.region-group.empty { padding-block: 11px; background: #f8fafd; }
.region-group-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.region-group-head h3 { margin-bottom: 4px; font-size: 15px; }
.region-group-head span { color: var(--muted); font-size: 10px; }
.region-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 10px; }
.region-kpis div { padding: 9px; border: 1px solid #e3e7f1; border-radius: 4px; background: #f8fafd; }
.region-kpis span, .region-kpis b { display: block; }
.region-kpis span { margin-bottom: 4px; color: var(--muted); font-size: 10px; }
.region-kpis b { font-size: 15px; }
.region-carrier-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px; margin-top: 10px; }
.region-carrier-card { padding: 10px; border: 1px solid var(--line); border-bottom: 3px solid var(--teal); border-radius: 5px; background: #f6f8fd; }
.region-carrier-card.medium { border-bottom-color: var(--gold); }
.region-carrier-card.low { border-bottom-color: var(--rose); }
.region-carrier-head strong { font-size: 14px; }
.region-carrier-metrics { display: grid; grid-template-columns: 1.1fr 1fr 1fr; gap: 6px; margin-top: 9px; }
.region-carrier-metrics div { padding: 6px; border-radius: 3px; background: white; }
.region-carrier-metrics span, .region-carrier-metrics b { display: block; }
.region-carrier-metrics b { font-size: 12px; }
.region-carrier-metrics .primary { grid-row: span 2; background: var(--mint); }
.region-carrier-metrics .primary b { margin-top: 4px; color: var(--teal); font-size: 19px; }
.logistics-overview { display: grid; grid-template-columns: 280px 1fr; gap: 13px; margin-top: 13px; }
.score-card {
  min-height: 190px; padding: 18px; border: 1px solid #2a3a73; border-radius: 12px; color: white;
  background: linear-gradient(135deg, #20294e 0%, #324597 100%); box-shadow: 0 8px 24px rgba(31,42,82,.2);
}
.score-card-head { display: flex; align-items: center; justify-content: space-between; }
.score-card-head span { color: #ccd6f7; font-size: 12px; font-weight: 700; }
.score-card-head b { display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid rgba(255,255,255,.3); border-radius: 50%; font-size: 15px; }
.score-card > strong { display: block; margin: 11px 0 0; font-size: 58px; line-height: 1; letter-spacing: -.02em; }
.score-card small { display: block; margin-top: 7px; color: #bcc8f0; font-size: 11px; }
.score-card p { margin-top: 12px; color: #cdd6f5; font-size: 11px; line-height: 1.5; }
.score-progress { height: 5px; margin-top: 15px; overflow: hidden; border-radius: 4px; background: rgba(255,255,255,.22); }
.score-progress i { display: block; height: 100%; border-radius: 4px; background: #8aa0ff; }
.score-breakdown { display: grid; grid-template-columns: repeat(2, 1fr); gap: 13px; }
.score-breakdown article {
  padding: 16px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); box-shadow: var(--shadow);
}
.score-breakdown span, .score-breakdown strong, .score-breakdown small { display: block; }
.score-breakdown span { color: var(--muted); font-size: 11px; font-weight: 700; }
.score-breakdown strong { margin: 8px 0 5px; font-size: 28px; }
.score-breakdown small { color: #8a9a97; font-size: 10px; }
.logistics-kpi-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 11px; margin-top: 13px; }
.logistics-kpi-grid .kpi-card { padding: 14px; }
.logistics-kpi-grid .kpi-card strong { font-size: 24px; }
.alert-kpi { border-color: #ecd3d4; background: #fffafa; }
.alert-kpi strong { color: var(--rose); }
.logistics-chart-grid { display: grid; grid-template-columns: 1.15fr .85fr 1fr; gap: 13px; }
.logistics-chart { height: 235px; }
.insight-panel { padding-bottom: 15px; }
.insight-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.insight-card { min-height: 74px; padding: 11px 12px; border-left: 3px solid var(--teal); background: #f6f8fd; }
.insight-card.warn { border-left-color: var(--gold); background: #fffbf4; }
.insight-card.alert { border-left-color: var(--rose); background: #fff8f8; }
.insight-card b, .insight-card span { display: block; }
.insight-card b { margin-bottom: 5px; font-size: 12px; }
.insight-card span { color: var(--muted); font-size: 11px; line-height: 1.55; }
.logistics-table-panel { padding: 0; overflow: hidden; }
.logistics-table-panel .section-title { margin: 0; padding: 12px 13px 8px; }
.logistics-table th, .logistics-table td { padding: 8px 10px; }
.logistics-dimension-grid { grid-template-columns: 1fr; align-items: start; }
.operator-name-cell { vertical-align: top; background: #f8fafd; }
.operator-name-cell small { display: block; margin-top: 4px; color: var(--muted); font-size: 10px; }
.score-number { font-weight: 700; }
.score-number.good { color: #3e8665; }
.score-number.medium { color: #9a762f; }
.score-number.low { color: var(--rose); }
.route-tag { display: inline-block; padding: 4px 7px; border-radius: 11px; font-size: 10px; font-weight: 700; }
.route-tag.good { color: #3e8665; background: #e6f3eb; }
.route-tag.medium { color: #8b6d31; background: #fbf3df; }
.route-tag.low { color: #a54d50; background: #fff0f0; }
.attention-table { min-width: 1040px; }
.attention-table th:nth-child(8) { min-width: 240px; }
.overdue-days { color: var(--rose); font-weight: 700; }
.pricing-intro { gap: 18px; }
.pricing-intro-actions { display: flex; flex-wrap: wrap; flex: 0 0 auto; align-items: center; justify-content: flex-end; gap: 8px; }
.pricing-filterbar { display: grid; grid-template-columns: minmax(160px, 1fr) minmax(180px, 1.2fr) minmax(150px, .9fr) 150px auto auto; gap: 10px; align-items: end; }
.pricing-summary-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 13px; margin-top: 13px; }
.pricing-summary-card {
  min-height: 112px; padding: 15px 16px; border: 1px solid var(--line); border-top: 3px solid var(--teal); border-radius: 7px;
  background: var(--surface); box-shadow: var(--shadow);
}
.pricing-summary-card span, .pricing-summary-card strong, .pricing-summary-card small { display: block; }
.pricing-summary-card span { color: var(--muted); font-size: 12px; font-weight: 700; }
.pricing-summary-card strong { margin: 11px 0 7px; color: var(--teal-dark); font-size: 28px; }
.pricing-summary-card small { color: #8a9a97; font-size: 10px; }
.pricing-summary-card.blue { border-top-color: var(--blue); }
.pricing-summary-card.teal { border-top-color: var(--teal); }
.pricing-summary-card.gold { border-top-color: var(--gold); }
.pricing-summary-card.green { border-top-color: #3e8665; }
.pricing-summary-card.blue strong { color: #4f7387; }
.pricing-summary-card.gold strong { color: #9a762f; }
.pricing-summary-card.green strong { color: #3e8665; }
.pricing-workbench { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 14px 0 0; }
.pricing-panel { padding: 0; overflow: hidden; }
.pricing-panel .section-title { margin: 0; padding: 12px 13px 8px; }
.pricing-table th, .pricing-table td { padding: 8px 10px; }
.pricing-table tfoot td { color: var(--teal-dark); background: var(--mint); font-weight: 700; }
.pricing-data-note { display: flex; gap: 9px; margin: 0 13px 11px; padding: 9px 11px; border-left: 3px solid var(--gold); background: #fffbf4; }
.pricing-data-note b { flex: 0 0 auto; color: #88692e; font-size: 11px; }
.pricing-data-note span { color: #7c7466; font-size: 11px; line-height: 1.5; }
.pricing-matrix-table { min-width: 1060px; }
.pricing-matrix-table thead tr:first-child th { border-bottom-color: #dde2ee; background: #eef1fb; vertical-align: middle; }
.pricing-matrix-table thead tr:nth-child(2) th { background: var(--surface-soft); }
.pricing-matrix-table tbody tr:hover td { background: var(--surface-soft); }
.carrier-group-head { min-width: 132px; color: var(--teal-dark); text-align: center; }
.carrier-group-head small { display: block; margin-top: 3px; color: #81918e; font-size: 9px; font-weight: 500; }
.pricing-decision-head { min-width: 250px; color: #88692e; text-align: center; background: #fbf5e8 !important; }
.pricing-p90 { font-weight: 700; }
.pricing-p90.good { color: #3e8665; }
.pricing-p90.medium { color: #9a762f; }
.pricing-p90.slow { color: var(--rose); }
.muted-price { color: #a4b0ae; }
.current-rate { display: inline-block; margin-left: 5px; padding: 2px 5px; border-radius: 8px; color: var(--teal); background: var(--mint); font-size: 9px; font-weight: 700; }
.best-price { color: var(--teal-dark); font-weight: 700; }
.savings-number { color: #3e8665; font-weight: 700; }
.price-up { color: var(--rose); font-weight: 700; }
.price-down { color: #3e8665; font-weight: 700; }
.price-tag { display: inline-block; padding: 4px 7px; border-radius: 10px; font-size: 10px; font-weight: 700; }
.price-tag.keep { color: #647673; background: #eef3f2; }
.price-tag.switch, .price-tag.fall { color: #3e8665; background: #e6f3eb; }
.price-tag.rise { color: #a54d50; background: #fff0f0; }
.pricing-change-overview { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; padding: 0 13px 11px; }
.pricing-change-overview article { padding: 11px 12px; border-left: 3px solid var(--teal); background: #f6f8fd; }
.pricing-change-overview article.rose { border-left-color: var(--rose); background: #fff8f8; }
.pricing-change-overview article.gold { border-left-color: var(--gold); background: #fffbf4; }
.pricing-change-overview article.green { border-left-color: #3e8665; background: #f4faf6; }
.pricing-change-overview span, .pricing-change-overview strong { display: block; }
.pricing-change-overview span { margin-bottom: 5px; color: var(--muted); font-size: 11px; }
.pricing-change-overview strong { font-size: 15px; }
.pricing-country-block { border-top: 1px solid var(--line); }
.pricing-country-block:first-child { border-top: 0; }
.pricing-country-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 13px; background: #f6f8fd; }
.pricing-country-head h3 { margin-bottom: 4px; font-size: 16px; }
.pricing-country-head span { color: var(--muted); font-size: 11px; }
.pricing-country-head strong { color: #3e8665; font-size: 14px; }
.backend-card { margin-top: 13px; }
.backend-form { display: grid; grid-template-columns: minmax(200px, 1.6fr) 120px 140px auto auto auto; gap: 10px; align-items: end; }
.backend-msg { margin-top: 10px; min-height: 16px; color: var(--muted); font-size: 12px; }
.backend-msg.error { color: var(--rose); }
.backend-state { padding: 3px 9px; border-radius: 999px; font-size: 11px; font-weight: 700; }
.backend-state.off { color: #8a6d2f; background: #fbf3df; }
.backend-state.on { color: #1f9d6b; background: #e6f5ee; }
@media (max-width: 900px) { .backend-form { grid-template-columns: 1fr 1fr; } }
/* 系统连接页：后端状态只读展示 */
.backend-status-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 6px; }
.backend-status-item { display: flex; flex-direction: column; gap: 5px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.backend-status-label { color: var(--muted); font-size: 11px; }
.backend-status-value { font-size: 14px; font-weight: 700; word-break: break-all; }
.backend-status-actions { margin-top: 13px; }
.creds-group-head { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line); }
.creds-group-head strong { font-size: 13px; }
@media (max-width: 720px) { .backend-status-grid { grid-template-columns: 1fr; } }
/* 规则导入预览弹窗 */
#ruleImportDialog { width: min(720px, 92vw); }
.rule-import-summary { font-size: 13px; color: var(--text, #1b2333); margin-bottom: 12px; line-height: 1.6; }
.rule-import-preview { max-height: 50vh; overflow: auto; }
/* 订单编辑弹窗 + 列表备注小字 */
#orderEditDialog { width: min(680px, 92vw); }
.order-edit-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.order-edit-grid .dialog-field { margin-bottom: 0; }
.order-edit-grid .oe-remark { grid-column: 1 / -1; }
.order-edit-grid textarea { width: 100%; resize: vertical; font: inherit; }
.order-remark { display: block; margin-top: 3px; color: var(--muted); font-size: 11px; max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 720px) { .order-edit-grid { grid-template-columns: 1fr; } }
/* 导入预览：物流商分布 + 订单抽查 */
.import-carrier-dist { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.dist-chip { padding: 4px 11px; border: 1px solid var(--line); border-radius: 999px; font-size: 12px; background: var(--surface); }
.dist-chip b { margin-left: 5px; color: #3a63f0; }
.import-sample-wrap { margin-top: 6px; max-height: 320px; overflow: auto; }
.import-sample-wrap .import-sub { margin-bottom: 8px; }
.entry-context {
  display: grid; grid-template-columns: 190px 190px 1fr; gap: 12px; align-items: end;
  padding: 14px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); box-shadow: var(--shadow);
}
.entry-tip { padding: 9px 12px; border-left: 2px solid var(--gold); background: #fffbf2; }
.entry-tip b, .entry-tip span { display: block; }
.entry-tip b { margin-bottom: 4px; color: #88692e; font-size: 12px; }
.entry-tip span { color: #7d7462; font-size: 11px; }
.entry-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.entry-card { min-height: 284px; }
.entry-card-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.mode-tag { padding: 4px 8px; border-radius: 999px; color: var(--teal); background: var(--mint); font-size: 10px; font-weight: 700; }
.mode-tag.muted { color: #88692e; background: #fbf2df; }
.dropzone {
  display: grid; place-items: center; min-height: 112px; padding: 16px; border: 1px dashed #b6c1e6;
  border-radius: 10px; color: var(--teal); background: #f6f8fe; text-align: center; cursor: pointer; transition: .15s ease;
}
.dropzone:hover { border-color: var(--teal); background: var(--mint); }
.dropzone.dragover { border-color: var(--teal); border-style: solid; background: var(--mint); box-shadow: 0 0 0 3px rgba(58,99,240,.12); }
.dropzone.dragover * { pointer-events: none; }
.dropzone strong { font-size: 14px; }
.dropzone span { margin-top: 7px; color: var(--muted); font-size: 11px; font-weight: 400; }
.dropzone input { display: none; }
.selected-files { min-height: 46px; margin-top: 10px; color: #56607a; font-size: 11px; line-height: 1.8; }
.selected-files.empty { display: flex; align-items: center; color: #99a2b6; }
.file-chip { display: inline-flex; align-items: center; gap: 7px; margin: 0 6px 6px 0; padding: 4px 6px 4px 10px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-soft); font-size: 12px; }
.file-chip-x { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; border: 0; background: transparent; color: var(--muted); font-size: 15px; line-height: 1; cursor: pointer; border-radius: 4px; padding: 0; }
.file-chip-x:hover { color: var(--rose); background: rgba(229,72,77,.1); }
.manual-form { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.entry-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; }
.table-caption { color: var(--muted); font-size: 11px; }
.empty-cell { padding: 28px 18px; color: #97a1b5; text-align: center; font-size: 12px; }
.empty-cell::before {
  content: ""; display: block; width: 30px; height: 30px; margin: 0 auto 9px;
  border-radius: 8px; border: 1.5px dashed #cdd4e3;
  background:
    linear-gradient(#cdd4e3, #cdd4e3) center/13px 1.5px no-repeat,
    linear-gradient(#cdd4e3, #cdd4e3) center/1.5px 13px no-repeat;
  opacity: .8;
}
/* 通用空状态组件（图标 + 标题 + 说明） */
.empty-state { display: grid; place-items: center; gap: 6px; padding: 34px 18px; text-align: center; color: var(--muted); }
.empty-state .es-icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--surface-soft); color: #aab3c6; }
.empty-state .es-title { color: #5a6478; font-size: 13px; font-weight: 600; }
.empty-state .es-sub { font-size: 11px; }

/* 加载态：骨架屏 + 旋转 spinner */
@keyframes lk-shimmer { 0% { background-position: -160px 0; } 100% { background-position: 160px 0; } }
.skeleton { border-radius: 6px; background: #eef1f7; background-image: linear-gradient(90deg, #eef1f7 0, #f6f8fc 40px, #eef1f7 80px); background-size: 240px 100%; animation: lk-shimmer 1.1s infinite linear; }
.skeleton-line { height: 12px; margin: 7px 0; }
@keyframes lk-spin { to { transform: rotate(360deg); } }
.spinner { display: inline-block; width: 14px; height: 14px; border: 2px solid currentColor; border-top-color: transparent; border-radius: 50%; opacity: .7; animation: lk-spin .7s linear infinite; vertical-align: -2px; }
/* 按钮加载态：spinner 用按钮文字色（currentColor），白底/蓝底都可见 */
.is-loading { position: relative; pointer-events: none; opacity: .9; }
.is-loading::before { content: ""; display: inline-block; width: 13px; height: 13px; margin-right: 7px; border: 2px solid currentColor; border-top-color: transparent; border-radius: 50%; opacity: .8; animation: lk-spin .7s linear infinite; vertical-align: -2px; }
.import-preview { border: 1px solid #d2dcf6; background: #f4f7fe; }
.import-stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(116px, 1fr)); gap: 10px; margin: 6px 0 16px; }
.import-stat { padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; background: #fff; display: flex; flex-direction: column; gap: 4px; }
.import-stat span { color: var(--muted); font-size: 11px; }
.import-stat b { font-size: 20px; color: var(--ink); letter-spacing: -.01em; }
.import-preview-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.import-sub { margin: 0 0 8px; font-size: 12px; font-weight: 600; color: #36405a; }
.import-garbled { margin: 0 0 16px; padding: 12px 14px; border: 1px solid #ecd3d4; border-radius: 10px; background: #fff8f8; }
.import-garbled-head { margin: 0 0 8px; font-size: 12px; font-weight: 600; color: #a54d50; line-height: 1.55; }
.import-garbled table { width: 100%; }
.import-garbled th, .import-garbled td { font-size: 12px; padding: 6px 8px; }
/* ===== 物流试算 quote 页 ===== */
.quote-form { display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-end; margin: 12px 0 6px; }
.quote-form label { display: flex; flex-direction: column; gap: 5px; font-size: 12px; color: var(--muted); }
.quote-form label span { font-weight: 600; color: #36405a; }
.quote-form select, .quote-form input { padding: 9px 11px; border: 1px solid var(--line); border-radius: 7px; font-size: 14px; min-width: 170px; }
.quote-dim-group { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
.quote-dim-group label { min-width: 105px; }
.quote-dim-group input { min-width: 105px; width: 105px; }
.quote-summary { margin: 10px 0 2px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 8px; background: #f8fafc; color: var(--muted); font-size: 12px; }
.quote-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(225px, 1fr)); gap: 12px; margin-top: 10px; }
.quote-card { border: 1px solid var(--line); border-radius: 10px; padding: 13px 15px; background: #fff; }
.quote-card.best { border-color: #b9d8c6; background: #f3fbf6; box-shadow: 0 1px 6px rgba(63,158,107,.12); }
.quote-card.over { opacity: .55; }
.qc-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
.qc-head b { font-size: 13px; color: var(--ink); }
.qc-price { font-size: 22px; font-weight: 700; color: var(--ink); letter-spacing: -.01em; }
.qc-meta { font-size: 12px; color: var(--muted); margin-top: 2px; }
.qc-calc { font-size: 11px; color: var(--muted); margin-top: 6px; padding-top: 6px; border-top: 1px dashed var(--line); }
.pricing-matrix-table td.price-best { background: #f3fbf6; }
.toggle-inline { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); cursor: pointer; }
@media (max-width: 1080px) {
  .import-stat-grid { grid-template-columns: repeat(3, 1fr); }
  .import-preview-cols { grid-template-columns: 1fr; }
}
/* ===== Toast 通知（替代 alert）===== */
.toast-host { position: fixed; top: 18px; right: 18px; z-index: 60; display: flex; flex-direction: column; gap: 10px; pointer-events: none; }
.toast {
  display: flex; align-items: flex-start; gap: 9px; min-width: 240px; max-width: 380px;
  padding: 12px 14px 12px 13px; border-radius: 10px; background: var(--surface);
  border: 1px solid var(--line); border-left: 3px solid var(--teal);
  box-shadow: 0 10px 30px rgba(27, 35, 51, .15); color: var(--ink); font-size: 12.5px;
  transform: translateX(120%); opacity: 0; transition: transform .26s cubic-bezier(.2,.7,.3,1), opacity .26s ease;
}
.toast.show { transform: translateX(0); opacity: 1; }
.toast-dot { width: 8px; height: 8px; margin-top: 4px; border-radius: 50%; flex: 0 0 auto; }
.toast-text { line-height: 1.5; word-break: break-word; }
.toast-success { border-left-color: var(--success); }
.toast-success .toast-dot { background: var(--success); }
.toast-warn { border-left-color: var(--gold); }
.toast-warn .toast-dot { background: var(--gold); }
.toast-info { border-left-color: var(--teal); }
.toast-info .toast-dot { background: var(--teal); }

.batch-tools { display: flex; align-items: center; gap: 7px; }
.compact { padding: 6px 9px; font-size: 11px; }
.danger-button { padding: 9px 14px; color: #a54d50; border-color: #ecd3d4; background: #fff8f8; }
.danger-button:hover { color: #8f3438; border-color: #e0b5b7; background: #fff1f2; }
.check-col { width: 32px; text-align: center; }
.check-col input, .batch-check { width: 14px; height: 14px; accent-color: var(--teal); }
.config-tabs { display: flex; gap: 6px; border-bottom: 1px solid var(--line); }
.config-tabs button { padding: 11px 14px 10px; }
.config-tabs button.active { border-bottom: 2px solid var(--teal); color: var(--teal); font-weight: 700; }
.config-toolbar { padding: 14px 0 2px; }
.config-toolbar > span { color: var(--muted); font-size: 12px; }
.searchbox { position: relative; width: 260px; }
.searchbox span { position: absolute; left: 10px; top: 7px; font-size: 17px; }
.searchbox input { padding-left: 30px; }
.config-table { padding: 0; overflow: hidden; }
.unmatched-panel { border-left: 3px solid var(--gold); }
.logistics-rule-panel { display: none; }
.logistics-rule-card { display: grid; grid-template-columns: minmax(250px, 1fr) minmax(460px, 1.5fr); gap: 22px; padding: 18px; }
.logistics-rule-card h3 { margin-bottom: 7px; font-size: 17px; }
.logistics-rule-card span { color: var(--muted); font-size: 12px; line-height: 1.7; }
.logistics-rule-form { display: grid; grid-template-columns: repeat(3, minmax(105px, 1fr)) auto; gap: 10px; align-items: end; }
.logistics-window-preview { margin-top: 10px; padding: 12px 14px; border-left: 3px solid var(--teal); background: var(--mint); }
.logistics-window-preview span, .logistics-window-preview strong { display: block; }
.logistics-window-preview span { margin-bottom: 5px; color: var(--muted); font-size: 11px; }
.logistics-window-preview strong { color: var(--teal-dark); font-size: 13px; }
.logistics-region-heading { margin-top: 18px; padding: 0 2px; }
.logistics-region-heading h3 { margin-bottom: 6px; font-size: 16px; }
.logistics-region-heading span { color: var(--muted); font-size: 12px; line-height: 1.65; }
.inline-input { min-width: 150px; padding: 6px 8px; font-size: 12px; }
.action-button { margin-right: 8px; border: 0; color: var(--teal); background: transparent; font-size: 12px; }
.action-button.delete { color: var(--rose); }
.process-panel { margin-top: 20px; padding: 18px; border-top: 1px solid var(--line); background: var(--surface-soft); }
.process-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 15px; }
.process-steps article { padding: 13px; border-left: 2px solid var(--teal); background: rgba(255,255,255,.65); }
.process-steps b, .process-steps strong, .process-steps span { display: block; }
.process-steps b { margin-bottom: 8px; color: var(--teal); font-size: 11px; }
.process-steps strong { margin-bottom: 5px; font-size: 13px; }
.process-steps span { color: var(--muted); font-size: 11px; line-height: 1.6; }

dialog { width: 430px; padding: 0; border: 0; border-radius: var(--radius); box-shadow: 0 16px 45px rgba(27,35,51,.22); }
dialog::backdrop { background: rgba(27,35,51,.35); }
dialog form { padding: 17px; }
.dialog-head, .dialog-actions { display: flex; align-items: center; justify-content: space-between; }
.dialog-head { margin-bottom: 15px; }
.dialog-head button { border: 0; color: var(--muted); background: transparent; font-size: 19px; }
.dialog-actions { justify-content: flex-end; gap: 8px; margin-top: 17px; }
.dialog-field { display: block; margin-bottom: 12px; }
.secondary-button { padding: 9px 14px; color: var(--teal); border-color: var(--line); background: white; }

@media (max-width: 900px) {
  .sidebar { width: 68px; padding-inline: 9px; }
  .brand > div:last-child, .nav-item span:last-child, .sidebar-bottom { display: none; }
  .brand { padding-inline: 6px; }
  .nav-item { justify-content: center; padding-inline: 7px; }
  .main { min-width: 700px; margin-left: 68px; padding-inline: 18px; }
  .order-result-foot { left: 86px; right: 18px; }
  .entry-grid { grid-template-columns: 1fr; }
  .order-search-main { grid-template-columns: minmax(260px, 2fr) 140px 140px 160px auto auto; }
  .logistics-filterbar { grid-template-columns: 140px 140px repeat(3, 150px) auto auto; }
  .logistics-summary-grid { grid-template-columns: repeat(2, 1fr); }
  .pricing-filterbar { grid-template-columns: repeat(4, minmax(145px, 1fr)) auto auto; }
  .pricing-summary-grid { grid-template-columns: repeat(2, 1fr); }
  .carrier-overview-cards { grid-template-columns: repeat(2, 1fr); }
  .logistics-rule-card { grid-template-columns: 1fr; }
  .logistics-rule-form { grid-template-columns: repeat(3, minmax(120px, 1fr)) auto; }
  .logistics-kpi-grid { grid-template-columns: repeat(3, 1fr); }
  .logistics-chart-grid { grid-template-columns: 1fr; }
}

/* ============ 设计精修层 / design polish ============ */
/* 数字等宽对齐：表格数值列与各类大数字统一用 tabular-nums，竖向对齐更专业 */
td.number, th.number,
.kpi-card strong, .logistics-summary-card strong, .pricing-summary-card strong,
.score-card > strong, .score-breakdown strong, .overview-total strong,
.import-stat b, .region-kpis b, .carrier-overview-metrics b {
  font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1, "cv01" 1;
}

/* 选区与滚动条 */
::selection { background: rgba(58,99,240,.16); color: var(--ink); }
* { scrollbar-width: thin; scrollbar-color: #c8cedd transparent; }
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-thumb { border: 3px solid transparent; border-radius: 999px; background: #cdd3e2; background-clip: content-box; }
*::-webkit-scrollbar-thumb:hover { background: #b3bbcf; background-clip: content-box; }
*::-webkit-scrollbar-track { background: transparent; }

/* 统一焦点可见态（键盘可达性 + 视觉一致） */
button:focus-visible, a:focus-visible, [tabindex]:focus-visible {
  outline: none; box-shadow: 0 0 0 3px rgba(58,99,240,.18);
}

/* 按钮微交互：按下回弹，主按钮悬停轻微抬升 */
.primary-button, .upload-button, .secondary-button, .danger-button, .icon-button { will-change: transform; }
.primary-button:hover, .upload-button:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(58,99,240,.28); }
.primary-button:active, .upload-button:active, .secondary-button:active, .danger-button:active, .icon-button:active { transform: translateY(0); }
/* secondary 统一为中性描边按钮（覆盖后定义的旧蓝字规则） */
.secondary-button { color: #3a4458; background: var(--surface); }
.secondary-button:hover { color: var(--teal); border-color: #c7cee0; background: var(--surface-soft); }

/* KPI 卡：左侧品牌色条 + 悬停抬升，强化数据视觉重点 */
.kpi-card { position: relative; overflow: hidden; transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease; }
.kpi-card::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: linear-gradient(180deg, var(--teal), #6a59f2); }
.kpi-card:hover { transform: translateY(-2px); border-color: #d6ddf2; box-shadow: 0 8px 22px rgba(27,35,51,.08); }

/* 概览/汇总卡悬停反馈 */
.logistics-summary-card, .pricing-summary-card, .carrier-overview-card, .import-stat { transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease; }
.logistics-summary-card:hover, .pricing-summary-card:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(27,35,51,.08); }
.import-stat:hover { border-color: #cdd6f4; box-shadow: 0 4px 14px rgba(27,35,51,.06); }

/* 报告头 meta 卡悬停微亮 */
.report-meta div { transition: background .16s ease; }
.report-meta div:hover { background: rgba(255,255,255,.16); }

/* 区块卡片标题序号徽章与正文细节 */
.section-title h3 { letter-spacing: -.01em; }
tbody tr { transition: background .12s ease; }

/* 侧栏导航激活态左侧指示条 */
.nav-item { position: relative; }
.nav-item.active::before { content: ""; position: absolute; left: -14px; top: 50%; transform: translateY(-50%); width: 3px; height: 18px; border-radius: 0 3px 3px 0; background: var(--teal); }