/* ============================================================
   app.css —— 应用外壳与通用组件样式
   全部取值来自 tokens.css，不写魔法值
   ============================================================ */

*{box-sizing:border-box}
html,body,#app{height:100%}
body{
  margin:0;background:var(--c-bg);color:var(--c-ink);
  font-family:var(--font-sans);font-size:var(--fs-14);line-height:var(--lh-base);
  letter-spacing:-.006em;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
a{color:inherit;text-decoration:none}
button{font-family:inherit;font-size:inherit;letter-spacing:inherit}
::selection{background:rgba(0,113,227,.18)}
::-webkit-scrollbar{width:11px;height:11px}
::-webkit-scrollbar-thumb{background:rgba(0,0,0,.18);border-radius:11px;border:3px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.32);background-clip:content-box}
::-webkit-scrollbar-track{background:transparent}

/* ---------------- 骨架布局 ---------------- */
.app-shell{display:flex;height:100vh;overflow:hidden}

/* ---------------- 侧边栏 ---------------- */
.sidebar{
  width:var(--layout-sidebar);flex:0 0 var(--layout-sidebar);
  display:flex;flex-direction:column;background:var(--c-nav-bg);color:var(--c-white);position:relative;z-index:30;
}
.sidebar::after{
  content:"";position:absolute;top:0;right:0;bottom:0;width:1px;
  background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.02));
}
.brand{display:flex;gap:11px;align-items:center;padding:22px 20px 20px}
.brand-logo{
  width:34px;height:34px;flex:0 0 34px;border-radius:var(--r-sm);
  background:linear-gradient(160deg,var(--c-brand-grad-1),var(--c-brand-grad-2) 55%,var(--c-brand-grad-3));
  display:grid;place-items:center;font-weight:var(--fw-bold);font-size:var(--fs-16);color:var(--c-white);
  letter-spacing:-.02em;
  box-shadow:0 2px 10px rgba(10,132,255,.35),inset 0 1px 0 rgba(255,255,255,.28);
}
.brand-title{font-size:13.5px;font-weight:var(--fw-bold);letter-spacing:-.01em;color:var(--c-nav-text-hi);white-space:nowrap}
.brand-sub{font-size:10.5px;color:var(--c-nav-dim);margin-top:2px;white-space:nowrap;letter-spacing:.01em}

.nav{flex:1;overflow-y:auto;padding:2px 12px 12px}
.nav::-webkit-scrollbar{width:0}
.nav-group{
  display:flex;align-items:center;gap:6px;width:100%;
  font-size:10.5px;letter-spacing:.06em;color:var(--c-nav-dim);
  padding:16px 10px 6px;font-weight:var(--fw-medium);
  background:none;border:0;text-align:left;cursor:pointer;
}
.nav-group .ng-caret{font-size:9px;transition:transform var(--dur-base) var(--ease);opacity:.7}
.nav-group.collapsed .ng-caret{transform:rotate(-90deg)}
.nav-item{
  display:flex;align-items:center;gap:10px;padding:8px 11px;border-radius:10px;
  color:var(--c-nav-text);font-size:var(--fs-13);cursor:pointer;user-select:none;
  transition:background var(--dur-base) var(--ease),color var(--dur-base) var(--ease);
  position:relative;margin-bottom:2px;border:0;background:none;width:100%;text-align:left;
}
.nav-item .ni-icon{width:18px;text-align:center;font-size:13.5px;opacity:.75;flex:0 0 18px}
.nav-item .ni-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-item:hover{background:rgba(255,255,255,.07);color:var(--c-nav-text-hi)}
.nav-item:hover .ni-icon{opacity:1}
.nav-item.active{background:rgba(255,255,255,.12);color:var(--c-white);font-weight:var(--fw-medium)}
.nav-item.active .ni-icon{opacity:1;color:var(--c-nav-active)}
.nav-item.active::before{
  content:"";position:absolute;left:-12px;top:50%;transform:translateY(-50%);
  width:3px;height:16px;border-radius:0 3px 3px 0;background:var(--c-nav-active-strong);
}
.nav-badge{
  background:rgba(255,255,255,.16);color:var(--c-nav-text-hi);font-size:10.5px;font-weight:var(--fw-bold);
  min-width:19px;height:19px;border-radius:var(--r-pill);display:grid;place-items:center;padding:0 6px;
  font-variant-numeric:tabular-nums;
}
.nav-item.active .nav-badge{background:rgba(255,255,255,.24)}

