/* ---------- 1. 令牌 ---------- */
:root {
  color-scheme: light dark;

  /* 排版（恒定） */
  --font-ui: "Inter", "Segoe UI Variable Text", "Segoe UI", "PingFang SC",
             "Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei", system-ui, sans-serif;
  --font-num: "Inter", "Segoe UI Variable Display", "Bahnschrift", system-ui, sans-serif;
  --fs: 14px;
  --lh: 1.5;
  --t: .16s cubic-bezier(.2, .7, .3, 1);

  /* 尺度（恒定） */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 20px; --sp-6: 24px; --sp-7: 32px; --sp-8: 40px;
  --r-sm: 6px; --r-md: 9px; --r-lg: 14px; --r-pill: 999px;
  --side-w: clamp(198px, 14.1vw, 237px);
  --workspace-pad: clamp(16px, 1.45vw, 26px);
  --ctl-h: 34px;

  /* 表面与线条 */
  --bg:            light-dark(#f0f2fb, #0f1115);
  --surface:       light-dark(#fcfcff, #171a20);
  --surface-2:     light-dark(#f0f1f9, #1c2027);
  --surface-3:     light-dark(#eaeefa, #232830);
  --line:          light-dark(#e2e6f3, #282e37);
  --line-strong:   light-dark(#cbd4ee, #3a424f);
  --inset:         light-dark(#f8f9fb, #12151a);

  /* 文字 */
  --ink:           light-dark(#101630, #e9edf3);
  --ink-2:         light-dark(#4b5566, #a4afc0);
  --ink-3:         light-dark(#525d79, #a4afc0);
  --on-brand:      #ffffff;

  /* 品牌与语义色 */
  --brand:         light-dark(#3047ec, #7b7ff5);
  --brand-hover:   light-dark(#2739d4, #8f93f7);
  --brand-soft:    light-dark(#edf0ff, #1e2140);
  --brand-line:    light-dark(#d5d8fb, #363c6b);
  --ok:            light-dark(#127047, #4dd39b);
  --ok-soft:       light-dark(#e6f7f0, #12271f);
  --warn:          light-dark(#9e4d09, #f0b45c);
  --warn-soft:     light-dark(#fdf3e2, #2b2114);
  --bad:           light-dark(#d92d20, #ff7d70);
  --bad-soft:      light-dark(#fdecea, #2d1715);
  --info:          light-dark(#2f6fed, #74aaff);
  --info-soft:     light-dark(#e9f1fe, #141f33);

  /* 阴影与焦点 */
  --sh-1: 0 1px 2px light-dark(#10151d14, #00000066);
  --sh-2: 0 1px 2px light-dark(#10151d10, #00000059), 0 8px 24px light-dark(#10151d12, #00000066);
  --sh-3: 0 16px 48px light-dark(#10151d22, #00000088);
  --ring: 0 0 0 3px light-dark(#4f46e533, #7b7ff540);

  /* 旧变量别名：app.js 内联样式仍引用 var(--sub)，其余供过渡期兜底 */
  --sub: var(--ink-3);
  --txt: var(--ink);
  --card: var(--surface);
  --pri: var(--brand);
  --pri-2: var(--brand-hover);
  --side-bg: var(--surface);
  --side-txt: var(--ink-2);
  --side-on: var(--on-brand);
}

/* 手动主题开关（未来加一行 JS 即可，纯 CSS 阶段先靠系统偏好） */
:root[data-theme='light'] { color-scheme: light; }
:root[data-theme='dark']  { color-scheme: dark; }

/* ---------- 2. 基座 ---------- */
* { box-sizing: border-box; margin: 0; padding: 0; }

html { -webkit-text-size-adjust: 100%; }

body {
  font-family: var(--font-ui);
  font-size: var(--fs);
  line-height: var(--lh);
  background: var(--bg);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-variant-numeric: tabular-nums proportional-nums;
}

#app { display: flex; height: 100vh; height: 100dvh; }

/* 侧边栏 */
#side {
  width: var(--side-w); flex-shrink: 0;
  background: var(--side-gradient);
  border-right: 1px solid var(--line);
  display: flex; flex-direction: column;
  overflow: hidden;
}
.logo {
  display: flex; align-items: center; gap: var(--sp-3);
  padding: var(--sp-5) var(--sp-5) var(--sp-4);
  color: var(--ink); font-size: 15px; letter-spacing: 0;
}
.logo-mark {
  width: 34px; height: 34px; flex-shrink: 0; border-radius: 10px;
  display: grid; place-items: center;
  background: linear-gradient(150deg, var(--brand), #9b59f6);
  color: #fff; font-size: 15px; font-weight: 700;
  box-shadow: 0 2px 8px light-dark(#4f46e540, #7b7ff540);
}
.logo-text { display: flex; flex-direction: column; line-height: 1.25; }
.logo-text b { color: var(--ink); font-weight: 650; }
.logo-text small { font-size: 11px; color: var(--ink-3); font-weight: 400; letter-spacing: .03em; }

#nav { flex: 1; padding: 0 var(--sp-3) var(--sp-3); display: flex; flex-direction: column; gap: 2px; overflow-y: auto; }
#nav a {
  position: relative; display: flex; align-items: center; gap: var(--sp-3);
  height: 38px; padding: 0 var(--sp-3);
  border-radius: var(--r-md); cursor: pointer;
  color: var(--ink-2); font-size: 14px; font-weight: 450;
  transition: background var(--t), color var(--t);
}
#nav a svg { width: 18px; height: 18px; flex-shrink: 0; opacity: .85; }
#nav a:hover { background: var(--surface-3); color: var(--ink); }
#nav a.on { background: var(--brand-soft); color: var(--brand); font-weight: 600; }
#nav a.on svg { opacity: 1; }
#nav a:focus-visible { outline: none; box-shadow: var(--ring); }

.side-foot {
  padding: var(--sp-4) var(--sp-5);
  border-top: 1px solid var(--line);
  font-size: 11.5px; line-height: 1.7; color: var(--ink-3);
  background: var(--surface);
}

/* 主区 */
#main {
  flex: 1; min-width: 0; overflow: auto;
  padding: 0 var(--workspace-pad) 24px;
  scrollbar-width: thin;
}
#main::-webkit-scrollbar { width: 11px; height: 11px; }
#main::-webkit-scrollbar-thumb { background: var(--line-strong); border: 3px solid var(--bg); border-radius: var(--r-pill); }
#main::-webkit-scrollbar-track { background: transparent; }

h1 {
  font-size: 29px; font-weight: 750; letter-spacing: -.011em;
  margin-bottom: var(--sp-1);
}
h1 + .sub, h1[style*="margin-top"] + .sub { margin-bottom: var(--sp-5); }
h2 {
  font-size: 17px; font-weight: 700;
  color: var(--ink); margin: 0 0 var(--sp-3);
  text-transform: none;
}
.panel > h2:first-child { margin-top: 0; }
.sub { color: var(--ink-3); font-size: 13px; margin-bottom: var(--sp-5); }
.loading {
  color: var(--ink-3); padding: 80px; text-align: center;
  display: flex; align-items: center; justify-content: center; gap: var(--sp-3);
}
.loading::before {
  content: ""; width: 15px; height: 15px; border-radius: 50%;
  border: 2px solid var(--line-strong); border-top-color: var(--brand);
  animation: spin .7s linear infinite;
}
@keyframes spin { to { transform: rotate(1turn); } }

/* 通用色（供 .num/.v/b 直接命中；v1 只定义了 .card .v.x，表格里的状态色是失效的） */
.blue, .info { color: var(--info); }
.green { color: var(--ok); }
.orange { color: var(--warn); }
.red, .danger-txt { color: var(--bad); }

/* ---------- 3. 组件 ---------- */

/* KPI 卡片 */
.cards {
  display: grid; gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 148px), 1fr));
  margin-bottom: var(--sp-5);
}
.card {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: var(--sp-4) var(--sp-5);
  box-shadow: var(--sh-1);
  transition: transform var(--t), box-shadow var(--t), border-color var(--t);
}
.card .k {
  color: var(--ink-3); font-size: 12.5px; font-weight: 500;
  margin-bottom: var(--sp-2); white-space: nowrap;
}
.card .v { font-family: var(--font-num); font-size: 25px; font-weight: 650; letter-spacing: -.02em; line-height: 1.2; }
.card .v.blue { color: var(--brand); }
.card .v.green { color: var(--ok); }
.card .v.orange { color: var(--warn); }
.card .v.red { color: var(--bad); }

/* 面板 */
.panel {
  min-width: 0; background: var(--surface); border: 1px solid var(--panel-line);
  border-radius: var(--r-lg); padding: 14px;
  margin-bottom: 12px; box-shadow: var(--panel-shadow);
}
.panel:has(table) { overflow-x: auto; scrollbar-width: thin; }
.panel img {
  display: block; border-radius: var(--r-sm);
}

/* 行内代码与密钥块（MCP 网关页） */
code {
  font-family: ui-monospace, Consolas, "Cascadia Mono", monospace;
  font-size: 12.5px; color: var(--ink-2);
  background: var(--surface-3); padding: 2px 6px; border-radius: 5px;
}
pre {
  background: var(--inset); border: 1px solid var(--line); border-radius: var(--r-md);
  padding: var(--sp-3) var(--sp-4); margin: var(--sp-3) 0;
  overflow-x: auto; scrollbar-width: thin;
  font-family: ui-monospace, Consolas, "Cascadia Mono", monospace;
  font-size: 13px; line-height: 1.6; color: var(--ink);
}
pre code { background: none; padding: 0; color: inherit; font-size: inherit; }

/* 侧栏退出链接 */
.side-foot a { color: var(--brand); text-decoration: none; font-weight: 500; }
.side-foot a:hover { color: var(--brand-hover); text-decoration: underline; }

/* h1 里混排的状态标签（草稿编辑器） */
h1 .tag { vertical-align: 3px; }

/* 文件选择框（截图报单） */
input[type='file'] { padding: 4px var(--sp-3); font-size: 12.5px; cursor: pointer; }
input[type='file']::file-selector-button {
  margin-right: var(--sp-3); border: 0; border-radius: var(--r-sm);
  padding: 3px 10px; font: inherit; font-size: 12px; font-weight: 550;
  background: var(--brand-soft); color: var(--brand); cursor: pointer;
  transition: background var(--t);
}
input[type='file']::file-selector-button:hover { background: var(--brand-line); }

/* 表格 */
table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
th {
  text-align: left; font-weight: 600; font-size: 12px; letter-spacing: .02em;
  color: var(--ink-3); white-space: nowrap;
  padding: 0 var(--sp-4); height: 38px;
  background: var(--surface-2);
  border-bottom: 1px solid var(--line);
  position: sticky; top: 0; z-index: 2;
}
th:first-child, td:first-child { padding-left: var(--sp-5); }
th:last-child, td:last-child { padding-right: var(--sp-5); }
td {
  padding: 0 var(--sp-4); height: 42px;
  border-bottom: 1px solid var(--line);
  color: var(--ink); vertical-align: middle;
}
tr:hover td { background: var(--brand-soft); }
tr:last-child td { border-bottom: 0; }
.num {
  text-align: right; font-family: var(--font-num);
  font-variant-numeric: tabular-nums; letter-spacing: -.005em;
}
th.num { text-align: right; }
td b, .num b { font-weight: 650; }

/* 徽标 / 状态标签 */
.tag {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 2px var(--sp-2); border-radius: var(--r-pill);
  font-size: 11.5px; font-weight: 600; line-height: 18px;
  background: var(--info-soft); color: var(--info);
  border: 1px solid transparent; white-space: nowrap;
}
.tag.g { background: var(--ok-soft); color: var(--ok); }
.tag.o { background: var(--warn-soft); color: var(--warn); }
.tag.r { background: var(--bad-soft); color: var(--bad); }

/* 按钮 */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  height: var(--ctl-h); min-width: var(--ctl-h); padding: 0 var(--sp-4);
  font: inherit; font-size: 13.5px; font-weight: 550;
  color: var(--ink); background: var(--surface);
  border: 1px solid var(--line-strong); border-radius: var(--r-md);
  box-shadow: var(--sh-1); cursor: pointer; white-space: nowrap;
  transition: background var(--t), border-color var(--t), color var(--t), box-shadow var(--t), transform var(--t);
}
.btn:hover { background: var(--surface-3); border-color: var(--ink-3); }
.btn:active { transform: translateY(1px); box-shadow: none; }
.btn:focus-visible { outline: none; box-shadow: var(--ring); }
.btn[disabled] { opacity: .5; cursor: not-allowed; box-shadow: none; }
.btn.pri {
  background: var(--brand); border-color: var(--brand); color: var(--on-brand);
  box-shadow: 0 1px 2px light-dark(#4f46e540, #0006);
}
.btn.pri:hover { background: var(--brand-hover); border-color: var(--brand-hover); color: var(--on-brand); }
.btn.sm { height: 27px; padding: 0 var(--sp-3); font-size: 12.5px; border-radius: var(--r-sm); box-shadow: none; }
.btn.danger { color: var(--bad); border-color: light-dark(#f0cfc9, #4a2b2a); }
.btn.danger:hover { background: var(--bad-soft); border-color: var(--bad); color: var(--bad); }

/* 表单控件 */
input, select, textarea {
  height: var(--ctl-h); padding: 0 var(--sp-3);
  font: inherit; font-size: 13.5px; color: var(--ink);
  background: var(--surface);
  border: 1px solid var(--line-strong); border-radius: var(--r-md);
  outline: none;
  transition: border-color var(--t), box-shadow var(--t), background var(--t);
}
textarea { height: auto; padding: var(--sp-3); line-height: 1.6; resize: vertical; }
input::placeholder, textarea::placeholder { color: var(--ink-3); opacity: 1; }
input:hover, select:hover, textarea:hover { border-color: var(--ink-3); }
input:focus, select:focus, textarea:focus { border-color: var(--brand); box-shadow: var(--ring); }
input[type='checkbox'], input[type='radio'] {
  height: auto; width: 15px; accent-color: var(--brand); cursor: pointer;
  border-radius: 4px; padding: 0;
}
input[type='date'], input[type='number'] { font-family: var(--font-num); }
input[type='date']::-webkit-calendar-picker-indicator { opacity: .55; cursor: pointer; }
select {
  appearance: none; -webkit-appearance: none;
  padding-right: 28px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%237b8698' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right var(--sp-3) center;
}
label { color: var(--ink-2); font-weight: 500; user-select: none; }
.grid-form label { font-size: 12px; color: var(--ink-3); display: block; margin-bottom: 5px; letter-spacing: .01em; }
.grid-form input, .grid-form select { width: 100%; }

/* 布局工具 */
.row { display: flex; gap: var(--sp-3); align-items: center; flex-wrap: wrap; }
.row > span { display: inline-flex; align-items: center; gap: var(--sp-2); color: var(--ink-2); font-size: 13px; white-space: nowrap; }
.toolbar {
  display: flex; gap: var(--sp-3); align-items: center; flex-wrap: wrap;
  margin-bottom: var(--sp-4); padding-bottom: var(--sp-4);
  border-bottom: 1px solid var(--line);
}
.toolbar:empty { display: none; }
.toolbar input, .toolbar select { min-width: 168px; }
.toolbar input[id$='-q'], .toolbar input[placeholder*='单号'], .toolbar input[placeholder*='条码'] { min-width: 240px; }
.grid2 { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: var(--sp-4); align-items: start; }
.grid-form { display: grid; grid-template-columns: repeat(auto-fill, minmax(224px, 1fr)); gap: var(--sp-3) var(--sp-4); }

/* 开单 */
#sell-lines { min-height: 108px; }
#sell-lines table td { padding-left: var(--sp-2); padding-right: var(--sp-2); height: 40px; }
#sell-lines table th { padding-left: var(--sp-2); padding-right: var(--sp-2); }
#sell-lines td:first-child, #sell-lines th:first-child { padding-left: var(--sp-4); color: var(--ink-3); }
#sell-lines input {
  width: 100%; min-width: 58px; height: 30px; padding: 0 var(--sp-2);
  text-align: right; font-family: var(--font-num); font-size: 13.5px;
  border-color: transparent; background: transparent; box-shadow: none;
}
#sell-lines input:hover { background: var(--inset); border-color: var(--line); }
#sell-lines input:focus { background: var(--surface); border-color: var(--brand); box-shadow: var(--ring); }
#sell-lines tr:hover td { background: transparent; }
#sell-lines tr:hover input { background: var(--inset); }

/* 草稿核验编辑器：行内输入与开单页同一套"读起来是表格，改起来是输入框"的语义 */
#de-lines input {
  height: 30px; padding: 0 var(--sp-2);
  text-align: right; font-family: var(--font-num); font-size: 13.5px;
  border-color: transparent; background: transparent; box-shadow: none;
}
#de-lines input:hover { background: var(--inset); border-color: var(--line); }
#de-lines input:focus { background: var(--surface); border-color: var(--brand); box-shadow: var(--ring); }
#de-lines tr:hover input { background: var(--inset); }
#de-lines td:first-child, #de-lines th:first-child { padding-left: var(--sp-4); }
#de-lines table th { padding-left: var(--sp-2); padding-right: var(--sp-2); }

/* 词典价带页：左右两栏等宽（select/input 布局复用 .grid2，仅此页展开） */
.grid2:has(#al-list) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#bc-input {
  font-size: 15px; width: 320px; height: 40px; padding: 0 var(--sp-4);
  font-family: var(--font-num); letter-spacing: .01em;
  border-width: 1.5px; border-color: var(--brand-line);
  background: var(--brand-soft);
}
#bc-input::placeholder { color: var(--ink-3); }
#bc-input:focus { background: var(--surface); border-color: var(--brand); box-shadow: var(--ring); }
#sell-tots {
  margin-top: var(--sp-3); padding: var(--sp-3) var(--sp-4);
  background: var(--inset); border: 1px solid var(--line); border-radius: var(--r-md);
}
.tot-line { display: flex; justify-content: space-between; align-items: baseline; padding: 3px 0; font-size: 13.5px; color: var(--ink-2); }
.tot-line b { font-family: var(--font-num); font-weight: 600; color: var(--ink); }
.tot-line.big {
  font-size: 14px; padding: var(--sp-2) 0 0; margin-top: var(--sp-2);
  border-top: 1px dashed var(--line-strong);
}
.tot-line.big b { font-size: 21px; letter-spacing: -.02em; color: var(--brand); }
.tot-line.big b.green { color: var(--ok); }

/* AI 助手 */
#ai-box { max-width: 900px; }
.msg { margin: 0 0 var(--sp-4); display: flex; gap: var(--sp-3); animation: rise var(--t); }
@keyframes rise { from { opacity: 0; transform: translateY(6px); } }
.msg .who {
  width: 30px; height: 30px; border-radius: var(--r-pill); flex-shrink: 0;
  background: var(--brand-soft); color: var(--brand);
  border: 1px solid var(--brand-line);
  display: grid; place-items: center; font-size: 14px;
}
.msg.me .who { background: var(--ok-soft); color: var(--ok); border-color: transparent; }
.msg .bubble {
  background: var(--surface-2); border: 1px solid var(--line);
  border-radius: var(--r-lg) var(--r-lg) var(--r-lg) var(--sp-1);
  padding: var(--sp-3) var(--sp-4); white-space: pre-wrap; line-height: 1.65;
  max-width: 66ch;
}
.msg.me .bubble {
  background: var(--brand); color: var(--on-brand); border-color: transparent;
  border-radius: var(--r-lg) var(--r-lg) var(--sp-1) var(--r-lg);
}
.msg .engine { font-size: 11px; color: var(--ink-3); margin-top: 5px; font-family: var(--font-num); }

/* Toast：右上堆叠，语义色 */
#toast {
  position: fixed; top: var(--sp-5); right: var(--sp-5); z-index: 99;
  display: flex; flex-direction: column; gap: var(--sp-2); align-items: flex-end;
  pointer-events: none;
}
#toast div {
  background: var(--surface);
  color: var(--ink);
  border: 1px solid var(--line); border-left: 3px solid var(--brand);
  border-radius: var(--r-md); padding: var(--sp-3) var(--sp-4);
  font-size: 13.5px; box-shadow: var(--sh-3);
  animation: slide .22s var(--t);
  max-width: 380px;
}
#toast .error { border-left-color: var(--bad); }
@keyframes slide { from { opacity: 0; transform: translateX(16px); } }

/* 柱状图 */
.bar { display: flex; align-items: flex-end; gap: var(--sp-2); height: 132px; padding: 0 var(--sp-1); }
.bar div {
  flex: 1; min-height: 3px; position: relative;
  background: linear-gradient(180deg, var(--brand) 0%, light-dark(#8ea2f8, #4a4f8f) 100%);
  border-radius: var(--sp-1) var(--sp-1) 0 0;
  transition: filter var(--t), transform var(--t);
}
.bar div:hover { filter: brightness(1.08); transform: scaleY(1.01); transform-origin: bottom; }
.bar div span {
  position: absolute; bottom: -22px; left: 50%; transform: translateX(-50%);
  font-size: 10.5px; color: var(--ink-3); white-space: nowrap; font-family: var(--font-num);
}
.chart-wrap { padding-bottom: 26px; }

/* 响应式 */
@media (max-width: 1200px) {
  .grid2 { grid-template-columns: 1fr; }
  .grid2:has(#al-list) { grid-template-columns: 1fr; }
}
@media (max-width: 1024px) {
  :root { --side-w: 64px; }
  .logo-text, #nav a span, .side-foot { display: none; }
  .logo { justify-content: center; padding: var(--sp-4) 0; }
  #nav a { justify-content: center; padding: 0; }
  #main { padding-inline: 16px; }
}
@media (max-width: 720px) {
  #app { flex-direction: column-reverse; height: auto; min-height: 100dvh; }
  #side { width: 100%; flex-direction: row; align-items: center; border-right: 0; border-top: 1px solid var(--line); position: sticky; bottom: 0; z-index: 20; }
  .logo { display: none; }
  #nav { flex-direction: row; overflow-x: auto; padding: var(--sp-2); gap: var(--sp-1); width: 100%; }
  #nav a { flex: 1 0 auto; min-width: 56px; flex-direction: column; gap: 3px; height: 52px; padding: var(--sp-2) 6px; }
  #nav a span { display: inline; font-size: 11px; line-height: 1.2; }
  #main { padding: 0 12px 16px; overflow: visible; }
  .cards { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
  #bc-input, .toolbar input, .toolbar select { min-width: 0; width: 100%; }
  #toast { left: var(--sp-4); right: var(--sp-4); top: auto; bottom: 76px; align-items: stretch; }
  #toast div { max-width: none; }
}

/* 无障碍 */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .card:hover, .bar div:hover { transform: none; }
}

/* ---------- 打印（76mm 小票保持独立样式；页面打印只隐藏侧栏/Toast/操作件） ---------- */
#receipt { display: none; }
@media print {
  #side, #toast, .topbar, dialog { display: none !important; }
  #app, .workspace { display: block; height: auto; }
  body { background: #fff; color: #000; }
  #main { max-width: none; padding: 0; overflow: visible; }
  .panel { box-shadow: none; break-inside: avoid; }
  th { position: static; }
  .btn, .toolbar, .loading { display: none !important; }
  a { color: #000; text-decoration: none; }
  /* 76mm 小票块：保留原视觉规范（独立打印窗口自带同款内联样式，此处为页面内兜底） */
  #receipt, #receipt * { visibility: visible; }
  #receipt { position: absolute; left: 0; top: 0; width: 76mm; padding: 4mm;
             font-size: 12px; font-family: "SimSun", monospace; color: #000; background: #fff; }
  #receipt table { width: 100%; font-size: 11px; }
  #receipt th { position: static; background: none; }
  #receipt h3 { text-align: center; font-size: 15px; }
}

/* ---------- MCP 网关：凭证（API Key + scope） ---------- */
.tag.dot::before { content: '●'; font-size: 7px; line-height: 1; }
.mk-issue {
  display: flex; gap: var(--sp-3); align-items: flex-end; flex-wrap: wrap;
  margin-top: var(--sp-4); padding-top: var(--sp-4); border-top: 1px dashed var(--line);
}
.mk-issue > div { display: flex; flex-direction: column; }
.mk-issue label { font-size: 12px; color: var(--ink-3); margin-bottom: 5px; }
.mk-issue input, .mk-issue select { width: 100%; }
.mk-issue > div { flex: 1 1 140px; min-width: 0; }
.mk-cfg {
  padding: var(--sp-4);
  background: var(--inset); border: 1px solid var(--line); border-radius: var(--r-md);
}
.mk-cfg-cap { font-size: 12.5px; color: var(--ink-2); margin-bottom: var(--sp-3); }
.mk-cfg-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-3); margin-bottom: var(--sp-3); }
.mk-cfg-row > div:last-child { grid-column: 1 / -1; }
.mk-cfg-row label { font-size: 12px; color: var(--ink-3); margin-bottom: 5px; }
.mk-cfg-row input, .mk-cfg-row select { width: 100%; }
.mk-cfg-json { margin: 0; min-height: 176px; }

/* 云桥工作台 */
:root {
  --side-gradient: linear-gradient(158deg, light-dark(#f7f8fd, #1d2235), light-dark(#eff1fc, #191d2b));
  --panel-line: light-dark(#fff, #30374b);
  --panel-shadow: 0 4px 12px light-dark(#435ab010, #0004);
  --primary-gradient: linear-gradient(110deg, #4a68f3, #2937d6 85%);
  --hero-base: light-dark(#edf0fc, #202744);
}

[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.workspace { display: flex; flex-direction: column; flex: 1; min-width: 0; min-height: 0; }
#side { position: relative; isolation: isolate; }
#side::after {
  content: ''; position: absolute; z-index: -1; pointer-events: none; bottom: -82px; left: -20%;
  width: 150%; height: 210px; border-radius: 50% 55% 0 0; transform: rotate(-24deg);
  background: linear-gradient(140deg, #596ef426, #879bf20a);
  box-shadow: 0 -30px 0 #657ff00b;
}
.logo { padding: 22px 18px 28px; gap: 10px; }
.logo-text b { font-size: clamp(18px, 1.43vw, 24px); font-weight: 800; white-space: nowrap; }
.logo-text small { margin-top: 4px; font-size: 11px; letter-spacing: 0; }
.logo-mark {
  width: 38px; height: 26px; position: relative; isolation: isolate; margin-top: 6px;
  background: linear-gradient(110deg, #3439e8, #35a9ff); border-radius: 18px; box-shadow: none;
}
.logo-mark::before {
  content: ''; position: absolute; width: 22px; height: 22px; top: -8px; left: 10px;
  border-radius: 50%; background: linear-gradient(125deg, #4247ff, #429aff);
}
.logo-mark::after {
  content: ''; position: absolute; bottom: -1px; left: 5px; width: 21px; height: 9px;
  border-radius: 90% 80% 0 0; border-top: 4px solid #fff; transform: rotate(-26deg);
}
#nav { gap: 3px; padding-inline: 11px; }
#nav a { flex-shrink: 0; text-decoration: none; color: var(--ink); height: clamp(38px, 2.7vw, 46px); font-size: 15px; font-weight: 650; padding-inline: 15px; }
#nav a svg { width: 21px; height: 21px; }
#nav a.on, .btn.pri { background: var(--primary-gradient); color: white; border-color: transparent; }
#nav a.on { box-shadow: 0 3px 8px #3345d72b; }
.nav-mark { margin-left: auto; padding: 1px 8px; border-radius: var(--r-pill); background: var(--brand-soft); color: var(--brand); font-size: 11px; }
#nav a.on .nav-mark { background: #ffffff32; color: white; }
.side-foot { background: transparent; }
.local-dot { display: inline-block; background: var(--ok); width: 6px; height: 6px; border-radius: 50%; }

.topbar {
  flex: 0 0 clamp(54px, 3.85vw, 65px); display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 0 var(--workspace-pad); background: var(--surface); border-bottom: 1px solid var(--line); z-index: 5;
}
.top-search {
  display: flex; align-items: center; gap: 11px; width: min(60%, 680px); min-width: 0; padding: 7px 12px;
  color: var(--ink-2); background: var(--surface-3); border: 1px solid transparent;
  border-radius: var(--r-pill); cursor: pointer; font: inherit; text-align: left;
}
.top-search:hover { border-color: var(--line-strong); }
.top-search span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; }
.top-search svg { width: 19px; flex: 0 0 19px; }
kbd { font: 650 11px var(--font-ui); color: var(--brand); background: var(--brand-soft); border-radius: 5px; padding: 4px 7px; white-space: nowrap; }
.top-search kbd { background: var(--surface); color: var(--ink-2); }
.top-actions { display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.top-actions > .btn { border-radius: 11px; }
.top-ai { color: var(--brand); gap: 5px; }
.top-ai svg { width: 17px; height: 17px; }
.profile { position: relative; }
.profile summary { display: flex; align-items: center; gap: 7px; cursor: pointer; list-style: none; }
.profile summary::after { content: '⌄'; color: var(--ink-2); }
.avatar { display: grid; place-items: center; border-radius: 50%; width: 32px; height: 32px; color: #2637b0; background: linear-gradient(140deg, #b9e1ff, #dcdeff); font-weight: 750; }
.profile-menu { position: absolute; top: calc(100% + 10px); right: 0; min-width: 140px; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); box-shadow: var(--sh-2); }
.profile-menu .sub { margin-bottom: 8px; }

#search-dialog {
  position: fixed; margin: min(14vh, 100px) auto auto; width: min(540px, calc(100vw - 28px));
  max-height: 75dvh; padding: 16px; border: 1px solid var(--line); border-radius: var(--r-lg);
  background: var(--surface); color: var(--ink); box-shadow: var(--sh-3);
}
#search-dialog::backdrop { background: #10183d66; }
#global-query { width: 100%; margin-bottom: 10px; }
.search-result { display: flex; align-items: center; gap: 9px; width: 100%; padding: 6px; border: 0; border-radius: 7px; background: transparent; color: var(--ink); font: inherit; cursor: pointer; text-align: left; }
.search-result:hover, .search-result:focus-visible { background: var(--brand-soft); }
.search-result small { margin-left: auto; color: var(--ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.signed-out #side { display: none; }
.signed-out #main { display: grid; place-items: center; background: var(--hero-base); padding: 24px; }
.login-card { width: min(100%, 420px); padding: 26px; margin: 0; }
.login-card .logo-mark { margin: 8px 0 14px; }
.login-card .sub:last-child { margin: 12px 0 0; }

.page-hero {
  position: relative; min-height: 94px; margin: 0 0 10px; padding: 19px 0 8px;
  display: flex; align-items: flex-start; gap: 14px;
}
.detail-back { margin-top: 14px; }
.page-hero h1 { font-size: clamp(25px, 2.2vw, 37px); line-height: 1.18; font-weight: 800; }
.page-hero p { color: var(--ink-2); font-size: clamp(13px, .93vw, 16px); font-weight: 500; }
.hero-logistics {
  isolation: isolate; overflow: hidden; min-height: clamp(94px, 7vw, 118px); margin: 0 calc(-1 * var(--workspace-pad));
  padding: clamp(16px, 1.6vw, 26px) var(--workspace-pad) 12px;
  background: radial-gradient(ellipse at 74% 0%, light-dark(#dce5ff, #253252), transparent 78%);
}
.hero-logistics::before {
  content: ''; position: absolute; z-index: -1; inset: 0 0 0 auto; width: min(65%, 1040px);
  background: url('./logistics-banner.png') 68% 47% / cover no-repeat;
  transform: scaleX(-1);
  mask-image: linear-gradient(to left, transparent, #000 28%);
}
.hero-logistics p { width: min(100%, 61ch); }
.hero-assist {
  margin-inline: calc(-1 * var(--workspace-pad)); padding-inline: var(--workspace-pad);
  background-image: radial-gradient(ellipse at 92% 0%, #8281ff2b, transparent 66%);
}
.hero-settings {
  min-height: clamp(122px, 10.5vw, 176px); margin: 16px 0; padding: 14px 16px;
  border-radius: var(--r-lg); overflow: hidden; isolation: isolate;
  background: linear-gradient(108deg, var(--surface) 7%, var(--brand-soft) 86%);
}
.hero-settings::after {
  content: ''; position: absolute; inset: 0 3% 0 auto; z-index: -1; width: min(34%, 340px);
  background: url('./settings-illustration.png') center / contain no-repeat;
}
.hero-icon {
  display: grid; place-items: center; width: 56px; height: 56px; flex: 0 0 56px; border-radius: 15px;
  background: linear-gradient(145deg, var(--surface), var(--brand-soft)); color: var(--brand);
}
.hero-icon svg { width: 31px; height: 31px; }
:root[data-theme='dark'] .hero-logistics::before { opacity: .33; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) .hero-logistics::before { opacity: .33; }
}
.metric {
  --tile-fg: var(--brand); --tile-bg: var(--brand-soft); min-width: 0;
  padding: 14px 16px; border-color: var(--panel-line); box-shadow: var(--panel-shadow);
  background: linear-gradient(135deg, var(--surface) 40%, color-mix(in srgb, var(--tile-bg), var(--surface) 35%));
}
.icon-tile {
  width: 30px; height: 30px; flex: 0 0 30px; display: inline-grid; place-items: center;
  border-radius: 9px; color: var(--tile-fg, var(--brand)); background: var(--tile-bg, var(--brand-soft));
}
.icon-tile svg, .section-head svg { width: 17px; height: 17px; }
.warm { --tile-fg: var(--warn); --tile-bg: var(--warn-soft); }
.green-tone { --tile-fg: var(--ok); --tile-bg: var(--ok-soft); }
.violet { --tile-fg: light-dark(#6345d5, #b9a7ff); --tile-bg: light-dark(#f0ebff, #2f2648); }
.metric .k { display: flex; align-items: center; gap: 7px; white-space: normal; color: var(--ink); font-weight: 650; }
.metric .v { font-size: clamp(19px, 1.6vw, 27px); font-weight: 780; overflow-wrap: anywhere; }
.metric-note, .cell-note, .chart-caption { color: var(--ink-3); font-size: 12px; }
.metric-note { margin-top: 6px; }
.cell-note { display: block; }
.section-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; flex-wrap: wrap; }
.section-head h2 { margin: 0; display: flex; align-items: center; gap: 7px; }
.section-head h2 svg { color: var(--brand); flex-shrink: 0; }
.text-btn { padding: 3px 0; border: 0; background: transparent; color: var(--brand); font: inherit; font-weight: 650; cursor: pointer; text-align: left; }
.text-btn:hover { text-decoration: underline; }
.directory-toolbar { align-items: center; justify-content: space-between; }
.table-scroll tr:has(button[aria-current="true"]) td { background: var(--brand-soft); }
.table-scroll button[aria-current="true"] { text-decoration: underline; }
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr); gap: 12px; align-items: stretch; }
.dashboard-grid > .panel { margin: 0; }
.dashboard-recent { grid-column: span 2; }
#dash-recent { max-height: 246px; overflow: auto; }
.table-scroll { overflow-x: auto; scrollbar-width: thin; }
.table-scroll table { min-width: max-content; }
th { color: var(--ink-2); height: 34px; }
td { height: 39px; }
td:first-child, th:first-child { padding-left: 12px; }
td:last-child, th:last-child { padding-right: 12px; }
td.red, td .red { color: var(--bad); }
td.green, td .green { color: var(--ok); }
td.orange { color: var(--warn); }
.empty-state { text-align: center; padding: 28px 12px; color: var(--ink-3); }
.segmented { display: inline-flex; border-radius: 9px; padding: 2px; background: var(--surface-3); gap: 2px; }
.segmented button { background: transparent; color: var(--ink-2); border: 0; border-radius: 7px; padding: 4px 10px; font: inherit; font-size: 12px; cursor: pointer; white-space: nowrap; }
.segmented button[aria-pressed="true"] { color: white; background: var(--primary-gradient); }
.trend { display: flex; align-items: stretch; gap: 7px; }
.trend-body { flex: 1; min-width: 0; }
.trend svg { width: 100%; height: 160px; display: block; overflow: visible; }
.chart-grid { stroke: var(--line); }
.chart-line { fill: none; stroke: var(--brand); stroke-width: 2.4; vector-effect: non-scaling-stroke; }
.trend circle { fill: var(--surface); stroke: var(--brand); vector-effect: non-scaling-stroke; }
.trend circle:hover { fill: var(--brand); r: 5px; }
.axis-y, .axis-x { display: flex; color: var(--ink-3); font-size: 10.5px; }
.axis-y { flex-direction: column; justify-content: space-between; text-align: right; padding: 14px 0 22px; }
.axis-x { justify-content: space-between; }
.share-chart { display: flex; align-items: center; gap: 12px; margin-top: 12px; }
.donut { flex: 0 0 clamp(90px, 9vw, 140px); aspect-ratio: 1; border-radius: 50%; background: conic-gradient(var(--segments)); display: grid; place-items: center; }
.donut > div { width: 74%; aspect-ratio: 1; border-radius: 50%; display: grid; align-content: center; text-align: center; background: var(--surface); font-size: clamp(11px, .96vw, 14px); overflow-wrap: anywhere; }
.donut small { color: var(--ink-3); }
.share-chart ul { flex: 1; list-style: none; min-width: 0; font-size: 12px; }
.share-chart li { display: flex; gap: 5px; align-items: center; margin: 6px 0; }
.share-chart li i { width: 7px; height: 7px; border-radius: 50%; background: var(--dot); flex-shrink: 0; }
.share-chart li span { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.info-line, .task-link { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.task-link { width: 100%; border: 0; border-bottom: 1px solid var(--line); background: transparent; color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.task-link:hover { background: var(--surface-2); }
.task-link > :nth-child(2) { flex: 1; min-width: 0; }
.task-link small { display: block; color: var(--ink-3); font-size: 11px; }
.task-link .tag { white-space: nowrap; }
.ai-intro {
  display: flex; align-items: center; gap: 12px; padding: 10px 12px;
  background: linear-gradient(110deg, var(--brand-soft), light-dark(#dadffb, #2e3154));
  border-radius: var(--r-md);
}
.ai-intro h2 { margin-bottom: 2px; }
.ai-intro p { font-size: 12px; color: var(--ink-2); }
.ai-intro .text-btn { margin-left: auto; flex-shrink: 0; }
.bot-art {
  display: block; width: 70px; height: 58px; flex: 0 0 70px;
  background: url('./assistant-mascot.png') center / contain no-repeat;
}
.work-grid, .review-grid, .evidence-grid {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(255px, .34fr); gap: 12px; align-items: start;
}
.work-grid > *, .review-grid > * { min-width: 0; }
.sell-meta { grid-template-columns: minmax(0, 1.3fr) minmax(0, .8fr) minmax(0, 1fr); margin-bottom: 12px; }
.sell-meta label, .amount-field { font-weight: 650; color: var(--ink-2); }
.scan-row { display: flex; align-items: center; position: relative; margin-bottom: 12px; }
#bc-input { flex: 1; width: 100%; padding-right: 48px; }
.scan-row kbd { position: absolute; right: 10px; }
.list-foot { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 10px; }
.list-foot > span:first-child { margin-right: auto; color: var(--ink-3); }
#sell-tots { background: transparent; padding: 0; }
.tot-line.big { border-top: 0; padding: 10px; border-radius: 9px; background: var(--brand-soft); }
.amount-field { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 10px 0; }
.amount-field input { width: 90px; text-align: right; }
.amount-field select { max-width: 58%; }
.summary-actions { display: grid; gap: 8px; margin-top: 14px; }
.summary-actions .btn { height: auto; min-height: 38px; justify-content: center; }
.summary-actions .pri kbd { color: white; background: #ffffff26; }
.shortcuts { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 18px; }
.evidence-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 175px), 1fr)); }
.evidence-text { padding: 12px; border-radius: 8px; background: var(--surface-2); white-space: pre-wrap; overflow-wrap: anywhere; }
.evidence-images { display: flex; gap: 8px; overflow-x: auto; }
.evidence-images img { max-height: 155px; max-width: 200px; object-fit: contain; }
.review-result { padding: 12px; margin: 8px 0; border-radius: 9px; background: var(--tile-bg, var(--brand-soft)); color: var(--tile-fg, var(--brand)); }
.review-result b { font-size: 17px; }
.review-result p { margin-top: 2px; color: var(--ink-2); font-size: 12px; }
.check-list { display: grid; gap: 5px; color: var(--ink-2); }
.warning-row td { background: var(--warn-soft); }
.detail-work { grid-template-columns: minmax(0, 1fr) minmax(285px, .48fr); }
.panel h3 { font-size: 14px; margin: 8px 0; }
.msg.me { flex-direction: row-reverse; }
.msg > :last-child { min-width: 0; }
.msg .bubble { overflow-wrap: anywhere; }
.settings-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
.settings-tile { display: flex; align-items: center; text-align: left; gap: 12px; margin: 0; color: var(--ink); font: inherit; cursor: pointer; }
.settings-tile:hover { background: var(--brand-soft); }
.settings-tile small { display: block; color: var(--ink-3); }
.settings-tile .icon-tile { width: 39px; height: 39px; flex-basis: 39px; }
.settings-tile > span:nth-child(2) { flex: 1; }
.settings-overview { grid-template-columns: minmax(0, 1.7fr) minmax(220px, 1fr); align-items: stretch; }
.settings-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 108px), 1fr)); gap: 8px; }
.settings-stats > div { display: grid; gap: 4px; padding: 10px; background: var(--surface-2); border-radius: var(--r-md); }
.settings-stats span { color: var(--ink-2); font-size: 12px; }
.settings-stats b { font-size: 17px; }
.settings-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.mcp-grid { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: stretch; }
.mcp-activity { grid-template-columns: minmax(205px, .44fr) minmax(0, 1fr); align-items: stretch; }
.mcp-grid pre { overflow-x: auto; }
.connection-help { padding: 12px; background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r-md); }
.connection-help p, .mcp-activity .cell-note { color: var(--ink-2); margin: 6px 0; }
.head-actions, .product-cell, .assistant-heading, .ai-shortcuts { display: flex; align-items: center; gap: 8px; }
.head-actions, .ai-shortcuts { flex-wrap: wrap; }
.head-actions .text-btn { white-space: nowrap; }
.soft-btn { background: var(--brand-soft); border-color: var(--line); color: var(--brand); box-shadow: none; }
.soft-btn svg, .settings-stats svg, .scan-field svg, .sell-meta svg,
.ai-compose > svg, .ai-result h3 svg { width: 17px; height: 17px; flex: 0 0 17px; color: var(--brand); }
.product-cell .icon-tile { background: var(--surface-3); }
.ai-overview-lines .info-line { justify-content: flex-start; padding-block: 6px; }
.ai-overview-lines .info-line b { margin-left: auto; }

/* 开单与报表 */
.sell-work { grid-template-columns: minmax(0, 1fr) minmax(245px, .33fr); align-items: stretch; }
.sell-work > div { display: flex; flex-direction: column; }
.sell-meta { grid-template-columns: minmax(0, 1.45fr) repeat(3, minmax(0, 1fr)); }
.sell-meta label { display: flex; align-items: center; gap: 6px; }
.sell-meta > div + div { border-left: 1px solid var(--line); padding-left: 10px; }
.scan-row { gap: 8px; flex-wrap: wrap; }
.scan-field { position: relative; display: flex; align-items: center; flex: 1 1 290px; min-width: 0; }
.scan-field svg { position: absolute; left: 11px; pointer-events: none; }
.scan-field #bc-input { padding-left: 36px; }
.scan-row .btn { min-height: 38px; }
#sell-lines input[data-f] { width: 62px; text-align: center; border-color: var(--line-strong); background: var(--surface); }
#sell-lines td { height: 46px; }
.sell-summary .section-head { background: var(--surface-2); border-radius: var(--r-md); padding: 10px; }
.sell-summary .tot-line, .sell-summary .amount-field { padding-inline: 9px; }
.sell-summary #sell-owe { margin-top: 16px; }
.sell-summary .summary-actions .btn { min-height: 41px; }
.sell-assist { padding: 8px; gap: 10px; }
.assistant-heading { flex: 1 1 210px; }
.sell-assist .capability-grid { flex: 2 1 350px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.stock-work { grid-template-columns: minmax(0, 2.65fr) minmax(285px, 1fr); }
.stock-toolbar { padding: 9px; margin-bottom: 10px; }
.stock-toolbar svg { width: 16px; height: 16px; color: var(--brand); }
.stock-toolbar label { display: flex; align-items: center; gap: 6px; }
.stock-toolbar input[type="checkbox"] { width: auto; min-width: 0; }
#st-metrics .metric { padding: 10px; }
.stock-balance { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 12px; margin-top: 8px; }
.stock-balance .review-result { margin: 0; }
.stock-chart { border: 1px solid var(--line); border-radius: var(--r-md); padding: 8px; margin-top: 10px; }
.stock-chart .trend svg { height: 108px; }
.stock-ledger { max-height: 220px; overflow: auto; }

/* 系统设置、MCP 与 AI */
body:has(#main[data-view="users"]) #nav a.on, body:has(#main[data-view="kb"]) #nav a.on {
  background: var(--brand-soft); color: var(--brand); box-shadow: inset 3px 0 var(--brand);
}
.settings-grid { gap: 16px; margin-bottom: 28px; }
.settings-tile { min-height: clamp(80px, 6.5vw, 108px); padding: 14px 20px; gap: 16px; }
.settings-tile b { font-size: clamp(16px, 1.24vw, 21px); }
.settings-tile small { font-size: clamp(12px, .88vw, 15px); }
.settings-tile .icon-tile { width: 52px; height: 52px; flex-basis: 52px; border-radius: 13px; }
.settings-tile .icon-tile svg { width: 27px; height: 27px; }
.settings-overview > .panel { padding: 20px; min-height: 176px; }
.settings-overview .settings-stats > div { background: transparent; border-right: 1px solid var(--line); border-radius: 0; }
.settings-overview .settings-stats > div:last-child { border: 0; }
.settings-overview .settings-stats > div > span { display: flex; align-items: center; gap: 6px; }
#settings-connection .green { color: var(--ok); font-size: inherit; }
.settings-actions .btn { min-height: 43px; white-space: normal; justify-content: center; }
.mcp-status { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1fr); align-items: stretch; gap: 10px;
  background: linear-gradient(120deg, var(--brand-soft), var(--surface) 60%); }
.mcp-status-intro { display: flex; align-items: center; gap: 10px; min-width: 0; }
.mcp-status-intro img { width: min(47%, 235px); height: 98px; object-fit: contain; align-self: center; }
.mcp-status-intro h2 { margin-bottom: 4px; }
.mcp-status-intro p { color: var(--ink-2); }
.mcp-status .cards { margin: 0; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.mcp-status .metric { box-shadow: none; padding: 8px 10px; }
.mcp-status .metric .k { font-size: 12px; }
.mcp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mcp-activity { grid-template-columns: minmax(0, .75fr) minmax(0, 1.35fr) minmax(0, .75fr); }
.connection-help { min-width: 0; }
.connection-help pre { min-height: 0; max-height: 200px; line-height: 1.5; background: var(--surface); }
#mk-list .product-cell { gap: 5px; }
#mk-list .icon-tile { width: 23px; height: 23px; flex-basis: 23px; }
#mk-list :is(td, th) { padding-inline: 5px; }
#mk-list .tag { padding-inline: 5px; }
.permission-line { display: flex; gap: 9px; align-items: center; background: var(--tile-bg, var(--surface-3));
  border-radius: var(--r-md); padding: 9px; margin-bottom: 8px; }
.permission-line > div { flex: 1; }
.permission-line p { color: var(--ink-2); font-size: 12px; }
.mcp-alert { background: var(--warn-soft); color: var(--ink); padding: 10px; border-radius: var(--r-md);
  margin-bottom: 8px; overflow-wrap: anywhere; }
.mcp-alert b, .mcp-alert small { color: var(--warn); }
.mcp-alert p { margin-block: 3px; }
.ai-chat .msg.me .bubble { background: var(--brand-soft); color: var(--ink); border-color: var(--brand-line); }
.ai-chat .msg:not(.me) > :last-child { flex: 1; }
.ai-chat .msg .bubble { width: fit-content; }
.ai-chat .msg.me .bubble { margin-left: auto; }
.capability-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.capability-grid .task-link { background: var(--tile-bg, var(--surface-3)); padding: 7px 8px; border: 1px solid transparent; border-radius: var(--r-md); }
.capability-grid .task-link:hover { border-color: var(--brand-line); }
.capability-grid .tag:empty { display: none; }
#ai-recent { list-style: none; }
#ai-recent li { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 5px 0; border-bottom: 1px solid var(--line); }
#ai-recent li:last-child { border-bottom: 0; }
#ai-recent li > :first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#ai-recent li .tag { flex-shrink: 0; }
.ai-result { border: 1px solid var(--line); background: var(--surface); padding: 9px 10px; border-radius: var(--r-md); margin-top: 5px; }
.ai-result h3 { display: flex; align-items: center; gap: 6px; margin: 0; }
.ai-result .settings-stats > div { padding-block: 7px; }
/* 草稿核验中心 */
.hero-draft {
  min-height: 112px; isolation: isolate; overflow: hidden; margin: 0 calc(-1 * var(--workspace-pad));
  padding: 18px var(--workspace-pad) 12px; background: linear-gradient(110deg, var(--bg), var(--hero-base));
}
.hero-draft::after {
  content: ''; position: absolute; inset: 0 0 0 auto; z-index: -1; width: min(58%, 770px);
  background: url('./draft-review-banner.png') center 51% / 100% auto no-repeat;
  mask-image: linear-gradient(90deg, transparent, #000 29%);
}
.hero-draft h1 { font-size: clamp(25px, 2vw, 34px); }
.hero-draft p { font-weight: 650; }
.draft-overview { display: grid; grid-template-columns: minmax(0, 1.75fr) minmax(240px, 1fr); gap: 18px; margin-bottom: 19px; }
.draft-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }
.draft-overview .panel { margin: 0; }
.draft-metric {
  min-height: 76px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px;
  padding: 9px 15px; text-align: left; color: var(--ink); font: inherit; cursor: pointer;
  background: linear-gradient(125deg, var(--surface), var(--surface-2));
}
.draft-metric:hover, .draft-metric[aria-pressed="true"] { border-color: var(--brand-line); }
.draft-metric .icon-tile, .draft-item > .icon-tile { border-radius: 50%; }
.draft-metric .icon-tile { width: 46px; height: 46px; }
.draft-metric .icon-tile svg { width: 26px; height: 26px; }
.draft-metric strong { display: block; font-size: 23px; line-height: 1.2; }
.draft-metric small { font-size: 13px; }
.draft-metric > :last-child { color: var(--ink-2); font-size: 21px; }
.draft-danger { --tile-fg: var(--bad); --tile-bg: var(--bad-soft); }
.draft-engine { padding: 5px 15px; background: linear-gradient(110deg, var(--surface-3), var(--brand-line)); }
.draft-engine .bot-art { width: 80px; height: 61px; flex-basis: 80px; }
.draft-engine h2 { color: var(--brand); }
.draft-engine p { font-size: 13px; }
.draft-work { grid-template-columns: minmax(235px, .29fr) minmax(0, 1fr); gap: 14px; align-items: stretch; }
.draft-inbox { margin: 0; padding: 0 5px 8px; }
.draft-inbox-heading, .draft-section-heading { margin: 0; min-height: 49px; padding: 8px 10px; border-bottom: 1px solid var(--line); }
.draft-inbox-heading h2 small, .draft-section-heading h2 small, .draft-review-panel small { color: var(--ink-2); font-size: 12px; font-weight: 600; }
.draft-inbox-menu { position: relative; }
.draft-inbox-menu[open] { z-index: 5; }
.draft-inbox-menu summary { list-style: none; cursor: pointer; }
.draft-inbox-menu > div {
  position: absolute; z-index: 2; top: calc(100% + 4px); right: 0; display: grid; gap: 5px; min-width: 110px;
  padding: 7px; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface); box-shadow: var(--sh-2);
}
.draft-filters { display: flex; gap: 4px; flex-wrap: wrap; padding: 7px 7px 15px; }
.draft-filters button {
  padding: 4px 7px; border: 1px solid var(--line); border-radius: 10px; color: var(--ink);
  background: var(--surface-2); font: inherit; font-size: 12px; font-weight: 650; white-space: nowrap; cursor: pointer;
}
.draft-filters button[aria-pressed="true"] { color: white; border-color: transparent; background: var(--primary-gradient); }
#df-list { overflow: auto; max-height: max(270px, calc(100dvh - 352px)); scrollbar-width: thin; }
.draft-item {
  display: flex; align-items: center; gap: 8px; min-height: 64px; width: 100%; padding: 8px 9px;
  border: 1px solid transparent; border-bottom-color: var(--line); border-radius: 9px;
  background: transparent; color: var(--ink); text-align: left; font: inherit;
}
button.draft-item { cursor: pointer; }
button.draft-item:hover { background: var(--surface-2); }
.draft-item[aria-pressed="true"] { border-color: var(--brand); background: var(--brand-soft); }
.draft-item > .icon-tile { width: 39px; height: 39px; flex-basis: 39px; }
.draft-item-copy { flex: 1; min-width: 0; }
.draft-item-copy > b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; }
.draft-item-copy small { display: block; margin-top: 3px; font-size: 12px; }
.draft-item-status { display: grid; justify-items: end; gap: 3px; white-space: nowrap; }
.draft-item-status time { font-size: 11px; color: var(--ink-2); }
.review-grid { grid-template-columns: minmax(0, 1fr) minmax(240px, .455fr); gap: 14px; align-items: stretch; }
.draft-detail { min-width: 0; }
.draft-detail > .panel { margin-bottom: 12px; padding: 0 8px 8px; }
.draft-detail > .panel:last-child { margin-bottom: 0; }
.draft-section-heading h2 { gap: 7px; }
.draft-detail-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; font-size: 12px; color: var(--ink-2); }
.draft-detail-tools .btn { padding-inline: 8px; }
.draft-state-tag { background: var(--primary-gradient); color: white; }
.draft-meta {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-height: 49px; padding: 6px 9px;
  color: var(--ink-2); font-size: 12px;
}
.draft-meta svg, .draft-product svg, .draft-hint svg, .draft-review-panel svg, .draft-action-panel .btn svg {
  width: 16px; height: 16px; flex: 0 0 16px; color: var(--tile-fg, var(--brand));
}
.draft-customer, .draft-meta-source, .draft-product, .draft-hint > span { display: inline-flex; align-items: center; gap: 5px; }
.draft-customer { color: var(--brand); }
.draft-customer select { max-width: min(210px, 45vw); height: 29px; color: var(--brand); font-weight: 700; }
.draft-meta-source { margin-left: auto; }
.draft-evidence-grid { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 0; }
.draft-evidence-pane {
  min-width: 0; min-height: 173px; padding: 9px 13px; border: 1px solid var(--line);
  border-radius: 12px; background: linear-gradient(145deg, var(--surface), var(--surface-2));
}
.draft-evidence-pane h3 { margin: 0 0 8px; }
.draft-evidence-pane h3 small { font-weight: 500; color: var(--ink-2); }
.draft-original { display: flex; align-items: flex-start; gap: 8px; }
.draft-original .evidence-text { flex: 1; min-width: 0; min-height: 110px; max-height: 150px; overflow: auto; background: var(--surface-3); }
.draft-evidence-empty { display: grid; place-items: center; min-height: 118px; border-radius: var(--r-md); color: var(--ink-2); background: var(--surface-3); }
.draft-evidence-images a { position: relative; flex: 0 0 100%; min-width: 0; border-radius: var(--r-md); background: var(--surface-3); }
.draft-evidence-images img { width: 100%; max-width: none; height: 130px; object-fit: contain; }
.draft-evidence-images a > span { position: absolute; bottom: 5px; right: 5px; padding: 1px 5px; border-radius: 4px; background: var(--ink-2); color: var(--surface); }
.draft-lines-panel .draft-section-heading { border: 0; }
#de-lines table { min-width: 660px; border-collapse: separate; border-spacing: 0; font-size: 12px; }
#de-lines :is(td, th) { padding: 5px 6px; }
#de-lines td { height: 42px; }
#de-lines .warning-row td {
  --draft-row-line: light-dark(#efad74, #87562d);
  background: light-dark(#fff2e9, #34251a); border-block: 1px solid var(--draft-row-line);
}
#de-lines .warning-row td:first-child { border-left: 1px solid var(--draft-row-line); border-radius: 8px 0 0 8px; }
#de-lines .warning-row td:last-child { border-right: 1px solid var(--draft-row-line); border-radius: 0 8px 8px 0; }
#de-lines :is(th, td):first-child { text-align: center; width: 26px; }
#de-lines td:nth-child(4) { min-width: 110px; }
#de-lines td:nth-child(5) { color: var(--ink-2); }
#de-lines :is(th, td) > input[type="checkbox"] { width: 14px; height: 14px; vertical-align: middle; }
#de-lines .draft-qty, #de-lines .draft-price { display: inline-flex; align-items: center; gap: 2px; white-space: nowrap; }
#de-lines .draft-qty {
  min-height: 26px; padding-right: 5px; border: 1px solid var(--line-strong); border-radius: 6px; background: var(--surface);
}
#de-lines input[data-f] { height: 25px; width: 39px; padding: 0 2px; text-align: right; font-size: 12px; }
#de-lines input[data-f="prc"] { width: 49px; }
#de-lines select { width: 100%; min-width: 0; max-width: 168px; height: 28px; color: var(--bad); font-size: 12px; }
#de-lines .tag { font-size: 10px; white-space: nowrap; padding-inline: 5px; }
.draft-line-status { display: flex; flex-wrap: wrap; gap: 3px; }
.draft-alias, .draft-remove { font-size: 10px; white-space: nowrap; color: var(--ink-2); }
.draft-alias input { width: 12px; height: 12px; vertical-align: middle; }
.draft-hint {
  display: flex; gap: 10px; align-items: center; min-height: 53px; margin-top: 8px; padding: 6px 10px;
  background: var(--brand-soft); border-radius: 9px; color: var(--ink-2); font-size: 12px;
}
.draft-hint > span, .draft-hint button { white-space: nowrap; color: var(--brand); }
.draft-hint p { flex: 1; }
.review-summary { display: flex; flex-direction: column; gap: 12px; }
.review-summary .panel { margin: 0; padding: 12px; }
.draft-result { display: flex; align-items: center; gap: 12px; margin: 0; min-height: 70px; }
.draft-result-symbol { font-size: 26px; line-height: 1; }
.draft-result b { font-size: 19px; }
.draft-review-panel summary { display: flex; justify-content: space-between; align-items: center; cursor: pointer; font-size: 16px; font-weight: 700; }
.draft-review-panel summary span { display: inline-flex; align-items: center; gap: 6px; }
.draft-review-panel summary::after { content: '⌄'; color: var(--ink-2); }
.draft-review-panel[open] summary::after { transform: rotate(180deg); }
.draft-checks { list-style: none; padding-top: 9px; }
.draft-checks li { display: flex; align-items: baseline; gap: 6px; padding: 4px 0; font-size: 13px; }
.draft-checks li::before { content: ''; flex: 0 0 8px; height: 8px; border-radius: 50%; background: var(--brand); }
.draft-checks .red::before { background: var(--bad); }
.draft-checks .orange::before { background: var(--warn); }
.draft-checks li > span { color: var(--ink); }
.draft-checks li > b { white-space: nowrap; color: var(--ink); }
.draft-suggestions li::before { content: '✓'; flex-basis: 14px; height: auto; text-align: center; color: var(--ok); background: var(--ok-soft); }
.review-summary .draft-action-panel { margin-top: auto; }
.draft-action-panel .summary-actions { margin-top: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.draft-action-panel .summary-actions .pri { min-height: 42px; grid-column: 1 / -1; font-size: 16px; }
.draft-payment { margin-top: 8px; color: var(--ink-2); font-size: 12px; }
.draft-payment summary { cursor: pointer; }
.draft-payment label { font-size: 12px; }
.draft-notice { display: none; margin-left: auto; color: #9b4600; background: #ffdfae; border-radius: var(--r-pill); padding: 1px 7px; font-size: 11px; }
@media (min-width: 1025px) {
  body:has(#main[data-view="drafts"]) { --workspace-pad: clamp(16px, 1.3vw, 22px); }
  body:has(#main[data-view="drafts"]) .topbar { flex-basis: 54px; }
  body:has(#main[data-view="drafts"]) .draft-notice { display: inline-block; }
  #main[data-view="drafts"] { padding-bottom: 14px; }
  body:has(#main:is([data-view="users"], [data-view="kb"])) { --bg: light-dark(#f5f5fc, #0f1115); }
  body:has(#main[data-view="mcp"]) #nav a.on {
    background: linear-gradient(105deg, #817bf2, #5543df); color: white;
  }
}
@media (min-width: 1400px) {
  #main[data-view="drafts"] { padding-inline-end: 8px; }
  .hero-draft { margin-inline-end: -8px; }
}

@media (max-width: 1220px) {
  .review-grid { grid-template-columns: minmax(0, 1fr); }
  .draft-work { grid-template-columns: minmax(200px, .32fr) minmax(0, 1fr); }
}
@media (max-width: 1180px) {
  .dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-recent { grid-column: 1 / -1; grid-row: 3; }
}
@media (max-width: 1024px) {
  :root { --workspace-pad: 16px; }
  .logo { padding: 22px 0; }
  #nav a { height: 39px; padding-inline: 0; }
  .mcp-activity { grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); }
  .mcp-activity > :last-child { grid-column: 1 / -1; }
  .draft-overview { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 900px) {
  .work-grid { grid-template-columns: minmax(0, 1fr); }
  .mcp-activity > :last-child { grid-column: auto; }
  .mcp-status { grid-template-columns: minmax(0, 1fr); }
  .settings-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #df-list { max-height: 32vh; }
}
@media (max-width: 720px) {
  :root { --workspace-pad: 12px; }
  .topbar { padding-inline: 10px; gap: 7px; }
  .top-actions { gap: 5px; }
  .top-actions .btn { padding-inline: 8px; }
  .top-search kbd, .top-ai, .profile summary b { display: none; }
  .top-search { flex: 1; width: auto; }
  .hero-logistics::before { display: none; }
  .hero-settings::after { display: none; }
  .hero-logistics p { width: auto; }
  .page-hero { padding-block: 14px; min-height: 0; }
  .hero-icon { width: 42px; height: 42px; flex-basis: 42px; }
  .hero-icon svg { width: 24px; height: 24px; }
  .dashboard-grid { grid-template-columns: minmax(0, 1fr); }
  .dashboard-recent { grid-column: auto; grid-row: auto; }
  .sell-meta { grid-template-columns: minmax(0, 1fr); }
  .sell-meta > div + div { border-left: 0; padding-left: 0; }
  .ai-intro { flex-wrap: wrap; }
  .sell-assist .capability-grid { grid-template-columns: minmax(0, 1fr); }
  .mcp-status .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hero-draft::after { display: none; }
  .draft-metrics { gap: 5px; }
  .draft-metric { padding: 8px 5px; gap: 4px; grid-template-columns: auto 1fr; font-size: 11px; }
  .draft-metric .icon-tile { width: 22px; height: 22px; }
  .draft-metric .icon-tile svg { width: 16px; height: 16px; }
  .draft-metric > :last-child { display: none; }
  .draft-metric strong { font-size: 18px; }
  .draft-evidence-grid { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .draft-meta-source { margin-left: 0; }
  .directory-toolbar { justify-content: flex-start; }
  #nav a { height: 48px; padding-inline: 6px; }
}
@media (max-width: 480px) {
  .settings-grid { grid-template-columns: minmax(0, 1fr); }
  .settings-actions { grid-template-columns: minmax(0, 1fr); }
}
@media print {
  .page-hero { background: none !important; }
  .hero-logistics::before, .hero-settings::after, .hero-draft::after { display: none; }
  .dashboard-grid, .work-grid, .report-grid, .review-grid { display: block; }
}

.settings-work { grid-template-columns: minmax(160px, .24fr) minmax(0, 1fr); }
@media (max-width: 720px) {
  .settings-work { grid-template-columns: minmax(0, 1fr); }
  #side { position: sticky; }
}

/* 经营报表 */
@media (min-width: 1181px) {
  body:has(#main[data-view="reports"]) { --workspace-pad: 16px; }
  body:has(#main[data-view="reports"]) .topbar { flex-basis: 58px; }
}
#main[data-view="reports"] .hero-logistics {
  min-height: 88px; padding-block: 11px 8px; margin-bottom: 0;
}
.report-filter {
  display: grid; grid-template-columns: 1.23fr 1fr 1fr .85fr auto; align-items: center; gap: 8px 13px;
  padding: 10px 13px; margin-bottom: 9px;
}
.report-filter > div:not(.report-custom) { min-width: 0; display: flex; align-items: center; gap: 8px; }
.report-filter > div:not(.report-custom):not(:first-child) { border-left: 1px solid var(--line); padding-left: 10px; }
.report-filter label, .report-warehouse b {
  display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; white-space: nowrap;
}
.report-filter select { min-width: 0; flex: 1; width: 100%; }
.report-filter svg { flex: 0 0 16px; width: 16px; height: 16px; }
.report-warehouse > span {
  flex: 1; min-width: 0; height: var(--ctl-h); padding: 0 10px; align-content: center; white-space: nowrap;
  background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r-md);
}
.report-custom { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; grid-column: 1 / -1; }
#report-error { grid-column: 1 / -1; margin: 0; }
.report-metrics { grid-template-columns: repeat(6, minmax(0, 1fr)); margin-bottom: 10px; }
.report-metrics .metric { padding: 8px 10px 8px; min-height: 97px; }
.report-metrics .metric .k { margin-bottom: 4px; }
.report-metrics .metric .v { font-size: clamp(17px, 1.6vw, 26px); }
.report-metrics .metric-note { display: flex; align-items: center; min-height: 20px; gap: 4px; margin-top: 4px; }
.report-metrics .metric-note > span { font-weight: 750; white-space: nowrap; }
.report-spark { width: min(31%, 68px); min-width: 25px; height: 20px; margin-left: auto; color: var(--tile-fg); }
.report-spark polygon { fill: currentColor; opacity: .10; }
.report-spark polyline { stroke: currentColor; fill: none; stroke-width: 1.6; }
.report-work {
  display: grid; grid-template-columns: minmax(0, 2.75fr) minmax(275px, 1fr); align-items: stretch; gap: 12px;
}
.report-grid {
  display: grid; grid-template-columns: minmax(0, 1.24fr) minmax(0, 1fr); align-items: stretch; gap: 8px;
}
.report-grid > .panel, .report-insights { min-width: 0; margin: 0; padding: 9px 12px; }
.report-grid .section-head, .report-insights .section-head { margin-bottom: 5px; }
.report-grid h2, .report-insights h2 { font-size: 17px; line-height: 1.35; }
.report-tabs { border-radius: 999px; }
.report-tabs button { border-radius: inherit; padding: 2px 10px; font-size: 11px; }
.report-grid .trend svg { height: 122px; }
.report-grid .trend .axis-y { padding: 12px 0 17px; }
.report-chart-caption { display: flex; align-items: center; gap: 9px; font-size: 11px; color: var(--ink-3); }
.report-chart-caption > :first-child { margin-right: auto; }
.report-key { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.report-key::before { content: ''; width: 11px; border-top: 2px solid var(--brand); }
.report-key.previous::before { border-top: 2px dashed var(--ink-3); }
.chart-previous { stroke: var(--ink-3); stroke-dasharray: 4 4; opacity: .7; fill: none; vector-effect: non-scaling-stroke; }
#report-categories .share-chart { min-height: 137px; margin-top: 4px; gap: clamp(8px, 1.35vw, 21px); }
#report-categories .donut { flex-basis: clamp(90px, 8.8vw, 140px); }
.report-empty { display: grid; align-content: center; min-height: 98px; padding: 10px; text-align: center; color: var(--ink-3); font-size: 12px; }
td.report-empty { display: table-cell; height: 72px; }
.report-muted { color: var(--ink-3); font-size: 11px; }
.report-ranking ol, .report-age-list, .report-insight-list { list-style: none; }
.rank-row {
  display: grid; grid-template-columns: 18px minmax(55px, 1.05fr) minmax(42px, 1fr) minmax(62px, auto);
  align-items: center; gap: 6px; min-height: 23px; font-size: 12px;
}
.rank-row b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.rank-row > :last-child { text-align: right; }
.report-rank { color: var(--ink-2); text-align: center; border-radius: 50%; background: var(--surface-3); font-weight: 700; }
.rank-row:first-child .report-rank { background: var(--warn-soft); color: var(--warn); }
.rank-track { height: 10px; background: var(--surface-3); border-radius: 4px; overflow: hidden; }
.rank-track i { display: block; height: 100%; background: linear-gradient(90deg, #a6c5ff, #4e78fb); border-radius: inherit; }
.report-aging .section-head > span { color: var(--ink-2); font-size: 11px; }
.report-age-bar { display: flex; overflow: hidden; background: var(--surface-3); height: 21px; border-radius: 5px; margin: 6px 0 4px; }
.report-age-bar span { min-width: 0; text-align: center; align-content: center; color: #101630; font-size: 11px; font-weight: 750; }
.report-age-list li { display: grid; grid-template-columns: 8px 1fr auto 48px; align-items: center; gap: 6px; padding-block: 1px; font-size: 12px; }
.report-age-list i { width: 7px; height: 7px; border-radius: 50%; background: var(--age-color); }
.report-age-list small { text-align: right; color: var(--ink-2); }
.report-profit { grid-column: 1 / -1; }
.report-profit td, .report-profit th { height: 24px; padding: 0 6px; white-space: nowrap; font-size: 12px; }
.report-profit th { background: var(--surface-3); color: var(--ink); }
.report-profit td:nth-child(2) { white-space: normal; }
.report-profit .report-empty { height: 64px; }
.report-profit .tag { font-size: 11px; padding-block: 0; }
.report-sku { color: var(--brand); font-weight: 700; }
.report-more { font-size: 12px; }
.report-insights {
  background: radial-gradient(ellipse at 82% 0%, light-dark(#e0ddff, #332b5b), transparent 44%), var(--surface);
  display: flex; flex-direction: column;
}
.report-insight-tag { background: linear-gradient(110deg, #3f48db, #6a4bc4); color: #fff; border-radius: 999px; padding: 2px 9px; font-size: 11px; }
.report-intro { display: flex; align-items: center; gap: 4px; min-height: 61px; font-size: 12px; color: var(--ink-2); }
.report-intro .bot-art { width: 72px; height: 61px; flex-basis: 72px; }
.report-insight-list { border-radius: var(--r-md); background: var(--surface); padding: 3px 8px; border: 1px solid var(--panel-line); }
.report-insight { display: grid; grid-template-columns: auto 1fr; gap: 8px; padding: 11px 2px; }
@media (min-width: 1181px) {
  .report-insight { min-height: 83px; }
}
.report-insight + .report-insight { border-top: 1px solid var(--line); }
.report-insight .icon-tile { width: 36px; height: 36px; border-radius: 50%; }
.report-insight h3 { display: flex; gap: 4px; justify-content: space-between; flex-wrap: wrap; align-items: center; margin: 0 0 3px; }
.report-insight p { font-size: 12px; color: var(--ink-2); }
.report-insight .tag { background: var(--tile-bg, var(--brand-soft)); color: var(--tile-fg, var(--brand)); font-size: 11px; }
.report-insight-actions { display: flex; justify-content: space-between; gap: 5px; flex-wrap: wrap; margin-top: auto; padding: 9px 0; }
.report-insight-actions .text-btn { font-size: 12px; }
.report-method { padding: 6px 8px; background: var(--brand-soft); border: 1px solid var(--brand-line); border-radius: 8px; font-size: 12px; }
.report-method summary { text-align: center; cursor: pointer; font-weight: 700; color: var(--brand); }
.report-method p { margin-top: 5px; color: var(--ink-2); }
@media (max-width: 1180px) {
  .report-work { grid-template-columns: minmax(0, 1fr); }
  .report-filter { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .report-filter .report-warehouse { border-left: 0 !important; padding-left: 0 !important; }
  .report-insight-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 10px; }
  .report-insight:nth-child(2) { border-top: 0; }
}
@media (max-width: 860px) {
  .report-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 660px) {
  .report-filter { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
  .report-filter > div:not(.report-custom) { flex-direction: column; align-items: stretch; gap: 4px; border-left: 0 !important; padding-left: 0 !important; }
  .report-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .report-grid, .report-insight-list { grid-template-columns: minmax(0, 1fr); }
  .report-insight:nth-child(2) { border-top: 1px solid var(--line); }
}
@media print {
  .report-work, .report-grid { display: block; }
}

/* 单据中心 */
body:has(.bill-workspace) #new-bill { display: none; }
#main:has(.bill-workspace) {
  background: radial-gradient(ellipse at 42% 0%, light-dark(#e5e5fa, #21233b), transparent 65%), var(--bg);
}
.bill-workspace {
  --bill-accent: light-dark(#5039df, #a79aff);
  --bill-tint: light-dark(#eeebfc, #2b2448);
  --bill-border: light-dark(#e5e1f5, #35304b);
  --bill-fill: linear-gradient(114deg, #695de6, #4e37d7);
  display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  gap: 14px; align-items: start; padding-top: 12px;
}
.bill-column { min-width: 0; }
.hero-bills { align-items: center; min-height: 0; padding: 0; margin-bottom: 13px; }
.hero-bills h1 { font-size: clamp(25px, 1.7vw, 32px); }
.hero-bills .hero-icon { color: var(--bill-accent); background: var(--bill-tint); }
.bill-metrics {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px; margin-bottom: 12px;
}
.bill-metrics .metric { margin: 0; padding: 10px 12px; }
.bill-metrics .metric .k { font-size: 13px; }
.bill-metrics .metric .v { margin-top: 4px; font-size: clamp(17px, 1.35vw, 23px); }
.bill-metrics .metric-note { margin-top: 3px; }
.bill-metrics .text-btn { padding: 0; color: var(--bill-accent); }
.bill-blue { --tile-fg: var(--info); --tile-bg: var(--info-soft); }
.bill-alert { --tile-fg: var(--bad); --tile-bg: var(--bad-soft); }
.bill-workspace .panel, .bill-print-queue { border-color: var(--panel-line); box-shadow: var(--panel-shadow); }
.bill-workspace .btn.pri { background: var(--bill-fill); border-color: transparent; color: white; }
.bill-workspace .btn.pri:hover { filter: brightness(1.12); }
.bill-filters {
  display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(104px, .8fr) minmax(104px, .8fr) minmax(235px, 1.6fr);
  gap: 8px 10px; align-items: end; padding: 11px 13px; margin-bottom: 12px;
}
.bill-filters > div, .bill-filters input, .bill-filters select { min-width: 0; width: 100%; }
.bill-filters label, .bill-filters legend { font-size: 12px; color: var(--ink-2); margin: 0 0 3px; font-weight: 650; }
.bill-filters input, .bill-filters select { height: 32px; padding-inline: 8px; font-size: 12px; }
.bill-dates { min-width: 0; border: 0; }
.bill-dates > div { display: flex; align-items: center; gap: 4px; }
.bill-dates span { font-size: 12px; color: var(--ink-2); }
.bill-filter-actions { grid-column: span 2; display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.bill-filter-actions .btn { height: 32px; }
.bill-filter-actions .bill-export { color: var(--bill-accent); border-color: var(--brand-line); }
.bill-register { padding: 0; margin: 0; overflow: hidden; }
.bill-tabs { display: flex; flex-wrap: wrap; gap: 5px; padding: 9px 10px; border-bottom: 1px solid var(--line); }
.bill-tabs button {
  display: inline-flex; align-items: center; justify-content: center; gap: 5px; flex: 1 0 auto;
  min-height: 32px; padding: 4px 8px; border: 1px solid transparent; border-radius: var(--r-md);
  background: transparent; color: var(--ink); font: inherit; font-size: 12.5px; font-weight: 650; cursor: pointer;
}
.bill-tabs svg { width: 15px; height: 15px; color: var(--ink-3); }
.bill-tabs small { font-size: inherit; }
.bill-tabs button:hover { background: var(--bill-tint); }
.bill-tabs [aria-pressed="true"] { background: var(--bill-fill); color: white; }
.bill-tabs [aria-pressed="true"] svg { color: inherit; }
.bill-list-tools, .bill-footer {
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;
  gap: 8px; padding: 8px 10px; font-size: 12px; color: var(--ink-2);
}
.bill-actions, .bill-pages, .bill-footer > div { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.bill-actions .btn, .bill-pages .btn { min-height: 30px; padding-inline: 8px; white-space: nowrap; }
.bill-footer { border-top: 1px solid var(--line); }
.bill-footer label { margin: 0; }
.bill-footer select { height: 30px; width: auto; padding-inline: 7px; }
.bill-pages .btn { min-width: 29px; }
.bill-table { margin-inline: 8px; }
.bill-table table, .bill-items table, .bill-print-queue table { font-size: 12px; }
.bill-table td, .bill-table th, .bill-items td, .bill-items th { height: 33px; padding: 0 6px; white-space: nowrap; }
.bill-table th, .bill-items th { background: var(--bill-tint); }
.bill-table td:first-child, .bill-table th:first-child { padding-inline: 8px; }
.bill-table tbody tr:nth-child(even):not(:has([aria-current="true"])):not(:hover) td { background: var(--surface-2); }
.bill-table .bill-partner-cell { max-width: 145px; overflow: hidden; text-overflow: ellipsis; }
.bill-table input[type=checkbox] { width: 15px; height: 15px; vertical-align: middle; accent-color: var(--bill-accent); }
.bill-workspace .bill-type:not(.g) { background: var(--bill-tint); color: var(--bill-accent); }
.tag.info { background: var(--info-soft); color: var(--info); }
.bill-workspace .text-btn { color: var(--bill-accent); }
.bill-table .empty-state { min-height: 240px; display: grid; align-content: center; justify-items: center; gap: 6px; }
.bill-table .empty-state svg { width: 28px; height: 28px; color: var(--bill-accent); }
.bill-inspector { position: sticky; top: 12px; margin: 0; padding: 10px; min-width: 0; }
.bill-inspector-head { margin: 0 0 8px; padding: 0 3px; }
.bill-inspector-head svg, .bill-inspector-section svg { color: var(--bill-accent); }
.bill-preview, .bill-inspector-section {
  border: 1px solid var(--bill-border); border-radius: var(--r-lg);
  background: color-mix(in srgb, var(--surface) 80%, var(--bill-tint)); padding: 10px;
}
.bill-preview-title { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-bottom: 10px; }
.bill-preview-title h3 { font-size: clamp(16px, 1.38vw, 23px); margin: 0; overflow-wrap: anywhere; }
.bill-preview-title .tag { flex-shrink: 0; }
.bill-preview-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(125px, 1fr); gap: 8px; }
.bill-meta, .bill-amount dl { font-size: 12px; display: grid; gap: 4px; }
.bill-meta > div { display: grid; grid-template-columns: 58px minmax(0, 1fr); align-items: start; gap: 5px; }
.bill-meta dt, .bill-amount dt { color: var(--ink-2); }
.bill-meta dd { overflow-wrap: anywhere; }
.bill-amount { border: 1px solid var(--bill-border); border-radius: var(--r-md); background: var(--bill-tint); padding: 9px; }
.bill-amount > span { font-size: 12px; color: var(--ink-2); }
.bill-amount strong { display: block; font-size: clamp(17px, 1.46vw, 25px); line-height: 1.3; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.bill-amount dl { margin-top: 6px; padding-top: 5px; border-top: 1px solid var(--bill-border); }
.bill-amount dl > div { display: flex; justify-content: space-between; gap: 4px; flex-wrap: wrap; }
.bill-note { font-size: 12px; color: var(--ink-2); margin: 6px 0 0; overflow-wrap: anywhere; }
.bill-inspector-section { margin-top: 8px; }
.bill-inspector-section h3 { display: flex; align-items: center; gap: 5px; font-size: 14px; margin: 0 0 7px; }
.bill-inspector-section h3 svg { width: 16px; height: 16px; }
.bill-inspector-section h3 span { font-size: 12px; color: var(--ink-2); }
.bill-items { max-height: 214px; overflow: auto; }
.bill-items td, .bill-items th { height: 29px; }
.bill-progress { list-style: none; padding: 0; font-size: 12px; }
.bill-progress li { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 3px 10px; padding: 5px 5px 5px 24px; }
.bill-progress li::before {
  content: ''; position: absolute; top: 10px; left: 6px; width: 8px; height: 8px;
  border: 2px solid var(--line-strong); border-radius: 50%; background: var(--surface); z-index: 1;
}
.bill-progress li:not(:last-child)::after { content: ''; position: absolute; top: 16px; bottom: -14px; left: 11px; border-left: 1px solid var(--line-strong); }
.bill-progress li:first-child::before { background: var(--ok); border-color: var(--ok); }
.bill-progress li.current { background: var(--bill-tint); border-radius: var(--r-sm); }
.bill-progress li.current::before { border-color: var(--bill-accent); }
.bill-progress li > span { color: var(--ink-2); }
.bill-print-note { display: flex; gap: 8px; background: var(--bill-tint); }
.bill-print-note h3 { margin-bottom: 2px; }
.bill-print-note p { font-size: 12px; color: var(--ink-2); }
.bill-inspector-actions { justify-content: space-between; padding: 10px 0 0; }
.bill-inspector-actions .btn { flex: 1 0 auto; }
.bill-print-queue { margin: 14px 0; }
.bill-print-queue td { white-space: nowrap; }

@media (min-width: 1181px) {
  body:has(.bill-workspace) { --workspace-pad: 14px; }
  body:has(.bill-workspace) .topbar { flex-basis: 50px; }
  body:has(.bill-workspace) .top-search { width: min(60%, 410px); padding-block: 4px; }
  body:has(.bill-workspace) #nav a.on { background: linear-gradient(114deg, #766ceb, #4e37d7); color: #fff; }
}
@media (max-width: 1450px) {
  .bill-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .bill-dates, .bill-filter-actions { grid-column: span 2; }
  .bill-metrics .metric { padding-inline: 8px; }
  .bill-metrics .metric .k { font-size: 12px; }
  .bill-metrics .icon-tile { width: 25px; height: 25px; flex-basis: 25px; }
}
@media (max-width: 1180px) {
  .bill-workspace { grid-template-columns: minmax(0, 1fr); }
  .bill-inspector { position: static; }
}
@media (max-width: 720px) {
  .bill-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bill-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bill-search, .bill-dates, .bill-filter-actions { grid-column: 1 / -1; }
  .bill-tabs button { flex: 0 0 auto; }
}
@media print {
  .bill-workspace { display: block; }
  .bill-inspector { position: static; }
}

/* 价格策略 */
body:has(#main[data-view="kb"]) {
  --price-accent: light-dark(#4619e6, #a998ff);
  --price-soft: light-dark(#f1edff, #2b2448);
  --price-selected: light-dark(#eeebfd, #30284e);
  --price-border: light-dark(#eeedf5, #30313d);
  --price-fill: linear-gradient(112deg, #5020ee, #4212dc);
  --price-shadow: 0 3px 12px light-dark(#26145408, #00000038);
}
body:has(#main[data-view="kb"]) #new-bill { display: none; }
body:has(#main[data-view="kb"]) #nav a.on {
  color: var(--price-accent);
  background: light-dark(#e3dcfb, #332856);
  box-shadow: inset 2px 0 var(--price-accent);
}
.pricing-crumb { display: flex; align-items: center; gap: 8px; margin-right: auto; font-size: 15px; font-weight: 750; white-space: nowrap; }
.pricing-crumb svg { width: 17px; height: 17px; color: var(--price-accent); }
body:has(#main[data-view="kb"]) .top-search {
  width: min(39%, 356px); border-color: var(--price-border); border-radius: 11px; background: var(--surface);
}
body:has(#main[data-view="kb"]) .top-ai { color: var(--price-accent); border-color: var(--price-accent); padding-inline: 19px; }
#main[data-view="kb"] {
  --price-pad: clamp(13px, 1.32vw, 22px);
  background: linear-gradient(180deg, light-dark(#f5f4fc, #191823) 0, var(--bg) 270px, var(--surface) 100%);
  padding-inline: var(--price-pad);
}
.hero-pricing { min-height: 0; margin: 0 0 18px; padding: clamp(16px, 1.5vw, 26px) 0 0; }
.hero-pricing h1 { font-size: clamp(24px, 1.64vw, 30px); margin-bottom: 5px; }
.hero-pricing p { font-size: 14px; }
.pricing-overview { display: flex; align-items: center; gap: clamp(12px, 1.25vw, 22px); margin-bottom: clamp(16px, 1.55vw, 26px); }
.pricing-metrics { display: grid; flex: 1; min-width: 0; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(10px, 1.12vw, 19px); }
.pricing-metric {
  display: flex; align-items: flex-start; gap: clamp(8px, .9vw, 15px); min-width: 0;
  padding: clamp(12px, 1.1vw, 19px); min-height: clamp(96px, 7.2vw, 120px);
  background: var(--surface); border: 1px solid var(--price-border); border-radius: 12px; box-shadow: var(--price-shadow);
}
.pricing-metric-icon {
  flex: 0 0 clamp(28px, 2.3vw, 38px); aspect-ratio: 1; display: grid; place-items: center;
  color: var(--price-accent); background: var(--price-soft); border-radius: 10px;
}
.pricing-metric-icon svg { width: 68%; height: 68%; }
.pricing-metric.blue .pricing-metric-icon { color: var(--info); background: var(--info-soft); }
.pricing-metric.red .pricing-metric-icon { color: var(--bad); background: var(--bad-soft); }
.pricing-metric h2 { font-size: 13px; margin: 0; font-weight: 650; }
.pricing-metric strong { display: block; color: var(--ink); font: 750 clamp(24px, 1.8vw, 31px)/1.15 var(--font-num); margin: 3px 0 5px; }
.pricing-metric p { color: var(--ink-2); font-size: 12px; }
.pricing-metric.red p { color: var(--bad); }
.pricing-overview .pricing-create {
  flex: 0 0 auto; min-width: clamp(140px, 10.4vw, 174px); justify-content: center;
  height: clamp(40px, 2.9vw, 49px); gap: 7px; padding-inline: clamp(11px, 1.2vw, 20px);
  background: var(--price-fill); border-radius: 10px; font-weight: 700;
}
.pricing-create span { font-size: 20px; line-height: 1; }

.pricing-work { display: grid; grid-template-columns: clamp(144px, 12.1vw, 202px) minmax(0, 1fr); gap: 5px; align-items: stretch; }
.pricing-work .panel {
  margin: 0; padding: var(--price-pad); border: 1px solid var(--price-border); border-radius: 12px; box-shadow: var(--price-shadow);
}
.pricing-work h2 { font-size: clamp(15px, 1.04vw, 18px); line-height: 1.35; font-weight: 750; }
.pricing-work .pricing-categories { padding-inline: clamp(10px, 1.05vw, 17px); }
.pricing-categories h2 { margin: 2px 7px 15px; }
.pricing-category-list, .pricing-utilities { display: grid; gap: 3px; }
.pricing-utilities { border-top: 1px solid var(--price-border); margin-top: 12px; padding-top: 9px; }
.pricing-category {
  display: flex; align-items: center; gap: 8px; min-width: 0; min-height: clamp(34px, 2.65vw, 44px); padding: 5px 8px;
  border: 0; border-radius: 9px; color: var(--ink); background: transparent;
  text-align: left; font: 550 13px var(--font-ui); cursor: pointer; white-space: nowrap;
}
.pricing-category svg { flex: 0 0 16px; width: 16px; height: 16px; color: var(--ink-3); }
.pricing-category[data-pb-category="timed"] svg { color: var(--bad); }
.pricing-category :is(b, svg:last-child) { margin-inline-start: auto; }
.pricing-category b { font: 650 13px var(--font-num); }
.pricing-category:hover { background: var(--surface-2); }
.pricing-category[aria-pressed="true"] { background: var(--price-soft); color: var(--price-accent); }
.pricing-category[aria-pressed="true"] svg { color: inherit; }
.pricing-category:focus-visible, .pricing-icon-button:focus-visible, .pricing-select:focus-visible {
  outline: 2px solid var(--price-accent); outline-offset: 2px;
}
.pricing-work .pricing-directory { overflow: hidden; }
.pricing-directory > h2 { margin: 2px 0 5px; }
.pricing-filters { display: flex; flex-wrap: wrap; gap: 7px; justify-content: flex-end; align-items: center; margin-bottom: clamp(16px, 1.85vw, 31px); }
.pricing-filters select { max-width: min(150px, 100%); width: auto; }
.pricing-filters select, .pricing-search {
  min-height: 34px; border: 1px solid var(--price-border); border-radius: 7px;
  background-color: var(--surface); color: var(--ink); font-size: 13px;
}
.pricing-search { display: flex; flex: 0 1 225px; min-width: 0; align-items: center; padding-inline: 9px; gap: 5px; margin: 0; }
.pricing-search svg { flex: 0 0 16px; width: 16px; height: 16px; color: var(--ink-3); order: 1; }
.pricing-search input { min-width: 0; height: 32px; padding: 0; border: 0; background: transparent; box-shadow: none; }
.pricing-search input:focus { border: 0; box-shadow: none; outline: none; }
.pricing-search:focus-within { box-shadow: var(--ring); border-color: var(--price-accent); }
#pb-list { border-radius: 8px; }
#pb-list .pricing-table { min-width: 560px; table-layout: fixed; }
.pricing-col-select { width: 34px; }
.pricing-col-name { width: 25%; }
.pricing-col-target { width: 18%; }
.pricing-col-date { width: 16%; }
.pricing-col-status { width: 67px; }
.pricing-col-action { width: 64px; }
.pricing-table :is(th, td), .pricing-tiers :is(th, td) { padding: 0 7px; }
.pricing-table :is(th, td):first-child { text-align: center; }
.pricing-table th, .pricing-tiers th { height: 40px; color: var(--ink); background: light-dark(#f6f5fa, #22222e); }
.pricing-table td { height: clamp(51px, 3.68vw, 62px); font-size: 13px; border-color: var(--price-border); }
.pricing-table tr[data-pb-row] { cursor: pointer; }
.pricing-table tr.is-selected td { background: var(--price-selected); }
.pricing-table td > strong, .pricing-period, .pricing-target span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pricing-table td.pricing-period { display: table-cell; }
.pricing-table td > strong { font-size: 13px; font-weight: 740; }
.pricing-type {
  display: inline-block; color: var(--price-accent); background: var(--price-soft);
  padding: 1px 5px; border-radius: 4px; font-size: 11px; font-weight: 650; white-space: nowrap;
}
.pricing-type.public { color: var(--info); background: var(--info-soft); }
.pricing-target { display: flex; align-items: center; gap: 5px; min-width: 0; }
.pricing-target svg, .pricing-fields svg { width: 14px; height: 14px; flex: 0 0 14px; color: var(--price-accent); vertical-align: -2px; }
.pricing-status {
  display: inline-flex; align-items: center; gap: 4px; padding: 2px 5px; border-radius: 5px; white-space: nowrap;
  font-size: 11px; font-weight: 650; color: var(--ink-2); background: var(--surface-3);
}
.pricing-status::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.pricing-status.active { color: var(--ok); background: var(--ok-soft); }
.pricing-status.pending { color: var(--warn); background: var(--warn-soft); }
.pricing-icon-button, .pricing-select {
  display: inline-grid; place-items: center; padding: 0; border: 0; color: var(--ink-3); background: transparent; cursor: pointer; vertical-align: middle;
}
.pricing-icon-button { width: 24px; height: 28px; border-radius: 6px; }
.pricing-icon-button svg { width: 15px; height: 15px; }
.pricing-icon-button:hover { color: var(--price-accent); background: var(--price-soft); }
.pricing-icon-button[data-pb-delete]:hover { color: var(--bad); background: var(--bad-soft); }
.pricing-select { width: 17px; height: 17px; border: 1px solid var(--line-strong); border-radius: 4px; background: var(--surface); }
.pricing-select svg { display: none; width: 12px; height: 12px; }
.pricing-select[aria-pressed="true"] { color: white; border-color: transparent; background: var(--price-fill); }
.pricing-select[aria-pressed="true"] svg { display: block; }
.pricing-row-actions { white-space: nowrap; }
.pricing-table .empty-state { height: 125px; color: var(--ink-3); }
.pricing-footer, .pricing-footer > div, .pricing-pages { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.pricing-footer { justify-content: space-between; gap: 8px 12px; padding-top: clamp(13px, 1.8vw, 29px); font-size: 12px; color: var(--ink-3); }
.pricing-footer > div { gap: 10px; }
.pricing-footer label { white-space: nowrap; margin: 0; }
.pricing-footer select { width: auto; min-height: 31px; }
.pricing-pages .btn {
  min-width: 31px; height: 31px; padding: 0 6px; justify-content: center; background: var(--surface-2);
}
.pricing-pages .btn[aria-current="page"] { color: white; border-color: transparent; background: var(--price-fill); }
.pricing-pages svg { width: 14px; height: 14px; }
.pricing-work .pricing-detail { align-self: start; overflow: visible; }
.pricing-detail-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 6px; }
.pricing-detail-head > div { display: flex; align-items: center; gap: 5px 8px; flex-wrap: wrap; min-width: 0; }
.pricing-detail-head h2 { margin: 0; overflow-wrap: anywhere; }
.pricing-detail .pricing-detail-head h2 { font-size: 16px; }
.pricing-detail-head > button { flex: 0 0 24px; }
.pricing-detail-section { padding-top: 16px; }
.pricing-detail-section + .pricing-detail-section { margin-top: 15px; border-top: 1px solid var(--price-border); }
.pricing-detail-section h3 { font-size: 13px; margin-bottom: 9px; }
.pricing-fields { display: grid; grid-template-columns: 5.5em minmax(0, 1fr); gap: 8px 6px; font-size: 13px; }
.pricing-fields dt { color: var(--ink-3); }
.pricing-fields dd { overflow-wrap: anywhere; }
.pricing-tier-wrap { border: 1px solid var(--price-border); border-radius: 7px; overflow: auto; }
.pricing-tiers { font-size: 12px; }
.pricing-tiers th { height: 34px; letter-spacing: 0; }
.pricing-tiers td { height: 35px; border-color: var(--price-border); }
.pricing-tiers tr:last-child td { border-bottom: 0; }
.pricing-tiers strong { color: var(--bad); }
.pricing-tiers td:last-child { width: 1%; white-space: nowrap; padding-inline: 2px; }
.pricing-note {
  display: flex; align-items: flex-start; gap: 7px; margin-top: 16px; padding: 11px; border-radius: 7px;
  background: light-dark(#eeeffe, #242744); font-size: 12px;
}
.pricing-note svg { flex: 0 0 15px; width: 15px; height: 15px; color: var(--price-accent); margin-top: 2px; }
.pricing-note p { color: var(--ink-2); margin-top: 3px; }
.pricing-aliases .pricing-filters { justify-content: flex-start; margin-bottom: 12px; }
.pricing-aliases .table-scroll table { min-width: 560px; }
.pricing-dialog {
  position: fixed; inset: 0; margin: auto; width: min(520px, calc(100vw - 26px)); max-height: calc(100dvh - 26px);
  padding: 20px; border: 1px solid var(--price-border); border-radius: 12px; background: var(--surface); color: var(--ink); box-shadow: var(--sh-3);
}
.pricing-dialog::backdrop { background: #16132b68; }
.pricing-dialog .sub { margin: 7px 0 14px; }
.pricing-dialog .grid-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pricing-form-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; }
.pricing-form-actions .pri { background: var(--price-fill); }
.pricing-form-error { color: var(--bad); margin-top: 10px; }

@media (min-width: 1280px) {
  .pricing-work.has-pricing-detail { grid-template-columns: clamp(144px, 12.1vw, 202px) minmax(0, 1fr) clamp(244px, 21.2vw, 362px); }
  .pricing-work .pricing-detail { min-height: 354px; }
}
@media (min-width: 1400px) {
  #main[data-view="kb"] { padding-inline-end: 13px; }
  .pricing-work { margin-inline-start: calc(-1 * var(--price-pad) + 3px); }
}
@media (max-width: 1279px) {
  .pricing-detail { grid-column: 2; }
}
@media (max-width: 900px) {
  .pricing-overview { flex-wrap: wrap; justify-content: flex-end; }
  .pricing-metrics { flex-basis: 100%; }
  .pricing-work, .pricing-work.has-pricing-detail { grid-template-columns: minmax(0, 1fr); }
  .pricing-detail { grid-column: 1; }
  .pricing-category-list, .pricing-utilities { display: flex; flex-wrap: wrap; }
  .pricing-categories h2 { margin: 0 0 7px; }
  .pricing-category { min-height: 32px; }
  .pricing-utilities { margin-top: 6px; padding-top: 5px; }
  .pricing-filters { justify-content: flex-start; }
}
@media (max-width: 560px) {
  .pricing-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pricing-metric { min-height: 91px; }
  .pricing-crumb { font-size: 13px; gap: 4px; }
  body:has(#main[data-view="kb"]) .top-search { width: auto; flex: 1; padding-inline: 6px; }
  body:has(#main[data-view="kb"]) .top-ai { padding-inline: 7px; }
  .pricing-search { flex-basis: 100%; }
}

/* 往来单位 */
#pt-new { display: none; }
body:has(.partners-page) #pt-new { display: inline-flex; }
body:has(.partners-page) #new-bill { display: none; }
#main:has(.partners-page) {
  background: radial-gradient(ellipse at 49% 0%, light-dark(#e8eafa, #232741), transparent 72%), var(--bg);
}
body:has(.partners-page) .topbar { background: light-dark(#f7f8ff, #1c2030); }
body:has(.partners-page) .top-search { background: light-dark(#eceefb, #292d43); }
.partners-page {
  --pt-accent: light-dark(#4629e8, #b1a1ff);
  --pt-soft: light-dark(#eeebfe, #302750);
  --pt-line: light-dark(#e9e9f4, #33394e);
  --pt-surface: light-dark(#fbfbff, #1d2230);
  --pt-fill: linear-gradient(115deg, #5537fa, #4320e5);
}
.hero-partners { min-height: 0; margin: 0 0 18px; padding: 16px 6px 0; }
.hero-partners h1 { font-size: clamp(27px, 2vw, 34px); margin-bottom: 4px; }
.partner-metrics {
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px;
  margin: 0 0 19px; padding-inline: 6px;
}
.partner-metrics .metric {
  position: relative; min-height: 116px; margin: 0; padding: 12px 12px 11px 61px;
  background: linear-gradient(140deg, var(--surface), var(--pt-surface)); border-radius: 15px;
}
.partner-metrics .metric .icon-tile {
  position: absolute; top: 10px; left: 12px; width: 40px; height: 40px; border-radius: 14px;
}
.partner-metrics .icon-tile svg { width: 24px; height: 24px; }
.partner-metrics .metric .k { font-size: 14px; line-height: 1.35; }
.partner-metrics .metric .v { margin-top: 4px; font-size: clamp(21px, 1.65vw, 28px); line-height: 1.26; }
.partner-metrics .partner-money .v { font-size: clamp(17px, 1.35vw, 24px); }
.partner-metrics .metric-note { margin-top: 6px; color: var(--ink-2); }
.partner-work { display: grid; gap: 12px; align-items: stretch; }
.partner-work > .panel {
  min-width: 0; margin: 0; padding: 14px; border-radius: 16px; background: var(--pt-surface);
}
.partner-work > .partner-directory { display: flex; flex-direction: column; padding: 0; overflow: visible; }
.partner-filter-tabs, .partner-tools, .partner-footer {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
}
.partner-filter-tabs { padding: 16px 15px 13px; border-bottom: 1px solid var(--pt-line); }
.partner-filter-tabs button, .partner-display button, .partner-detail-tabs button, #pt-pages button {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  border: 1px solid transparent; border-radius: 8px; background: transparent;
  font: 650 13px var(--font-ui); color: var(--ink); cursor: pointer;
}
.partner-filter-tabs button { background: var(--surface-3); border-radius: 12px; padding: 5px 11px; min-height: 32px; }
.partner-filter-tabs button span { color: var(--ink-2); font-variant-numeric: tabular-nums; }
.partner-filter-tabs button[aria-pressed="true"], .partner-detail-tabs button[aria-pressed="true"], #pt-pages button[aria-current="page"] {
  background: var(--pt-fill); color: #fff;
}
.partner-filter-tabs button[aria-pressed="true"] span { background: #fff3; border-radius: 7px; padding: 1px 4px; color: #fff; }
.partner-filter-tabs button[data-pt-type="balance"]:not([aria-pressed="true"]) { background: var(--warn-soft); color: var(--warn); }
.partner-tools { padding: 13px 15px; }
.partner-search { position: relative; flex: 1 1 185px; min-width: 0; margin: 0; }
.partner-search svg { position: absolute; left: 9px; top: 8px; width: 16px; height: 16px; color: var(--ink-2); pointer-events: none; }
.partner-tools .partner-search input { width: 100%; min-width: 0; padding-left: 31px; background: var(--surface-3); }
.partner-tools input, .partner-tools select, #pt-size { min-height: 32px; height: 32px; font-size: 12px; }
.partner-tools select, #pt-size { padding-inline: 7px; }
.partner-display {
  display: flex; flex: none; margin-left: auto; padding: 2px;
  border: 1px solid var(--line); border-radius: 8px; background: var(--surface-3);
}
.partner-display button { width: 28px; height: 26px; border-radius: 5px; }
.partner-display svg { width: 15px; height: 15px; }
.partner-display button[aria-pressed="true"] { background: var(--surface); color: var(--pt-accent); box-shadow: var(--panel-shadow); }
#pt-list { max-height: min(52vh, 448px); overflow: auto; }
#pt-list:focus-visible { outline-offset: -2px; }
#pt-list .partner-table { width: 100%; min-width: 610px; }
.partner-table th, .partner-table td { padding: 0 4px; font-size: 12px; white-space: nowrap; }
.partner-table th { height: 41px; background: var(--surface-3); }
.partner-table td { height: 53px; border-color: var(--pt-line); }
.partner-table :is(th, td):first-child { padding-left: 15px; }
.partner-table :is(th, td):last-child { padding-right: 13px; }
.partner-table td:nth-child(3), .partner-address { max-width: 83px; overflow: hidden; text-overflow: ellipsis; }
.partner-name {
  display: block; max-width: 100%; min-width: 0; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; color: var(--ink); font-weight: 700;
}
.partner-table .partner-name { max-width: clamp(108px, 8.5vw, 158px); }
.partner-table .partner-name[aria-current="true"] { color: var(--pt-accent); text-decoration: none; }
.partner-table tr[data-pt-row], .partner-card { cursor: pointer; }
.partner-table tr:has(.partner-name[aria-current="true"]) td { background: var(--pt-soft); }
.partner-table tr:has(.partner-name[aria-current="true"]) td:first-child { box-shadow: inset 3px 0 var(--pt-accent); }
.partner-work .tag { font-size: 11px; padding: 1px 6px; border-radius: 5px; white-space: nowrap; }
.partner-level { background: var(--pt-soft); color: var(--pt-accent); }
.partner-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 195px), 1fr)); gap: 9px; padding: 0 14px 12px; }
.partner-card { min-width: 0; padding: 10px; border: 1px solid var(--pt-line); border-radius: 10px; background: var(--surface); }
.partner-card:has(.partner-name[aria-current="true"]) { border-color: var(--pt-accent); background: var(--pt-soft); }
.partner-card > div:first-child, .partner-card-amount { display: flex; justify-content: space-between; align-items: center; gap: 6px; }
.partner-card-amount { margin-top: 8px; color: var(--ink-2); }
.partner-footer { justify-content: space-between; margin-top: auto; padding: 13px 15px 16px; color: var(--ink-2); font-size: 12px; }
.partner-pagination, #pt-pages { display: flex; align-items: center; gap: 4px; }
.partner-pagination label { margin: 0 1px 0 0; }
#pt-size { margin-right: 4px; }
#pt-pages button { min-width: 25px; height: 28px; padding-inline: 4px; border-color: var(--line); }
#pt-pages button:disabled { opacity: .5; cursor: default; }
#pt-pages button:not(:disabled):hover, .partner-display button:hover, .partner-detail-tabs button:not([aria-pressed="true"]):hover {
  border-color: var(--pt-accent);
}

.partner-detail-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 8px; align-items: start; }
.partner-identity { display: flex; align-items: flex-start; gap: 10px; min-width: 0; }
.partner-identity .icon-tile { width: 44px; height: 44px; flex-basis: 44px; background: var(--pt-soft); color: var(--pt-accent); }
.partner-identity .icon-tile svg { width: 24px; height: 24px; }
.partner-title, .partner-badges, .partner-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.partner-title h2 { margin: 0; font-size: clamp(17px, 1.35vw, 22px); line-height: 1.3; overflow-wrap: anywhere; }
.partner-badges { margin-top: 5px; }
.partner-actions { grid-column: 1 / -1; justify-content: flex-end; }
.partner-close { border: 0; box-shadow: none; background: transparent; padding: 0; width: 29px; min-height: 28px; font-size: 21px; color: var(--ink-2); }
.partner-outline { border-color: var(--pt-accent); color: var(--pt-accent); background: var(--pt-soft); }
.partner-menu { position: relative; }
.partner-menu summary { list-style: none; }
.partner-menu > div {
  position: absolute; right: 0; z-index: 4; display: grid; gap: 4px; width: max-content;
  margin-top: 4px; padding: 6px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); box-shadow: var(--sh-2);
}
.partner-profile { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 15px; }
.partner-detail dl { margin: 0; min-width: 0; }
.partner-profile dl + dl { border-left: 1px solid var(--pt-line); padding-left: 11px; }
.partner-profile dl:not(:last-child) { padding-right: 11px; }
.partner-detail dl > div { display: flex; align-items: baseline; gap: 7px; margin-bottom: 7px; font-size: 12px; }
.partner-detail dt { color: var(--ink-2); flex-shrink: 0; }
.partner-detail dd { min-width: 0; margin: 0; color: var(--ink); font-weight: 650; }
.partner-profile dd { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.partner-balance {
  display: inline-flex; flex-wrap: wrap; gap: 5px 14px; padding: 6px 13px; margin-top: 4px;
  border-radius: 13px; background: var(--pt-soft); font-size: 12px; color: var(--ink-2);
}
.partner-balance b { margin-left: 5px; color: var(--pt-accent); font-size: 14px; }
.partner-balance span + span { border-left: 1px solid var(--line-strong); padding-left: 14px; }
.partner-detail-tabs {
  display: flex; flex-wrap: wrap; gap: 4px; margin: 12px -14px 0; padding: 7px 14px;
  border-block: 1px solid var(--pt-line); background: var(--surface-2);
}
.partner-detail-tabs button { min-height: 29px; padding: 3px 12px; }
.partner-tab-content { margin-top: 10px; }
.partner-tab-content h3 { font-size: 14px; margin: 0; }
.partner-overview { display: grid; grid-template-columns: minmax(0, 1.38fr) minmax(0, 1fr); gap: 10px; }
.partner-overview-card {
  min-width: 0; min-height: 166px; padding: 10px; border: 1px solid var(--pt-line); border-radius: 12px;
  background: var(--surface); box-shadow: var(--panel-shadow);
}
.partner-insights { background: linear-gradient(148deg, var(--pt-soft), var(--surface) 83%); }
.partner-insights h3 .tag { margin-left: 4px; }
.partner-insights dl { margin-top: 13px; }
.partner-insights dl > div { flex-wrap: wrap; justify-content: space-between; }
.partner-overview-card .share-chart { gap: 8px; margin-top: 8px; }
.partner-overview-card .donut { width: 122px; flex: 0 0 122px; }
.partner-overview-card .donut b { font-size: 12px; }
.partner-overview-card .share-chart li { font-size: 11px; }
.partner-overview-card .empty-state { padding: 28px 5px; }
.partner-recent-head { margin: 12px 0 4px; }
.partner-trades { width: 100%; }
.partner-trades th, .partner-trades td { height: 29px; font-size: 12px; padding-block: 2px; border-color: var(--pt-line); }
.partner-trades th { background: var(--surface-3); }
.partner-contact-card { padding-top: 10px; }
.partner-contact-card dd { overflow-wrap: anywhere; }
.partner-detail .grid-form { grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); }
.partner-form-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }

@media (min-width: 1180px) {
  body:has(.partners-page) { --workspace-pad: clamp(12px, 1vw, 18px); }
  body:has(.partners-page) .topbar { flex-basis: 60px; }
  body:has(.partners-page) #nav a.on { background: linear-gradient(115deg, #5069f5, #3d36eb); }
  .partner-work { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .partner-work > .panel { min-height: 626px; }
  .partner-directory:has(+ [hidden]) { grid-column: 1 / -1; }
}
@media (min-width: 1180px) and (max-width: 1480px) {
  .partner-metrics .metric { padding-left: 49px; }
  .partner-metrics .metric .icon-tile { left: 9px; width: 33px; height: 33px; }
  .partner-metrics .icon-tile svg { width: 20px; height: 20px; }
  .partner-metrics .partner-money .v { font-size: 17px; }
}
@media (min-width: 1530px) {
  .partner-detail-head { grid-template-columns: minmax(0, 1fr) auto auto; }
  .partner-close { grid-column: 3; grid-row: 1; }
  .partner-actions { grid-column: 2; grid-row: 1; align-self: end; margin-top: 29px; }
}
@media (max-width: 1179px) {
  .partner-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .partner-metrics .metric { min-height: 92px; }
}
@media (max-width: 650px) {
  .hero-partners { padding-inline: 0; }
  .partner-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 0; }
  .partner-metrics .metric { padding: 9px 8px 8px 44px; }
  .partner-metrics .metric .icon-tile { width: 29px; height: 29px; left: 8px; border-radius: 9px; }
  .partner-metrics .icon-tile svg { width: 17px; height: 17px; }
  .partner-metrics .metric .k { font-size: 12px; }
  .partner-profile { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 0; }
  .partner-profile dl:nth-child(3) { grid-column: 1 / -1; border: 0; padding: 0; }
  .partner-overview { grid-template-columns: minmax(0, 1fr); }
  .partner-actions { justify-content: flex-start; margin-top: 5px; }
  .partner-tools, .partner-footer, .partner-filter-tabs { padding-inline: 10px; }
  .partner-search { flex-basis: 100%; }
}

/* 客户偏好：开单参考、草稿证据与主数据维护 */
.customer-preferences { margin: 12px 0; padding: 12px; border: 1px solid var(--pt-line); border-radius: 12px; background: var(--pt-soft); }
.customer-preferences-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 6px 12px; }
.customer-preferences-head b { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; }
.customer-preferences-head svg { width: 16px; height: 16px; }
.customer-preferences-head span, .sell-preference-item small { color: var(--ink-2); font-size: 11px; }
.sell-preference-list { display: grid; gap: 9px; margin-top: 10px; }
.sell-preference-item { padding-top: 9px; border-top: 1px solid var(--pt-line); }
.sell-preference-item > div:first-child { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; font-size: 12px; }
.sell-preference-item small { display: block; margin-top: 6px; line-height: 1.55; }
.preference-products { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.preference-product { height: auto; min-height: 29px; padding: 4px 8px; background: var(--surface); text-align: left; }
.draft-order-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 10px 0 12px; }
.draft-order-meta label { display: grid; gap: 5px; color: var(--ink-2); font-size: 12px; }
.draft-preference-list { display: grid; gap: 8px; padding-top: 10px; }
.draft-preference-item { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; line-height: 1.5; }
.draft-preference-item .tag { flex: none; }
.draft-preference-item small { display: block; margin-top: 3px; color: var(--ink-2); }
.preference-evidence { display: block; max-width: 230px; margin-top: 5px; line-height: 1.45; }
.partner-preference-list { display: grid; gap: 9px; margin: 10px 0; }
.partner-preference { min-width: 0; padding: 10px; border: 1px solid var(--pt-line); border-radius: 11px; background: var(--surface); }
.partner-preference.pending { border-color: var(--warn); background: var(--warn-soft); }
.partner-preference-title { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; font-size: 12px; }
.partner-preference-title b { min-width: 0; overflow-wrap: anywhere; }
.partner-preference-title .tag:last-child { margin-left: auto; }
.preference-candidates { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }
.preference-candidates span { padding: 3px 7px; border-radius: 6px; background: var(--surface-3); color: var(--ink-2); font-size: 11px; }
.preference-raw { margin-top: 7px; color: var(--ink-2); font-size: 11px; line-height: 1.55; overflow-wrap: anywhere; }
.preference-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
.preference-editor { margin-top: 12px; border-top: 1px solid var(--pt-line); padding-top: 10px; }
.preference-editor summary { display: inline-flex; width: max-content; cursor: pointer; }
.preference-editor form { margin-top: 12px; }
.preference-kind-fields:not([hidden]) { display: grid; grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.preference-kind-fields label { display: grid; gap: 5px; font-size: 12px; }
.preference-kind-fields .check-line { display: flex; align-items: center; gap: 7px; min-height: 36px; }
.preference-raw-input { grid-column: 1 / -1; }
@media (max-width: 650px) {
  .customer-preferences-head { align-items: flex-start; }
  .customer-preferences-head span { flex-basis: 100%; }
  .draft-order-meta, .preference-kind-fields:not([hidden]) { grid-template-columns: minmax(0, 1fr); }
  .partner-preference-title .tag:last-child { margin-left: 0; }
}

/* AI 会话、真实运行记录与安全结果卡片 */
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
#main[data-view="ai"] .hero-assist { min-height: 0; margin: 0 0 12px; padding: 16px 0 0; background: none; }
#main[data-view="ai"] .page-hero h1 { font-size: 25px; text-wrap: balance; }
#main[data-view="ai"] .hero-icon { width: 42px; height: 42px; flex-basis: 42px; background: var(--brand-soft); }
#main[data-view="ai"] .hero-icon svg { width: 23px; height: 23px; }
.ai-work { grid-template-columns: clamp(172px, 14vw, 216px) minmax(0, 1fr) clamp(272px, 20vw, 312px); }
.ai-conversation, .ai-tools { display: grid; gap: 12px; }
.ai-work :is(.ai-session-sidebar, .ai-welcome, .ai-chat), .ai-tools > .panel {
  margin: 0; border-color: var(--line); box-shadow: var(--sh-1);
}
.ai-session-sidebar { position: sticky; top: 8px; max-height: calc(100dvh - 120px); overflow: auto; padding: 12px 8px; }
.ai-session-sidebar .section-head { align-items: center; flex-wrap: wrap; gap: 7px; padding-inline: 4px; }
.ai-session-sidebar h2 { display: flex; align-items: center; gap: 6px; margin: 0; }
.ai-session-sidebar h2 svg { width: 17px; height: 17px; color: var(--brand); }
.ai-session-sidebar > .cell-note { padding: 9px 5px 0; line-height: 1.55; }
.ai-sessions ul { list-style: none; display: grid; gap: 4px; }
.ai-sessions li { display: flex; align-items: stretch; gap: 3px; min-width: 0; }
.ai-session-select {
  flex: 1; min-width: 0; display: flex; align-items: center; gap: 5px; padding: 8px;
  color: var(--ink); background: transparent; border: 1px solid transparent; border-radius: var(--r-md);
  font: inherit; text-align: left; cursor: pointer;
}
.ai-session-select > :first-child { flex: 1; min-width: 0; }
.ai-session-select b, .ai-session-select small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ai-session-select b { font-size: 12.5px; }
.ai-session-select small { margin-top: 3px; color: var(--ink-3); font-size: 10.5px; }
.ai-session-select > .cell-note { flex: none; font-size: 10px; }
.ai-session-select:hover { background: var(--surface-2); }
.ai-session-select[aria-pressed="true"] { color: var(--brand); border-color: var(--brand-line); background: var(--brand-soft); }
.ai-session-select:focus-visible, .ai-steps summary:focus-visible, .ai-card-section summary:focus-visible, .ai-step-data summary:focus-visible {
  outline: none; box-shadow: var(--ring);
}
.ai-session-delete { align-self: center; flex: 0 0 27px; padding: 0; color: var(--ink-3); }
.ai-session-delete:hover { color: var(--bad); background: var(--bad-soft); }
.ai-work .ai-welcome { padding: 12px 14px; background: var(--surface); }
.ai-welcome .bot-art { width: 68px; height: 64px; flex-basis: 68px; }
.ai-welcome-copy { flex: 1; min-width: 0; }
.ai-welcome h2 { text-wrap: balance; }
.ai-status-badges, .ai-model-actions, .ai-run-head, .ai-run-meta, .ai-step-head, .ai-card-flags {
  display: flex; align-items: center; flex-wrap: wrap; gap: 6px;
}
.ai-status-badges, .ai-model-details { margin-top: 6px; }
.ai-model-details summary { width: fit-content; color: var(--ink-2); font-size: 12px; cursor: pointer; }
.ai-model-details summary:hover { color: var(--brand); }
.ai-intro .ai-model-detail, .ai-model-details #ai-metrics { margin-top: 6px; overflow-wrap: anywhere; }
.ai-model-actions { margin-top: 8px; }
.ai-model-actions .cell-note { color: var(--ink-2); }
.ai-session-heading { align-items: flex-start; margin-bottom: 0; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
.ai-session-heading h2 { margin-bottom: 2px; overflow-wrap: anywhere; }
.ai-session-heading .cell-note { overflow-wrap: anywhere; }
#ai-box { height: clamp(170px, calc(100dvh - 550px), 620px); overflow: auto; padding: 12px 4px; overscroll-behavior: contain; scroll-behavior: smooth; }
.ai-chat .msg-content { flex: 1; min-width: 0; max-width: 100%; }
.ai-chat .msg.me .msg-content { display: flex; flex-direction: column; align-items: flex-end; }
.ai-chat .msg-content .bubble { max-width: 72ch; }
.ai-run-head { align-items: flex-start; margin-bottom: 6px; }
.ai-run-meta { color: var(--ink-3); font-family: var(--font-num); font-size: 10.5px; line-height: 1.6; }
.ai-run-meta > span:not(.tag) { padding-right: 6px; border-right: 1px solid var(--line); }
.ai-run-meta > span:last-child { border-right: 0; }
.ai-run-error, .ai-warnings, .ai-uncertainties, .ai-draft-note {
  margin-top: 8px; padding: 9px 10px; border-radius: var(--r-md); background: var(--warn-soft); color: var(--warn);
  font-size: 12px; overflow-wrap: anywhere;
}
.ai-run-error { background: var(--bad-soft); color: var(--bad); }
.ai-warnings, .ai-uncertainties ul, .ai-notes { padding-left: 20px; }
.ai-warnings { padding-left: 28px; }
.ai-card { margin-top: 10px; overflow: hidden; }
.ai-card-head { align-items: flex-start; margin-bottom: 7px; }
.ai-card-head h3 { min-width: 0; overflow-wrap: anywhere; }
.ai-card-head .tag { flex: none; }
.ai-card-sub { margin-bottom: 8px; color: var(--ink-2); font-size: 12px; }
.ai-card .cell-note { margin-top: 8px; line-height: 1.55; }
.ai-card-table { max-height: 310px; overflow: auto; border: 1px solid var(--line); border-radius: var(--r-md); }
.ai-card-table table { min-width: 480px; }
.ai-card-table td { height: auto; min-height: 38px; padding-block: 7px; vertical-align: top; overflow-wrap: anywhere; }
.ai-card-table td .tag { margin-left: 5px; }
.ai-card-flags { margin-bottom: 8px; }
.ai-draft-note { color: var(--ink-2); border: 1px solid var(--warn); }
.ai-draft-note + .btn { margin-top: 9px; }
.ai-card-section { margin-top: 9px; padding-top: 8px; border-top: 1px solid var(--line); }
.ai-card-section > summary, .ai-steps > summary, .ai-step-data > summary { cursor: pointer; color: var(--ink-2); font-weight: 600; }
.ai-card-section > summary { margin-bottom: 8px; }
.ai-card-section .info-line:last-child { border-bottom: 0; }
.ai-insight-metrics small { color: var(--ink-3); font-size: 10px; }
.ai-notes { color: var(--ink-2); font-size: 12px; line-height: 1.65; }
.ai-kv { display: grid; gap: 6px; }
.ai-kv > div { display: grid; grid-template-columns: minmax(80px, .3fr) minmax(0, 1fr); gap: 8px; }
.ai-kv dt { color: var(--ink-3); }
.ai-kv dd { overflow-wrap: anywhere; white-space: pre-wrap; }
.ai-vision-text { max-height: 150px; overflow: auto; padding: 9px; border-radius: var(--r-md); background: var(--surface-2); white-space: pre-wrap; overflow-wrap: anywhere; }
.ai-uncertainties b { display: block; margin-bottom: 4px; }
.ai-steps { margin-top: 10px; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface-2); }
.ai-steps > summary { padding: 9px 10px; }
.ai-steps > ol { list-style: none; padding: 0 9px 9px; display: grid; gap: 7px; counter-reset: ai-step; }
.ai-steps > ol > li { position: relative; padding: 9px 9px 9px 34px; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface); counter-increment: ai-step; }
.ai-steps > ol > li::before { content: counter(ai-step); position: absolute; left: 9px; top: 9px; color: var(--ink-3); font: 11px var(--font-num); }
.ai-steps > ol > li.failed { border-color: var(--bad); }
.ai-step-head { align-items: baseline; }
.ai-step-head > span:last-child:not(.tag) { margin-left: auto; color: var(--ink-3); font-size: 10px; }
.ai-steps li > p { margin-top: 5px; color: var(--ink-2); font-size: 12px; white-space: pre-wrap; overflow-wrap: anywhere; }
.ai-step-data { margin-top: 7px; }
.ai-step-data > summary { font-size: 11px; }
.ai-step-data > b { display: block; margin-top: 6px; font-size: 11px; }
.ai-step-data pre { max-height: 260px; margin: 4px 0; padding: 8px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 11px; }
.ai-no-steps { margin-top: 8px; color: var(--ink-3); font-size: 11px; }
.ai-composer { min-width: 0; border-top: 1px solid var(--line); padding-top: 12px; }
.ai-shortcuts { margin-bottom: 10px; gap: 6px; }
.ai-shortcuts b { color: var(--ink-2); font-size: 12px; }
.ai-shortcuts .btn { padding-inline: 8px; background: var(--surface-2); border-color: var(--line); }
.ai-shortcuts .btn:hover { color: var(--brand); background: var(--brand-soft); border-color: var(--brand-line); }
.ai-compose {
  display: grid; gap: 6px; padding: 6px; background: var(--surface-2);
  border: 1px solid var(--line-strong); border-radius: var(--r-lg);
}
.ai-compose:has(#ai-in:focus) { border-color: var(--brand); box-shadow: var(--ring); }
.ai-compose #ai-in { width: 100%; min-width: 0; min-height: 52px; max-height: 170px; padding: 6px; border: 0; outline: none; box-shadow: none; background: transparent; }
.ai-compose-tools { display: flex; justify-content: flex-end; gap: 8px; }
.ai-compose-tools svg { width: 16px; height: 16px; }
.ai-compose-help { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 4px 10px; margin-top: 6px; color: var(--ink-3); font-size: 10.5px; }
#ai-attachment-summary { flex: none; font-family: var(--font-num); }
#ai-attachment-summary:empty { display: none; }
.ai-progress-row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 6px; }
.ai-progress-row:has(#ai-progress:not(:empty)) { margin-top: 6px; }
#ai-progress { flex: 1; min-width: 180px; margin: 0; }
.ai-attachments { grid-template-columns: repeat(auto-fill, minmax(145px, 1fr)); gap: 8px; margin: 8px 0; }
.ai-attachments:not([hidden]) { display: grid; }
.ai-attachment { min-width: 0; display: grid; gap: 5px; padding: 7px; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface-2); }
.ai-attachment img { width: 100%; height: 105px; object-fit: contain; background: var(--inset); }
.ai-attachment figcaption { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.ai-attachment label { display: grid; gap: 3px; font-size: 10px; }
.ai-attachment input { width: 100%; min-width: 0; height: 28px; padding-inline: 7px; font-size: 11px; }
.ai-attachment .btn { justify-self: end; }
.ai-chat[aria-busy="true"] .ai-compose { opacity: .72 }
.ai-tools > .panel { min-width: 0; }
.ai-overview-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 112px), 1fr)); gap: 8px; }
.ai-overview-grid .metric { padding: 8px; background: var(--surface-2); border-color: var(--line); box-shadow: none; }
.ai-overview-grid .metric .k { gap: 4px; margin-bottom: 4px; font-size: 12px; }
.ai-overview-grid .metric .v { font-size: 21px; }
.ai-overview-grid .icon-tile { width: 22px; height: 22px; flex-basis: 22px; }
.ai-overview-grid .icon-tile svg { width: 14px; height: 14px; }
.ai-capabilities { grid-template-columns: minmax(0, 1fr); gap: 4px; }
.ai-capabilities .task-link { min-height: 52px; padding: 6px 8px; gap: 10px; background: var(--surface-2); border-color: var(--line); }
.ai-capabilities .task-link:hover { background: var(--brand-soft); border-color: var(--brand-line); }
.ai-capabilities .task-link b { display: block; line-height: 1.4; }
.ai-capabilities .task-link small { margin-top: 2px; color: var(--ink-2); line-height: 1.45; text-wrap: pretty; }
.ai-capabilities .task-link > :last-child { flex: none; color: var(--ink-3); font-size: 18px; line-height: 1; }
@media (max-width: 1220px) {
  .ai-work { grid-template-columns: minmax(175px, 210px) minmax(0, 1fr); }
  .ai-tools { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .ai-tools > :last-child { grid-column: 1 / -1; }
}
@media (max-width: 900px) {
  .ai-work { grid-template-columns: minmax(0, 1fr); }
  .ai-session-sidebar { position: static; max-height: 230px; }
  .ai-sessions ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #ai-box { height: clamp(230px, 43dvh, 440px); }
}
@media (max-width: 720px) {
  .ai-tools { grid-template-columns: minmax(0, 1fr); }
  .ai-sessions ul { grid-template-columns: minmax(0, 1fr); }
  .ai-card-head { flex-wrap: wrap; }
  .ai-run-meta > span:not(.tag) { border-right: 0; padding-right: 0; }
  .ai-chat .msg .who { width: 26px; height: 26px; font-size: 11px; }
  .ai-chat .msg { gap: 7px; }
}
@media (max-width: 480px) {
  .ai-welcome .bot-art { display: none; }
  .ai-model-actions { align-items: flex-start; flex-direction: column; }
  .ai-attachments { grid-template-columns: minmax(0, 1fr); }
  .ai-kv > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .ai-compose-tools .btn { flex: 1; }
}
@media (prefers-reduced-motion: reduce) {
  #ai-box { scroll-behavior: auto; }
  .ai-work .msg { animation: none; }
}