.sidebar-foot{padding:12px;border-top:1px solid rgba(255,255,255,.07)}
.user-chip{
  display:flex;align-items:center;gap:10px;padding:9px;border-radius:var(--r-sm);
  background:rgba(255,255,255,.06);transition:background var(--dur-base) var(--ease);
}
.user-chip:hover{background:rgba(255,255,255,.1)}
.user-avatar{
  width:30px;height:30px;flex:0 0 30px;border-radius:50%;
  display:grid;place-items:center;font-size:12.5px;font-weight:var(--fw-bold);color:var(--c-white);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25);
}
.user-meta{flex:1;min-width:0}
.user-name{font-size:12.5px;font-weight:var(--fw-medium);color:var(--c-nav-text-hi);letter-spacing:-.01em}
.user-role{font-size:10.5px;color:var(--c-nav-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.user-switch{
  background:rgba(255,255,255,.12);border:0;color:var(--c-nav-text-soft);width:24px;height:24px;border-radius:var(--r-pill);
  display:grid;place-items:center;font-size:var(--fs-12);transition:background var(--dur-base) var(--ease);flex:0 0 24px;cursor:pointer;
}
.user-switch:hover{background:var(--c-nav-active-strong);color:var(--c-white)}

/* ---------------- 主区 ---------------- */
.main{flex:1;display:flex;flex-direction:column;min-width:0;overflow:hidden}
.topbar{
  height:var(--layout-topbar);flex:0 0 var(--layout-topbar);
  background:rgba(255,255,255,.72);
  -webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid var(--c-line);
  display:flex;align-items:center;justify-content:space-between;padding:0 22px;gap:14px;
  position:relative;z-index:20;
}
.crumb{font-size:12.5px;color:var(--c-muted-2)}
.crumb b{color:var(--c-ink);font-weight:var(--fw-medium)}
.topbar-right{display:flex;align-items:center;gap:var(--sp-2)}
.content{flex:1;overflow-y:auto;padding:26px var(--layout-content-x) 64px;scroll-behavior:smooth}

/* ---------------- 原型提示条（常驻，说明数据边界，不可关闭） ---------------- */
.proto-bar{
  flex:0 0 auto;display:flex;align-items:center;gap:var(--sp-2);
  padding:7px 22px;font-size:var(--fs-12);line-height:1.45;
  background:var(--c-warn-50);color:var(--c-warn-text);
  border-bottom:1px solid var(--c-warn-line);
}
.proto-bar .pb-ico{flex:0 0 auto}
.proto-bar .pb-main{flex:1;min-width:0;line-height:1.45}
.proto-bar .el-button{flex:0 0 auto}
.proto-bar .pb-meta{color:var(--c-warn-text);opacity:.72;white-space:nowrap;font-variant-numeric:tabular-nums}
.proto-bar.danger{background:var(--c-danger-50);color:var(--c-danger-text);border-bottom-color:var(--c-danger-line)}
.proto-bar.danger .pb-meta{color:var(--c-danger-text);opacity:.9}

/* 价格依据折叠区（原内部核价那页信息，挪到报价单预览里给销售自查） */
.basis-collapse{border:0;background:transparent}
.basis-collapse .el-collapse-item__header{
  border:0;background:transparent;height:auto;padding:0 0 var(--sp-2);line-height:1.5;
  font-size:var(--fs-13);color:var(--c-ink);
}
.basis-collapse .el-collapse-item__wrap{border:0;background:transparent}
.basis-collapse .el-collapse-item__content{padding-bottom:0}
.basis-sum{display:flex;gap:var(--sp-5);flex-wrap:wrap;padding:var(--sp-3) var(--sp-4);margin-bottom:var(--sp-3);
  background:var(--c-fill-2);border:1px solid var(--c-line-2);border-radius:var(--r-sm)}
.basis-sum .bs-k{font-size:var(--fs-11);color:var(--c-muted);display:block}
.basis-sum .bs-v{font-size:var(--fs-16);font-weight:var(--fw-bold);letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.apply-list{margin:0;padding:0;list-style:none}
.apply-list li{display:flex;gap:var(--sp-2);align-items:baseline;padding:5px 0;border-bottom:1px solid var(--c-line-2);font-size:var(--fs-12);color:var(--c-ink-2)}
.apply-list li:last-child{border-bottom:0}
.apply-list .al-no{flex:0 0 42px;color:var(--c-muted-2);font-variant-numeric:tabular-nums}
.apply-list .al-model{flex:0 0 96px;font-weight:var(--fw-medium)}
.apply-list .al-apply{margin-left:auto;color:var(--c-muted)}

/* ---------------- 页头 ---------------- */
.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:22px;flex-wrap:wrap}
.page-title{font-size:var(--fs-30);font-weight:var(--fw-bold);letter-spacing:-.022em;line-height:var(--lh-tight);display:flex;align-items:center;gap:11px}
.page-sub{color:var(--c-muted);font-size:var(--fs-13);margin-top:7px}
.page-actions{display:flex;gap:var(--sp-2);align-items:center;flex-wrap:wrap}

/* ---------------- 卡片 ---------------- */
.card{
  background:var(--c-card);border-radius:var(--r-lg);
  box-shadow:var(--sh-sm);border:1px solid rgba(0,0,0,.04);
  margin-bottom:var(--sp-4);overflow:hidden;
  transition:box-shadow .3s var(--ease);
}
.card.hoverable:hover{box-shadow:var(--sh-md)}
.card-head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px 12px;gap:var(--sp-3)}
.card-title{font-size:var(--fs-16);font-weight:var(--fw-bold);letter-spacing:-.016em;display:flex;align-items:center;gap:var(--sp-2)}
.card-extra{font-size:12.5px;color:var(--c-muted);display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap}
.card-body{padding:4px 20px 20px}
.card-body.tight{padding:2px 16px 16px}
.card-body.flush{padding:0}

.grid{display:grid;gap:var(--sp-4)}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.g-2-1{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}
.g-1-1-3{grid-template-columns:minmax(0,1.1fr) minmax(0,1.1fr) minmax(0,.9fr)}
@media(max-width:1240px){.g4{grid-template-columns:repeat(2,minmax(0,1fr))}.g-2-1{grid-template-columns:minmax(0,1fr)}}
@media(max-width:1080px){.g2,.g3,.g-1-1-3{grid-template-columns:minmax(0,1fr)}}

/* ---------------- KPI ---------------- */
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-4);margin-bottom:var(--sp-4)}
@media(max-width:1100px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
.kpi{
  background:var(--c-card);border-radius:var(--r-lg);padding:18px 18px 16px;
  display:flex;align-items:flex-start;gap:var(--sp-3);
  box-shadow:var(--sh-sm);border:1px solid rgba(0,0,0,.04);position:relative;overflow:hidden;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.kpi:hover{transform:translateY(-2px);box-shadow:var(--sh-md)}
.kpi.alert{border-color:rgba(255,59,48,.16)}
.kpi.alert::before{content:"";position:absolute;inset:0 0 auto 0;height:2px;background:linear-gradient(90deg,var(--c-danger),rgba(255,59,48,0))}
.kpi-icon{width:38px;height:38px;flex:0 0 38px;border-radius:var(--r-sm);display:grid;place-items:center;font-size:17px;background:rgba(0,0,0,.04)}
.kpi-icon.blue{background:var(--c-primary-50);color:var(--c-primary)}
.kpi-icon.green{background:var(--c-success-50);color:var(--c-success-text)}
.kpi-icon.amber{background:var(--c-warn-50);color:var(--c-warn-text)}
.kpi-icon.red{background:var(--c-danger-50);color:var(--c-danger-text)}
.kpi-icon.purple{background:var(--c-purple-50);color:var(--c-purple-text)}
.kpi-main{flex:1;min-width:0}
.kpi-val{font-size:26px;font-weight:var(--fw-bold);letter-spacing:-.028em;line-height:1.1;display:flex;align-items:baseline;gap:5px;font-variant-numeric:tabular-nums}
.kpi-val .unit{font-size:var(--fs-12);font-weight:var(--fw-medium);color:var(--c-muted);letter-spacing:0}
.kpi-label{font-size:12.5px;color:var(--c-muted);margin-top:5px;display:block}

/* ---------------- 徽标 ---------------- */
.badge{
  display:inline-flex;align-items:center;gap:5px;font-size:var(--fs-11);font-weight:var(--fw-medium);
  padding:2px 9px;border-radius:var(--r-pill);white-space:nowrap;line-height:1.6;
}
.badge .bdot{width:5px;height:5px;border-radius:50%;background:currentColor;flex:0 0 5px}
.badge-blue{background:var(--c-primary-50);color:var(--c-primary)}
.badge-green{background:var(--c-success-50);color:var(--c-success-text)}
.badge-amber{background:var(--c-warn-50);color:var(--c-warn-text)}
.badge-red{background:var(--c-danger-50);color:var(--c-danger-text)}
.badge-purple{background:var(--c-purple-50);color:var(--c-purple-text)}
.badge-cyan{background:var(--c-cyan-50);color:var(--c-cyan-text)}
.badge-gray{background:rgba(0,0,0,.05);color:var(--c-muted)}
.badge-ghost{background:var(--c-white);border:1px solid var(--c-line);color:var(--c-muted)}
.badge-lg{font-size:12.5px;padding:4px 12px}

/* ---------------- 出入口徽标（本轮的验收重点） ---------------- */
.if-badge{
  display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 9px;
  border-radius:var(--r-pill);font-size:var(--fs-11);font-weight:var(--fw-bold);
  border:1px solid transparent;cursor:pointer;white-space:nowrap;
  transition:all var(--dur-base) var(--ease);line-height:1;
  font-variant-numeric:tabular-nums;
}
.if-badge .if-arrow{font-size:12px;line-height:1}
.if-badge.in{background:var(--c-info-50);color:var(--c-info-text);border-color:var(--c-info-line)}
.if-badge.out{background:var(--c-purple-50);color:var(--c-purple-text);border-color:var(--c-purple-line-2)}
.if-badge:hover{transform:translateY(-1px);box-shadow:var(--sh-xs)}
.if-badge.in:hover{background:var(--c-primary-25);border-color:var(--c-primary-line)}
.if-badge.out:hover{background:var(--c-purple-100);border-color:var(--c-purple-line)}
.if-badge.todo{background:var(--c-fill);color:var(--c-muted);border-color:var(--c-line)}
.if-badge.todo:hover{background:var(--c-fill-3)}
.if-badge:focus-visible{outline:2px solid var(--c-primary);outline-offset:2px}
.if-card{width:320px;padding:0}
.if-card-head{display:flex;align-items:center;gap:8px;padding-bottom:10px;border-bottom:1px solid var(--c-line-2);margin-bottom:10px}
.if-card-title{font-size:13.5px;font-weight:var(--fw-bold);letter-spacing:-.01em}
.if-rows{display:flex;flex-direction:column;gap:0}
.if-row{display:flex;gap:12px;padding:7px 0;font-size:12.5px;border-bottom:1px dashed var(--c-line-2)}
.if-row:last-child{border-bottom:0}
.if-row .k{color:var(--c-muted);flex:0 0 68px}
.if-row .v{flex:1;font-weight:var(--fw-medium);color:var(--c-ink);word-break:break-all}
.if-note{margin-top:10px;padding:10px 12px;border-radius:var(--r-xs);background:var(--c-warn-50);border:1px solid var(--c-warn-line);font-size:11.5px;color:var(--c-warn-text);line-height:var(--lh-loose)}

/* ---------------- 来源说明条（外部数据必须可溯源） ---------------- */
.source-bar{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  background:var(--c-info-50);border:1px solid var(--c-info-line);border-radius:var(--r-sm);
  padding:9px 13px;font-size:12.5px;color:var(--c-info-text);margin-bottom:var(--sp-3);
}
.source-bar.gray{background:var(--c-fill-2);border-color:var(--c-line);color:var(--c-muted)}
.source-bar .sb-ico{font-size:13px;opacity:.9}
.source-bar b{font-weight:var(--fw-bold);color:var(--c-info-text)}
.source-bar .sb-right{margin-left:auto;display:flex;align-items:center;gap:var(--sp-2)}

/* ---------------- 提示块 ---------------- */
.callout{
  background:var(--c-fill-2);border:1px solid var(--c-line-2);border-left:2.5px solid var(--c-primary);
  border-radius:var(--r-sm);padding:12px 14px;font-size:12.5px;color:var(--c-ink-2);line-height:var(--lh-loose);
}
.callout.warn{background:var(--c-warn-50);border-left-color:var(--c-warn);border-color:var(--c-warn-line);color:var(--c-warn-text)}
.callout.green{background:var(--c-success-50);border-left-color:var(--c-success);border-color:var(--c-success-line);color:var(--c-success-text)}
.callout.red{background:var(--c-danger-50);border-left-color:var(--c-danger);border-color:var(--c-danger-line);color:var(--c-danger-text)}
.callout b{font-weight:var(--fw-bold)}

/* ---------------- 表格（Element Plus 覆盖） ---------------- */
.el-table{--el-table-border-color:var(--c-line-2);--el-table-header-bg-color:transparent;--el-table-row-hover-bg-color:var(--c-fill-2);font-size:var(--fs-13)}
.el-table th.el-table__cell{background:transparent;font-size:11.5px;font-weight:var(--fw-medium);color:var(--c-muted-2);padding:10px 0}
.el-table td.el-table__cell{padding:12px 0;border-bottom:1px solid var(--c-line-2);color:var(--c-ink-2)}
.el-table__inner-wrapper::before{display:none}
.el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell{background:var(--c-fill-2)}
.el-table .cell{padding:0 16px;line-height:1.5}
.el-table__body tr.row-click{cursor:pointer}
.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.tbl-code{font-family:var(--font-mono);font-size:12.5px;font-weight:var(--fw-bold);color:var(--c-primary)}
.tbl-strong{font-weight:var(--fw-bold);color:var(--c-ink)}
.tbl-sub{font-size:11.5px;color:var(--c-muted-2);margin-top:2px;line-height:1.4}
.num{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:12.5px}
.tr{text-align:right}
.tc{text-align:center}

/* ---------------- 筛选条 ---------------- */
.filterbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:13px 20px;border-bottom:1px solid var(--c-line-2);background:var(--c-fill-2)}
.filterbar .right{margin-left:auto}
.filterbar .fb-count{font-size:var(--fs-12);color:var(--c-muted-2)}
.filterbar .fb-count b{color:var(--c-ink);font-weight:var(--fw-bold)}

/* ---------------- 空态 / 加载 ---------------- */
.empty-state{padding:52px 20px;text-align:center;color:var(--c-muted-2)}
.empty-state .es-ico{font-size:34px;opacity:.35;margin-bottom:12px}
.empty-state .es-text{font-size:var(--fs-13)}
.empty-state .es-sub{font-size:var(--fs-12);margin-top:6px;color:var(--c-muted-2)}

/* ---------------- 时间轴 ---------------- */
.timeline{position:relative;padding:4px 0 0}
.tl-item{display:flex;gap:14px;position:relative;padding-bottom:20px}
.tl-item:last-child{padding-bottom:2px}
.tl-item::before{content:"";position:absolute;left:11px;top:24px;bottom:0;width:1.5px;background:var(--c-track)}
.tl-item:last-child::before{display:none}
.tl-item.done::before{background:var(--c-success-line)}
.tl-dot{
  width:23px;height:23px;flex:0 0 23px;border-radius:50%;display:grid;place-items:center;
  font-size:10.5px;font-weight:var(--fw-bold);background:var(--c-track);color:var(--c-muted-2);z-index:1;
  border:2px solid var(--c-white);
}
.tl-item.done .tl-dot{background:var(--c-success);color:var(--c-white)}
.tl-item.current .tl-dot{background:var(--c-primary);color:var(--c-white);box-shadow:0 0 0 5px rgba(0,113,227,.15)}
.tl-item.warn .tl-dot{background:var(--c-warn);color:var(--c-white);box-shadow:0 0 0 5px rgba(255,159,10,.18)}
.tl-item.fail .tl-dot{background:var(--c-danger);color:var(--c-white)}
.tl-body{flex:1;min-width:0;padding-top:1px}
.tl-title{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:var(--fw-medium);color:var(--c-muted-2);flex-wrap:wrap}
.tl-item.done .tl-title,.tl-item.current .tl-title,.tl-item.fail .tl-title{color:var(--c-ink);font-weight:var(--fw-bold)}
.tl-desc{font-size:12px;color:var(--c-muted);margin-top:3px;line-height:var(--lh-loose)}
.tl-meta{font-size:11px;color:var(--c-muted-2);font-family:var(--font-mono);margin-left:auto;white-space:nowrap}

/* ---------------- 信息行 ---------------- */
.info-rows{display:flex;flex-direction:column}
.info-row{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid var(--c-line-2);font-size:var(--fs-13)}
.info-row:last-child{border-bottom:0}
.info-row .ir-k{color:var(--c-muted);flex:0 0 88px;font-size:12.5px}
.info-row .ir-v{font-weight:var(--fw-medium);text-align:right;word-break:break-all;flex:1;min-width:0}
.section-label{font-size:11px;letter-spacing:.06em;color:var(--c-muted-2);font-weight:var(--fw-bold);margin:20px 0 10px}
.section-label:first-child{margin-top:0}

/* ---------------- 只读区（金蝶账务段） ---------------- */
.readonly-zone{background:var(--c-fill);border:1px solid var(--c-line);border-radius:var(--r-sm);padding:14px 16px}
.readonly-zone .rz-head{display:flex;align-items:center;gap:var(--sp-2);margin-bottom:10px;flex-wrap:wrap}
.readonly-zone .rz-title{font-size:12.5px;font-weight:var(--fw-bold);color:var(--c-muted)}
.readonly-zone .rz-lock{font-size:var(--fs-11);color:var(--c-muted-2);display:inline-flex;align-items:center;gap:4px}
.readonly-zone .el-input__wrapper{background:var(--c-readonly-bg);box-shadow:none}
.readonly-zone .el-input__inner{color:var(--c-muted)}

/* ---------------- 抽屉 / 弹窗（EP 覆盖） ---------------- */
.el-drawer{--el-drawer-bg-color:var(--c-bg)}
.el-drawer__header{margin-bottom:0;padding:18px 24px;border-bottom:1px solid var(--c-line);background:rgba(255,255,255,.78);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}
.el-drawer__body{padding:20px 24px 28px}
.el-drawer__footer{padding:14px 24px;border-top:1px solid var(--c-line);background:rgba(255,255,255,.78)}
.drawer-title{font-size:var(--fs-19);font-weight:var(--fw-bold);letter-spacing:-.018em;display:flex;align-items:center;gap:10px;color:var(--c-ink);flex-wrap:wrap;row-gap:6px}
.drawer-title .mono{min-width:0;overflow-wrap:anywhere}
.drawer-sub{font-size:var(--fs-12);color:var(--c-muted);margin-top:4px;font-weight:var(--fw-regular)}
.drawer-section{background:var(--c-white);border-radius:var(--r-md);border:1px solid rgba(0,0,0,.04);box-shadow:var(--sh-xs);padding:16px 18px;margin-bottom:var(--sp-3)}
.el-dialog{border-radius:var(--r-xl)}
.el-dialog__header{padding:20px 24px 14px;margin:0;border-bottom:1px solid var(--c-line-2)}
.el-dialog__title{font-size:var(--fs-19);font-weight:var(--fw-bold);letter-spacing:-.02em;color:var(--c-ink)}
.el-dialog__body{padding:18px 24px;color:var(--c-ink-2);font-size:var(--fs-13)}
.el-dialog__footer{padding:14px 24px;border-top:1px solid var(--c-line-2);background:var(--c-fill-2)}
.el-dialog__headerbtn{top:14px;right:14px}

/* ---------------- 按钮（Apple 胶囊） ---------------- */
.el-button{
  --el-button-border-color:rgba(0,0,0,.10);
  --el-button-bg-color:rgba(255,255,255,.9);
  --el-button-text-color:var(--c-ink);
  --el-button-hover-bg-color:var(--c-white);
  --el-button-hover-border-color:rgba(0,0,0,.18);
  --el-button-hover-text-color:var(--c-ink);
  border-radius:var(--r-pill);font-weight:var(--fw-medium);font-size:var(--fs-13);
  padding:8px 16px;height:auto;transition:all var(--dur-base) var(--ease);
}
.el-button+.el-button{margin-left:var(--sp-2)}
.el-button:hover{transform:translateY(-1px);box-shadow:var(--sh-xs)}
.el-button:active{transform:translateY(0) scale(.985)}
.el-button--primary{
  --el-button-bg-color:var(--c-primary);--el-button-border-color:transparent;--el-button-text-color:var(--c-white);
  --el-button-hover-bg-color:var(--c-primary-hover);--el-button-hover-border-color:transparent;
  --el-button-hover-text-color:var(--c-white);--el-button-active-bg-color:var(--c-primary-active);
  box-shadow:0 1px 3px rgba(0,113,227,.28);
}
.el-button--primary:hover{box-shadow:0 4px 14px -2px rgba(0,113,227,.42)}
.el-button--danger{
  --el-button-bg-color:var(--c-danger);--el-button-border-color:transparent;--el-button-text-color:var(--c-white);
  --el-button-hover-bg-color:var(--c-danger-hover);--el-button-hover-border-color:transparent;--el-button-hover-text-color:var(--c-white);
}
.el-button--success{
  --el-button-bg-color:var(--c-success);--el-button-border-color:transparent;--el-button-text-color:var(--c-white);
  --el-button-hover-bg-color:var(--c-success-hover);--el-button-hover-border-color:transparent;--el-button-hover-text-color:var(--c-white);
}
.el-button--small{font-size:var(--fs-12);padding:5px 13px}
.el-button.is-disabled,.el-button.is-disabled:hover{transform:none;box-shadow:none;opacity:.4}
.el-button--text{--el-button-bg-color:transparent;border-color:transparent;padding:4px 6px;color:var(--c-primary)}
.el-button--text:hover{background:var(--c-primary-50);box-shadow:none;transform:none}

/* ---------------- 表单（EP 覆盖） ---------------- */
.el-input__wrapper,.el-textarea__inner,.el-select__wrapper{
  border-radius:10px;box-shadow:0 0 0 1px rgba(0,0,0,.10) inset;background:var(--c-white);
  transition:box-shadow var(--dur-base) var(--ease);
}
.el-input__wrapper:hover,.el-textarea__inner:hover,.el-select__wrapper:hover{box-shadow:0 0 0 1px rgba(0,0,0,.18) inset}
.el-input__wrapper.is-focus,.el-textarea__inner:focus,.el-select__wrapper.is-focused{
  box-shadow:0 0 0 1px var(--c-primary) inset,0 0 0 4px rgba(0,113,227,.13) !important;
}
.el-form-item__label{font-size:12.5px;font-weight:var(--fw-medium);color:var(--c-ink-2)}
.el-form-item{margin-bottom:var(--sp-4)}
.form-hint{font-size:var(--fs-11);color:var(--c-muted-2);line-height:1.5;margin-top:2px}
.req-star{color:var(--c-danger);margin-left:3px}

/* ---------------- 分页 ---------------- */
.el-pagination{--el-pagination-button-bg-color:transparent;padding:12px 20px;justify-content:flex-end;font-weight:var(--fw-medium)}
.el-pagination .el-pager li{border-radius:var(--r-pill);font-size:var(--fs-12);min-width:28px;height:28px;line-height:28px}
.el-pagination .el-pager li.is-active{background:var(--c-primary);color:var(--c-white)}
.el-pagination button{border-radius:var(--r-pill)}

/* ---------------- Tabs（EP 覆盖） ---------------- */
.el-tabs__header{margin-bottom:var(--sp-4)}
.el-tabs__nav-wrap::after{height:1px;background:var(--c-line)}
.el-tabs__item{font-size:var(--fs-13);font-weight:var(--fw-medium);color:var(--c-muted)}
.el-tabs__item.is-active{color:var(--c-ink);font-weight:var(--fw-bold)}
.el-tabs__active-bar{background:var(--c-primary);height:2px;border-radius:2px}

/* ---------------- 树 ---------------- */
.el-tree{--el-tree-node-hover-bg-color:var(--c-fill);font-size:13px;background:transparent}
.el-tree-node__content{height:32px;border-radius:var(--r-xs);margin-bottom:2px}
.el-tree-node.is-current>.el-tree-node__content{background:var(--c-primary-50);color:var(--c-primary);font-weight:var(--fw-bold)}

/* ---------------- 提示条 ---------------- */
.el-alert{border-radius:var(--r-sm);padding:11px 14px}
.el-alert__title{font-size:12.5px;line-height:var(--lh-loose)}
.el-alert--warning.is-light{background:var(--c-warn-50);color:var(--c-warn-text)}
.el-alert--error.is-light{background:var(--c-danger-50);color:var(--c-danger-text)}
.el-alert--info.is-light{background:var(--c-fill);color:var(--c-muted)}
.el-message{border-radius:var(--r-md);box-shadow:var(--sh-md);border:1px solid var(--c-line);background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
.el-message__content{font-size:var(--fs-13)}
.el-message-box{border-radius:var(--r-xl);padding:20px 22px}
.el-message-box__title{font-size:var(--fs-19);font-weight:var(--fw-bold);letter-spacing:-.02em}
.el-message-box__content{font-size:var(--fs-13);color:var(--c-ink-2);line-height:var(--lh-loose)}
.el-message-box__btns{padding-top:var(--sp-4)}

/* ---------------- 工具类 ---------------- */
.split{display:flex;align-items:center;gap:var(--sp-2)}
.right{margin-left:auto}
.muted{color:var(--c-muted)}
.dim{color:var(--c-muted-2)}
.nowrap{white-space:nowrap}
.fs11{font-size:var(--fs-11)}.fs12{font-size:var(--fs-12)}.fs13{font-size:var(--fs-13)}
.fw6{font-weight:var(--fw-bold)}
.mt8{margin-top:var(--sp-2)}.mt12{margin-top:var(--sp-3)}.mt16{margin-top:var(--sp-4)}
.mb0{margin-bottom:0}.mb8{margin-bottom:var(--sp-2)}.mb12{margin-bottom:var(--sp-3)}
.hidden{display:none!important}
.stack{display:flex;flex-direction:column;gap:var(--sp-2)}
.tag-list{display:flex;gap:6px;flex-wrap:wrap}
.link{color:var(--c-primary);font-weight:var(--fw-medium);cursor:pointer}
.link:hover{color:var(--c-primary-hover)}

/* ---------------- 演示控制台（仅 ?dev=1） ----------------
   默认访问看不到：右下角留给两条引导。开了 dev 时 ⚡ 叠在引导按钮上方，不互相压住。 */
.demo-fab{
  position:fixed;right:22px;bottom:124px;width:46px;height:46px;border-radius:50%;border:0;z-index:70;
  background:rgba(29,29,31,.92);color:var(--c-white);font-size:19px;box-shadow:var(--sh-md);
  transition:transform .28s var(--ease-out);cursor:pointer;
  -webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);
}
.demo-fab:hover{transform:scale(1.07)}
.demo-panel{
  position:fixed;right:22px;bottom:180px;width:320px;background:rgba(255,255,255,.94);
  -webkit-backdrop-filter:saturate(180%) blur(28px);backdrop-filter:saturate(180%) blur(28px);
  border-radius:var(--r-xl);z-index:71;border:1px solid rgba(255,255,255,.6);
  box-shadow:var(--sh-lg);overflow:hidden;
}
.demo-head{padding:14px 16px;background:var(--c-nav-bg);color:var(--c-white);display:flex;align-items:center;justify-content:space-between}
.demo-head .dh-title{font-size:13.5px;font-weight:var(--fw-bold)}
.demo-head .dh-sub{font-size:11px;color:var(--c-nav-dim);margin-top:3px}
.demo-body{padding:14px 16px 18px}
.demo-sec{font-size:10.5px;letter-spacing:.06em;color:var(--c-muted-2);font-weight:var(--fw-bold);margin:14px 0 8px}
.demo-sec:first-child{margin-top:0}
.demo-btn{width:100%;justify-content:flex-start;margin-bottom:6px}

/* ---------------- 右下角入口（引导 + 一次性提示） ---------------- */
.guide-dock{
  position:fixed;right:22px;bottom:22px;z-index:65;
  display:flex;flex-direction:column;align-items:flex-end;gap:var(--sp-2);
}
.dock-btn{
  background:rgba(29,29,31,.92);color:var(--c-white);border-color:transparent;
  box-shadow:var(--sh-md);padding:10px 16px;
  -webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);
}
/* 悬停显式取值：不引变量（--c-nav-bg-2 与文字同为近黑，悬停后文字读不出来） */
.dock-btn:hover{background:#2b2b2e;color:#fff;border-color:transparent;box-shadow:var(--sh-lg)}
.dock-btn:active{background:#3a3a3d;color:#fff;border-color:transparent}
.dock-btn:focus-visible,.guide-dock .dock-btn:focus-visible{outline:2px solid #ffffff;outline-offset:2px;box-shadow:0 0 0 5px rgba(0,113,227,.85)}
.notice-toast{
  display:flex;align-items:center;gap:var(--sp-2);max-width:300px;
  background:rgba(255,255,255,.96);border:1px solid var(--c-line);border-radius:var(--r-md);
  box-shadow:var(--sh-md);padding:10px 12px;
  font-size:var(--fs-12);color:var(--c-ink-2);line-height:1.5;
  animation:toast-in var(--dur-slow) var(--ease-out);
}
.notice-toast .nt-text{flex:1;min-width:0}
.notice-toast .nt-x{
  border:0;background:none;color:var(--c-muted-2);cursor:pointer;
  font-size:var(--fs-12);line-height:1;padding:2px 3px;border-radius:var(--r-xs);flex:0 0 auto;
}
.notice-toast .nt-x:hover{color:var(--c-ink);background:var(--c-fill)}
@keyframes toast-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.notice-toast{animation:none}}

/* ---------------- 引导：遮罩 + 高亮 + 气泡卡 ----------------
   高亮用「四条遮罩带围一个洞」实现（不用超大外阴影，绘制更稳）；
   遮罩层 pointer-events:none，所以目标元素照样可点 —— 演示时能边看边点。 */
.guide-root{position:fixed;inset:0;z-index:90;pointer-events:none;display:none}
.guide-root.on{display:block}
.guide-mask{position:absolute;inset:0;pointer-events:none}
.guide-mask .gm{position:absolute;background:rgba(17,17,19,.55);pointer-events:none}
.guide-hole{
  position:fixed;top:0;left:0;width:0;height:0;pointer-events:none;
  border-radius:var(--r-sm);
  box-shadow:0 0 0 2px var(--c-primary),0 0 0 6px rgba(0,113,227,.22);
}
.guide-root.missing .guide-hole{box-shadow:none}
.guide-card{
  position:fixed;top:0;left:0;width:344px;max-width:calc(100vw - 24px);
  pointer-events:auto;background:var(--c-card);border:1px solid var(--c-line);
  border-radius:var(--r-md);box-shadow:var(--sh-lg);padding:13px 15px 11px;
}
/* 刻意不做淡入：位置由内联 transform 控制，再叠透明度动画会出现「卡片不可见但点击有效」的空窗 */
.guide-head{display:flex;align-items:center;gap:var(--sp-2);margin-bottom:7px}
.guide-name{font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--c-primary);letter-spacing:-.01em}
.guide-step{font-size:var(--fs-11);color:var(--c-muted-2);font-variant-numeric:tabular-nums}
.guide-x{
  margin-left:auto;border:0;background:none;color:var(--c-muted-2);cursor:pointer;
  font-size:var(--fs-12);line-height:1;padding:3px 4px;border-radius:var(--r-xs);
}
.guide-x:hover{color:var(--c-ink);background:var(--c-fill)}
.guide-text{font-size:var(--fs-13);color:var(--c-ink);line-height:var(--lh-loose);letter-spacing:-.005em}
.guide-foot{display:flex;align-items:center;gap:6px;margin-top:11px;padding-top:10px;border-top:1px solid var(--c-line-2)}
.guide-foot .guide-gap{flex:1}
.guide-btn{
  font-family:inherit;font-size:var(--fs-12);font-weight:var(--fw-medium);line-height:1;
  padding:7px 13px;border-radius:var(--r-pill);border:1px solid rgba(0,0,0,.10);
  background:var(--c-white);color:var(--c-ink);cursor:pointer;
  transition:background var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease);
}
.guide-btn:hover:not(:disabled){box-shadow:var(--sh-xs)}
.guide-btn:focus-visible{outline:2px solid var(--c-primary);outline-offset:2px}
.guide-btn.primary{
  background:var(--c-primary);border-color:transparent;color:var(--c-white);
  box-shadow:0 1px 3px rgba(0,113,227,.28);
}
.guide-btn.primary:hover:not(:disabled){background:var(--c-primary-hover);box-shadow:0 4px 14px -2px rgba(0,113,227,.42)}
.guide-btn.ghost{background:transparent;border-color:transparent;color:var(--c-muted);padding-left:2px;padding-right:4px}
.guide-btn.ghost:hover:not(:disabled){color:var(--c-ink);background:var(--c-fill)}
.guide-btn:disabled{opacity:.35;cursor:default;box-shadow:none}

/* ---------------- 角色切换 ---------------- */
.role-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.role-card{
  border:1px solid var(--c-line);border-radius:var(--r-md);padding:12px 13px;cursor:pointer;
  transition:all var(--dur-base) var(--ease);display:flex;gap:10px;align-items:center;background:var(--c-white);text-align:left;
}
.role-card:hover{border-color:rgba(0,113,227,.4);background:var(--c-fill-2);transform:translateY(-1px)}
.role-card.active{border-color:var(--c-primary);background:var(--c-primary-50);box-shadow:0 0 0 4px rgba(0,113,227,.1)}
.role-avatar{width:32px;height:32px;flex:0 0 32px;border-radius:50%;display:grid;place-items:center;color:var(--c-white);font-size:13px;font-weight:var(--fw-bold)}
.role-name{font-size:12.5px;font-weight:var(--fw-bold)}
.role-desc{font-size:11px;color:var(--c-muted);line-height:1.45;margin-top:1px}

/* ---------------- 响应式 ---------------- */
@media(max-width:900px){
  .sidebar{width:64px;flex:0 0 64px}
  .brand-text,.nav-item .ni-label,.nav-badge,.user-meta,.nav-group{display:none}
  .content{padding:18px 16px 48px}
  .page-title{font-size:22px}
  .kpis{grid-template-columns:minmax(0,1fr)}
}

/* ============================================================
   组件补充样式（表单域 / 物料选择器 / 三态进度 / 余额校验 / 高亮行）
   ============================================================ */

/* ---------------- 表单域 ---------------- */
.field{display:flex;flex-direction:column;gap:7px;min-width:0}
.field>label{font-size:12.5px;font-weight:var(--fw-medium);color:var(--c-ink-2);letter-spacing:-.005em}
.field>.el-select,.field>.el-date-editor,.field .el-input{width:100%}

/* ---------------- 来源条文字 ---------------- */
.source-bar .sb-text{flex:1;min-width:0;line-height:1.55}
.source-bar.gray .sb-text b{color:var(--c-ink-2)}
.source-bar.gray{color:var(--c-muted)}

/* ---------------- 物料选择器 ---------------- */
.mp-body{display:grid;grid-template-columns:176px minmax(0,1fr);gap:var(--sp-4)}
.mp-tree{border-right:1px solid var(--c-line-2);padding-right:var(--sp-3);max-height:440px;overflow-y:auto}
.mp-tree-title{font-size:11px;letter-spacing:.06em;color:var(--c-muted-2);font-weight:var(--fw-bold);margin-bottom:var(--sp-2)}
.mp-main{min-width:0}
.mp-search{display:flex;align-items:center;gap:var(--sp-2);margin-bottom:var(--sp-2)}
.mp-search .fb-count{font-size:var(--fs-12);color:var(--c-muted-2)}
.mp-search .fb-count b{color:var(--c-ink);font-weight:var(--fw-bold)}
.mp-table .el-table__row{cursor:pointer}
@media(max-width:820px){.mp-body{grid-template-columns:minmax(0,1fr)}.mp-tree{border-right:0;padding-right:0;max-height:160px}}

/* ---------------- 准三态进度 ---------------- */
.stage-track{display:flex;align-items:flex-start;gap:0}
.stage-node{flex:0 0 auto;width:150px;text-align:center;opacity:.55}
.stage-node.done,.stage-node.current{opacity:1}
.stage-dot{
  width:28px;height:28px;border-radius:50%;margin:0 auto var(--sp-2);
  display:grid;place-items:center;font-size:12px;font-weight:var(--fw-bold);
  background:var(--c-track);color:var(--c-muted-2);
}
.stage-node.done .stage-dot{background:var(--c-success);color:var(--c-white)}
.stage-node.current .stage-dot{background:var(--c-primary);color:var(--c-white);box-shadow:0 0 0 5px rgba(0,113,227,.15)}
.stage-name{font-size:12.5px;font-weight:var(--fw-bold);color:var(--c-ink)}
.stage-desc{font-size:11px;color:var(--c-muted-2);margin-top:2px;line-height:1.45}
.stage-bar{flex:1;height:2px;background:var(--c-track);margin-top:14px;border-radius:2px}
.stage-bar.on{background:var(--c-success-line)}

/* ---------------- 余额校验 ---------------- */
.balance-box{
  display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;
  background:var(--c-fill-2);border:1px solid var(--c-line-2);border-radius:var(--r-md);
  padding:var(--sp-4);
}
.bal-item{flex:1;min-width:110px;text-align:center;padding:var(--sp-2) 0}
.bal-item.accent{background:var(--c-primary-50);border-radius:var(--r-sm)}
.bal-k{font-size:11px;color:var(--c-muted);margin-bottom:4px}
.bal-v{font-family:var(--font-mono);font-size:15px;font-weight:var(--fw-bold);letter-spacing:-.02em;color:var(--c-ink)}
.bal-item.accent .bal-v{color:var(--c-primary)}
.bal-op{font-size:15px;color:var(--c-muted-2);font-weight:var(--fw-bold);padding:0 2px}

/* ---------------- 询价最优行高亮 ---------------- */
.el-table .rfq-best-row>td.el-table__cell{background:var(--c-success-50)!important}
.el-table .rfq-best-row:hover>td.el-table__cell{background:var(--c-success-25)!important}

/* ---------------- 文件条 / 日志行 ---------------- */
.file-chip{
  display:flex;align-items:center;gap:10px;background:var(--c-fill-2);border:1px solid var(--c-line-2);
  border-radius:var(--r-sm);padding:10px 13px;font-size:12.5px;margin-bottom:6px;
}
.file-chip .fc-ico{color:var(--c-primary)}
.logline{font-family:var(--font-mono);font-size:12px;color:var(--c-ink-2);padding:6px 0;display:flex;gap:12px;border-bottom:1px solid var(--c-line-2)}
.logline:last-child{border-bottom:0}
.logline .lt{color:var(--c-muted-2);flex:0 0 auto}
.logline .lm{flex:1;line-height:1.6}
.logline .lm.ok{color:var(--c-success-text)}

/* 表头里放徽标时不换行 */
.el-table th .split.nowrap{white-space:nowrap}

/* ---------------- 键盘可达 / 焦点可见 ---------------- */
.nav-item:focus-visible,.nav-group:focus-visible,.user-switch:focus-visible,.demo-fab:focus-visible,.role-card:focus-visible{
  outline:2px solid var(--c-primary);outline-offset:2px;
}
.nav-item:focus-visible{outline-offset:-2px}

/* ---------------- 表格内数字/编码不折行，长文本省略 ---------------- */
.el-table .num{white-space:nowrap}
.cell-ell{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}

/* 资质完备：提示项，不用大面积底色 */
.qual{font-size:12px;white-space:nowrap;letter-spacing:-.01em}
.qual.ok{color:var(--c-success-text)}
.qual.warn{color:var(--c-warn-text)}

/* ============================================================
   报价应用补充样式（本文件追加段：全部取 tokens.css 的变量）
   ============================================================ */

/* ---------------- 编辑页两栏：主区 + 算价摘要（sticky） ---------------- */
.edit-layout{display:grid;grid-template-columns:minmax(0,1fr) 348px;gap:var(--sp-4);align-items:start}
@media(max-width:1500px){.edit-layout{grid-template-columns:minmax(0,1fr)}.summary-col{position:static}}
.summary-col{position:sticky;top:var(--sp-4)}
.summary-card{background:var(--c-card);border-radius:var(--r-lg);box-shadow:var(--sh-sm);border:1px solid rgba(0,0,0,.04);overflow:hidden}
.summary-head{padding:14px 16px 10px;border-bottom:1px solid var(--c-line-2)}
.summary-title{font-size:13.5px;font-weight:var(--fw-bold);letter-spacing:-.01em}
.summary-sub{font-size:11.5px;color:var(--c-muted-2);margin-top:3px}
.summary-body{padding:4px 16px 14px}
.sum-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px dashed var(--c-line-2);font-size:12.5px}
.sum-row:last-child{border-bottom:0}
.sum-row .k{color:var(--c-muted);white-space:nowrap}
.sum-row .v{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-weight:var(--fw-medium);text-align:right}
.sum-row.total{padding-top:12px}
.sum-row.total .v{font-size:19px;font-weight:var(--fw-bold);letter-spacing:-.02em;color:var(--c-primary)}
.summary-foot{padding:12px 16px 16px;border-top:1px solid var(--c-line-2);display:flex;flex-direction:column;gap:var(--sp-2)}
.deal-box{margin:10px 0 0;padding:11px 12px;border-radius:var(--r-sm);background:var(--c-primary-50);border:1px solid var(--c-primary-line);font-size:12.5px;line-height:1.6}
.deal-box.free{background:var(--c-success-50);border-color:var(--c-success-line);color:var(--c-success-text)}
.deal-box .ab-title{font-weight:var(--fw-bold);display:flex;align-items:center;gap:6px;color:inherit}
.deal-box .ab-sub{font-size:11.5px;color:var(--c-muted);margin-top:4px}

/* ---------------- 明细行编辑器（可输入表格） ---------------- */
.line-table{width:100%;border-collapse:separate;border-spacing:0;font-size:12.5px;table-layout:fixed}
.line-table th{
  font-size:11px;font-weight:var(--fw-medium);color:var(--c-muted-2);text-align:left;
  padding:8px 8px;border-bottom:1px solid var(--c-line);white-space:nowrap;background:var(--c-fill-2);
}
.line-table td{padding:6px 6px;border-bottom:1px solid var(--c-line-2);vertical-align:middle}
.line-table tr:hover td{background:var(--c-fill-2)}
.line-table .ln{width:34px;text-align:center;color:var(--c-muted-2);font-family:var(--font-mono)}
.line-table .cell-num{font-family:var(--font-mono);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.line-table .el-input__wrapper,.line-table .el-select__wrapper{padding:2px 8px;min-height:30px}
.line-table .el-input__inner{font-size:12.5px}
.line-table tr.is-error td{background:var(--c-danger-50)}
.line-err{font-size:11px;color:var(--c-danger-text);margin-top:2px;line-height:1.4}
.line-extra{padding:2px 8px 12px;background:var(--c-fill-2)}
.line-extra textarea{font-size:12px;line-height:1.6}
.src-tag{display:inline-block;font-size:10.5px;color:var(--c-muted);background:rgba(0,0,0,.05);border-radius:var(--r-pill);padding:1px 8px;white-space:nowrap}
.src-tag.ex{background:var(--c-warn-50);color:var(--c-warn-text)}
.manual-tag{font-size:10.5px;color:var(--c-warn-text);margin-left:4px}

/* ---------------- 配置中心：矩阵格 ---------------- */
.matrix{width:100%;border-collapse:separate;border-spacing:0;font-size:12.5px}
.matrix th,.matrix td{border-bottom:1px solid var(--c-line-2);padding:10px 12px;text-align:left;vertical-align:top}
.matrix thead th{font-size:11.5px;color:var(--c-muted-2);font-weight:var(--fw-medium);background:var(--c-fill-2)}
.matrix tbody th{font-weight:var(--fw-medium);color:var(--c-ink)}
.matrix .cell-wan{font-size:11px;color:var(--c-muted-2);margin-top:2px}
.matrix .cell-unit{font-size:11px;color:var(--c-primary);margin-top:4px;font-family:var(--font-mono)}
.matrix .fixed-cell{background:var(--c-warn-50)}
.matrix .el-input-number{width:104px}
.matrix .el-input{width:104px}

/* ---------------- 折线/表格通用小件 ---------------- */
.chip-line{display:flex;gap:var(--sp-2);flex-wrap:wrap;align-items:center}
.mono-sm{font-family:var(--font-mono);font-size:11.5px;color:var(--c-muted)}

/* ---------------- 预览页 ---------------- */
.preview-toolbar{
  display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;
  background:var(--c-card);border:1px solid rgba(0,0,0,.04);border-radius:var(--r-md);
  box-shadow:var(--sh-xs);padding:10px 14px;margin-bottom:var(--sp-4);
  position:sticky;top:0;z-index:12;
}
.preview-toolbar .pt-label{font-size:12px;color:var(--c-muted-2);margin-right:4px}
.sheet-canvas{
  background:#F0F2F5;border-radius:var(--r-md);padding:var(--sp-5) var(--sp-4);
  overflow-x:auto;
}
.sheet-canvas .sh-paper + .sh-paper{margin-top:var(--sp-5)}
.paper-label{
  width:210mm;margin:0 auto var(--sp-2);font-size:11.5px;color:var(--c-muted-2);
  font-family:var(--font-sans);display:flex;align-items:center;gap:var(--sp-2);
}

/* ---------------- 导入向导 ---------------- */
.imp-steps{display:flex;gap:var(--sp-2);align-items:center;margin-bottom:var(--sp-4);flex-wrap:wrap}
.imp-step{
  display:flex;align-items:center;gap:8px;font-size:12px;color:var(--c-muted-2);
  background:var(--c-fill-2);border:1px solid var(--c-line-2);border-radius:var(--r-pill);padding:5px 12px;
}
.imp-step .is-n{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:10.5px;background:rgba(0,0,0,.06);color:var(--c-muted)}
.imp-step.on{background:var(--c-primary-50);border-color:var(--c-primary-line);color:var(--c-primary);font-weight:var(--fw-medium)}
.imp-step.on .is-n{background:var(--c-primary);color:var(--c-white)}
.imp-step.done{background:var(--c-success-50);border-color:var(--c-success-line);color:var(--c-success-text)}
.imp-step.done .is-n{background:var(--c-success);color:var(--c-white)}
.drop-zone{
  border:1.5px dashed var(--c-line);border-radius:var(--r-md);padding:28px;
  text-align:center;background:var(--c-fill-2);color:var(--c-muted);
}
.drop-zone .dz-ico{font-size:26px;opacity:.4;margin-bottom:8px}
.drop-zone .dz-name{font-size:13px;font-weight:var(--fw-medium);color:var(--c-ink);margin-top:6px}
.diff-tag{font-size:10.5px;padding:1px 7px;border-radius:var(--r-pill);white-space:nowrap}
.diff-new{background:var(--c-success-50);color:var(--c-success-text)}
.diff-mod{background:var(--c-primary-50);color:var(--c-primary)}
.diff-same{background:rgba(0,0,0,.05);color:var(--c-muted)}
.diff-err{background:var(--c-danger-50);color:var(--c-danger-text)}
.diff-warn{background:var(--c-warn-50);color:var(--c-warn-text)}

/* ---------------- 自检面板（演示控制台用） ---------------- */
.selfcheck{font-size:12px;line-height:1.6}
.selfcheck .sc-row{display:flex;gap:8px;padding:5px 0;border-bottom:1px dashed var(--c-line-2)}
.selfcheck .sc-row:last-child{border-bottom:0}
.selfcheck .sc-k{flex:1;min-width:0;color:var(--c-ink-2)}
.selfcheck .sc-v{font-family:var(--font-mono);font-size:11.5px;white-space:nowrap;color:var(--c-ink)}
.selfcheck .sc-v.ok{color:var(--c-success-text)}
.selfcheck .sc-v.bad{color:var(--c-danger-text)}

/* ---------------- 骨架行（加载态） ---------------- */
.row-skel{height:14px;border-radius:var(--r-xs);background:linear-gradient(90deg,var(--c-fill) 25%,var(--c-fill-3) 37%,var(--c-fill) 63%);background-size:400% 100%;animation:skel 1.4s ease infinite}
@keyframes skel{0%{background-position:100% 50%}100%{background-position:0 50%}}
@media(prefers-reduced-motion:reduce){.row-skel{animation:none}}

/* ---------------- 明细行：类型切换用的小提示 ---------------- */
.mode-tip{font-size:11.5px;color:var(--c-muted-2);line-height:1.5}
.form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-3)}
@media(max-width:900px){.form-row{grid-template-columns:minmax(0,1fr)}}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field>label{font-size:12px;font-weight:var(--fw-medium);color:var(--c-ink-2)}
.field .el-select,.field .el-input,.field .el-date-editor{width:100%}

/* KPI 长金额（千分位 + 两位小数）在窄卡里降一档字号，不换行 */
.kpi-val.sm{font-size:19px;letter-spacing:-.02em}

/* 折扣区间单元格：两个数字框 + 短横，不换行 */
.range-cell{display:flex;align-items:center;gap:6px;white-space:nowrap}
.range-cell .el-input-number{width:72px;flex:0 0 72px}
.matrix .chip-line{white-space:nowrap}

/* 明细行里的「年限 + 区间」必须一行放下，否则会上下窜 */
.line-table .chip-line{flex-wrap:nowrap}
.line-table .chip-line .el-input-number{flex:0 0 50px}

/* 明细行金额列的副行（单价） */
.line-table .cell-sub{font-size:11px;color:var(--c-muted-2);margin-top:2px}

/* 年限区间只读展示（由使用年限派生，不可编辑） */
.line-table .range-ro{color:var(--c-muted);white-space:nowrap;font-variant-numeric:tabular-nums}

/* 明细行「适用：全局费率档 1.500%」—— 允许折行，不跟着金额一起 nowrap */
.line-table .apply-ro{white-space:normal;color:var(--c-muted);line-height:1.35;font-family:var(--font-sans)}

/* 明细行内控件宽度跟随单元格，不再被内容挤扁 */
.line-table td .el-select,.line-table td .el-input{width:100%}
.line-table td .el-input-number{width:100%}
.line-table td .el-input-number .el-input__inner{text-align:right}

/* 系数格：输入框右侧补 % 后缀（值仍是 95 表示 95%） */
.pct-wrap{display:flex;align-items:center;gap:3px;min-width:0}
.pct-wrap .pct{font-size:11px;line-height:1;color:var(--c-muted-2);flex:0 0 auto}
.line-table td .pct-wrap .el-input-number{width:auto;flex:1 1 auto;min-width:0}
.card-extra .pct-wrap{display:inline-flex}

/* 明细行操作列：文字按钮，不靠「⋯」图标 */
.line-table .row-ops{white-space:nowrap}
.line-table .row-ops .el-button+.el-button{margin-left:2px}
.line-table .row-ops .el-button{vertical-align:middle}

/* 费率矩阵：格子表（行列由「设置」里的清单决定，表内不再有增删入口） */

/* 只读代码展示：灰底、不可编辑、不可粘贴（不是 input，所以粘贴进不来） */
.code-ro{
  display:flex;align-items:center;width:100%;min-height:34px;padding:6px 12px;
  background:var(--c-readonly-bg);border-radius:10px;
  box-shadow:0 0 0 1px rgba(0,0,0,.06) inset;
  font-family:var(--font-mono);font-size:13px;letter-spacing:.02em;color:var(--c-ink-2);
  user-select:all;
}
.code-ro.is-empty{font-family:var(--font-sans);font-size:12.5px;color:var(--c-muted-2);letter-spacing:0}

/* 设置弹窗里的清单行（型号 / 年限区间 / 服务档位 三个页签共用这一套；
   .el-collapse 那几条是「价格依据」折叠区在用的，这里只是把折叠头收拾得跟卡片一致） */
.el-collapse{border-top:0}
.el-collapse-item__header{
  height:auto;line-height:1.4;padding:12px 0;background:transparent;border-bottom-color:var(--c-line);
  font-size:13.5px;font-weight:var(--fw-bold);color:var(--c-ink);
}
.el-collapse-item__wrap{background:transparent;border-bottom-color:var(--c-line-2)}
.el-collapse-item__content{padding-bottom:var(--sp-4);font-size:var(--fs-13);color:var(--c-ink-2)}
.set-title{display:inline-flex;align-items:center;gap:var(--sp-2);min-width:0}
.set-count{font-size:var(--fs-11);font-weight:var(--fw-regular);color:var(--c-muted-2)}
.set-add{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;margin-bottom:var(--sp-2)}
.set-add .el-input{flex:1 1 120px;min-width:0}
.set-row{display:flex;align-items:flex-start;gap:var(--sp-2);flex-wrap:wrap;padding:9px 0;border-bottom:1px solid var(--c-line-2)}
.set-row:last-child{border-bottom:0}
.set-main{display:flex;align-items:center;gap:var(--sp-2);flex:1 1 auto;min-width:0;flex-wrap:wrap;font-size:var(--fs-13)}
.set-ops{display:flex;align-items:center;gap:2px;flex:0 0 auto}
.set-ops .el-button+.el-button{margin-left:2px}
.set-note{flex:1 1 100%;font-size:var(--fs-11);line-height:1.45;color:var(--c-warn-text)}
.set-tip{font-size:var(--fs-11);color:var(--c-muted-2);line-height:1.55;margin:2px 0 var(--sp-3)}
.set-tip.bad{color:var(--c-danger-text)}

/* 展开区里的按钮组可以折行：快速档有 7 个，一行放不下就得换行，不能裁掉 */
.line-extra .chip-line{flex-wrap:wrap}

/* ============================================================
   设置弹窗（居中弹窗 + 顶部四个页签）
   · 弹窗体固定高度上限，滚动只发生在页签内容里 —— 页签头与「完成」按钮始终可见
   ============================================================ */
.set-dialog-sub{font-size:var(--fs-12);line-height:var(--lh-base);color:var(--c-muted);margin:-4px 0 var(--sp-2)}
/* 窗口比弹窗窄时收进来（880px 是给 1440 屏的舒适宽度，不是硬下限） */
.set-dialog{max-width:calc(100vw - var(--sp-6))}
.set-tabs .el-tabs__header{margin-bottom:var(--sp-3)}
.set-tabs .el-tabs__content{max-height:64vh;overflow-y:auto;overflow-x:hidden;padding-right:var(--sp-1)}
.set-tabs .el-tab-pane{min-height:120px}

/* ============================================================
   服务内容模板编辑器（左：档位竖列表 / 右：模板）
   ============================================================ */
.tpl-wrap{display:grid;grid-template-columns:168px 1fr;gap:var(--sp-4);align-items:start}

/* 左：档位竖列表（原生 button，键盘可直接 Tab 到） */
.tpl-levels{display:flex;flex-direction:column;gap:2px;border-right:1px solid var(--c-line-2);padding-right:var(--sp-2)}
.tpl-level-item{
  display:flex;align-items:baseline;gap:6px;flex-wrap:wrap;width:100%;
  padding:8px 10px;border:0;border-radius:var(--r-xs);background:transparent;
  font-family:var(--font-sans);font-size:var(--fs-13);color:var(--c-ink-2);
  text-align:left;cursor:pointer;transition:background var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease);
}
.tpl-level-item:hover{background:var(--c-fill)}
.tpl-level-item:focus-visible{outline:2px solid var(--c-primary);outline-offset:1px}
.tpl-level-item.is-active{background:var(--c-primary-50);color:var(--c-primary);font-weight:var(--fw-bold)}
.tpl-level-name{min-width:0;overflow-wrap:anywhere}
.tpl-level-code{font-family:var(--font-mono);font-size:var(--fs-11);color:var(--c-muted-2);letter-spacing:.02em}
.tpl-level-item.is-active .tpl-level-code{color:var(--c-info-text)}
.tpl-level-count{margin-left:auto;font-size:var(--fs-11);color:var(--c-muted-2)}

/* 右：模板编辑器 */
.tpl-main{min-width:0;display:flex;flex-direction:column;gap:var(--sp-3)}
.tpl-field{display:flex;align-items:flex-start;gap:var(--sp-2)}
.tpl-field .tpl-label{flex:0 0 60px;padding-top:7px}
.tpl-label{font-size:var(--fs-12);font-weight:var(--fw-medium);color:var(--c-muted);letter-spacing:.01em}
.tpl-field .el-textarea{align-self:stretch}

/* 列管理 */
.tpl-cols{display:flex;flex-direction:column;gap:6px;padding:var(--sp-2) var(--sp-3);background:var(--c-fill-2);border-radius:var(--r-sm);border:1px solid var(--c-line-2)}
.tpl-cols-head{display:flex;align-items:baseline;gap:var(--sp-2);flex-wrap:wrap;margin-bottom:2px}
.tpl-col-row{display:flex;align-items:center;gap:var(--sp-2)}
.tpl-col-row .el-input{flex:1 1 160px;min-width:0}
.tpl-col-row .el-input-number{flex:0 0 88px}
.tpl-col-idx{flex:0 0 18px;font-family:var(--font-mono);font-size:var(--fs-11);color:var(--c-muted-2)}
.tpl-cols > .el-button{align-self:flex-start;margin-top:2px}

/* 表格：表头深色 + 斑马纹 + 单元格紧凑 + 横向可滚动 */
.tpl-grid-scroll{
  overflow-x:auto;overscroll-behavior-x:contain;
  border:1px solid var(--c-line);border-radius:var(--r-sm);background:var(--c-card);
}
.tpl-grid{width:100%;min-width:560px;border-collapse:separate;border-spacing:0;table-layout:fixed}
.tpl-grid th,.tpl-grid td{padding:0;vertical-align:top;border-bottom:1px solid var(--c-line-2);border-right:1px solid var(--c-line-2)}
.tpl-grid th:last-child,.tpl-grid td:last-child{border-right:0}
.tpl-grid thead th{
  position:sticky;top:0;z-index:1;
  padding:8px 10px;background:var(--c-ink);color:var(--c-white);
  font-size:var(--fs-12);font-weight:var(--fw-medium);letter-spacing:.02em;text-align:left;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.tpl-grid tbody tr:nth-child(even){background:var(--c-fill-2)}
.tpl-grid tbody tr:hover{background:var(--c-primary-25)}
.tpl-grid tbody tr:last-child td{border-bottom:0}
.tpl-grid .tpl-grid-no{
  width:7%;padding:9px 6px;text-align:center;
  font-family:var(--font-mono);font-size:var(--fs-11);color:var(--c-muted-2);
  background:var(--c-fill);border-right:1px solid var(--c-line-2);
}
.tpl-grid thead .tpl-grid-no{background:var(--c-nav-bg-2);color:var(--c-nav-text);font-family:var(--font-sans)}
.tpl-grid .tpl-grid-op{width:8%;text-align:center;vertical-align:middle}
.tpl-grid thead .tpl-grid-op{background:var(--c-nav-bg-2);color:var(--c-nav-text)}

/* 单元格里的输入框：去掉外框，靠 hover / focus 给反馈（表格本身就够密了） */
.tpl-grid .el-input__wrapper{
  padding:5px 8px;background:transparent;box-shadow:none;border-radius:0;
  transition:background var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease);
}
.tpl-grid .el-textarea__inner{
  padding:5px 8px;background:transparent;box-shadow:none;border-radius:0;
  font-family:var(--font-sans);font-size:var(--fs-13);line-height:var(--lh-base);color:var(--c-ink-2);
  transition:background var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease);
}
.tpl-grid .el-input__wrapper:hover,.tpl-grid .el-textarea__inner:hover{background:var(--c-primary-25)}
.tpl-grid .el-input__wrapper.is-focus,.tpl-grid .el-textarea__inner:focus{
  background:var(--c-white);box-shadow:inset 0 0 0 2px var(--c-primary);
}

.tpl-empty{padding:var(--sp-5) var(--sp-4);text-align:center;font-size:var(--fs-12);line-height:var(--lh-loose);color:var(--c-muted-2)}
.tpl-foot{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap}

/* 窄屏：档位列表改成横排，编辑器占满一行（弹窗宽度由 el-dialog 自己收） */
@media (max-width:820px){
  .tpl-wrap{grid-template-columns:1fr}
  .tpl-levels{flex-direction:row;flex-wrap:wrap;border-right:0;border-bottom:1px solid var(--c-line-2);padding:0 0 var(--sp-2)}
  .tpl-level-item{width:auto}
  .tpl-level-count{margin-left:0}
}