/* 掌柜默认外观（2026-10-20 虎哥在打样台定稿）：雾蓝底、卡片毛玻璃、阴影分卡、大圆角、墨黑主按钮、思源黑体、确认时盖章。
   排在 app.css 后面加载，只改颜色、字体、圆角和外壳；布局和交互仍在 app.css / app.js。
   颜色全走变量：<html data-ground="cool|celadon|sand|white"> 换底色，data-primary="blue" 换主按钮，
   以后给客户自己挑（app.js 读 ?ground= / ?primary= 并记在本机）。 */

:root {
  /* 底：一种低饱和的雾蓝，再叠三团同色系的光，玻璃卡片才有东西可透 */
  --ground: #EDF1F5;
  --blob-a: #D2DDEB;
  --blob-b: #E0E7F0;
  --blob-c: #C9D5E5;
  --line: #DDE3EA;
  --line-soft: #EAEEF2;
  --av: #D3DBE5;
  /* 字 */
  --ink: #1C2026;
  --ink-2: #4A515C;
  --ink-3: #6A717C;
  /* 颜色含义：AI 填的（复写蓝）→ 人确认的（墨）→ 生效（朱红章） */
  --carbon: #1A5DB0;
  --carbon-wash: #EAF1FB;
  --seal: #C42A1F;
  --primary: #1C2026;
  --primary-hover: #2A3442;
  /* 卡片：半透明白 + 模糊；边用阴影不用线 */
  --panel-bg: rgba(255, 255, 255, .58);
  --panel-strong: rgba(255, 255, 255, .78);
  --edge-color: rgba(255, 255, 255, .72);
  --edge-shadow: 0 1px 2px rgba(28, 32, 38, .07), 0 4px 14px -6px rgba(28, 32, 38, .16);
  --glass: blur(20px) saturate(160%);
  --r-panel: 18px;
  --r-ctl: 10px;
  --r-chip: 8px;
  --stamp-d: 1.4s; /* 盖章全程；38% 处落到纸上，app.js 的 STAMP_IMPACT 要跟着改 */

  /* app.css 的旧变量改指新值 */
  --navy: var(--primary);
  --navy-2: var(--carbon);
  --bg: var(--ground);
  --surface: var(--panel-bg);
  --muted: var(--ink-3);
  --grey: var(--ink-3); /* 灰色小标签的字：原来的浅灰在浅底上只有 2.8:1，看不清 */
  --blue: var(--carbon);
  --blue-bg: var(--carbon-wash);
  --shadow: var(--edge-shadow);
  --radius: var(--r-panel);
  --font: "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", system-ui, sans-serif;
}
/* 其他底色：留给客户挑 */
:root[data-ground="cool"] { --ground: #F1F2F4; --line: #E3E5E9; --line-soft: #EEF0F2; --av: #D9DDE3; --blob-a: #DCE1E8; --blob-b: #E6E9EE; --blob-c: #D3D9E1; }
:root[data-ground="celadon"] { --ground: #EBF0EF; --line: #DAE2E0; --line-soft: #E7EDEC; --av: #D2DCDA; --blob-a: #D1E1DC; --blob-b: #DFE9E6; --blob-c: #C6D8D2; }
:root[data-ground="sand"] { --ground: #F2F0EC; --line: #E3E0DA; --line-soft: #EEEBE6; --av: #DDD8D0; --blob-a: #E3DCD0; --blob-b: #EBE6DE; --blob-c: #D9D0C2; }
:root[data-ground="white"] { --ground: #FFFFFF; --line: #E5E7EB; --line-soft: #EFF1F3; --av: #E3E6EA; --blob-a: #E9ECF0; --blob-b: #F1F3F5; --blob-c: #E4E8ED; }
:root[data-primary="blue"] { --primary: #2160D8; --primary-hover: #1B4FB5; }

/* ───────── 底与字 ───────── */
html, body { background: var(--ground); }
body { color: var(--ink); -webkit-font-smoothing: antialiased; font-variant-numeric: tabular-nums; }
.app-shell, .login-screen {
  background:
    radial-gradient(640px 480px at 6% 4%, var(--blob-a) 0%, transparent 70%),
    radial-gradient(700px 520px at 96% 14%, var(--blob-b) 0%, transparent 70%),
    radial-gradient(760px 560px at 60% 80%, var(--blob-c) 0%, transparent 72%),
    var(--ground);
}
:focus-visible { outline: 2px solid var(--carbon); outline-offset: 2px; }

/* ───────── 左栏：不再是深色大块，直接摆在底色上 ───────── */
.sidebar { padding: 16px 12px; background: transparent; color: var(--ink); }
.brand { padding: 4px 8px 22px; }
/* 10-23 标识 BSL 横着摆在名字前面：左栏高 30px；登录页放大到 56px。字母跟墨色（currentColor） */
.brand-mark {
  width: auto; height: auto; border-radius: 0; background: transparent; color: var(--ink); box-shadow: none;
}
.brand-mark svg { display: block; width: 59px; height: 30px; }
.home-brand .brand-mark svg { width: 110px; height: 56px; }
.brand-name { font-size: 17px; font-weight: 650; letter-spacing: 0; }
.brand-sub, .nav-label { display: none; }
.nav-list { gap: 2px; }
.nav-link { height: 40px; padding: 0 10px; gap: 10px; border-radius: var(--r-ctl); color: var(--ink-2); }
.nav-link:hover { background: rgba(255, 255, 255, .6); color: var(--ink); }
.nav-link.active { background: #FFFFFF; color: var(--ink); font-weight: 600; box-shadow: 0 0 0 1px var(--line); }
.nav-icon { width: 18px; height: 18px; display: grid; place-items: center; color: var(--ink-3); }
.nav-link.active .nav-icon { color: var(--ink); }
.nav-count { height: 20px; min-width: 20px; border-radius: 10px; background: var(--seal); font-size: 12px; font-weight: 600; }
.sidebar-foot { padding: 12px 10px 0; color: var(--ink-3); font-size: 12px; }
.ic { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

/* ───────── 顶栏 ───────── */
.topbar { background: transparent; border-bottom: 1px solid rgba(28, 32, 38, .06); backdrop-filter: none; }
.page-kicker { display: none; }
.page-name { font-size: 18px; font-weight: 650; }
.crumb { color: var(--ink-3); font-weight: 500; }
.top-search, .industry-select, .icon-button { border-color: var(--line); border-radius: var(--r-ctl); background: rgba(255, 255, 255, .7); }
.top-search { color: var(--ink-3); }
.top-search input { font-size: 13px; }
.industry-select { font-size: 13px; }
.icon-button { display: inline-grid; place-items: center; color: var(--ink-2); }
.icon-button:hover { color: var(--ink); background: #FFFFFF; }
.user-chip { border-color: transparent; background: transparent; }
.avatar { border-radius: 50%; background: var(--ink); color: #FFFFFF; font-size: 13px; font-weight: 600; }
.user-name { font-size: 13px; font-weight: 600; }
.user-role { font-size: 12px; color: var(--ink-3); }

/* ───────── 卡片：毛玻璃 + 阴影分卡 + 大圆角 ───────── */
.card, .action-card, .customer-banner, .stat-chip, .stat-card, .module-strip, .wb-bar, .switch-banner, .login-box {
  border: 1px solid var(--edge-color); border-radius: var(--r-panel); background: var(--panel-bg);
  box-shadow: var(--edge-shadow); -webkit-backdrop-filter: var(--glass); backdrop-filter: var(--glass);
}
/* 卡片里再套卡片：不再叠模糊，换成实一点的白 */
.card .action-card, .card .card, .modal .action-card {
  background: var(--panel-strong); -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: none; border-color: var(--line-soft);
}
.card-title, .side-head h2, .mini-head .card-title { font-weight: 600; }
.card-title { font-size: 15px; }
.mini-head .card-title { font-size: 14px; }
.side-head h2 { font-size: 15px; }
.action-title, .wb-main .action-title { font-size: 14px; font-weight: 600; }
.action-icon, .wb-main .action-icon { background: rgba(28, 32, 38, .05); color: var(--ink-2); }
.stat-chip.warn { border-color: rgba(255, 255, 255, .72); background: rgba(255, 249, 238, .72); }
.stat-chip b { font-weight: 650; }
.customer-banner { background: var(--panel-bg); }
.customer-avatar { background: var(--av); color: var(--ink-2); }
.customer-name { font-weight: 650; }

/* 卡片里的格子：实白、细线、中圆角 */
.option-card, .field-card, .review-row, .order-card, .demo-account, .job-tab, .module-tile, .choice-option, .oplog-row, .switch-row {
  border-color: var(--line); border-radius: 12px; background: rgba(255, 255, 255, .86);
}
.option-card.recommended { background: rgba(255, 255, 255, .92); }
.option-card.selected, .order-card.selected { border-color: var(--ink); box-shadow: 0 0 0 3px rgba(28, 32, 38, .07); }
.option-card:hover, .field-card:hover, .order-card:hover, .demo-account:hover { border-color: #B9BEC6; }
.option-ribbon { background: var(--carbon); font-size: 11px; font-weight: 600; }
.option-total { font-weight: 700; letter-spacing: -.02em; }
.option-highlight { background: var(--carbon-wash); color: #2D4F78; }
.job-tab.active { border-color: var(--ink); box-shadow: 0 0 0 3px rgba(28, 32, 38, .07); }
.job-tab strong { color: var(--ink); }
.message-preview, .source-entry textarea, .scene-entry-card textarea { background: rgba(255, 255, 255, .78); border-color: var(--line); }
.inferred-summary { border-color: #D6E3F3; background: rgba(234, 241, 251, .6); }
.wb-bar { position: sticky; background: rgba(255, 255, 255, .72); }
.wb-bar-info { color: var(--ink-2); font-size: 13px; }

/* ───────── 按钮 ───────── */
.btn { border-color: var(--line); border-radius: var(--r-ctl); background: rgba(255, 255, 255, .78); color: var(--ink); font-weight: 600; font-size: 13px; }
.btn:hover { transform: none; border-color: #B9BEC6; box-shadow: none; background: #FFFFFF; }
.btn.primary { border-color: var(--primary); background: var(--primary); color: #FFFFFF; }
.btn.primary:hover { border-color: var(--primary-hover); background: var(--primary-hover); }
.btn.soft { border-color: transparent; background: rgba(28, 32, 38, .05); }
.btn.soft:hover { background: rgba(28, 32, 38, .08); }
.btn.text { border-color: transparent; background: transparent; color: var(--carbon); }
.btn.text:hover { background: rgba(26, 93, 176, .06); }
.btn.small { font-size: 12px; }
.btn .ic { width: 16px; height: 16px; vertical-align: -3px; }
.new-msg { display: inline-flex; align-items: center; justify-content: center; gap: 4px; }
.top-search .ic { width: 16px; height: 16px; }
.icon-button .ic { width: 17px; height: 17px; }
.tile-icon .ic { width: 20px; height: 20px; color: var(--ink-2); }
.stat-strip-title { display: none; }
.wb-bar .btn.primary { min-height: 40px; padding: 8px 20px; font-size: 14px; }
.chip-btn, .module-link { border-color: var(--line); border-radius: var(--r-ctl); background: rgba(255, 255, 255, .7); color: var(--ink); }
.admin-tab.active { border-color: var(--primary); background: var(--primary); }

/* ───────── 弹层、提示、免责声明 ───────── */
.modal { border-radius: var(--r-panel); }
.modal-backdrop { background: rgba(28, 32, 38, .32); }
.toast { border-radius: var(--r-ctl); background: var(--ink); }
.disclaimer { border-top-color: rgba(28, 32, 38, .06); background: transparent; color: var(--ink-3); }

/* ───────── 登录页：和工作台同一块底，不再是深蓝大块 ───────── */
.login-hero { background: transparent; color: var(--ink); }
.login-hero::before, .login-hero::after { display: none; }
.hero-copy .eyebrow { color: var(--ink-3); letter-spacing: .04em; }
.hero-copy h1 { font-weight: 700; letter-spacing: -.02em; }
.hero-copy h1 em { color: var(--carbon); }
.hero-copy p { color: var(--ink-2); }
.hero-tile { border-color: var(--edge-color); background: var(--panel-bg); color: var(--ink); box-shadow: var(--edge-shadow); }
.hero-tile span { color: var(--ink-3); }
.hero-foot { color: var(--ink-3); }
.login-side { background: transparent; }
.login-box { background: rgba(255, 255, 255, .72); }
.form-row label { color: var(--ink-2); }
.form-row input { border-color: var(--line); border-radius: var(--r-ctl); }

/* ───────── 盖章：章从按钮上方落下，印留在按钮的位置 ───────── */
.stamp-fx { position: fixed; z-index: 60; width: 0; height: 0; pointer-events: none; }
.stamp-fx .stamper, .stamp-fx .seal { position: absolute; left: 0; top: 0; opacity: 0; }
/* 章身（从上往下看的印章顶） */
.stamp-fx .stamper {
  width: 118px; height: 118px; margin: -59px 0 0 -59px; border-radius: 50%;
  background: radial-gradient(circle at 36% 30%, #8C3B2F 0%, #62241B 46%, #3F1610 100%);
  box-shadow: inset 0 0 0 5px rgba(255, 255, 255, .07), inset 0 0 0 12px rgba(0, 0, 0, .12), 0 2px 4px rgba(28, 32, 38, .3);
  animation: zg-stamper var(--stamp-d) both;
}
/* 印：留在纸上的那个 */
.stamp-fx .seal { width: 108px; height: 108px; margin: -54px 0 0 -54px; color: var(--seal); filter: url(#zg-inkpad); animation: zg-ink var(--stamp-d) both; }
.stamp-fx.fade .seal { opacity: .88; transform: rotate(-9deg); animation: zg-ink-out .45s ease-in both; }
.stamp-fx .seal circle { fill: none; stroke: currentColor; }
.stamp-fx .seal text { fill: currentColor; stroke: none; font-family: var(--font); text-anchor: middle; }
.stamp-pressed { animation: zg-btn-under var(--stamp-d) both; }
@keyframes zg-stamper {
  0% { opacity: 0; transform: translate(-12px, -40px) scale(1.5); box-shadow: inset 0 0 0 5px rgba(255, 255, 255, .07), inset 0 0 0 12px rgba(0, 0, 0, .12), 0 30px 36px -10px rgba(28, 32, 38, .26); animation-timing-function: cubic-bezier(.45, 0, .85, .35); }
  8% { opacity: 1; }
  38% { opacity: 1; transform: translate(0, 0) scale(1); box-shadow: inset 0 0 0 5px rgba(255, 255, 255, .07), inset 0 0 0 12px rgba(0, 0, 0, .12), 0 2px 3px rgba(28, 32, 38, .38); animation-timing-function: ease-out; }
  44% { transform: translate(0, 0) scale(.965); }
  52% { opacity: 1; transform: translate(0, 0) scale(1); animation-timing-function: cubic-bezier(.2, .7, .3, 1); }
  80%, 100% { opacity: 0; transform: translate(-6px, -24px) scale(1.3); box-shadow: inset 0 0 0 5px rgba(255, 255, 255, .07), inset 0 0 0 12px rgba(0, 0, 0, .12), 0 26px 30px -10px rgba(28, 32, 38, .2); }
}
@keyframes zg-ink {
  0%, 37.9% { opacity: 0; transform: rotate(-9deg) scale(1.03); }
  38% { opacity: .97; transform: rotate(-9deg) scale(1.03); }
  100% { opacity: .88; transform: rotate(-9deg) scale(1); }
}
@keyframes zg-ink-out { to { opacity: 0; transform: rotate(-9deg) scale(.96); } }
@keyframes zg-btn-under {
  0% { transform: scale(1); }
  6%, 37.9% { transform: scale(.96); }
  38%, 100% { transform: scale(.96); opacity: 0; }
}

/* ───────── 补：app.css 里没写过样式的块（客户档案、账号、日志、更多、选项头、改挂）与残留的橙色 ───────── */
.btn.accent { border-color: var(--primary); background: var(--primary); color: #FFFFFF; }
.btn.accent:hover { border-color: var(--primary-hover); background: var(--primary-hover); }
.btn.danger:hover { background: var(--red-bg); }
.option-head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 0 8px; }
.option-head .option-total { margin-top: 0; }
.action-title .action-kind { margin-left: 8px; }
.task-shortage { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; margin-top: 6px; font-size: 13px; }
.task-items { margin: 6px 0 0; padding-left: 20px; font-size: 13px; line-height: 1.6; }
.mini-note { color: var(--ink-3); font-size: 13px; line-height: 1.5; }
.empty-line { padding: 10px 0; color: var(--ink-3); font-size: 13px; }
.empty-card .empty-line { padding: 22px 14px; text-align: center; }
.page-count { color: var(--ink-2); }
.modal-sub { margin-top: 2px; color: var(--ink-3); font-size: 13px; }
.data-table:not(.sku-table) th.num { white-space: nowrap; }
.timeline-item > .btn { grid-column: 2; justify-self: start; margin: 2px 0 0 -8px; white-space: nowrap; }

/* 客户档案 */
.cust-list { margin: 0; padding: 4px 8px 8px; list-style: none; }
.cust-row { border-bottom: 1px solid var(--line-soft); }
.cust-row:last-child { border-bottom: 0; }
.cust-main { width: 100%; display: flex; align-items: center; gap: 12px; padding: 10px 8px; border: 0; border-radius: var(--r-ctl); background: transparent; color: inherit; text-align: left; }
.cust-main:hover { background: rgba(255, 255, 255, .6); }
.cust-name { min-width: 0; flex: 1; display: grid; gap: 2px; }
.cust-name strong { font-size: 14px; font-weight: 650; }
.cust-name > span { overflow: hidden; color: var(--ink-3); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.cust-right { flex: none; color: var(--carbon); font-size: 12px; font-weight: 600; }
.cust-detail { display: grid; gap: 4px; padding: 0 8px 12px 52px; }
.customer-avatar.small { width: 32px; height: 32px; border-radius: 10px; font-size: 14px; }

/* 老板后台：账号与权限、操作日志 */
.admin-grid { display: grid; gap: 11px; align-content: start; }
.perm-block { display: grid; gap: 8px; padding: 2px 13px 14px; font-size: 13px; }
.perm-block > div { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.perm-block em { flex: none; min-width: 64px; color: var(--ink-3); font-size: 12px; font-style: normal; font-weight: 600; }
.acct-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; margin: 0; padding: 2px 13px 14px; list-style: none; }
.acct-list > li { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255, 255, 255, .86); }
.acct-list > li strong { font-size: 13px; }
.acct-list > li .tag:first-of-type { margin-left: auto; }
[data-oplog] { padding: 14px 16px 16px; }
.oplog-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.oplog-row { display: block; }
.oplog-line { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; }
.oplog-time { flex: none; font-weight: 500; }
.oplog-who { font-size: 13px; font-weight: 650; }
.oplog-object { min-width: 0; color: var(--ink-2); font-size: 13px; overflow-wrap: anywhere; }
.oplog-deny { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; margin-top: 6px; }
.oplog-more { margin-top: 4px; color: var(--ink-3); font-size: 12px; }
.oplog-more summary { cursor: pointer; }
.oplog-toggle { background: rgba(255, 255, 255, .7); }

/* 客户对不上、改挂 */
.mismatch-bar { display: flex; align-items: center; gap: 10px; margin: 0 0 8px; padding: 10px 12px; border: 1px solid var(--edge-color); border-radius: var(--r-panel); background: rgba(255, 249, 238, .72); box-shadow: var(--edge-shadow); }
.mm-mark, .choice-mark { width: 28px; height: 28px; flex: none; display: grid; place-items: center; border-radius: 50%; background: var(--yellow); color: #FFFFFF; font-size: 14px; font-weight: 700; }
.mm-copy { min-width: 0; flex: 1; display: grid; gap: 2px; }
.mm-copy strong { font-size: 13px; }
.mm-copy span { color: var(--ink-2); font-size: 12px; }
.choice-banner { border-color: var(--edge-color); border-radius: var(--r-panel); background: rgba(255, 249, 238, .72); box-shadow: var(--edge-shadow); }
.choice-option:hover { border-color: var(--ink); box-shadow: 0 0 0 3px rgba(28, 32, 38, .07); }
.choice-quote { border-left-color: var(--yellow); }
.choice-why { margin-top: 2px; color: var(--ink-3); font-size: 12px; }
.move-list { display: grid; gap: 8px; }
.move-option { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255, 255, 255, .86); cursor: pointer; }
.move-option:hover { border-color: #B9BEC6; }
.move-option:has(input:checked) { border-color: var(--ink); box-shadow: 0 0 0 3px rgba(28, 32, 38, .07); }
.move-option input { accent-color: var(--ink); }
.move-option > span { min-width: 0; display: grid; gap: 2px; }
.move-option strong { font-size: 14px; }
.move-option small { color: var(--ink-3); font-size: 12px; }

/* 新客福利券：不再用橙色，跟着复写蓝走 */
.coupon-card { border-color: var(--line); background: var(--panel-strong); }
.coupon-value { border-right-color: var(--line); color: var(--carbon); }
.coupon-copy span { color: var(--ink-2); }
.coupon-tag { background: var(--carbon); }
.coupon-preview { border-color: var(--line); background: rgba(255, 255, 255, .6); }
.preview-text { color: var(--ink-2); }
.anchor.hit { background: var(--carbon); }
.source-line.hit { border-left-color: var(--yellow); }

/* 售后案例、依据、其余字段的表格：以前没有样式，输入框和表格是浏览器自带的 */
.case-view { display: grid; gap: 4px; margin-top: 6px; font-size: 13px; line-height: 1.6; }
.case-view em { display: inline-block; min-width: 40px; margin-right: 8px; color: var(--ink-3); font-size: 12px; font-style: normal; font-weight: 600; }
.case-edit { margin-top: 6px; }
.case-edit > summary, .basis-more > summary { color: var(--ink-2); font-size: 13px; cursor: pointer; }
.case-form { display: grid; gap: 8px; margin-top: 8px; }
.case-form label { display: grid; gap: 4px; color: var(--ink-2); font-size: 12px; font-weight: 600; }
.case-form textarea { width: 100%; padding: 8px 10px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: rgba(255, 255, 255, .86); font-size: 13px; font-weight: 400; line-height: 1.6; resize: vertical; }
.basis-group { padding: 10px 14px 12px; }
.basis-group > summary { font-size: 13px; font-weight: 600; cursor: pointer; }
.basis-item { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line-soft); }
.basis-item > strong { display: block; font-size: 13px; }
.md-body { color: var(--ink-2); font-size: 13px; line-height: 1.7; }
/* 方案说明里的表：表头浅底、行间细线、数字列右对齐等宽数字；同一块说明里几张表列宽一致，“说明”列允许换行 */
.md-table { width: 100%; border-collapse: collapse; margin: 6px 0 10px; font-size: 13px; line-height: 1.5; }
.md-table th, .md-table td { padding: 6px 8px; border-bottom: 1px solid var(--line-soft); text-align: left; vertical-align: top; }
.md-table thead th { background: rgba(28, 32, 38, .045); color: var(--ink-2); font-weight: 600; white-space: nowrap; }
.md-table .md-num, .md-table .md-idx { white-space: nowrap; font-variant-numeric: tabular-nums; }
.md-table .md-num { padding-right: 6px; padding-left: 6px; text-align: right; }
.md-table .md-idx { text-align: center; }
.option-explain .md-table { min-width: 520px; table-layout: fixed; }
.option-explain .md-table .md-idx { width: 2.6em; }
.option-explain .md-table .md-brand { width: 5.6em; }
.option-explain .md-table .md-model { width: 24%; }
.option-explain .md-table .md-num { width: 5em; }
.kv-grid { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 12px; margin: 8px 0 0; font-size: 13px; }
.kv-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.kv-table th, .kv-table td { padding: 6px 8px; border-bottom: 1px solid var(--line-soft); text-align: left; vertical-align: middle; }
.kv-table th { color: var(--ink-3); font-weight: 600; }
.kv-table tbody th { width: 28px; text-align: center; }
.pinned { color: var(--ink-3); }
.no-mention { margin-top: 6px; color: var(--ink-3); font-size: 12px; }
.kv { display: contents; }
.kv dt { color: var(--ink-3); font-size: 12px; }
.kv dd { min-width: 0; margin: 0; }
.anchor-link { padding: 1px 6px; border: 0; border-radius: 6px; background: var(--carbon-wash); color: var(--carbon); font: 700 11px/1.5 var(--font); cursor: pointer; }
.anchor-link:hover { color: var(--ink); }

/* 弹层里的输入框：和别处一样的细线、中圆角，不用浏览器自带的黑框 */
.modal textarea { width: 100%; padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: #FFFFFF; line-height: 1.6; resize: vertical; }
.modal select, .modal .setting-input, .form-row input { border-radius: var(--r-ctl); }
.knowledge-drawer { border-radius: var(--r-panel) 0 0 var(--r-panel); }

/* 手机“更多”弹层：以前没有样式，按钮是浏览器自带的灰框 */
.more-list { display: grid; gap: 8px; }
.more-link { width: 100%; min-height: 48px; display: flex; align-items: center; gap: 12px; padding: 0 14px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255, 255, 255, .86); color: var(--ink); font-size: 15px; font-weight: 600; text-align: left; }
.more-link .ic { width: 20px; height: 20px; color: var(--ink-2); }
.more-link.active { border-color: var(--ink); box-shadow: 0 0 0 3px rgba(28, 32, 38, .07); }
.more-link b { min-width: 20px; height: 20px; margin-left: auto; padding: 0 6px; display: grid; place-items: center; border-radius: 10px; background: var(--seal); color: #FFFFFF; font-size: 12px; font-weight: 600; }
.about-line { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line-soft); color: var(--ink-3); font-size: 12px; line-height: 1.6; }
.about-line strong { display: block; margin-bottom: 2px; color: var(--ink-2); }

/* ───────── 手机 ───────── */
.wb-top .btn { flex: none; white-space: nowrap; }
@media (max-width: 850px) {
  .topbar { background: rgba(237, 241, 245, .78); background: color-mix(in srgb, var(--ground) 78%, transparent); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
  .mobile-nav { border-top-color: rgba(28, 32, 38, .06); background: rgba(255, 255, 255, .86); }
  .mobile-nav .nav-link { position: relative; height: auto; color: var(--ink-3); }
  .mobile-nav .nav-link.active { color: var(--ink); background: rgba(28, 32, 38, .06); box-shadow: none; }
  .mobile-nav .nav-icon { width: auto; height: auto; }
  /* 待审批的数字：挂在图标右上角，不再另占一行把文字顶歪 */
  .mobile-nav .nav-count { position: absolute; top: -1px; right: 5px; height: 18px; min-width: 18px; margin: 0; padding: 0 5px; border-radius: 9px; font-size: 11px; line-height: 1; }
  .sheet-backdrop { place-items: end center; }
  .disclaimer { background: rgba(255, 255, 255, .86); }
}
@media (max-width: 520px) {
  .page-name { font-size: 15px; }
  /* 切换行业的下拉：窄屏下 13 号字会把两个字的行业名裁掉 */
  .topbar .industry-select { width: 56px; padding: 0 0 0 6px; font-size: 12px; }
  /* 工作台底栏上只剩一个被隐藏的重复按钮时，整条是空的，别留一条空白卡片 */
  .wb-bar:has(.wb-bar-buttons > .bar-dup:only-child) { display: none; }
}

/* ---- “?” 说明：小字收进标题旁，悬停/点按才出现（10-20 虎哥：页面靠标题说清楚，不铺注释） ---- */
.tip { position: relative; display: inline-grid; place-items: center; width: 16px; height: 16px; margin: 0 0 0 6px; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: rgba(255, 255, 255, .7); color: var(--ink-3); font: 600 11px/1 var(--font); vertical-align: 1px; cursor: help; flex: none; }
.tip:hover, .tip:focus-visible { color: var(--ink); border-color: var(--ink-3); outline: none; }
.tip::after { content: attr(data-tip); position: absolute; z-index: 60; left: 50%; top: calc(100% + 8px); width: max-content; max-width: min(280px, 78vw); padding: 8px 10px; border-radius: 10px; background: var(--ink); color: #fff; font: 400 12.5px/1.55 var(--font); text-align: left; white-space: normal; transform: translateX(-50%); opacity: 0; pointer-events: none; transition: opacity .12s; box-shadow: 0 6px 18px -6px rgba(28, 32, 38, .35); }
.tip:hover::after, .tip:focus::after { opacity: 1; }
.tip.end::after { left: auto; right: -6px; transform: none; }
.tip.start::after { left: -6px; transform: none; }
/* 毛玻璃卡片各自成层，说明框的 z-index 出不了本卡，会被相邻卡/粘性操作条盖住：悬停或聚焦时把含“?”的那张卡抬高一层（:where 零优先级，已 sticky 的保持原 position） */
:where(.card, .action-card, .customer-banner, .stat-chip, .stat-card, .module-strip, .switch-banner, .login-box, .wb-block, .credit-bar):has(.tip:hover, .tip:focus, .tip:focus-visible) { position: relative; }
:is(.card, .action-card, .customer-banner, .stat-chip, .stat-card, .module-strip, .switch-banner, .login-box, .wb-block, .credit-bar, .wb-bar):has(.tip:hover, .tip:focus, .tip:focus-visible) { z-index: 30; }

/* ===== 工单 P1：首页与作业工作台（只由 P1 改） ===== */
/* 范围：main.content.view-home / view-workbench 和知识与案例抽屉，全部用页面类名限定，不动通用规则。
   规矩：间距只用 4/8/12/16/24；要看的数据和状态字号 ≥ 13px；说明文字不上屏（收进 tip 的“?”）；颜色只用上面的变量。 */

/* ── 首页 + 工作台共用：数字条、标签、状态词、小按钮 ── */
.view-home .stat-strip, .view-workbench .stat-strip { gap: 12px; margin: 0 0 12px; }
.view-home .stat-chip, .view-workbench .stat-chip { min-height: 56px; padding: 8px 16px; display: flex; align-items: center; justify-content: flex-start; gap: 12px; text-align: left; }
.view-home .stat-chip-label, .view-workbench .stat-chip-label { flex: none; overflow: visible; color: var(--ink-2); font-size: 14px; }
.view-home .stat-chip b, .view-workbench .stat-chip b { grid-row: auto; grid-column: auto; font-size: 22px; }
.view-home .tag, .view-workbench .tag { padding: 4px 8px; font-size: 13px; }
.view-home .status-pill, .view-workbench .status-pill { padding: 4px 12px; font-size: 13px; }
.view-home .btn.small, .view-home .chip-btn, .view-workbench .btn.small { min-height: 32px; padding: 4px 12px; font-size: 13px; }
.view-home .btn.text.small, .view-workbench .btn.text.small { padding: 4px 8px; }
.view-workbench .tiny, .view-workbench .muted { font-size: 13px; }

/* ── 首页 ── */
.view-home .home-head { gap: 16px; margin: 0 0 16px; }
.view-home .greet { gap: 8px; }
.view-home .greet-pack { font-size: 13px; }
.view-home .home-chips { gap: 8px; }
.view-home .module-strip { margin: 0 0 12px; }
.view-home .module-strip > summary { min-height: 40px; padding: 8px 16px; font-size: 13px; }
.view-home .module-links { gap: 8px; padding: 0 12px 12px; }
.view-home .module-link { min-height: 32px; padding: 4px 12px; font-size: 13px; }
.view-home .module-link strong { font-size: 13px; }
.view-home .home-grid { gap: 16px; }
.view-home .home-col { gap: 16px; }
.view-home .mini-head { min-height: 48px; padding: 12px 16px 8px; gap: 8px; }
.view-home .mini-head .card-title { font-size: 15px; }
.view-home .mini-body { padding: 0 16px 8px; }
.view-home .mini-row { min-height: 48px; padding: 8px 0; gap: 12px; }
.view-home .mini-main { gap: 4px; }
.view-home .mini-main strong { font-size: 14px; }
.view-home .mini-main > span, .view-home .mini-right, .view-home .mini-note { font-size: 13px; }
.view-home .todo-list { padding: 0 16px 8px; }
.view-home .todo-row { padding: 8px 0; gap: 4px 12px; }
.view-home .todo-main { gap: 4px; }
.view-home .todo-main strong { font-size: 14px; }
.view-home .todo-main > span { display: block; font-size: 13px; line-height: 1.5; -webkit-line-clamp: unset; }
.view-home .todo-meta { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.view-home .todo-detail { margin-top: 4px; color: var(--ink-2); white-space: normal; }
.view-home .more-link-inline { margin: 0 16px 12px; }
.view-home .empty-line { padding: 12px 16px 16px; font-size: 13px; }

/* ── 工作台：页头（分页签 / 客户条 / 吸顶操作条） ── */
.view-workbench .wb-top { min-height: 36px; gap: 12px; margin: 0 0 12px; }
.view-workbench .job-tabs { gap: 8px; margin: 0; padding: 0; }
.view-workbench .job-tab, .view-workbench .job-tab.active { min-height: 36px; padding: 4px 16px; display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: var(--r-ctl); font-size: 14px; }
.view-workbench .job-tab.active { border-color: var(--ink); box-shadow: 0 0 0 3px rgba(28, 32, 38, .07); font-weight: 600; }
.view-workbench .job-tab em { font-size: 13px; }
.view-workbench .wb-top .btn.small { min-height: 36px; }
.view-workbench .live-badge { display: inline-flex; align-items: center; gap: 8px; padding: 4px 12px; border-radius: 999px; background: var(--carbon-wash); color: var(--carbon); font-size: 13px; font-weight: 600; }
.view-workbench .live-badge.ok { flex: none; white-space: nowrap; background: var(--green-bg); color: var(--green); }      /* 手机上别被分页签挤成三四行 */
.view-workbench .live-badge.bad { background: var(--red-bg); color: var(--red); }
.view-workbench .mini-spinner { width: 12px; height: 12px; flex: none; border: 2px solid currentColor; border-top-color: transparent; border-radius: 50%; animation: spin .8s linear infinite; }
.view-workbench .wb-banner { min-height: 56px; margin: 0 0 12px; padding: 8px 16px; gap: 12px; }
.view-workbench .wb-banner .customer-avatar { width: 40px; height: 40px; border-radius: 12px; font-size: 16px; }
.view-workbench .wb-banner .customer-name { font-size: 14px; }
.view-workbench .customer-tags { gap: 8px; }
.view-workbench .wb-banner .wb-meta { font-size: 13px; }
.view-workbench .wb-bar { top: 8px; min-height: 56px; margin: 0 0 12px; padding: 8px 16px; gap: 12px; }
.view-workbench .wb-bar-info, .view-workbench .bar-info { color: var(--ink-2); font-size: 14px; }
.view-workbench .bar-info.warn { color: var(--yellow); }
.view-workbench .blocked-note { padding: 4px 12px; font-size: 13px; }
.view-workbench .wb-bar-buttons { gap: 8px; }
.view-workbench .wb-bar .btn { min-height: 40px; padding: 8px 20px; font-size: 14px; }
.view-workbench .wb-bar:has(.wb-bar-buttons > .bar-dup:only-child) { min-height: 48px; padding: 4px 16px; }
.view-workbench .job-shortages, .view-workbench .job-shortage-list li, .view-workbench .job-shortage-list li small, .view-workbench .job-shortage-sources { font-size: 13px; }
.view-workbench .mismatch-bar, .view-workbench .choice-banner { margin: 0 0 12px; padding: 8px 16px; gap: 12px; }
.view-workbench .mm-copy { gap: 4px; }
.view-workbench .mm-copy span, .view-workbench .choice-copy span { font-size: 13px; }
.view-workbench .choice-copy { gap: 4px; }

/* “?” 的气泡：不出现时不占位（否则 375 宽下气泡会把页面撑出横向滚动条）；出现时贴着所在卡片的左右边，不会伸出屏幕 */
.view-workbench .action-card, .view-workbench .side-card { position: relative; }
.view-workbench .tip { position: static; }
.view-workbench .tip::after { display: none; top: 52px; right: 16px; left: 16px; width: auto; max-width: none; transform: none; }
.view-workbench .tip:hover::after, .view-workbench .tip:focus::after, .view-workbench .tip:focus-visible::after { display: block; }
/* 报价图标题旁的“?”：说明框原本相对整块 .wb-block 定位，块很高时跑出屏幕；让标题行自己当定位参照，说明框就贴在标题下面 */
.view-workbench .quote-image-head { position: relative; }

/* ── 工作台：两栏 + 卡片统一节奏（卡内块与块之间 12，卡与卡之间 16） ── */
.view-workbench .wb-grid { gap: 16px; }
.view-workbench .wb-main, .view-workbench .wb-side { gap: 16px; }
.view-workbench .ops-list { display: grid; gap: 16px; align-content: start; }
.view-workbench .wb-main .action-card, .view-workbench .ops-list .action-card { padding: 16px; }
.view-workbench .wb-side .side-card { padding: 16px; overflow: visible; }
.view-workbench .action-card > * + * { margin-top: 12px; }
.view-workbench .action-head { align-items: center; gap: 8px; }
.view-workbench .wb-main .action-icon, .view-workbench .ops-list .action-icon { width: 28px; height: 28px; border-radius: 8px; }
.view-workbench .action-title, .view-workbench .wb-main .action-title { min-width: 0; flex: 1; display: flex; flex-wrap: wrap; align-items: center; font-size: 15px; font-weight: 600; }
.view-workbench .action-title .action-kind { flex-basis: 100%; margin: 0; color: var(--ink-3); font-size: 13px; font-weight: 400; }
.view-workbench .action-status { padding: 4px 12px; font-size: 13px; }
.view-workbench .head-tools { margin-left: auto; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.view-workbench .action-footer { margin-top: 12px; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.view-workbench .options-card .action-footer { justify-content: flex-start; }
.view-workbench .action-footer > .button-row { margin-left: auto; gap: 8px; }
.view-workbench .side-head { align-items: center; gap: 8px; margin: 0 0 12px; }
.view-workbench .side-head h2 { display: flex; align-items: center; font-size: 15px; }
.view-workbench .side-card .side-head + * { margin-top: 0; }

/* ── 工作台：报价方案 ── */
.view-workbench .quote-gap { padding: 8px 12px; border-radius: var(--r-chip); background: var(--yellow-bg); color: var(--yellow); font-size: 13px; line-height: 1.6; }
.view-workbench .options-grid { gap: 12px; }
.view-workbench .option-card, .view-workbench .option-card.selected { padding: 16px; border-width: 1px; }
.view-workbench .option-card.selected { border-color: var(--ink); box-shadow: 0 0 0 1px var(--ink), 0 0 0 4px rgba(28, 32, 38, .07); }
.view-workbench .option-head { gap: 4px 8px; }
.view-workbench .option-title { font-size: 14px; }
.view-workbench .option-total { font-size: 22px; }
.view-workbench .option-ribbon { top: -8px; right: 12px; padding: 4px 8px; font-size: 12px; }
.view-workbench .option-margin { margin-top: 8px; font-size: 13px; }
.view-workbench .option-lines { gap: 8px; margin-top: 12px; padding-top: 12px; }
.view-workbench .option-line { min-height: 32px; align-items: center; gap: 12px; color: var(--ink-2); font-size: 13px; }
.view-workbench .option-line .ol-name b { font-size: 13px; }
.view-workbench .option-line .ol-price { min-width: 80px; text-align: right; font-size: 13px; }
.view-workbench .line-price { gap: 4px; color: var(--ink-3); font-size: 13px; }
.view-workbench .line-price input { width: 80px; height: 32px; padding: 4px 8px; border: 1px solid var(--line); border-radius: var(--r-chip); background: #FFFFFF; font-size: 13px; }
.view-workbench .option-highlight { margin-top: 12px; padding: 8px 12px; border-radius: var(--r-chip); font-size: 13px; line-height: 1.6; }
.view-workbench .option-drawbacks, .view-workbench .more-lines { margin-top: 12px; font-size: 13px; }
.view-workbench .option-drawbacks summary, .view-workbench .more-lines > summary { font-size: 13px; }
.view-workbench .option-drawbacks > div { margin-top: 4px; }
.view-workbench .option-explain { margin: 12px 0 0; }
.view-workbench .option-explain summary { font-size: 13px; }
.view-workbench .option-explain .message-preview { font-size: 13px; }
.view-workbench .coupon-card { margin-top: 12px; }
.view-workbench .coupon-copy span, .view-workbench .coupon-value small, .view-workbench .coupon-note, .view-workbench .draft-coupon { font-size: 13px; }
.view-workbench .coupon-note { margin-top: 8px; }

/* ── 工作台：回复草稿 ── */
.view-workbench .draft-card .action-head { flex-wrap: wrap; }
.view-workbench .message-preview { margin-top: 12px; min-height: 96px; padding: 12px; font-size: 13px; line-height: 1.7; }
.view-workbench .draft-lock { color: var(--yellow); font-size: 13px; font-weight: 600; }
.view-workbench .draft-note, .view-workbench .draft-coupon { margin-top: 12px; font-size: 13px; }

/* ── 工作台：安全拦截 / 待办 / 审批 / 案例 ── */
.view-workbench .block-quote { padding: 8px 12px; border-left: 3px solid var(--red); border-radius: 0 var(--r-chip) var(--r-chip) 0; background: var(--red-bg); font-size: 13px; line-height: 1.6; }
.view-workbench .block-line { grid-template-columns: 72px 1fr; gap: 8px; padding: 8px 12px; border-radius: var(--r-chip); font-size: 13px; line-height: 1.6; }
.view-workbench .block-line em { font-size: 13px; }
.view-workbench .block-fast { font-size: 13px; }
.view-workbench .fold > summary, .view-workbench .task-edit > summary, .view-workbench .case-edit > summary { font-size: 13px; }
.view-workbench .task-text { color: var(--ink); font-size: 14px; line-height: 1.6; }
.view-workbench .task-items, .view-workbench .task-shortage { margin: 0; font-size: 13px; }
.view-workbench .field-meta { margin-top: 12px; color: var(--ink-3); font-size: 13px; }
.view-workbench .task-controls { gap: 8px 12px; margin-top: 8px; }
.view-workbench .task-controls label { color: var(--ink-3); font-size: 13px; }
.view-workbench .task-controls input, .view-workbench .task-controls select { min-height: 36px; margin-top: 4px; padding: 4px 8px; font-size: 13px; }
.view-workbench .appr-lines { display: grid; gap: 8px; }
.view-workbench .appr-line { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; font-size: 13px; }
.view-workbench .appr-line > strong { font-size: 14px; }
.view-workbench .appr-sum { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 13px; }
.view-workbench .appr-part { font-size: 13px; }
.view-workbench .decision { display: grid; gap: 8px; }
.view-workbench .case-view { gap: 8px; font-size: 13px; }
.view-workbench .case-view em, .view-workbench .case-form label { font-size: 13px; }
.view-workbench .case-edit { margin-top: 12px; }
.view-workbench .basis-group { padding: 12px 16px; }
.view-workbench .basis-group > summary, .view-workbench .basis-more > summary { font-size: 13px; }

/* ── 工作台：右栏（客户原文 / 要你看 / 推测） ── */
.view-workbench .ocr-banner { margin: 0 0 12px; padding: 8px 12px; border-radius: var(--r-chip); font-size: 13px; }
.view-workbench .source-first, .view-workbench .source-card .source-paper { font-size: 13px; line-height: 1.6; }
.view-workbench .source-line { padding: 4px 8px; font-size: 13px; }
.view-workbench .review-list { gap: 8px; }
.view-workbench .review-row { padding: 12px; border-radius: var(--r-ctl); }
.view-workbench .frow-top { gap: 4px 8px; }
.view-workbench .frow-top .anchor-link { margin-left: auto; }
.view-workbench .flabel { font-size: 14px; }
.view-workbench .frow-val { margin-top: 8px; }
.view-workbench .wb-side .cell { min-height: 36px; padding: 8px 12px; border-radius: var(--r-ctl); font-size: 14px; }
.view-workbench .wb-side .cell.ro { min-height: 0; padding: 4px 0; }
.view-workbench .wb-side .state { padding: 4px 8px; font-size: 13px; }
.view-workbench .wb-side .frow-why { margin-top: 8px; font-size: 13px; }
.view-workbench .wb-side .field-basis { margin-top: 8px; padding: 8px 12px; font-size: 13px; }
.view-workbench .wb-side .field-basis summary { font-size: 13px; }
.view-workbench .wb-side .field-basis > span { margin-top: 4px; }
.view-workbench .saved-tick { margin-left: 8px; color: var(--green); font-size: 13px; }
.saved-tick { white-space: nowrap; }
/* 字段格编辑：输入框和原来的格子一样宽；红字、保存 / 取消 / “没保存”在输入框下面（表格里浮在格子下面，不撑宽列、不撑高行） */
.cell-edit { position: relative; display: block; width: var(--cell-w, auto); max-width: 100%; }
.cell-sizer { display: none; }
.cell-input { display: block; width: 100%; min-width: 6em; min-height: 36px; }
.cell-error { display: block; margin-top: 4px; color: var(--red); font-size: 12px; line-height: 1.45; }
.cell-error:empty { display: none; }
.cell-edit-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 6px; margin-top: 6px; white-space: nowrap; }
.cell-edit-bar .btn { min-height: 30px; padding: 3px 12px; }
.cell-save:disabled { border-color: transparent; background: var(--line-soft); color: var(--ink-3); opacity: 1; }
.cell-unsaved { padding: 1px 7px; border-radius: 999px; background: var(--yellow-bg); color: var(--yellow); font-size: 12px; }
.cell-unsaved[hidden] { display: none; }
.kv-table th, .kv-table td, .kv-table .cell { white-space: nowrap; }      /* 表头、“空开”“漏保”不一个字一行；表太宽就在卡片里横向滚 */
.kv-table td { position: relative; }
.kv-table .cell-input { position: relative; z-index: 2; background-color: #FFFFFF; }      /* 格子比 6 个字窄时输入框伸到旁边的格子上面 */
.kv-table .cell-edit-pop { position: absolute; top: calc(100% + 2px); left: -2px; z-index: 6; min-width: 190px; padding: 6px 8px 8px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: #FFFFFF; box-shadow: 0 8px 24px -8px rgba(28, 32, 38, .28); white-space: normal; }
/* 给浮着的保存条留地方，免得被滚动区裁掉；负的下边距把这块地方还回去：点开格子时下面的内容不被推走（不跳）。空出来的透明地方不挡鼠标 */
.table-wrap:has(.cell-edit) { position: relative; z-index: 5; padding-bottom: 110px; margin-bottom: -110px; pointer-events: none; }
.table-wrap:has(.cell-edit) > table { pointer-events: auto; }
.view-workbench .kv-table .saved-tick { position: absolute; top: 1px; right: 3px; margin: 0; padding: 0 6px; border-radius: 8px; background: var(--green-bg); font-size: 11px; line-height: 16px; }
.view-workbench .all-good { padding: 4px 0; color: var(--green); font-size: 14px; }
.view-workbench .inferred-summary { margin-top: 12px; border-radius: var(--r-ctl); }
.view-workbench .inferred-summary-head { padding: 12px 12px 8px; font-size: 14px; }
.view-workbench .inferred-items { padding: 0 12px 8px; }
.view-workbench .inferred-item > summary { gap: 4px 12px; padding: 8px 0; }
.view-workbench .inferred-item > summary strong, .view-workbench .inferred-values { font-size: 13px; }
.view-workbench .inferred-basis-label { color: var(--carbon); font-size: 13px; }
.view-workbench .inferred-field-list { padding: 0 0 8px; }
.view-workbench .inferred-field-detail { padding: 8px 0; }
.view-workbench .inferred-field-top { gap: 4px 12px; }
.view-workbench .inferred-field-label, .view-workbench .inferred-original, .view-workbench .inferred-basis-missing { font-size: 13px; }
.view-workbench .fields-rest { margin-top: 12px; }
.view-workbench .fields-rest > summary { font-size: 13px; cursor: pointer; }
.view-workbench .kv-grid, .view-workbench .kv-table, .view-workbench .no-mention, .view-workbench .kv dt { font-size: 13px; }
.view-workbench .stage-card { padding: 16px; }
.view-workbench .stage-list { gap: 8px; margin-top: 12px; }
.view-workbench .stage-row, .view-workbench .stage-row em { font-size: 13px; }

/* ── 知识与案例抽屉 ── */
.knowledge-drawer .drawer-head { padding: 16px 24px; }
.knowledge-drawer .drawer-head small { color: var(--ink-3); font-size: 13px; font-weight: 400; }
.knowledge-drawer .drawer-content { padding: 16px 24px 24px; }
.knowledge-drawer .search-row { gap: 8px; }
.knowledge-drawer .search-row input { height: 40px; padding: 0 12px; border-radius: var(--r-ctl); font-size: 14px; }
.knowledge-drawer .search-row .btn { min-height: 40px; padding: 0 20px; font-size: 14px; }
.knowledge-drawer .drawer-tabs { gap: 8px; margin-top: 12px; }
.knowledge-drawer .industry-chip { min-height: 32px; padding: 4px 12px; border-radius: var(--r-ctl); font-size: 13px; }
.knowledge-drawer .drawer-list { margin-top: 8px; }
.knowledge-drawer .snippet { display: grid; gap: 8px; padding: 16px 0; }
.knowledge-drawer .snippet strong { font-size: 14px; }
.knowledge-drawer .snippet p { font-size: 13px; line-height: 1.6; }
.knowledge-drawer .snippet-fix em { margin-right: 8px; color: var(--ink-3); font-style: normal; font-weight: 600; }
.knowledge-drawer .snippet-source { margin-top: 0; color: var(--ink-3); font-size: 13px; }
.knowledge-drawer .md-body { font-size: 13px; }
.knowledge-drawer .empty-line { padding: 16px 0; font-size: 13px; }

/* ── 手机 ── */
@media (max-width: 850px) {
  .view-workbench .wb-bar { top: 0; }
}
@media (max-width: 520px) {
  .view-home .home-head { gap: 8px; margin-bottom: 12px; }
  .view-home .stat-strip, .view-workbench .stat-strip { gap: 8px; }
  .view-home .stat-chip, .view-workbench .stat-chip { min-height: 48px; padding: 8px 12px; gap: 8px; }
  .view-home .stat-chip-label, .view-workbench .stat-chip-label { font-size: 13px; }
  .view-home .stat-chip b, .view-workbench .stat-chip b { font-size: 20px; }
  .view-home .chip-btn { min-height: 32px; padding: 4px 12px; font-size: 13px; }
  .view-home .home-col, .view-home .home-grid, .view-workbench .wb-grid, .view-workbench .wb-main, .view-workbench .wb-side { gap: 12px; }
  .view-home .mini-head { min-height: 44px; padding: 12px 12px 8px; }
  .view-home .mini-body, .view-home .todo-list { padding-right: 12px; padding-left: 12px; }
  .view-home .more-link-inline { margin-left: 12px; }
  .view-workbench .wb-banner { gap: 8px 12px; padding: 8px 12px; }
  .view-workbench .wb-banner .customer-avatar { width: 32px; height: 32px; font-size: 14px; }
  .view-workbench .wb-banner .wb-meta { margin-left: 44px; }
  .view-workbench .wb-look-pill { padding: 4px 12px; font-size: 13px; }
  .view-workbench .wb-main .action-card, .view-workbench .ops-list .action-card, .view-workbench .wb-side .side-card { padding: 12px; }
  .view-workbench .head-tools { width: 100%; justify-content: stretch; }
  .view-workbench .head-tools .btn { flex: 1 1 auto; }
  .view-workbench .option-card, .view-workbench .option-card.selected { padding: 12px; }
  .view-workbench .option-total { font-size: 22px; }
  .view-workbench .wb-bar .btn { min-height: 40px; font-size: 14px; }
  .knowledge-drawer .drawer-head, .knowledge-drawer .drawer-content { padding-right: 16px; padding-left: 16px; }
}
/* ===== 工单 P1 结束 ===== */

/* ===== 工单 P2：外壳、通用组件、订单、待审批、老板后台、登录、弹层（只由 P2 改） ===== */
/* 范围：侧栏 / 顶栏 / 底栏 / 弹层 / 登录页，以及 main.content.view-orders / view-approvals / view-admin。
   规矩：间距只用 4/8/12/16/24；要看的数据和状态字号 ≥ 13px；说明文字不上屏（收进 tip 的“?”）；颜色只用上面的变量。 */

/* ── 外壳：顶栏的搜索框、行业、头像、按钮同高同中线；标题、分页签、卡片同一条左边线 ── */
.topbar { --tb-h: 36px; gap: 16px; padding: 0 24px; }
.topbar-left, .topbar-right { gap: 8px; }
.topbar .btn.small, .topbar .top-search, .topbar .industry-select, .topbar .icon-button, .topbar .user-chip { height: var(--tb-h); min-height: var(--tb-h); }
.topbar .btn.small { padding: 0 12px; }
.topbar .top-search { padding: 0 12px; }
.topbar .industry-select { padding: 0 8px; }
.topbar .icon-button { width: var(--tb-h); padding: 0; }
.topbar .user-chip { padding: 0 8px 0 4px; align-items: center; }
.topbar .avatar { width: 28px; height: 28px; }
.topbar .user-name, .topbar .user-role { line-height: 1.3; }
@media (min-width: 851px) { .content { padding: 16px 24px 24px; } }
.mobile-nav .nav-link { font-size: 11px; }
.btn.small { min-height: 32px; padding: 4px 12px; font-size: 13px; }
.btn.text.small { padding: 4px 8px; }
.modal-head { padding: 16px 24px; }
.modal-head h2 { display: flex; align-items: center; font-size: 16px; font-weight: 600; }
.modal-body { padding: 24px; }
.modal-actions { gap: 8px; margin-top: 16px; }
.choice-list { gap: 12px; }
.choice-option { padding: 16px; }
.choice-quote { margin-bottom: 12px; font-size: 14px; }
.choice-why { margin: 0 0 12px; font-size: 13px; }
.demo-grid { gap: 8px; }
.demo-account { padding: 12px; }
.demo-account strong { font-size: 14px; }
.demo-account span { font-size: 13px; }
.switch-banner span { font-size: 13px; }
.move-option small { font-size: 13px; }
.form-row { gap: 8px; margin-bottom: 12px; }
.form-row label { font-size: 13px; }
.form-row label small { font-size: 13px; font-weight: 400; }
.form-error { font-size: 13px; }
@media (max-width: 520px) {
  .topbar { --tb-h: 32px; padding: 0 10px; gap: 8px; }
  .topbar .btn.small { padding: 0; }
  .topbar .new-msg { width: var(--tb-h); min-width: var(--tb-h); }
  .topbar .drawer-icon, .topbar [data-logout] { width: var(--tb-h); height: var(--tb-h); }
  .topbar .user-chip { padding: 0; }
  .topbar .avatar { width: 28px; height: 28px; }
  .topbar .industry-select { width: 64px; padding: 0 0 0 8px; font-size: 13px; }
  .modal-head { padding: 12px 16px; }
  .modal-body { padding: 16px; }
}

/* ── 登录页：标题自己说清楚，不再配小字 ── */
.hero-copy .eyebrow, .hero-foot, .demo-head, .login-mode, .seed-line { font-size: 13px; }
.hero-copy .module-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 24px; }
.hero-tile { min-height: 0; padding: 16px; display: flex; align-items: center; gap: 12px; }
.hero-tile .tile-icon { flex: none; }
.hero-tile strong { margin: 0; font-size: 14px; font-weight: 600; white-space: nowrap; }
.login-box { padding: 24px; }
.login-box h2 { margin: 4px 0 24px; }
.form-row input { height: 40px; font-size: 14px; }
.login-submit { height: 40px; margin-top: 8px; }
.demo-head { margin: 24px 0 12px; }
.login-mode, .seed-line { margin-top: 12px; padding: 8px 12px; }
@media (max-width: 1000px) { .hero-copy .module-grid { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .login-brand-mobile span { margin-top: 4px; font-size: 13px; } }

/* ── 订单中心 ── */
.view-orders > * { max-width: 1280px; }
.view-orders .page-tools { min-height: 36px; margin: 0 0 12px; gap: 12px; }
.view-orders .page-count, .view-approvals .page-count { color: var(--ink-2); font-size: 14px; }
.view-orders .order-grid { grid-template-columns: 320px minmax(0, 1fr); gap: 16px; }
.view-orders .order-list { display: grid; gap: 8px; align-content: start; }
.view-orders .order-card { display: grid; gap: 4px; padding: 12px 16px; }
.view-orders .order-card strong { font-size: 14px; font-weight: 600; }
.view-orders .order-card-sub { color: var(--ink-3); font-size: 13px; }
.view-orders .order-card-foot { display: flex; margin-top: 4px; }
/* 客户在等：灰 = 时间还宽裕，黄 = 剩不到三成，红 = 已超时（10-24 虎哥定的标准，见 app.js 的 WAIT_LIMIT_MIN） */
.view-orders .order-wait { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin-top: 4px; padding: 4px 8px; border-radius: var(--r-chip); background: var(--line-soft); color: var(--ink-2); font-size: 13px; line-height: 1.3; }
.view-orders .order-wait .mi { width: 14px; height: 14px; }
.view-orders .order-wait .ow-what, .view-orders .order-wait .ow-left { font-weight: 600; }
.view-orders .order-wait .ow-left { margin-left: auto; }
.view-orders .order-wait.soon { background: var(--yellow-bg); color: var(--yellow); }
.view-orders .order-wait.over { background: var(--red-bg); color: var(--red); }
.view-orders .status-pill, .view-approvals .status-pill { padding: 4px 12px; font-size: 13px; }
.view-orders .tag, .view-admin .tag, .view-approvals .tag { padding: 4px 8px; font-size: 13px; }
.view-orders .order-detail { padding: 24px; }
.view-orders .order-detail-head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; margin: 0 0 16px; }
.view-orders .order-detail h2 { font-size: 18px; font-weight: 650; }
.view-orders .order-date { color: var(--ink-3); font-size: 13px; }
.view-orders .order-rename { display: inline-grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 0; border-radius: 8px; background: transparent; color: var(--ink-3); cursor: pointer; align-self: center; }
.view-orders .order-rename:hover, .view-orders .order-rename:focus-visible { background: rgba(0, 0, 0, .06); color: var(--ink); }
.view-orders .order-rename .ic { width: 16px; height: 16px; }
.view-orders .order-rename[hidden] { display: none; }
.view-orders .order-title-input { flex: 1 1 220px; min-width: 0; max-width: 460px; height: 36px; padding: 0 10px; border: 1px solid var(--line); border-radius: var(--r-ctl); font: inherit; font-size: 16px; font-weight: 650; color: var(--ink); background: #fff; }
.view-orders .order-title-input:focus { outline: 2px solid rgba(28, 32, 38, .35); outline-offset: 1px; }
.form-row[hidden] { display: none; }
.view-orders .order-summary { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px 16px; margin: 0 0 16px; }
.view-orders .order-summary-main { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; font-size: 14px; }
.view-orders .dot-sep { color: var(--ink-3); }
/* 订单顶上只有一个醒目的“当前金额”；改单前的旧报价写小、写淡，并标明已被替代 */
.view-orders .order-amount { display: inline-flex; align-items: baseline; flex-wrap: wrap; gap: 2px 8px; color: var(--ink); }
.view-orders .order-amount b { font-size: 20px; font-weight: 700; letter-spacing: .01em; }
.view-orders .order-amount small { font-size: 12px; color: var(--ink-3); font-weight: 400; }
.view-orders .order-old-quote { font-size: 12px; color: var(--ink-3); }
.view-orders .superseded-rows { opacity: .62; }
@media (max-width: 520px) {
  .view-orders .order-summary-main { flex-direction: column; align-items: flex-start; gap: 4px; }
  .view-orders .order-summary-main .dot-sep { display: none; }
}
.view-orders .button-row { gap: 8px; }
.view-orders .erp-row { display: flex; align-items: center; justify-content: flex-start; gap: 4px; min-height: 48px; margin: 0 0 16px; padding: 8px 16px; border: 1px solid var(--line-soft); border-radius: var(--r-ctl); background: var(--panel-strong); }
.view-orders .erp-status { font-size: 14px; }
.view-orders .erp-end { margin-left: auto; display: inline-flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.view-orders .erp-note { color: var(--ink-3); font-size: 13px; }
.view-orders .section-head h3 { margin: 0 0 12px; font-size: 15px; font-weight: 600; }
.view-orders .timeline-item { gap: 12px; padding: 0 0 12px; }
.view-orders .timeline-copy { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 4px 16px; }
.view-orders .timeline-copy strong { display: inline; font-size: 14px; font-weight: 600; }
.view-orders .timeline-copy span { display: inline; margin: 0; color: var(--ink-3); font-size: 13px; white-space: nowrap; }
.view-orders .timeline-fold > summary, .view-orders .timeline-more > summary { font-size: 13px; }
.view-orders .pick-list { margin: 0 0 16px; }
.view-orders .pick-list li { font-size: 14px; }
.view-orders .pick-list em { font-size: 13px; font-style: normal; color: var(--ink-3); }
.view-orders .order-lines { margin: 0 0 16px; padding: 0 16px 8px; }
.view-orders .order-lines .mini-head { padding: 12px 0 4px; }
.view-orders .order-lines .data-table { width: auto; min-width: 0; font-size: 14px; }
.view-orders .order-lines .data-table th, .view-orders .order-lines .data-table td { padding: 8px 16px 8px 0; font-size: 14px; text-align: left; white-space: nowrap; }
.view-orders .order-lines .data-table th { color: var(--ink-3); font-size: 13px; font-weight: 600; }
.view-orders .order-lines .data-table .num { padding-left: 16px; padding-right: 0; text-align: right; }
.view-orders .order-lines .data-table .tiny { font-size: 13px; }
.view-orders .order-sections { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; margin: 16px 0 0; align-items: start; }
.view-orders .mini-head { min-height: 44px; padding: 12px 16px 4px; gap: 8px; }
.view-orders .mini-head .card-title { font-size: 15px; }
.view-orders .mini-body { padding: 0 16px 12px; }
.view-orders .mini-row { min-height: 40px; padding: 8px 0; gap: 12px; }
.view-orders .mini-main strong { font-size: 14px; }
.view-orders .mini-main > span, .view-orders .mini-note, .view-orders .margin-note { font-size: 13px; }
.view-orders .mini-main > span { overflow: visible; text-overflow: clip; white-space: normal; }
.view-orders .mini-right { color: var(--ink); font-size: 14px; font-weight: 600; text-align: right; }
.view-orders .customer-facts { grid-template-columns: 1fr; gap: 8px; margin-top: 4px; }
.view-orders .fact { padding: 8px 12px; }
.view-orders .fact strong { font-size: 13px; color: var(--ink-3); font-weight: 600; }
.view-orders .fact span { margin-top: 4px; color: var(--ink); font-size: 14px; }
.view-orders .empty-line { padding: 12px 16px 16px; font-size: 13px; }
@media (max-width: 850px) {
  .view-orders .order-grid { grid-template-columns: 1fr; }
  .view-orders .order-detail { padding: 16px; }
}
@media (max-width: 520px) {
  .view-orders .order-lines .data-table thead { display: none; }
  .view-orders .order-lines .data-table, .view-orders .order-lines .data-table tbody { display: block; }
  .view-orders .order-lines .data-table tr { display: flex; flex-wrap: wrap; gap: 4px 16px; padding: 8px 0; border-bottom: 1px solid var(--line-soft); }
  .view-orders .order-lines .data-table td { padding: 0; border: 0; }
  .view-orders .order-lines .data-table td:first-child { flex: 1 0 100%; }
  .view-orders .order-lines .data-table td.num { padding: 0; font-size: 13px; text-align: left; }
  .view-orders .order-lines .data-table td[data-label]:not(:first-child)::before { content: attr(data-label) " "; color: var(--ink-3); }
}

/* ── 待审批 ── */
.view-approvals > * { max-width: 880px; }
.view-approvals .page-tools { min-height: 36px; margin: 0 0 12px; gap: 12px; }
.view-approvals .approval-list { display: grid; gap: 16px; }
.view-approvals .approval-card { padding: 16px; }
.view-approvals .action-card > * + * { margin-top: 12px; }
.view-approvals .action-head { align-items: center; gap: 12px; }
.view-approvals .action-head .status-pill { margin-left: auto; }
.view-approvals .appr-lines { display: grid; gap: 8px; }
.view-approvals .appr-line { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; font-size: 13px; }
.view-approvals .appr-line > strong { font-size: 14px; }
.view-approvals .appr-sum { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 13px; }
.view-approvals .appr-part { font-size: 13px; }
.view-approvals .field-meta { margin-top: 12px; color: var(--ink-3); font-size: 13px; }
.view-approvals .decision { display: grid; gap: 8px; }
.view-approvals .tiny { font-size: 13px; }
.view-approvals .empty-line { padding: 12px 16px 16px; font-size: 13px; }

/* ── 老板后台：分页签 / 价格政策 / 营销设置 / 操作日志 / 账号 ── */
.view-admin > * { max-width: 1080px; }
.view-admin .admin-top { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; margin: 0 0 16px; }
.view-admin .admin-tabs { gap: 8px; margin: 0; }
.view-admin .admin-tab { height: 36px; padding: 0 16px; font-size: 14px; }
.view-admin .settings-pack { margin: 0; display: flex; align-items: center; color: var(--ink-2); font-size: 13px; white-space: nowrap; }
.view-admin .settings-card .card-body { display: grid; gap: 16px; padding: 24px; }
.view-admin .settings-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 24px; align-items: start; }
.view-admin .settings-grid.price-rules { grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr) minmax(0, 1fr); }
.view-admin .setting { gap: 8px; }
.view-admin .setting-label { display: flex; align-items: center; min-height: 20px; color: var(--ink-2); font-size: 13px; font-weight: 600; }
.view-admin .input-suffix, .view-admin .setting-input { height: 40px; min-height: 40px; border-color: var(--line); border-radius: var(--r-ctl); background: var(--panel-strong); }
.view-admin .input-suffix input { padding: 0 8px 0 12px; font-size: 14px; }
.view-admin .input-suffix em { padding: 0 12px 0 0; color: var(--ink-3); font-size: 13px; }
.view-admin .input-suffix .input-prefix { padding: 0 0 0 12px; color: var(--ink-2); font-weight: 600; }
.view-admin .input-suffix .input-prefix + input { padding-left: 8px; }
.view-admin .setting-input { padding: 0 12px; font-size: 14px; }
.view-admin textarea.setting-input { height: auto; min-height: 96px; padding: 12px; }
.view-admin .tier-inputs { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.view-admin .tier-inputs .input-suffix input { padding: 0 4px 0 8px; }
.view-admin .tier-inputs .input-suffix em { padding-right: 8px; }
.view-admin .tier-inputs .input-prefix { padding-left: 12px; }
.view-admin .divider { margin: 8px 0; }
.view-admin .sku-head { display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 8px 16px; }
.view-admin .sku-title { display: flex; align-items: center; }
.view-admin .sku-title strong { font-size: 15px; font-weight: 600; }
.view-admin .sku-search { width: 320px; max-width: 100%; height: 40px; padding: 0 12px; border-color: var(--line); border-radius: var(--r-ctl); background: var(--panel-strong); font-size: 14px; }
.view-admin .sku-table-wrap { width: fit-content; max-width: 100%; max-height: 480px; border-color: var(--line); border-radius: var(--r-ctl); background: var(--panel-strong); }
.view-admin .sku-table { width: auto; font-size: 14px; }
.view-admin .sku-table th, .view-admin .sku-table td { padding: 8px 16px; border-bottom: 1px solid var(--line-soft); font-size: 14px; text-align: left; vertical-align: middle; white-space: nowrap; }
.view-admin .sku-table th { color: var(--ink-3); font-size: 13px; font-weight: 600; }
.view-admin .sku-table .num { text-align: right; }
.view-admin .sku-table tbody tr:last-child td { border-bottom: 0; }
.view-admin .sku-table td:first-child { min-width: 240px; }
.view-admin .sku-table .tiny { color: var(--ink-3); font-size: 13px; }
.view-admin .sku-table td.sku-clear { width: 1%; padding-left: 0; }
.view-admin .sku-floor-input { width: 120px; height: 36px; padding: 0 12px; border-color: var(--line); border-radius: var(--r-chip); background: var(--panel-strong); font-size: 14px; }
.view-admin .sku-add { display: flex; gap: 8px; max-width: 480px; }
.view-admin .sku-add input { min-width: 0; height: 36px; padding: 0 12px; border-color: var(--line); border-radius: var(--r-chip); background: var(--panel-strong); font-size: 14px; }
.view-admin .settings-foot { gap: 16px; padding-top: 8px; }
.view-admin .settings-status { font-size: 13px; }
.view-admin .settings-foot .btn.primary { min-height: 40px; padding: 8px 24px; font-size: 14px; }
.view-admin .switch-row { padding: 12px 16px; border-radius: var(--r-ctl); background: var(--panel-strong); }
.view-admin .switch-row strong { display: inline-flex; align-items: center; font-size: 15px; font-weight: 600; }
.view-admin .chip-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 8px; color: var(--ink-2); font-size: 13px; }
.view-admin .chip-insert { height: 32px; padding: 0 12px; border: 1px solid var(--line); border-radius: var(--r-chip); background: var(--panel-strong); color: var(--ink); font-size: 13px; }
.view-admin .coupon-text { font-size: 14px; line-height: 1.7; }
.view-admin .coupon-preview { margin: 0; padding: 16px; }
.view-admin .coupon-copy span, .view-admin .coupon-value small, .view-admin .preview-label, .view-admin .preview-text, .view-admin .coupon-off { font-size: 13px; }
.view-admin .preview-text { line-height: 1.7; }
.view-admin [data-oplog] { padding: 16px; }
.view-admin .oplog-head { display: flex; align-items: center; justify-content: flex-start; margin: 0 0 12px; }
.view-admin .oplog-tools { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.view-admin .oplog-toggle { height: 36px; padding: 0 12px; font-size: 13px; }
.view-admin .oplog-toggle b, .view-admin .coupon-tag { font-size: 13px; }
.view-admin .oplog-action { width: auto; min-width: 140px; height: 36px; min-height: 36px; padding: 0 12px; font-size: 13px; }
.view-admin .oplog-tools .btn { height: 36px; }
.view-admin .oplog-list { gap: 8px; }
.view-admin .oplog-row { padding: 12px 16px; }
.view-admin .oplog-line { display: grid; grid-template-columns: 96px minmax(120px, 200px) auto minmax(0, 1fr); align-items: center; gap: 4px 12px; }
.view-admin .oplog-time { color: var(--ink-3); font-size: 13px; white-space: nowrap; }
.view-admin .oplog-who { font-size: 13px; }
.view-admin .oplog-object { font-size: 13px; }
.view-admin .oplog-deny { gap: 4px 12px; margin-top: 8px; }
.view-admin .oplog-sentence { font-size: 14px; }
.view-admin .oplog-path, .view-admin .oplog-reason, .view-admin .oplog-more { font-size: 13px; }
.view-admin .oplog-more { margin-top: 4px; }
.view-admin .admin-grid { gap: 16px; }
.view-admin .mini-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 48px; padding: 12px 16px 8px; }
.view-admin .mini-head .card-title { font-size: 15px; }
.view-admin .mini-head-end { display: inline-flex; align-items: center; gap: 4px; }
.view-admin .perm-block { gap: 12px; padding: 0 16px 16px; font-size: 13px; }
.view-admin .perm-block > div { gap: 8px; }
.view-admin .perm-block em { min-width: 72px; font-size: 13px; }
.view-admin .acct-list { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 8px; padding: 0 16px 16px; }
.view-admin .acct-list > li { gap: 12px; padding: 8px 12px; }
.view-admin .acct-list > li strong { font-size: 14px; }
.view-admin .mini-main strong { font-size: 14px; }
.view-admin .mini-main > span { font-size: 13px; }
.view-admin .empty-line { padding: 12px 16px 16px; font-size: 13px; }
@media (max-width: 900px) {
  .view-admin .settings-grid, .view-admin .settings-grid.price-rules { grid-template-columns: 1fr; }
  .view-admin .oplog-line { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; }
}
@media (max-width: 520px) {
  .view-admin .settings-card .card-body { padding: 16px; }
  .view-admin .admin-tabs { gap: 8px; }
  .view-admin .admin-tab { padding: 0 12px; font-size: 13px; }
  .view-admin .sku-search { width: 100%; }
  .view-admin .sku-table-wrap { width: auto; }
  .view-admin .sku-table, .view-admin .sku-table tbody { display: block; }
  .view-admin .sku-table thead { display: none; }
  .view-admin .sku-table tr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; align-items: center; gap: 4px 12px; padding: 12px 16px; border-bottom: 1px solid var(--line-soft); }
  .view-admin .sku-table tr[hidden] { display: none; }
  .view-admin .sku-table tbody tr:last-child { border-bottom: 0; }
  .view-admin .sku-table td, .view-admin .sku-table td:first-child { display: block; min-width: 0; padding: 0; border: 0; text-align: left; white-space: normal; }
  .view-admin .sku-table td:first-child { grid-column: 1 / -1; }
  .view-admin .sku-table td[data-label="牌价"], .view-admin .sku-table td[data-label="按规则"] { font-size: 13px; text-align: left; }
  .view-admin .sku-table td[data-label="牌价"]::before, .view-admin .sku-table td[data-label="按规则"]::before { content: attr(data-label) " "; color: var(--ink-3); }
  .view-admin .sku-table td[data-label="牌价"] .tiny { display: block; }
  .view-admin .sku-table td[data-label="单独审批线"] { grid-column: 1 / 3; }
  .view-admin .sku-table td.sku-clear { grid-column: 3; width: auto; }
  .view-admin .sku-floor-input { width: 100%; }
  .view-admin .oplog-toggle, .view-admin .oplog-action { flex: 1 1 auto; }
}
/* ===== 工单 P2 结束 ===== */

/* ===== 工单 P3：库存与缺料、客户档案、配图（只由 P3 改） ===== */
/* 范围：main.content.view-stock / view-customers，工作台里的缺料卡（.job-shortages），以及产品小图 .pimg、客户头像 .cav、线条图标 .mi。
   间距只用 4 / 8 / 12 / 16 / 24；颜色只用已有变量；红色只给“缺料”这一件事。 */

/* 线条图标：跟着文字颜色走 */
.mi { width: 16px; height: 16px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* 产品小图：同一套摄影棚白底；没有图时退成一枚线条图标 */
.pimg { flex: none; width: 40px; height: 40px; display: grid; place-items: center; overflow: hidden; border: 1px solid var(--line-soft); border-radius: var(--r-chip); background: var(--panel-strong); color: var(--ink-3); }
.pimg.sm { width: 32px; height: 32px; }
.pimg.lg { width: 64px; height: 64px; }
.pimg img { display: block; width: 100%; height: 100%; object-fit: cover; }
.pimg.fb { background: var(--line-soft); }
.pimg.fb .mi { width: 20px; height: 20px; }

/* 客户头像：微信式圆角方块；没有图时是名字首字 */
.cav { flex: none; width: 44px; height: 44px; display: grid; place-items: center; overflow: hidden; border-radius: var(--r-ctl); background: var(--av); color: var(--ink-2); font-size: 16px; font-weight: 600; line-height: 1; }
.cav.sm { width: 32px; height: 32px; font-size: 14px; }
.cav.lg { width: 56px; height: 56px; font-size: 20px; }
.cav img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* 缺料标记：红色图标 + 红色“缺 N”，一眼能看见 */
.short-badge { flex: none; display: inline-flex; align-items: center; gap: 4px; padding: 4px 8px; border-radius: 999px; background: var(--red-bg); color: var(--red); font-size: 13px; font-weight: 600; line-height: 1.2; white-space: nowrap; }
.short-badge .mi { width: 14px; height: 14px; }
.short-mark { flex: none; display: inline-grid; place-items: center; width: 24px; height: 24px; margin-right: 8px; border-radius: 50%; background: var(--red-bg); color: var(--red); }
.short-mark .mi { width: 14px; height: 14px; }
.card-title:has(> .short-mark) { display: inline-flex; align-items: center; }

/* 缺料清单（库存页右侧和作业页共用）：一件物料一张小条，左边一道红边 */
ul.short-list { display: grid; gap: 8px; margin: 0; padding: 0 16px 16px; list-style: none; }
ul.short-list > li.short-item { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 8px 12px; margin: 0; padding: 12px; border: 1px solid var(--line-soft); border-left: 3px solid var(--red); border-radius: var(--r-ctl); background: var(--panel-strong); font-size: 13px; }
.short-main { min-width: 0; display: grid; gap: 0; }
.short-main strong { color: var(--ink); font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }
.short-sku { color: var(--ink-3); font-size: 13px; overflow-wrap: anywhere; }
.short-meta { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.short-order { display: inline-flex; align-items: center; gap: 4px; min-width: 0; color: var(--ink-2); font-size: 13px; overflow-wrap: anywhere; }
.short-order .mi { width: 14px; height: 14px; color: var(--ink-3); }
.short-cost { color: var(--ink-3); font-size: 13px; }
.short-item .tag { padding: 4px 8px; font-size: 13px; font-weight: 600; }
.job-shortages ul.short-list { padding: 0; }
.job-shortages .mini-head { min-height: 32px; padding: 0 0 8px; }
.job-shortages .mini-head .card-title { font-size: 14px; }

/* ---- 库存与缺料页 ---- */
.view-stock .page-tools-left { flex-wrap: wrap; gap: 8px 12px; }
.view-stock .page-tools-left .tag { padding: 4px 8px; font-size: 13px; }
.view-stock .page-tools-right .tag { padding: 4px 8px; font-size: 13px; }
.stock-layout { display: grid; grid-template-columns: minmax(0, 760px) minmax(280px, 380px); gap: 16px; align-items: start; }
.stock-layout.no-short { grid-template-columns: minmax(0, 760px); }
.stock-layout > .stock-card { grid-column: 1; grid-row: 1; margin: 0; padding: 0; }
.stock-layout > .stock-short { grid-column: 2; grid-row: 1; position: sticky; top: 16px; max-height: calc(100dvh - 120px); overflow-y: auto; padding: 0; }
.stock-short .mini-head { min-height: 48px; padding: 12px 16px 8px; }
.stock-short .mini-head .card-title { font-size: 15px; }

.stock-card .stock-toolbar { margin: 0; padding: 16px 16px 12px; align-items: center; flex-direction: row; }
.stock-card .stock-toolbar .card-title { display: flex; align-items: baseline; gap: 12px; }
.stock-count { color: var(--ink-3); font-size: 13px; font-weight: 400; }
.stock-card .stock-search { position: relative; display: block; flex: none; }
.stock-card .stock-search .mi { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--ink-3); pointer-events: none; }
.stock-card .stock-search input { width: 240px; min-width: 0; height: 36px; padding: 0 12px 0 36px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel-strong); color: var(--ink); font-size: 13px; }
.stock-card .stock-tools { display: flex; align-items: center; gap: 8px; flex: none; }
.stock-card .stock-only-short { height: 36px; padding: 0 12px; font-size: 13px; white-space: nowrap; }
.stock-card .stock-only-short[aria-pressed="true"] { border-color: var(--red); background: var(--red-bg); color: var(--red); }
.stock-card .stock-note { margin: 0 16px 12px; padding: 8px 12px; font-size: 13px; }
.stock-card .stock-more { margin: 12px 16px 16px; }
.stock-card .empty-line { padding: 12px 16px 16px; }
.stock-card .table-wrap { overflow-x: visible; }

.stock-table { table-layout: fixed; font-size: 14px; }
.stock-table th { padding: 8px 12px; border-bottom: 1px solid var(--line); color: var(--ink-3); font-size: 13px; font-weight: 600; white-space: nowrap; }
.stock-table td { padding: 8px 12px; border-bottom: 1px solid var(--line-soft); vertical-align: middle; font-size: 14px; font-variant-numeric: tabular-nums; }
.stock-table tbody tr:last-child td { border-bottom: 0; }
.stock-table tr[hidden] { display: none; }
.stock-table th:first-child, .stock-table td:first-child { padding-left: 16px; }
.stock-table th.num, .stock-table td.num { width: 88px; text-align: right; }
.stock-table th.num:last-child, .stock-table td.num:last-child { width: 104px; padding-right: 16px; }
.stock-table td.num.out { color: var(--red); font-weight: 600; }
.stock-unit { color: var(--ink-3); font-size: 13px; }
.stock-cell { display: flex; align-items: center; gap: 12px; min-width: 0; }
.stock-name { flex: 1 1 auto; min-width: 0; display: grid; }
.stock-name strong { color: var(--ink); font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }
.stock-card .stock-table td .stock-name small { margin: 0; color: var(--ink-3); font-size: 13px; overflow-wrap: anywhere; }

/* ---- 客户档案页：一位客户一张名片 ---- */
.cust-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 360px)); grid-auto-flow: dense; gap: 16px; align-items: start; margin: 0; padding: 0; list-style: none; container-type: inline-size; }
.cust-grid > li.cust-card { position: relative; display: grid; gap: 12px; margin: 0; padding: 16px; border-bottom: 1px solid var(--edge-color); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease; }
/* 鼠标移上去：名片轻微上浮放大（像苹果小组件） */
@media (hover: hover) {
  .cust-grid > li.cust-card:not(.open):hover { transform: translateY(-2px) scale(1.01); box-shadow: 0 1px 2px rgba(28, 32, 38, .08), 0 14px 30px -10px rgba(28, 32, 38, .32); }
}
/* 点开：占 2 列，高度随内容，最高 100vh-180px，超出只让历史订单那块在里面滚动 */
.cust-grid > li.cust-card.open { grid-column: span 2; display: flex; flex-direction: column; max-height: calc(100vh - 180px); }
.cust-card.open > * { flex: none; }
.cust-card.open > .cust-detail { flex: 0 1 auto; }
@container (max-width: 575px) {
  .cust-grid > li.cust-card.open { grid-column: 1 / -1; }
}
/* 窄屏底部有固定的导航条：展开后滚进视野时，别让名片底边停在导航条后面 */
@media (max-width: 850px) {
  .cust-grid > li.cust-card { scroll-margin-bottom: 100px; }
}
@media (prefers-reduced-motion: reduce) {
  .cust-grid > li.cust-card { transition: none; }
  .cust-grid > li.cust-card:not(.open):hover { transform: none; }
}
/* 展开/收起的放大动画（只在客户档案页：JS 动画期间才给 html 加 cust-vt） */
html.cust-vt::view-transition-group(*) { animation-duration: .25s; animation-timing-function: ease; }
/* 默认的新/旧截图“宽度铺满动画框、高度按自己的宽高比算”：小名片的旧截图被放宽到 2 列后会比最终名片高出一截（收起时是新截图高出），
   淡出前就是一个比最终名片还高的残影。截图钉在动画框内（高度 100%），按原尺寸从左上角摆放、超出的部分被动画框裁掉：名片只会一路长到最终大小，不放大文字、不冒出框外。 */
html.cust-vt::view-transition-old(*), html.cust-vt::view-transition-new(*) { width: 100%; height: 100%; object-fit: none; object-position: left top; }
.cust-card .cust-main { width: 100%; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 12px; padding: 0; border-radius: var(--r-ctl); background: transparent; cursor: pointer; }
.cust-card.open .cust-main { padding-right: 72px; }
.cust-close { position: absolute; top: 14px; right: 14px; display: inline-flex; align-items: center; gap: 2px; padding: 4px 10px; border: 1px solid var(--line); border-radius: 999px; background: var(--panel-strong); color: var(--ink-2); font-size: 13px; line-height: 1.2; cursor: pointer; }
.cust-close:hover { color: var(--ink); border-color: var(--ink-3); }
.cust-card .cust-main:hover { background: transparent; }
.cust-card .cust-name { gap: 0; }
.cust-card .cust-name strong { color: var(--ink); font-size: 15px; font-weight: 600; overflow-wrap: anywhere; }
.cust-card .cust-name > span { color: var(--ink-3); font-size: 13px; }
.cust-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.cust-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.tier-chip { display: inline-flex; align-items: center; padding: 4px 12px; border-radius: 999px; background: var(--carbon-wash); color: var(--carbon); font-size: 13px; font-weight: 600; line-height: 1.2; }
.tier-chip.t-a { background: var(--ink); color: var(--panel-strong); }
.tier-chip.t-c { background: var(--line-soft); color: var(--ink-2); }
.tier-chip.t-new { background: var(--green-bg); color: var(--green); }
.cust-stat { display: inline-flex; align-items: center; gap: 4px; padding: 4px 8px; border-radius: 999px; background: var(--line-soft); color: var(--ink-2); font-size: 13px; line-height: 1.2; }
.cust-stat b { color: var(--ink); font-weight: 600; }
.cust-stat .mi { width: 14px; height: 14px; color: var(--ink-3); }
.cust-chip { display: inline-flex; align-items: center; gap: 4px; padding: 4px 8px; border: 1px solid var(--line); border-radius: var(--r-chip); background: var(--panel-strong); color: var(--ink); font-size: 13px; line-height: 1.2; }
.cust-chip em { color: var(--ink-3); font-style: normal; }
.cust-card .cust-detail { display: flex; flex-direction: column; gap: 12px; min-height: 0; padding: 12px 0 0; border-top: 1px solid var(--line-soft); font-size: 13px; cursor: auto; overflow: auto; }
.cust-sec { display: grid; gap: 6px; flex: none; }
.cust-sec h3 { margin: 0; color: var(--ink-3); font-size: 12px; font-weight: 600; }
.cust-sec-hist { display: flex; flex: 0 1 auto; flex-direction: column; min-height: 98px; }
.cust-hist { display: grid; align-content: start; gap: 8px; flex: 0 1 auto; min-height: 72px; padding-right: 4px; overflow-y: auto; }
.cust-line { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 8px; color: var(--ink); font-size: 13px; overflow-wrap: anywhere; }
.cust-line.cust-order { grid-template-columns: 56px minmax(0, 1fr) auto; }
.cust-amt { color: var(--ink); font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cust-key { color: var(--ink-3); }
.cust-card .empty-line { padding: 0; }

/* ---- 客户档案页下面的只读块「账本里的其他客户」：名片沿用上面同一套样式，只读——不抬起、只有名字那一行能点开 ---- */
.led-section { margin: 28px 0 8px; }
.led-title { display: flex; align-items: center; margin: 0 0 12px; color: var(--ink); font-size: 15px; font-weight: 600; }
.cust-grid > li.cust-card.led-card { cursor: default; }
@media (hover: hover) {
  .cust-grid > li.cust-card.led-card:not(.open):hover { transform: none; box-shadow: var(--edge-shadow); }
}
.cust-grid > li.cust-card.led-card:not(.open) { grid-template-columns: minmax(0, 1fr); }      /* 结算方式很长时在卡里省略，不把整张卡撑宽 */
.led-card .cust-tags { min-width: 0; }
.led-card .cust-stat { min-width: 0; max-width: 100%; }
.cust-stat.led-terms { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.led-more { display: flex; justify-content: center; margin: 16px 0 0; }

/* 窄一些：缺料卡放到库存表上面，单列 */
@media (max-width: 1100px) {
  .stock-layout, .stock-layout.no-short { grid-template-columns: minmax(0, 1fr); }
  .stock-layout > .stock-short { grid-column: 1; grid-row: 1; position: static; max-height: none; overflow: visible; }
  .stock-layout > .stock-card { grid-column: 1; grid-row: 2; }
  .stock-layout.no-short > .stock-card { grid-row: 1; }
}
/* 手机：“?”说明改成顶在整行下面展开（原来的气泡会伸出屏幕右边，让页面能横着拖） */
@media (max-width: 850px) {
  .view-stock .page-tools { position: relative; }
  .view-stock .tip { position: static; }
  .view-stock .tip::after { display: none; top: calc(100% + 4px); left: 0; right: 0; width: auto; max-width: none; transform: none; }
  .view-stock .tip:hover::after, .view-stock .tip:focus::after, .view-stock .tip:focus-visible::after { display: block; }
}
/* 手机：库存表每行变成“名称在上、库存进价售价在下”的小卡，不横向滚动 */
@media (max-width: 600px) {
  .stock-card .stock-toolbar { flex-direction: column; align-items: stretch; gap: 8px; }
  .stock-card .stock-tools { width: 100%; }
  .stock-card .stock-search { flex: 1 1 auto; }
  .stock-card .stock-search input { width: 100%; }
  .stock-table, .stock-table tbody { display: block; width: 100%; }
  .stock-table thead { display: none; }
  .stock-table tr { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; padding: 12px 16px; border-bottom: 1px solid var(--line-soft); }
  .stock-table tbody tr:last-child { border-bottom: 0; }
  .stock-table td { padding: 0; border: 0; }
  .stock-table td:first-child { flex: 1 0 100%; padding: 0; }
  .stock-table td.num, .stock-table td.num:last-child { width: auto; padding: 0; text-align: left; font-size: 13px; }
  .stock-table td.num:nth-child(2) { margin-left: 52px; }
  .stock-table td[data-label]:not(:first-child)::before { content: attr(data-label) " "; color: var(--ink-3); }
  ul.short-list { padding: 0 12px 12px; }
  .cust-grid { grid-template-columns: minmax(0, 1fr); }
  .cust-grid > li.cust-card.open { grid-column: 1 / -1; }
}

/* ===== 军师：工作台客户条用客户档案同一张头像（头像填满原来的首字方块） ===== */
.customer-avatar:has(> .cav) { padding: 0; overflow: hidden; background: none; }
.customer-avatar > .cav { width: 100%; height: 100%; border-radius: inherit; font-size: inherit; }

/* ===== 工单 T1：新人练手（只由 T1 改；类名都以 pr- 开头，范围 main.content.view-practice） ===== */
.pr { display: grid; gap: 16px; max-width: 960px; margin: 0 auto; }
.pr[data-practice="play"], .pr[data-practice="result"], .pr[data-practice="plan"] { max-width: 720px; }
.pr-ic { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.pr-ic.up { transform: rotate(180deg); }
.pr button { font-family: var(--font); }

/* 顶上一条：星 + 每单一格的进度条 + 已完成数 + “?” */
.pr-hero { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border: 1px solid var(--edge-color); border-radius: var(--r-panel); background: var(--panel-bg); box-shadow: var(--edge-shadow); }
.pr-hero-star { display: grid; place-items: center; width: 32px; height: 32px; flex: none; border-radius: 50%; background: var(--seal); color: #FFFFFF; }
.pr-hero-star .pr-ic { width: 18px; height: 18px; }
.pr-meter { flex: 1; display: flex; gap: 4px; min-width: 0; }
.pr-meter-seg { flex: 1; height: 8px; border-radius: 4px; background: var(--line); }
.pr-meter-seg.half { background: var(--ink-3); }
.pr-meter-seg.full { background: var(--seal); }
.pr-hero-count { flex: none; color: var(--ink-3); font-size: 15px; }
.pr-hero-count b { color: var(--ink); font-size: 22px; font-weight: 700; }
.pr-hero .tip { margin: 0; width: 20px; height: 20px; font-size: 12px; }

/* 单子卡：头像 + 标题标签 + 三格进度 */
.pr-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 12px; }
.pr-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; width: 100%; min-height: 84px; padding: 12px 16px; text-align: left; color: var(--ink); cursor: pointer;
  border: 1px solid var(--edge-color); border-radius: var(--r-panel); background: var(--panel-bg); box-shadow: var(--edge-shadow); -webkit-backdrop-filter: var(--glass); backdrop-filter: var(--glass); transition: transform .12s, background .12s; }
.pr-card:hover { background: var(--panel-strong); }
.pr-card:active { transform: scale(.985); }
.pr-card.perfect { box-shadow: inset 0 0 0 1.5px var(--seal), var(--edge-shadow); }
.pr-card.skeleton { min-height: 84px; background: var(--line-soft); box-shadow: none; cursor: default; }
.pr-card-title { display: block; overflow: hidden; font-size: 16px; font-weight: 650; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.pr-card-main { min-width: 0; display: grid; gap: 4px; }
.pr-card-side { display: grid; justify-items: end; gap: 8px; color: var(--ink-3); }
.pr-card-score { font-size: 16px; font-weight: 700; color: var(--ink); }
.pr-card-score.full { color: var(--seal); }
.pr-card-go { display: inline-grid; }
.pr-tags { display: flex; flex-wrap: wrap; gap: 4px; }
.pr-chip { padding: 4px 8px; border-radius: 999px; background: var(--line-soft); color: var(--ink-2); font-size: 13px; font-style: normal; line-height: 1.2; white-space: nowrap; }
.pr-chip.hot { background: var(--carbon-wash); color: var(--carbon); }

/* 进度格：对＝绿＋勾，错＝红＋叉，当前＝墨色，没到＝灰 */
.pr-segs { display: inline-flex; gap: 4px; }
.pr-seg { display: inline-grid; place-items: center; background: var(--line); color: #FFFFFF; }
.pr-seg .pr-ic { width: 12px; height: 12px; stroke-width: 3; }
.pr-seg.ok { background: var(--green); }
.pr-seg.bad { background: var(--red); }
.pr-seg.cur { background: var(--ink); }
.pr-card .pr-seg { width: 20px; height: 20px; border-radius: 50%; }
.pr-top { display: flex; align-items: center; gap: 12px; }
.pr-top .pr-segs { flex: 1; }
.pr-top .pr-seg { flex: 1; height: 8px; border-radius: 4px; }
.pr-top .pr-seg .pr-ic { display: none; }
.pr-back { display: grid; place-items: center; width: 40px; height: 40px; flex: none; border: 1px solid var(--line); border-radius: var(--r-ctl); background: rgba(255, 255, 255, .7); color: var(--ink-2); cursor: pointer; }
.pr-back:hover { background: #FFFFFF; color: var(--ink); }
.pr-top-pos { min-width: 32px; color: var(--ink-3); font-size: 14px; text-align: right; }
.pr-plan-title { flex: 1; font-size: 16px; font-weight: 650; }

/* 客户来的消息：左边头像，右边白色气泡 */
.pr-msg { display: flex; align-items: flex-start; gap: 12px; }
.pr-bubble { min-width: 0; flex: 1; padding: 12px 16px; border: 1px solid var(--edge-color); border-radius: 4px var(--r-panel) var(--r-panel) var(--r-panel); background: #FFFFFF; box-shadow: var(--edge-shadow); }
.pr-bubble-name { margin-bottom: 4px; color: var(--ink-3); font-size: 13px; }
.pr-bubble-text { margin: 0; font-size: 15px; line-height: 1.6; white-space: pre-line; overflow-wrap: anywhere; }
.pr-bubble-text.clamp { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.pr-more { display: inline-flex; align-items: center; gap: 4px; margin-top: 8px; padding: 4px 0; border: 0; background: none; color: var(--carbon); font-size: 14px; cursor: pointer; }
.pr-more .pr-ic { width: 16px; height: 16px; }

/* 题目与大按钮选项 */
.pr-q { display: grid; gap: 12px; }
.pr-ask { margin: 0; font-size: 19px; font-weight: 700; line-height: 1.45; }
.pr-options { display: grid; gap: 12px; }
.pr-opt { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; align-items: center; gap: 12px; width: 100%; min-height: 56px; padding: 12px 16px; text-align: left; color: var(--ink); font-size: 16px; line-height: 1.45; cursor: pointer;
  border: 1.5px solid var(--line); border-radius: var(--r-panel); background: #FFFFFF; box-shadow: var(--edge-shadow); transition: transform .1s, border-color .1s, background .1s; }
.pr-opt:hover { border-color: var(--ink-3); }
.pr-opt:active { transform: scale(.985); }
.pr-letter { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--line-soft); color: var(--ink-2); font-size: 15px; font-weight: 700; }
.pr-opt-text { min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; overflow-wrap: anywhere; }
.pr-opt-mark { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; color: #FFFFFF; }
.pr-opt.right { border-color: var(--green); background: var(--green-bg); }
.pr-opt.right .pr-letter, .pr-opt.right .pr-opt-mark { background: var(--green); color: #FFFFFF; }
.pr-opt.wrong { border-color: var(--red); background: var(--red-bg); animation: pr-shake .35s; }
.pr-opt.wrong .pr-letter, .pr-opt.wrong .pr-opt-mark { background: var(--red); color: #FFFFFF; }
.pr-opt.dim { background: rgba(255, 255, 255, .55); color: var(--ink-3); box-shadow: none; }
.pr-opt[aria-disabled="true"] { cursor: default; }
.pr-opt[aria-disabled="true"]:active { transform: none; }
.pr-ai { display: inline-flex; align-items: center; gap: 4px; padding: 4px 8px; border-radius: 999px; background: var(--line-soft); color: var(--ink-2); font-size: 13px; line-height: 1.2; }
.pr-ai .pr-ic { width: 14px; height: 14px; }
@keyframes pr-shake { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-5px); } 75% { transform: translateX(5px); } }
@keyframes pr-rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .pr-opt.wrong, .pr-reveal { animation: none; } }

/* 揭晓：对错一眼看到，下面一句老业务员思路，依据收成一行可展开 */
.pr-reveal { scroll-margin-bottom: 112px; display: grid; gap: 12px; padding: 16px; border: 1px solid var(--edge-color); border-radius: var(--r-panel); background: var(--panel-strong); box-shadow: var(--edge-shadow); animation: pr-rise .22s ease-out both; }
.pr-reveal.ok { box-shadow: inset 4px 0 0 var(--green), var(--edge-shadow); }
.pr-reveal.bad { box-shadow: inset 4px 0 0 var(--red), var(--edge-shadow); }
.pr-verdict { display: flex; align-items: center; gap: 8px; font-size: 18px; }
.pr-badge { display: inline-grid; place-items: center; width: 28px; height: 28px; flex: none; border-radius: 50%; color: #FFFFFF; }
.pr-badge .pr-ic { width: 16px; height: 16px; stroke-width: 3; }
.pr-reveal.ok .pr-badge, .pr-recap li.ok .pr-badge { background: var(--green); }
.pr-reveal.bad .pr-badge, .pr-recap li.bad .pr-badge { background: var(--red); }
.pr-answer-chip { margin-left: auto; padding: 4px 12px; border-radius: 999px; background: var(--green-bg); color: var(--green); font-size: 14px; font-weight: 600; }
.pr-why { margin: 0; font-size: 16px; line-height: 1.6; }
.pr-why-tag { display: inline-block; margin-right: 8px; padding: 2px 8px; border-radius: 6px; background: var(--ink); color: #FFFFFF; font-size: 13px; font-weight: 600; vertical-align: 1px; }
.pr-basis-toggle { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 40px; padding: 8px 12px; text-align: left; border: 1px solid var(--line); border-radius: var(--r-ctl); background: rgba(255, 255, 255, .7); color: var(--ink-2); font-size: 14px; cursor: pointer; }
.pr-basis-toggle span { flex: 1; }
.pr-basis-toggle .pr-ic { width: 18px; height: 18px; }
.pr-basis-body { padding: 12px; border: 1px dashed var(--line); border-radius: var(--r-ctl); background: rgba(255, 255, 255, .7); font-size: 14px; }
.pr-basis-title { font-size: 15px; font-weight: 600; }
.pr-basis-title small { display: block; margin-top: 4px; color: var(--ink-3); font-size: 13px; font-weight: 400; }
.pr-basis-lines { display: grid; gap: 8px; margin: 12px 0 0; padding: 0; list-style: none; }
.pr-basis-lines li { display: flex; align-items: center; gap: 12px; }
.pr-basis-lines li b { margin-left: auto; }
.pr-basis-quote { margin: 8px 0 0; padding: 4px 12px; border-left: 3px solid var(--carbon); color: var(--ink-2); line-height: 1.6; }
.pr-next { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 52px; font-size: 17px; }

/* 结果：头像 + 标题 + 朱红章；你几分 / 满分几分；三题回顾 */
.pr-result { display: grid; gap: 16px; padding: 24px 16px 16px; border: 1px solid var(--edge-color); border-radius: var(--r-panel); background: var(--panel-bg); box-shadow: var(--edge-shadow); }
.pr-result-head { position: relative; display: flex; align-items: center; gap: 12px; min-height: 108px; }
.pr-result-who { min-width: 0; flex: 1; display: grid; gap: 8px; }
.pr-result-who b { font-size: 17px; line-height: 1.3; }
.pr-result.perfect .pr-result-who { padding-right: 112px; }
.pr-seal { position: absolute; right: 0; top: 50%; width: 108px; height: 108px; margin-top: -54px; color: var(--seal); filter: url(#zg-inkpad); transform: rotate(-9deg); opacity: 0; animation: pr-seal-in .3s ease-out both; }
.pr-seal.still { opacity: .88; animation: none; }
.pr-seal .seal { display: block; width: 100%; height: 100%; }
.pr-seal .seal circle { fill: none; stroke: currentColor; }
.pr-seal .seal text { fill: currentColor; stroke: none; font-family: var(--font); text-anchor: middle; }
@keyframes pr-seal-in { from { opacity: 0; transform: rotate(-9deg) scale(1.03); } to { opacity: .88; transform: rotate(-9deg) scale(1); } }
.pr-score { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; margin: 0; color: var(--ink-2); font-size: 20px; }
.pr-score b { font-size: 36px; font-weight: 800; line-height: 1; }
.pr-score .mine { color: var(--ink); }
.pr-result.perfect .pr-score .mine { color: var(--seal); }
.pr-score .top { color: var(--green); }
.pr-score-sep { margin-left: -8px; color: var(--ink-3); }
.pr-recap { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.pr-recap li { display: flex; align-items: flex-start; gap: 12px; padding: 12px; border: 1px solid var(--line-soft); border-radius: var(--r-ctl); background: var(--panel-strong); }
.pr-recap-text { min-width: 0; display: grid; gap: 4px; font-size: 14px; }
.pr-recap-ask { color: var(--ink-2); overflow-wrap: anywhere; }
.pr-recap-right { color: var(--green); font-weight: 600; overflow-wrap: anywhere; }
.pr-actions { display: grid; gap: 12px; }
.pr-big-btn { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; font-size: 16px; }

/* 标准答案方案卡 */
.pr-tier { display: grid; gap: 12px; padding: 16px; border: 1px solid var(--edge-color); border-radius: var(--r-panel); background: var(--panel-bg); box-shadow: var(--edge-shadow); }
.pr-tier.recommended { border-top: 3px solid var(--seal); }
.pr-tier header { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.pr-tier header b { font-size: 16px; }
.pr-tier-total { font-size: 22px; font-weight: 800; }
.pr-lines { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.pr-lines li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; font-size: 14px; }
.pr-line-body { min-width: 0; display: grid; gap: 4px; }
.pr-line-name { overflow-wrap: anywhere; }
.pr-line-qty { color: var(--ink-3); }
.pr-line-amt { text-align: right; white-space: nowrap; }
.pr-extra { display: flex; justify-content: space-between; gap: 12px; padding: 12px 16px; border: 1px dashed var(--line); border-radius: var(--r-ctl); color: var(--ink-2); font-size: 14px; }
.pr-empty { display: grid; justify-items: center; gap: 12px; padding: 24px; color: var(--ink-2); text-align: center; }

@media (min-width: 851px) {
  .pr-actions { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
}
@media (max-width: 520px) {
  .pr-grid { grid-template-columns: minmax(0, 1fr); }
  .pr-ask { font-size: 18px; }
}
/* ===== 工单 T1 结束 ===== */

/* ===== 工单 F2：老板审批卡片、撤销条、登录页路线、置顶订单、重置演示（只由 F2 改） ===== */
/* 规矩同 P2：间距 4/8/12/16/24；数据和状态 ≥ 13px；说明进“?”；颜色只用上面的变量。 */

/* ── 老板审批：一张一张的卡片 ── */
main.content.view-approvals { overflow-x: clip; }
.view-approvals > .appr-deck, .view-approvals > .appr-done { max-width: 640px; }
.appr-progress { display: inline-flex; align-items: center; gap: 12px; }
.appr-dots { display: inline-flex; align-items: center; gap: 4px; }
.appr-dots i { display: block; width: 8px; height: 8px; border-radius: 50%; background: var(--line); }
.appr-dots i.done { background: var(--green); }
.appr-dots i.now { background: var(--ink); }
.appr-stage { position: relative; padding-bottom: 24px; }
.appr-bg { position: absolute; inset: 0 0 24px 0; z-index: 0; display: flex; align-items: center; padding: 0 24px; border-radius: var(--r-panel); opacity: 0; pointer-events: none; }
.appr-bg .ic { width: 40px; height: 40px; stroke-width: 2.2; transition: transform .12s ease-out; }
.appr-bg.ok { justify-content: flex-start; background: var(--green-bg); color: var(--green); opacity: clamp(0, var(--swipe, 0), 1); }
.appr-bg.no { justify-content: flex-end; background: var(--red-bg); color: var(--red); opacity: clamp(0, calc(var(--swipe, 0) * -1), 1); }
.appr-deck.armed .appr-bg .ic { transform: scale(1.3); }
.appr-ghost { position: absolute; inset: 0 0 24px 0; z-index: 0; border: 1px solid var(--edge-color); border-radius: var(--r-panel); background: var(--panel-strong); box-shadow: var(--edge-shadow); }
.appr-ghost.g1 { transform: translateY(8px) scale(.96); opacity: .85; }
.appr-ghost.g2 { transform: translateY(16px) scale(.92); opacity: .6; }
.appr-card { position: relative; z-index: 1; padding: 24px; border: 1px solid var(--edge-color); border-radius: var(--r-panel); background: var(--panel-strong); box-shadow: var(--edge-shadow); -webkit-backdrop-filter: var(--glass); backdrop-filter: var(--glass); touch-action: pan-y; user-select: none; -webkit-user-select: none; cursor: grab; will-change: transform; }
.appr-card.dragging { cursor: grabbing; }
.appr-card.enter { animation: appr-in .24s ease-out; }
@keyframes appr-in { from { opacity: 0; transform: translateY(8px) scale(.96); } to { opacity: 1; transform: none; } }
.appr-card img { -webkit-user-drag: none; pointer-events: none; }
.appr-who { display: flex; align-items: center; gap: 12px; }
.appr-who-text { flex: 1; min-width: 0; display: grid; gap: 4px; }
.appr-who-text strong { font-size: 16px; font-weight: 600; line-height: 1.3; overflow-wrap: anywhere; }
.appr-who-text span { color: var(--ink-3); font-size: 13px; }
.appr-items { display: grid; gap: 16px; margin-top: 16px; }
.appr-item { display: flex; align-items: flex-start; gap: 12px; }
.appr-item-main { flex: 1; min-width: 0; display: grid; gap: 8px; }
.appr-item-name { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; }
.appr-item-name strong { font-size: 15px; font-weight: 600; overflow-wrap: anywhere; }
.appr-item-name b { color: var(--ink-3); font-size: 13px; font-weight: 600; }
.appr-prices { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; }
.appr-old { color: var(--ink-3); font-size: 14px; }
.appr-arrow { color: var(--ink-3); font-size: 14px; }
.appr-new { font-size: 24px; font-weight: 700; line-height: 1.15; }
.appr-new.bad { color: var(--red); }
.appr-drop { padding: 2px 8px; border-radius: var(--r-chip); background: var(--yellow-bg); color: var(--yellow); font-size: 13px; font-weight: 600; }
.appr-drop.bad { background: var(--red-bg); color: var(--red); }
.appr-bar { position: relative; display: flex; height: 8px; border-radius: 999px; background: var(--line-soft); }
.appr-bar .keep { height: 100%; border-radius: 999px 0 0 999px; background: var(--ink); }
.appr-bar .cut { height: 100%; border-radius: 0 999px 999px 0; background: var(--red); opacity: .3; }
.appr-bar .floor { position: absolute; top: -4px; bottom: -4px; width: 2px; margin-left: -1px; border-radius: 1px; background: var(--seal); }
.appr-flag { justify-self: start; padding: 2px 8px; border-radius: var(--r-chip); background: var(--red-bg); color: var(--red); font-size: 13px; font-weight: 600; }
.appr-hist { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; color: var(--ink-3); font-size: 13px; }
.appr-hist-k { display: inline-flex; align-items: center; gap: 4px; }
.appr-chip { display: inline-flex; align-items: baseline; gap: 4px; padding: 2px 8px; border-radius: var(--r-chip); background: var(--line-soft); color: var(--ink-2); font-size: 13px; font-weight: 600; }
.appr-chip small { color: var(--ink-3); font-size: 13px; font-weight: 400; }
.appr-chip.low { background: var(--red-bg); color: var(--red); }
.appr-more { color: var(--ink-3); font-size: 13px; }
.appr-sums { display: grid; gap: 8px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--line-soft); }
.appr-sum-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; color: var(--ink-2); font-size: 14px; }
.appr-sum-v { display: inline-flex; align-items: baseline; flex-wrap: wrap; justify-content: flex-end; gap: 4px 8px; }
.appr-sum-v s { color: var(--ink-3); }
.appr-sum-v b { color: var(--ink); font-size: 16px; font-weight: 700; }
.appr-sum-v b.neg { color: var(--red); }
.appr-sum-v em { color: var(--ink-3); font-size: 13px; font-style: normal; }
.appr-note { display: flex; align-items: flex-start; gap: 8px; margin-top: 12px; padding: 8px 12px; border-radius: var(--r-ctl); background: var(--line-soft); color: var(--ink-2); font-size: 14px; overflow-wrap: anywhere; }
.appr-note .ic { width: 16px; height: 16px; margin-top: 3px; color: var(--ink-3); }
.appr-note.ai { background: var(--carbon-wash); color: var(--carbon); }
.appr-note.ai .ic { color: var(--carbon); }
.appr-note small { font-size: 13px; }
.appr-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 16px; }
.appr-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 16px; font-size: 15px; }
.appr-btn .ic { width: 18px; height: 18px; }
.appr-done { margin-top: 16px; padding: 0; }
.appr-done > summary { padding: 12px 16px; cursor: pointer; font-size: 14px; font-weight: 600; }
.appr-done .approval-list { padding: 0 16px 16px; }
/* 没有待批：顶上只有一个小标签，“已处理”铺满内容区宽度，宽屏分两列，窄屏一列 */
.view-approvals > .appr-done.wide { max-width: none; margin-top: 0; }
.view-approvals > .appr-done.wide .approval-list { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
@media (max-width: 900px) { .view-approvals > .appr-done.wide .approval-list { grid-template-columns: minmax(0, 1fr); } }
/* 驳回理由 / 二次确认：手机从底下升起，电脑居中 */
.appr-sheet-back { position: fixed; inset: 0; z-index: 40; display: grid; align-items: end; justify-items: center; background: rgba(28, 32, 38, .45); }
.appr-sheet { width: min(100%, 480px); display: grid; gap: 16px; padding: 24px; border-radius: var(--r-panel) var(--r-panel) 0 0; background: var(--ground); box-shadow: var(--edge-shadow); animation: appr-sheet-in .2s ease-out; }
.appr-sheet h3 { margin: 0; font-size: 16px; font-weight: 600; }
.appr-reasons { display: flex; flex-wrap: wrap; gap: 8px; }
.appr-reason { min-height: 40px; padding: 0 16px; font-size: 14px; }
.appr-other { display: flex; gap: 8px; }
.appr-other .setting-input { flex: 1; min-width: 0; height: 40px; min-height: 40px; padding: 0 12px; font-size: 14px; }
.appr-other .btn { min-height: 40px; padding: 0 16px; }
.appr-sheet-foot { display: flex; justify-content: space-between; gap: 8px; }
.appr-risk { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.appr-risk li { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 12px 16px; border-radius: var(--r-ctl); background: var(--red-bg); font-size: 14px; }
.appr-risk b { color: var(--red); font-size: 18px; font-weight: 700; }
.appr-sheet-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@keyframes appr-sheet-in { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@media (min-width: 851px) {
  .appr-sheet-back { align-items: center; }
  .appr-sheet { border-radius: var(--r-panel); }
}
/* 撤销条：贴着屏幕底部，5 秒走完 */
.undo-bar { position: fixed; left: 50%; bottom: 24px; z-index: 55; width: min(440px, calc(100vw - 32px)); display: flex; align-items: center; gap: 12px; padding: 12px 12px 15px 16px; overflow: hidden; border-radius: var(--r-ctl); background: var(--ink); color: #fff; box-shadow: 0 10px 30px -10px rgba(28, 32, 38, .5); font-size: 14px; transform: translateX(-50%); animation: undo-in .18s ease-out; }
.undo-bar[hidden] { display: none; }
.undo-ic { flex: none; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: var(--green); font-size: 13px; font-weight: 700; line-height: 1; }
.undo-bar[data-kind="deny"] .undo-ic { background: var(--red); }
.undo-text { flex: 1; min-width: 0; font-weight: 600; overflow-wrap: anywhere; }
.undo-btn { flex: none; min-height: 36px; padding: 0 16px; border: 1px solid rgba(255, 255, 255, .45); border-radius: var(--r-chip); background: transparent; color: #fff; font: 700 14px/1 var(--font); cursor: pointer; }
.undo-btn:hover { background: rgba(255, 255, 255, .14); }
.undo-timer { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: rgba(255, 255, 255, .22); }
.undo-timer b { display: block; height: 100%; background: #fff; transform-origin: left center; animation: undo-run linear forwards; }
@keyframes undo-run { from { transform: scaleX(1); } to { transform: scaleX(0); } }
@keyframes undo-in { from { opacity: 0; transform: translate(-50%, 8px); } to { opacity: 1; transform: translateX(-50%); } }
@media (max-width: 850px) {
  .undo-bar { bottom: calc(94px + env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-motion: reduce) {
  .appr-card.enter, .appr-sheet, .undo-bar { animation: none; }
  .undo-timer b { animation: none; }
  .appr-bg .ic { transition: none; }
}
/* —— 登录页：先来挑战 + 3 分钟路线（电脑放左边大图区，手机放进登录框；两份只显示一份）—— */
.login-promo { display: grid; gap: 16px; margin-top: 24px; }
.login-promo-box { display: none; margin: 0 0 16px; }
.challenge-btn { justify-self: start; min-height: 48px; padding: 0 24px; font-size: 15px; }
.route { display: grid; gap: 12px; }
.route-head { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; }
.route-head strong { font-size: 15px; font-weight: 600; }
.route-head .tip { margin: 0; }
.route-min { color: var(--ink-3); font-size: 13px; }
.route-steps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; gap: 12px; margin: 0; padding: 0; list-style: none; }
.route-step { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.route-go { flex: 1; display: grid; grid-template-columns: auto auto 1fr; grid-template-areas: "n av sec" "tx tx tx"; align-items: center; gap: 8px; width: 100%; min-height: 96px; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255, 255, 255, .86); color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.route-go:hover { border-color: #B9BEC6; background: #FFFFFF; }
.route-go:focus-visible { outline: 2px solid var(--carbon); outline-offset: 2px; }
.route-go:disabled { opacity: .55; cursor: default; }
.route-n { grid-area: n; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--ink); color: #FFFFFF; font-size: 13px; font-weight: 600; line-height: 1; }
.route-go > .cav { grid-area: av; }
.route-sec { grid-area: sec; justify-self: end; color: var(--ink-3); font-size: 13px; }
.route-text { grid-area: tx; display: grid; gap: 4px; min-width: 0; }
.route-text strong { font-size: 14px; font-weight: 600; line-height: 1.45; overflow-wrap: anywhere; }
.route-who { color: var(--ink-3); font-size: 13px; }
.route-also { justify-self: start; min-height: 32px; padding: 0 8px; border: 0; border-radius: var(--r-chip); background: transparent; color: var(--carbon); font: 600 13px/1 var(--font); cursor: pointer; }
.route-also:hover { background: var(--carbon-wash); }
.route-also:disabled { opacity: .55; cursor: default; }
.demo-account .demo-start { margin-top: 4px; color: var(--ink-2); font-size: 13px; line-height: 1.4; white-space: normal; overflow: visible; }
.login-mode { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.login-mode .tip { flex: none; margin: 0; }
@media (min-width: 1280px) {
  .route-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .login-promo-hero { display: none; }
  .login-promo-box { display: grid; }
  .challenge-btn { justify-self: stretch; width: 100%; }
  .route-steps { display: flex; gap: 12px; overflow-x: auto; padding: 0 0 8px; scroll-snap-type: x proximity; }
  .route-step { flex: 0 0 min(232px, 72%); scroll-snap-align: start; }
}
/* —— 订单置顶角标、订单头部交期、订单行来源小标签 —— */
.pin-badge { justify-self: start; padding: 2px 8px; border-radius: var(--r-chip); background: var(--carbon-wash); color: var(--carbon); font-size: 13px; font-weight: 600; line-height: 1.4; }
.order-card.pinned-order { border-color: var(--line); }
.view-orders .order-due { padding: 4px 8px; border-radius: var(--r-chip); background: var(--line-soft); color: var(--ink); font-size: 13px; font-weight: 600; }
.line-src-row { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.line-src { padding: 2px 8px; border-radius: var(--r-chip); background: var(--line-soft); color: var(--ink-2); font-size: 13px; font-weight: 600; line-height: 1.4; }
.line-src.quote { background: var(--carbon-wash); color: var(--carbon); }
.line-src.change, .line-src.changed { background: var(--yellow-bg); color: var(--yellow); }
/* —— 老板后台：重置演示一栏、进度、倒计时 —— */
.reset-strip { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px 16px; margin: 0 0 16px; padding: 12px 16px; }
.reset-main { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; min-width: 0; }
.reset-title { font-size: 15px; font-weight: 600; }
.reset-main .tip { margin: 0; }
.reset-state { color: var(--ink-2); font-size: 14px; }
.reset-state.ok { color: var(--green); }
.reset-state.bad { color: var(--red); }
.reset-bar { appearance: none; -webkit-appearance: none; width: 160px; height: 8px; border: 0; border-radius: 4px; background: var(--line-soft); overflow: hidden; }
.reset-bar::-webkit-progress-bar { border-radius: 4px; background: var(--line-soft); }
.reset-bar::-webkit-progress-value { border-radius: 4px; background: var(--carbon); transition: width .3s; }
.reset-bar::-moz-progress-bar { border-radius: 4px; background: var(--carbon); }
.reset-note { padding: 4px 12px; border-radius: var(--r-chip); background: var(--yellow-bg); color: var(--yellow); font-size: 13px; font-weight: 600; }
.reset-note b { font-size: 14px; }
.reset-warn { margin: 0; color: var(--ink-2); font-size: 14px; line-height: 1.6; }
.seed-banner .btn { margin-left: 8px; }
@media (prefers-reduced-motion: reduce) {
  .reset-bar::-webkit-progress-value { transition: none; }
}
/* ===== 工单 F2 结束 ===== */

/* ===== 工单 F1：确认闸、导出锁、议价提示、改单与系统带入（只由 F1 改；颜色只用上面已有的变量，间距只用 4/8/12/16/24） ===== */
/* 确认闸：“还有 N 项”小徽标（图标 + 数字，点它滚到第一项）。确认键置灰时挂在它旁边 */
.review-badge { display: inline-flex; align-items: center; justify-content: center; gap: 4px; flex: none; min-height: 36px; padding: 4px 12px; border: 0; border-radius: 999px; background: var(--yellow-bg); color: var(--yellow); font: 600 13px/1.2 var(--font); white-space: nowrap; cursor: pointer; }
.review-badge .ic { width: 16px; height: 16px; }
.review-badge:hover { box-shadow: 0 0 0 1px var(--yellow); }
.view-workbench .wb-bar .review-badge { min-height: 40px; }
/* 手机宽把核对清单提到确认键前面：借 .wb-side 的卡片内样式，但不参与 .wb-side 的排序 */
.fields-first, .fields-first.wb-side { order: 0; margin: 0 0 12px; }

/* 逐项处理：按此 / 填上 / 跳过（写理由）；已跳过的项灰着，理由收进“?” */
.view-workbench .frow-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; }
.view-workbench .frow-actions .btn, .view-workbench .review-skip .btn { min-height: 36px; padding: 4px 12px; font-size: 13px; }
.view-workbench .frow-actions .btn .ic { width: 14px; height: 14px; margin-right: 4px; vertical-align: -2px; }
.view-workbench .review-skip { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 8px; }
.view-workbench .review-skip .setting-input { flex: 1 1 160px; width: auto; min-width: 0; height: 36px; min-height: 36px; padding: 0 12px; font-size: 14px; }
.view-workbench .frow .form-error { min-height: 0; margin: 8px 0 0; }
.state.skipped { color: var(--ink-3); background: var(--grey-bg); }
.view-workbench .review-skipped { margin-top: 12px; }
.view-workbench .review-skipped .frow { padding: 8px 12px; border-radius: var(--r-ctl); background: var(--grey-bg); }
.view-workbench .review-skipped .frow-top { min-height: 28px; }
.view-workbench .review-skipped .tip { margin-left: auto; }
/* 被点到 / 被后台挡住的那一项：黄圈闪一下（不跟系统“减少动画”走，要看得见） */
@keyframes f1-flash { 0% { box-shadow: 0 0 0 3px var(--yellow); background: var(--yellow-bg); } 100% { box-shadow: 0 0 0 0 transparent; background: transparent; } }
.frow.review-flash, .frow.flash { border-radius: var(--r-ctl); animation: f1-flash 1.8s ease-out; }

/* 改单确认前还没派出的待办：灰着、没有按钮、不进计数 */
.view-workbench .task-card.waiting { background: var(--grey-bg); box-shadow: none; opacity: .72; }
.view-workbench .task-card.waiting .action-icon { background: transparent; color: var(--ink-3); }
.status-pill.wait { display: inline-flex; align-items: center; gap: 4px; background: transparent; color: var(--ink-3); box-shadow: inset 0 0 0 1px var(--line); }
.status-pill.wait .ic { width: 14px; height: 14px; }

/* 客户还价：需老板审批的醒目，可让范围内的次要 */
.bargain-banner { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: var(--r-chip); line-height: 1.5; }
.bargain-banner .ic { width: 18px; height: 18px; flex: none; }
.bargain-banner.need { background: var(--red-bg); color: var(--red); font-size: 14px; box-shadow: inset 3px 0 0 var(--red); }
.bargain-banner.need strong { font-weight: 700; }
.bargain-banner.range { background: var(--grey-bg); color: var(--ink-2); font-size: 13px; }
.view-workbench .options-card .bargain-banner + .bargain-banner { margin-top: 8px; }

/* 订单里已有确认过的行：追加还是替换；确认后后台返回的一次性提示 */
.view-workbench .replace-row { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; margin-top: 12px; color: var(--ink-3); font-size: 13px; line-height: 1.6; }
.view-workbench .replace-link { min-height: 0; padding: 0; border: 0; background: none; color: var(--carbon); font: inherit; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.lines-notice { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: var(--r-chip); background: var(--carbon-wash); color: var(--carbon); font-size: 13px; line-height: 1.6; }
.lines-notice .ic { width: 16px; height: 16px; flex: none; }
.lines-notice > span { flex: 1; min-width: 0; }
.lines-notice .icon-button { width: 28px; height: 28px; flex: none; border: 0; background: transparent; }
.lines-notice.attention { background: var(--yellow-bg); color: var(--yellow); font-weight: 600; }

/* 系统带入（订单里本来就有的客户、明细、原交期）：不是推测，也没有原文可定位 */
.sys-tag { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 999px; background: var(--grey-bg); color: var(--ink-2); font-size: 13px; font-weight: 600; white-space: nowrap; }
.sys-tag .ic { width: 12px; height: 12px; }

/* 知识检索结果里带 warning 的段落：红色警示图标，说明收进“?” */
.snippet-warn { display: inline-flex; align-items: center; gap: 4px; margin-left: 8px; color: var(--red); vertical-align: middle; }
.snippet-warn .ic { width: 16px; height: 16px; }
.knowledge-drawer .snippet.warned { box-shadow: inset 3px 0 0 var(--red); padding-left: 12px; }
/* 导出锁等“?”挂在按钮行里时，和按钮垂直居中（默认贴在行顶，离按钮一截） */
.view-workbench .head-tools .tip, .view-workbench .frow-actions .tip, .view-workbench .replace-row .tip { align-self: center; margin-left: 0; }
/* 手机宽核对清单排在确认条前面后，确认条自然位置可能落到底部导航上：让它钉在导航上方，滚过去后再钉到顶（.content 底部留白 150px 先被扣掉，所以是负值） */
@media (max-width: 850px) {
  .view-workbench .wb-bar { bottom: -80px; }
}
/* ===== 工单 F1 结束 ===== */

/* ===== 第三波 W4：登录页里“你当老板：30 秒批 5 张”入口（游戏本身的样式在 web/game.css，只给 game.html 用） ===== */
.game-entry { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.game-entry:hover { text-decoration: none; }
/* ===== 第三波 W4 结束 ===== */

/* ===== 第三波 W5：客户芯片、欠款红条、口头承诺小单（只由 W5 改） ===== */
/* 客户芯片：图标 + 短词，原因收进“?”。红 = 欠款超额度 / 逾期 > 30 天；黄 = 超额度或逾期但还没到红；灰 = 行为标签 */
.cchips { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; }
.cchip { display: inline-flex; align-items: center; gap: 4px; padding: 4px 8px; border-radius: 999px; background: var(--line-soft); color: var(--ink-2); font-size: 13px; font-weight: 600; line-height: 1.2; white-space: nowrap; }
.cchip .mi { width: 14px; height: 14px; flex: none; }
.cchip .cdot { width: 6px; height: 6px; flex: none; border-radius: 50%; background: var(--ink-3); }
.cchip .tip { margin: 0; width: 16px; height: 16px; border-color: currentColor; background: transparent; color: inherit; }
.cchip.warn { background: var(--yellow-bg); color: var(--yellow); }
.cchip.bad { background: var(--red-bg); color: var(--red); }
.customer-banner > .cchips { flex: 0 1 auto; }
/* 欠款红条：挂在询价工作台顶部客户条下面，只在后台判为红色时出现 */
.credit-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0 0 8px; padding: 8px 16px; border-radius: var(--r-panel); background: var(--red-bg); color: var(--red); box-shadow: inset 3px 0 0 var(--red), var(--edge-shadow); }
.credit-bar > .mi { width: 18px; height: 18px; flex: none; }
.credit-text { font-size: 14px; font-weight: 650; font-variant-numeric: tabular-nums; }
.credit-advice { display: inline-flex; align-items: center; padding: 4px 12px; border-radius: 999px; background: var(--panel-strong); box-shadow: inset 0 0 0 1px var(--red); color: var(--red); font-size: 13px; font-weight: 600; white-space: nowrap; }
.credit-bar .tip { margin: 0; border-color: currentColor; background: transparent; color: inherit; }
/* 口头承诺小单：自带 DOM，挂在 body 上（不随页面重画） */
.promise-modal { width: min(520px, 100%); }
.promise-modal .modal-body { display: grid; gap: 12px; }
.promise-quote { padding: 8px 12px; border-radius: var(--r-chip); background: var(--red-bg); box-shadow: inset 3px 0 0 var(--red); color: var(--red); font-size: 14px; font-weight: 600; line-height: 1.6; }
.promise-quote p, .promise-suggest p { margin: 0; }
.promise-suggest { padding: 8px 12px; border-radius: var(--r-chip); background: var(--carbon-wash); color: var(--carbon); font-size: 14px; line-height: 1.6; }
.promise-suggest em { display: block; margin-bottom: 4px; color: var(--ink-3); font-size: 13px; font-style: normal; }
.promise-ack[hidden] { display: none; }
.promise-ack { margin: 0; }
.promise-quick { display: flex; flex-wrap: wrap; gap: 8px; }
.promise-modal .modal-actions { margin-top: 4px; }
/* ===== 第三波 W5 结束 ===== */

/* ===== 第三波 W3：审批卡分级（级别条、红卡按住批、黄卡确认条、芯片、待定卡）（只由 W3 改；颜色只用上面已有的变量，间距只用 4/8/12/16/24） ===== */
.appr-deck { position: relative; }
/* 卡片顶边的级别条：图标 + 红/黄/绿 + 一句操作提示；解释和“演示假设”收进右边的“?” */
.appr-level { display: flex; align-items: center; gap: 8px; margin: -24px -24px 16px; padding: 8px 24px; border-radius: var(--r-panel) var(--r-panel) 0 0; font-size: 13px; line-height: 1.4; }
.appr-level .ic { width: 16px; height: 16px; }
.appr-level strong { font-size: 14px; font-weight: 700; }
.appr-level > span { flex: 1; min-width: 0; font-weight: 600; }
.appr-level .tip { margin: 0; }
.appr-level.red { background: var(--red-bg); color: var(--red); box-shadow: inset 0 3px 0 var(--red); }
.appr-level.yellow { background: var(--yellow-bg); color: var(--yellow); box-shadow: inset 0 3px 0 var(--yellow); }
.appr-level.green { background: var(--green-bg); color: var(--green); box-shadow: inset 0 3px 0 var(--green); }
/* “?”里的多行说明（\n 换行）；气泡在卡片里要盖过下面的内容 */
.appr-card .tip::after, .appr-sheet .tip::after { white-space: pre-line; }
.appr-card.settling { cursor: default; }
.appr-deck.blocked .appr-card { box-shadow: 0 0 0 2px var(--red), var(--edge-shadow); }
/* 后台给的原因：最多 3 枚短芯片 */
.appr-why { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.appr-why-chip { padding: 4px 8px; border-radius: var(--r-chip); background: var(--line-soft); color: var(--ink-2); font-size: 13px; font-weight: 600; line-height: 1.4; overflow-wrap: anywhere; }
.appr-why-chip.red { background: var(--red-bg); color: var(--red); }
.appr-why-chip.yellow { background: var(--yellow-bg); color: var(--yellow); }
.appr-why-chip.green { background: var(--green-bg); color: var(--green); }
/* 欠款一枚芯片 / 近期批价一排 / 全成本一行 */
.appr-credit { display: flex; align-items: center; gap: 8px; width: fit-content; max-width: 100%; margin-top: 12px; padding: 4px 8px 4px 12px; border-radius: var(--r-chip); background: var(--line-soft); color: var(--ink-2); font-size: 14px; font-weight: 600; }
.appr-credit .ic { width: 16px; height: 16px; }
.appr-credit > span { min-width: 0; overflow-wrap: anywhere; }
.appr-credit .tip { margin: 0; }
.appr-credit.warn { background: var(--yellow-bg); color: var(--yellow); }
.appr-credit.bad { background: var(--red-bg); color: var(--red); }
.appr-recent { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; margin-top: 12px; color: var(--ink-3); font-size: 13px; }
.appr-rc { padding: 2px 8px; border-radius: var(--r-chip); background: var(--line-soft); color: var(--ink-2); font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; }
.appr-rc.ok { background: var(--green-bg); color: var(--green); }
.appr-rc.no { background: var(--red-bg); color: var(--red); }
.appr-recent .tip { margin: 0; }
.appr-full { display: flex; align-items: center; gap: 8px; margin-top: 12px; color: var(--ink-2); font-size: 14px; }
.appr-full .ic { width: 16px; height: 16px; color: var(--ink-3); }
.appr-full b { font-size: 16px; font-weight: 700; }
.appr-full.neg, .appr-full.neg .ic { color: var(--red); }
.appr-full .tip { margin: 0; }
/* 待定卡：大字一句话 → 谁申请什么 → 事实格子 */
.appr-dtype span { display: inline-block; padding: 2px 8px; border-radius: var(--r-chip); background: var(--line-soft); color: var(--ink-2); font-size: 13px; font-weight: 600; }
.appr-headline { margin: 12px 0 0; font-size: 22px; font-weight: 700; line-height: 1.3; overflow-wrap: anywhere; }
.appr-request { margin: 8px 0 0; color: var(--ink-2); font-size: 15px; line-height: 1.5; overflow-wrap: anywhere; }
.appr-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 16px 0 0; }
.appr-fact { min-width: 0; padding: 8px 12px; border-radius: var(--r-ctl); background: var(--line-soft); }
.appr-fact dt { margin: 0; color: var(--ink-3); font-size: 13px; }
.appr-fact dd { margin: 4px 0 0; color: var(--ink); font-size: 15px; font-weight: 600; line-height: 1.4; overflow-wrap: anywhere; }
.appr-fact.bad { background: var(--red-bg); }
.appr-fact.bad dd { color: var(--red); }
.appr-fact.warn { background: var(--yellow-bg); }
.appr-fact.warn dd { color: var(--yellow); }
.appr-fact.ok { background: var(--green-bg); }
.appr-fact.ok dd { color: var(--green); }
.appr-fact:last-child:nth-child(odd) { grid-column: 1 / -1; }
@media (min-width: 560px) {
  .appr-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .appr-fact:last-child:nth-child(odd) { grid-column: auto; }
}
/* 连批 3 张后的短提示 */
.appr-lock { margin-top: 16px; padding: 8px 12px; border-radius: var(--r-ctl); background: var(--yellow-bg); color: var(--yellow); font-size: 13px; font-weight: 600; }
.appr-lock + .appr-actions { margin-top: 8px; }
/* 弹回时的提示 */
.appr-hint { position: absolute; left: 50%; top: 56px; z-index: 6; max-width: calc(100% - 32px); padding: 8px 16px; border-radius: var(--r-chip); background: var(--ink); color: #fff; font-size: 14px; font-weight: 600; text-align: center; transform: translateX(-50%); box-shadow: 0 10px 30px -10px rgba(28, 32, 38, .5); pointer-events: none; animation: appr-hint-in .18s ease-out; }
@keyframes appr-hint-in { from { opacity: 0; transform: translate(-50%, 8px); } to { opacity: 1; transform: translateX(-50%); } }
/* 黄卡确认条：就在卡片下面，写清对象和金额 */
.appr-confirm { position: sticky; bottom: 16px; z-index: 8; display: flex; align-items: center; gap: 8px; margin-top: 8px; padding: 12px; border-radius: var(--r-ctl); background: var(--ink); color: #fff; scroll-margin-bottom: 120px; box-shadow: 0 10px 30px -10px rgba(28, 32, 38, .5); }
@media (max-width: 850px) { .appr-confirm { position: fixed; left: 16px; right: 16px; bottom: 104px; z-index: 45; margin: 0; } }   /* 手机：钉在底部导航上面，不跟着长卡片滚到屏幕外 */
.appr-confirm .ic { width: 18px; height: 18px; flex: none; }
.appr-confirm-text { flex: 1; min-width: 0; font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }
.appr-confirm .btn { flex: none; min-height: 40px; padding: 0 16px; font-size: 14px; }
.appr-confirm .btn:not(.primary) { border-color: rgba(255, 255, 255, .45); background: transparent; color: #fff; }
.appr-confirm .btn.primary { border-color: #fff; background: #fff; color: var(--ink); }
/* 红卡理由单 + 按住批准 */
.appr-sheet-title { display: flex; align-items: center; gap: 8px; color: var(--red); }
.appr-sheet-title .ic { width: 18px; height: 18px; }
.appr-sheet-gist { margin: 0; color: var(--ink-2); font-size: 14px; overflow-wrap: anywhere; }
.appr-sheet.hold .appr-risk li { display: block; padding: 8px 12px; color: var(--red); font-weight: 600; }
.appr-reason { height: auto; padding: 8px 16px; white-space: normal; text-align: left; }
.appr-reason.on { border-color: var(--primary); background: var(--primary); color: #fff; }
.appr-hold { position: relative; gap: 8px; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.appr-hold[aria-disabled="true"] { opacity: .45; cursor: not-allowed; }
.appr-hold[data-holding] { transform: scale(.98); }
.appr-ring { flex: none; width: 24px; height: 24px; transform: rotate(-90deg); }
.appr-ring circle { fill: none; stroke-width: 4; }
.appr-ring .track { stroke: rgba(255, 255, 255, .3); }
.appr-ring .bar { stroke: #fff; stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: calc(100 - var(--hold, 0) * 100); }
/* 理由单盖在上一张的撤销条和提示上面：别让它们压住快捷理由和输入框（撤销倒计时照走，关掉理由单后条还在） */
.appr-sheet-back { z-index: 70; }
@media (prefers-reduced-motion: reduce) {
  .appr-hint { animation: none; }
  .appr-hold[data-holding] { transform: none; }
}
/* ===== 第三波 W3 结束 ===== */

/* ===== 第四波 F4：能力地图（只由 F4 改；颜色只用已有变量，间距只用 4/8/12/16/24，字号 ≥ 13px） ===== */
.cm { display: grid; gap: 16px; max-width: 1080px; }
.cm-head { display: flex; align-items: center; gap: 8px; }
.cm-title { margin: 0; font-size: 24px; font-weight: 600; line-height: 1.3; }
.cm-head .tip { margin: 0; }
.cm-playall { margin-left: auto; flex: none; padding-inline: 20px; font-size: 16px; font-weight: 600; white-space: nowrap; }
.cm-playall.cm-playall-all { margin-left: 0; }   /* 地图顶上两颗：「一键演示（7 个本事）」主按钮靠右，「全部连播」紧挨着它 */
.chip-btn.primary { border-color: var(--primary); background: var(--primary); color: #FFFFFF; }   /* 首页那排 chip 里的「一键演示」主按钮 */
.chip-btn.primary:hover { border-color: var(--primary-hover); background: var(--primary-hover); }
.cm-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); grid-auto-rows: 1fr; gap: 12px; margin: 0; padding: 0; list-style: none; }
.cm-item { display: flex; min-width: 0; }
.cm-free { display: flex; }
/* 一格：编号（左上）、状态点（右上）位置固定；名字区固定两行高、顶部对齐；名字下一句场景说明（来自 CAPMAP 的 line）；格子等高 */
.cm-cell { position: relative; display: flex; flex-direction: column; justify-content: flex-start; gap: 8px; width: 100%; min-height: 140px; padding: 16px; text-align: left; color: var(--ink); cursor: pointer;
  border: 1px solid var(--edge-color); border-radius: var(--r-panel); background: var(--panel-bg); box-shadow: var(--edge-shadow); -webkit-backdrop-filter: var(--glass); backdrop-filter: var(--glass); transition: transform .12s, background .12s; }
.cm-cell:hover:not(:disabled) { background: var(--panel-strong); transform: translateY(-1px); }
.cm-cell:active:not(:disabled) { transform: scale(.985); }
.cm-cell:focus-visible { outline: 2px solid var(--carbon); outline-offset: 2px; }
.cm-cell.wait { background: var(--line-soft); box-shadow: none; color: var(--ink-3); cursor: default; -webkit-backdrop-filter: none; backdrop-filter: none; }
.cm-cell.locked { opacity: .65; }
.cm-cell.wide { flex-direction: row; align-items: center; justify-content: flex-start; gap: 16px; min-height: 72px; }
.cm-cell.wide .cm-dot { position: static; margin-left: auto; }
.cm-cell .cm-dot { position: absolute; top: 21px; right: 16px; }
.cm-n { color: var(--ink-3); font-size: 15px; font-weight: 700; line-height: 20px; letter-spacing: .04em; }
.cm-text { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.cm-cell.wide .cm-text { flex: 1 1 auto; }
.cm-state { display: inline-flex; align-items: center; gap: 4px; color: var(--ink-2); font-size: 13px; white-space: nowrap; }
.cm-dot { flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--ink-3); }
.cm-dot.done { background: var(--green); }
.cm-dot.demo { background: var(--carbon); }
.cm-dot.fail { background: var(--red); }
.cm-dot.running { background: var(--orange); animation: cm-pulse 1.1s ease-in-out infinite; }
.cm-dot.wait { background: var(--line); box-shadow: inset 0 0 0 1px var(--ink-3); }
.cm-name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; min-height: 2.5em; overflow: hidden; font-size: 20px; font-weight: 650; line-height: 1.25; overflow-wrap: anywhere; }
.cm-cell.wide .cm-name { min-height: 0; }
.cm-line { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: var(--ink-2); font-size: 14px; font-weight: 400; line-height: 1.4; overflow-wrap: anywhere; }
.cm-cell.wait .cm-line { color: var(--ink-3); }
.cm-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; padding: 4px 0; }
.cm-skeleton .cm-cell { min-height: 140px; box-shadow: none; }
/* 弹层：登录页的整张地图、点一格弹出的运行记录 */
.cm-overlay { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; padding: 24px; background: rgba(28, 32, 38, .42); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.cm-detail-layer { z-index: 95; background: rgba(28, 32, 38, .32); }
.cm-sheet { position: relative; display: grid; gap: 16px; width: min(960px, 100%); max-height: 100%; overflow: auto; padding: 24px; border-radius: 24px; background: var(--ground); box-shadow: 0 24px 60px -24px rgba(28, 32, 38, .5); }
.cm-close { position: absolute; top: 16px; right: 16px; }
.cm-sheet .cm-head { padding-right: 40px; }
.cm-sheet .tag { padding: 4px 8px; font-size: 13px; }
.cm-detail { width: min(520px, 100%); }
.cm-d-head { display: flex; align-items: center; gap: 12px; padding-right: 40px; }
.cm-d-name { margin: 0; font-size: 24px; font-weight: 600; line-height: 1.3; }
.cm-d-head .cm-state { margin-left: auto; }
.cm-d-line { margin-top: -8px; color: var(--ink-2); font-size: 15px; }
/* 弹窗里的一行状态（几点跑过 · 怎么跑的 / 上次失败）；长解释在它旁边的问号气泡里 */
.cm-status { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; padding: 12px 16px; border-radius: var(--r-ctl); background: var(--panel-bg); color: var(--ink); font-size: 15px; font-weight: 600; }
.cm-status .tip { margin: 0; }
.cm-status.sub { margin-top: -8px; padding-block: 8px; color: var(--ink-2); font-size: 14px; font-weight: 400; }
/* 运行记录：版本信息里的几行（输入样本 / 版本 / 代码提交），一行一条 */
.cm-runs { display: grid; gap: 4px; margin: 0; padding: 12px 16px; border-radius: var(--r-ctl); background: var(--panel-bg); }
.cm-row { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 4px 0; }
.cm-row dt { flex: none; color: var(--ink-3); font-size: 14px; }
.cm-row dd { margin: 0; color: var(--ink); font-size: 15px; font-weight: 600; text-align: right; overflow-wrap: anywhere; }
.cm-row.fail dd, .cm-bad { color: var(--red); }
.cm-ok { color: var(--green); }
.cm-spin { display: inline-block; width: 12px; height: 12px; margin-right: 8px; vertical-align: -1px; border: 2px solid var(--line); border-top-color: var(--orange); border-radius: 50%; animation: cm-turn .8s linear infinite; }
.cm-blocked { color: var(--ink-2); font-size: 14px; }
/* 第七波 W3：运行记录下面的说明（"运行完成"不等于结果正确、重跑用的是预设原文、资料改过需重跑） */
.cm-note { color: var(--ink-2); font-size: 14px; line-height: 1.5; }
.cm-note.warn { color: var(--orange); }
.cm-small { display: inline-block; color: var(--ink-2); font-size: 13px; font-weight: 400; line-height: 1.5; }
.cm-actions { display: flex; flex-wrap: wrap; gap: 12px; }
/* 重新运行的实时进度：已用秒数在走；运行日志一行 = 后台真发生过的一步（10-24 虎哥：要代码行的输出，不要节点动画） */
.cm-live { display: grid; gap: 12px; padding: 12px 16px; border-radius: var(--r-ctl); background: var(--panel-bg); }
.cm-live-head { display: flex; align-items: center; gap: 8px; font-size: 15px; }
.cm-live-head .cm-spin { margin-right: 0; }
.cm-live-head strong { font-weight: 600; }
.cm-live-time { margin-left: auto; color: var(--ink-2); font-size: 14px; font-variant-numeric: tabular-nums; }
.cm-live-time b { color: var(--ink); font-weight: 600; }
/* 运行日志：等宽字体，一行一条真实事件（时间 阶段 model=… 用时 → 结果） */
.cm-log { display: grid; gap: 2px; margin: 0; padding: 10px 12px; list-style: none; overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--card-bg, #fff); font-family: ui-monospace, SFMono-Regular, Consolas, "Courier New", monospace; font-size: 12.5px; line-height: 1.8; }
.cm-log-line { display: flex; flex-wrap: wrap; gap: 2px 12px; white-space: nowrap; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.cm-log-at { color: var(--ink-3); }
.cm-log-name { color: var(--ink); font-weight: 600; }
.cm-log-engine, .cm-log-secs { color: var(--ink-3); }
.cm-log-via { color: var(--orange); font-size: 11.5px; }
.cm-log-result { color: var(--ink-2); white-space: normal; }
.cm-log-line.pending { color: var(--ink-3); }
.cm-log-line.error .cm-log-result { color: var(--red); }
.cm-stages { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.cm-stage { display: flex; align-items: center; gap: 8px; color: var(--ink-3); font-size: 14px; }
.cm-stage i { flex: none; display: grid; place-items: center; width: 18px; height: 18px; border: 2px solid var(--line); border-radius: 50%; font-size: 12px; font-style: normal; font-weight: 800; line-height: 1; }
.cm-stage.done, .cm-stage.running { color: var(--ink); }
.cm-stage.done i { border-color: var(--green); background: var(--green); color: #fff; }
.cm-stage.running i { border-top-color: var(--orange); animation: cm-turn .8s linear infinite; }
.cm-stage.error { color: var(--red); }
.cm-stage.error i { border-color: var(--red); color: var(--red); }
.cm-stage em { margin-left: auto; color: var(--ink-3); font-size: 13px; font-style: normal; font-variant-numeric: tabular-nums; }
.cm-live-open { justify-self: start; }
/* 重跑前先看输入：预设样本照片的缩略图（读的是那份作业真收到的原图） */
.cm-input { display: grid; gap: 6px; margin: 0; justify-items: start; }
.cm-input-img { display: block; max-width: 260px; max-height: 150px; object-fit: contain; border: 1px solid var(--line); border-radius: var(--r-ctl); background: #fff; }
.cm-input-name { max-width: 100%; }
.cm-actions .btn { flex: 1 1 auto; justify-content: center; }
.cm-actions .btn[aria-disabled="true"] { opacity: .5; }
@keyframes cm-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@keyframes cm-turn { to { transform: rotate(360deg); } }
/* 原料联动卡（老板首页）和点开的清单 */
.mat-card .mini-body { display: grid; gap: 12px; }
.mat-main { display: flex; align-items: baseline; gap: 12px; }
.mat-num { font-size: 40px; font-weight: 650; line-height: 1.1; letter-spacing: -.01em; }
.mat-num.up { color: var(--red); }
.mat-num.down { color: var(--green); }
.mat-basis { color: var(--ink-3); font-size: 14px; }
.mat-facts { display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: 15px; color: var(--ink-2); }
.mat-fact b { font-size: 20px; font-weight: 650; color: var(--ink); }
.mat-fact.bad, .mat-fact.bad b { color: var(--red); }
.mat-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.mat-seg { display: inline-flex; padding: 4px; gap: 4px; border-radius: var(--r-ctl); background: var(--line-soft); }
.mat-seg-btn { padding: 4px 12px; border: 0; border-radius: var(--r-chip); background: transparent; color: var(--ink-2); font-size: 13px; cursor: pointer; }
.mat-seg-btn.on { background: var(--panel-strong); color: var(--ink); font-weight: 600; box-shadow: var(--edge-shadow); }
.mat-source { color: var(--ink-3); font-size: 13px; }
.mat-modal-head { margin-bottom: 12px; font-size: 17px; font-weight: 600; }
.mat-list { display: grid; gap: 8px; margin: 0 0 12px; padding: 0; list-style: none; }
.mat-row { display: grid; gap: 4px; padding: 12px 16px; border-radius: var(--r-ctl); background: var(--panel-bg); }
.mat-row-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.mat-row .tag { padding: 4px 8px; font-size: 13px; }
.mat-row-sub { color: var(--ink-3); font-size: 13px; }
.mat-row-why { color: var(--ink); font-size: 14px; }
.mat-row-advice { color: var(--ink-2); font-size: 14px; }
.mat-more { margin: 0 0 12px; color: var(--ink-3); font-size: 13px; }
/* C5b：锁价、基准日 → 行情日、预计多花、三组清单、发布门（字号 ≥ 13px，间距 4/8/12/16/24） */
.mat-card .mini-head, .mat-modal .modal-head { justify-content: flex-start; }
.mat-status { margin-left: auto; padding: 4px 8px; font-size: 13px; }
.mat-modal .modal-head .icon-button { margin-left: auto; }
.mat-modal-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.mat-fact.warn, .mat-fact.warn b { color: var(--orange); }
.mat-tabs { display: flex; margin: 0 0 12px; }
.mat-tabs .mat-seg-btn { flex: 1; padding: 8px 12px; }
.mat-warn { margin: 0 0 12px; padding: 8px 12px; border-radius: var(--r-ctl); background: var(--line-soft); color: var(--orange); font-size: 14px; }
.mat-amount { font-size: 15px; color: var(--ink-2); }
.mat-amount b { font-size: 17px; font-weight: 650; color: var(--ink); }
.mat-amount.warn, .mat-amount.warn b { color: var(--orange); }
.mat-cap { color: var(--ink-3); font-size: 13px; }
.mat-row-sub .tag { margin-left: 4px; padding: 4px 8px; font-size: 13px; }
.mat-pub { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 12px 0; }
.mat-pub-note { color: var(--ink-3); font-size: 13px; }
.mat-pub-note.ok { color: var(--green); }
.mat-pub-note.bad { color: var(--red); }
/* 公开行情（上期所日结算价）：每个品种一行，价格 + 出处 + 日期在左，30 个交易日的小折线在右 */
.mat-quotes { display: grid; gap: 4px; padding-top: 12px; border-top: 1px solid var(--line-soft); }
.mat-modal .mat-quotes { margin: 0 0 12px; padding: 0 0 12px; border-top: 0; border-bottom: 1px solid var(--line-soft); }
.mat-quote { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "text spark" "meta meta"; align-items: center; gap: 0 12px; padding: 4px 0; }
.mat-quote-text { grid-area: text; color: var(--ink-2); font-size: 15px; font-weight: 400; }
.mat-quote-name { color: var(--ink); font-weight: 650; }
.mat-quote-num { color: var(--ink); font-size: 20px; font-weight: 650; font-variant-numeric: tabular-nums; }
.mat-quote-meta { grid-area: meta; color: var(--ink-3); font-size: 13px; }       /* 窄的时候（首页卡片、手机）：价格一行，日期、价格类型和出处换到下一行，小折线跟价格一行 */
.mat-quote-meta .warn { color: var(--orange); }
.mat-quote-sep { display: none; }
.mat-spark { grid-area: spark; width: 96px; height: 28px; overflow: visible; }
@media (min-width: 521px) {                                                      /* 清单弹窗够宽：价格、日期出处、小折线写成一行 */
  .mat-modal .mat-quote { grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "text meta spark"; }
  .mat-modal .mat-quote-sep { display: inline; }
}
.mat-spark polyline { fill: none; stroke: var(--ink-3); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.mat-spark circle { fill: var(--ink); }
@media (max-width: 1100px) { .cm-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 560px) {
  .cm-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .cm-cell, .cm-skeleton .cm-cell { min-height: 148px; padding: 12px; }
  .cm-cell.wide { min-height: 72px; }
  .cm-cell .cm-dot { top: 17px; right: 12px; }
  .cm-name { font-size: 18px; }
  .cm-line { min-height: 2.8em; }
  .cm-cell.wide .cm-line { min-height: 0; }
  .cm-overlay { padding: 12px; }
  .cm-sheet { padding: 16px; }
  .cm-actions { flex-direction: column; }
  .cm-head { flex-wrap: wrap; }
  .cm-playall { padding-inline: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .cm-cell { transition: none; }
  .cm-cell:hover:not(:disabled), .cm-cell:active:not(:disabled) { transform: none; }
  .cm-dot.running, .cm-spin, .cm-stage.running i { animation: none; }
}
/* 页脚声明：原来桌面 11px、手机 8px，读不了；改成一句短话，13px 起 */
.disclaimer { font-size: 13px; line-height: 1.4; padding: 8px 12px; min-height: 0; }
@media (max-width: 850px) {
  .disclaimer { font-size: 13px; line-height: 1.4; padding: 8px 12px; }
}
/* 投标偏离表：逐条清单 + 状态色，文字版（复制用）收起来；手机上一条一张小卡，不横向滚动 */
.dv-sums { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 4px 0 12px; font-size: 15px; }
.dv-sum b { font-size: 20px; font-weight: 650; }
.dv-sum.green { color: var(--green); }
.dv-sum.orange { color: var(--orange); }
.dv-sum.red { color: var(--red); }
.dv-list { display: grid; gap: 8px; margin: 0 0 12px; padding: 0; list-style: none; }
.dv-row { display: grid; gap: 4px; padding: 12px 16px; border-radius: var(--r-ctl); background: var(--panel-bg); }
.dv-row[data-dv="无偏离"], .dv-row[data-dv="正偏离"] { background: transparent; box-shadow: inset 0 0 0 1px var(--line-soft); }
.dv-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.dv-top .tag { padding: 4px 8px; font-size: 13px; flex: none; }
.dv-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; font-size: 14px; color: var(--ink); }
.dv-pair em { display: block; color: var(--ink-3); font-size: 13px; font-style: normal; }
.dv-note { color: var(--ink-2); font-size: 14px; }
.dv-text > summary { color: var(--ink-2); font-size: 13px; cursor: pointer; }
.dv-text .message-preview { margin-top: 8px; }
@media (max-width: 520px) { .dv-pair { grid-template-columns: 1fr; } }
/* 提示条（重新运行完成等）和演示数据横幅（有作业没处理成功时出现）原来 12px，提到 13px */
.toast, .seed-banner, .seed-line { font-size: 13px; }
/* 门店日报待办卡：2–3 个数字先摆出来，观察卡写“观察什么” */
.task-numbers { display: flex; flex-wrap: wrap; gap: 8px 24px; margin: 4px 0 8px; }
.task-number b { display: block; font-size: 18px; font-weight: 650; color: var(--ink); }
.task-number em { display: block; font-size: 13px; font-style: normal; color: var(--ink-3); }
.task-watch { font-size: 14px; color: var(--ink); }
.task-watch em { margin-right: 8px; color: var(--ink-3); font-style: normal; font-weight: 600; }
/* 案例抽屉：处理办法后面的“适用 / 不能沿用”两行，样式同“处理办法” */
.knowledge-drawer .snippet-cond em { margin-right: 8px; color: var(--ink-3); font-style: normal; font-weight: 600; }
/* 依据里的资料出处（文件名）原来 12px，读不清，提到 13px */
.source-link { font-size: 13px; }
/* ===== 第四波 F4 结束 ===== */

/* ===== 军师 10-24 界面打磨：填空框、工作台吸顶条、订单明细宽度、能力地图弹窗的折叠（颜色只用上面已有的变量） ===== */
/* ── 填空框：没跟上主题的补齐。点值就改的输入框（cell-input）原来是浏览器自带的直角框，圆角、浅边、聚焦描边都跟其他输入框一致；只补样式，不动其他框的大小和布局 ── */
.cell-input { display: block; box-sizing: border-box; width: 100%; min-height: 36px; padding: 8px 12px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: #FFFFFF; color: var(--ink); font-size: 14px; line-height: 1.4; }
.task-controls input, .task-controls select, .message-preview, .setting-input { border-radius: var(--r-ctl); }
/* 聚焦：柔和的 carbon 描边（边变 carbon + 一圈浅蓝晕），替掉全局那条 2px 实线外框 */
.cell-input:focus, .task-controls input:focus, .task-controls select:focus, .message-preview:focus, .setting-input:focus,
.form-row input:focus, .search-row input:focus, .stock-card .stock-search input:focus, .sku-search:focus, .sku-add input:focus, .sku-floor-input:focus,
.line-price input:focus, .modal textarea:focus, .case-form textarea:focus { outline: none; border-color: var(--carbon); box-shadow: 0 0 0 3px var(--carbon-wash); }

/* ── 工作台吸顶条：实心底，不再透出下面的字；压在卡片上面；往下滚时和下面的内容之间留一道虚化的间隔 ── */
.wb-bar { z-index: 20; border-color: var(--line); background: #FFFFFF; -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: 0 1px 2px rgba(28, 32, 38, .07), 0 8px 20px -8px rgba(28, 32, 38, .22); }
@media (min-width: 851px) {
  .wb-bar::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 14px; pointer-events: none; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); -webkit-mask-image: linear-gradient(#000, transparent); mask-image: linear-gradient(#000, transparent); }
}

/* ── 订单中心：宽屏按可用宽度铺开（原来整页封顶 1280，1920 宽右边空一大块）；订单明细表占满卡片宽度 ── */
.view-orders > * { max-width: none; }
.view-orders .order-lines .data-table { width: 100%; }

/* ── 能力地图弹窗：版本哈希收进“版本信息”，默认只露结果、上次运行、方式 ── */
.cm-versions > summary { padding: 0 4px; color: var(--ink-3); font-size: 14px; cursor: pointer; }
.cm-versions[open] > summary { margin-bottom: 8px; }
/* ===== 军师 10-24 界面打磨 结束 ===== */

/* ===== 第四波 U1：首页一个动作、审批卡五件事、客户横幅两行（只由 U1 改；颜色只用上面已有的变量，间距只用 4/8/12/16/24） ===== */
/* —— 首页：品牌 → 口号 → 一句用途 → 一个主按钮。六个岗位点了“体验一单”才出现，账号密码收进“企业登录” —— */
.login-screen.home-lite { display: grid; grid-template-columns: minmax(0, 1fr); place-items: center; min-height: 100vh; padding: 24px 16px; }
.home-card { display: flex; flex-direction: column; align-items: center; width: min(100%, 560px); text-align: center; }
.home-brand { justify-content: center; padding: 0; }
.home-card h1 { margin: 24px 0 16px; font-size: clamp(30px, 9.6vw, 56px); font-weight: 700; line-height: 1.12; letter-spacing: -.02em; word-break: keep-all; overflow-wrap: break-word; }
/* P1-6：大标题下面一句“给谁用”＋ 3 分钟路线（route 数据后台一直给，这里才画出来）；一行一步，375 宽换行也看得见 */
.home-who { margin: 0 0 6px; color: var(--ink); font-size: 18px; font-weight: 600; }   /* 10-25 海报口径：副标题比一句说明醒目 */
.home-lead { max-width: 20em; margin: 0 0 24px; color: var(--ink-3); font-size: 15px; line-height: 1.6; }
.home-route { width: 100%; margin-top: 16px; text-align: left; }
.home-route-head { display: flex; align-items: center; gap: 6px; padding: 0 4px; color: var(--ink-2); font-size: 14px; }
.home-route-head strong { font-weight: 650; }
.home-route-step { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; width: 100%; min-height: 44px; margin-top: 8px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 10px; background: #fff; font: inherit; cursor: pointer; text-align: left; }
.home-route-step:hover { border-color: #9eb3ca; background: #f8fafc; }
.home-route-step b { display: grid; place-items: center; flex: none; width: 22px; height: 22px; border-radius: 50%; background: var(--av); color: var(--ink-2); font-size: 13px; }
.home-route-step .route-role { color: var(--ink); font-size: 13px; font-weight: 650; }
.home-route-step .route-what { min-width: 0; color: var(--ink-3); font-size: 13px; }
.home-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; width: 100%; }
.home-main, .home-second { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 32px; font-size: 16px; }
.home-main { min-width: 168px; }
.home-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 16px; margin-top: 16px; }
.home-link { min-height: 40px; padding: 0 8px; border: 0; border-radius: var(--r-chip); background: transparent; color: var(--carbon); font: 600 14px/1 var(--font); cursor: pointer; }
.home-link:hover { background: var(--carbon-wash); }
.home-error { width: 100%; min-height: 0; margin: 0 0 16px; text-align: center; font-size: 14px; }
.home-error:empty { display: none; }
.home-enterprise { width: min(100%, 360px); margin-top: 16px; text-align: left; }
.home-enterprise[hidden] { display: none; }
.home-enterprise .form-row:last-of-type { margin-bottom: 16px; }
.home-enterprise .login-submit { width: 100%; margin-top: 0; }
.home-note { width: 100%; }
.home-note .login-mode { justify-content: center; margin-top: 24px; padding: 0; background: transparent; color: var(--ink-3); font-size: 13px; }
.home-note .seed-line { margin-top: 16px; text-align: center; }
.home-roles-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 12px; text-align: left; }
.home-roles-head strong { font-size: 18px; font-weight: 650; }
.home-role-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.demo-account.home-role { display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 8px 12px; text-align: left; }
.home-role .home-role-av { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 50%; background: var(--av); color: var(--ink-2); font-size: 15px; font-weight: 600; }
.home-role-text { display: grid; gap: 4px; min-width: 0; }
.home-role-text strong { color: var(--ink); font-size: 15px; font-weight: 650; line-height: 1.2; }
.home-role-text span { color: var(--ink-3); font-size: 13px; line-height: 1.2; }
.home-roles, .home-card > #demo-block { width: 100%; }
[data-home-step="start"] .home-roles, [data-home-step="entering"] .home-roles { display: none; }
[data-home-step="roles"] .home-actions, [data-home-step="roles"] .home-links, [data-home-step="roles"] .home-enterprise, [data-home-step="roles"] .home-lead, [data-home-step="roles"] .home-route { display: none; }
[data-home-step="entering"] .home-actions, [data-home-step="entering"] .home-links, [data-home-step="entering"] .home-enterprise, [data-home-step="entering"] .home-lead, [data-home-step="entering"] .home-note, [data-home-step="entering"] .home-route { display: none; }
.home-card .switch-banner { justify-content: center; width: 100%; margin: 24px 0 0; }
.home-card .switch-banner strong { font-size: 14px; }
@media (max-width: 520px) {
  .home-main, .home-second { width: 100%; }
  .home-card h1 { margin: 16px 0 12px; }
  .home-lead { margin-bottom: 24px; }
}
/* —— 审批卡首层：客户 / 品名·原价→申请价 / 一个金额影响 / 风险（只说一次）/ 三个动作；其余折进“看依据” —— */
.appr-card { padding: 16px 24px 24px; }
.appr-card .appr-level { margin-top: -16px; }
.appr-items { margin-top: 16px; gap: 12px; }
.appr-impact { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--line-soft); color: var(--ink-2); font-size: 14px; }
.appr-impact .appr-sum-v b { font-size: 20px; }
.appr-why { margin-top: 12px; gap: 8px; }
.appr-why-chip.unknown { background: transparent; box-shadow: inset 0 0 0 1px var(--line); color: var(--ink-3); }
.appr-basis { margin-top: 8px; border-top: 1px solid var(--line-soft); }
.appr-basis > summary, .appr-rest > summary { display: flex; align-items: center; justify-content: space-between; min-height: 44px; color: var(--ink-3); font-size: 14px; font-weight: 600; cursor: pointer; list-style: none; }
.appr-basis > summary::-webkit-details-marker, .appr-rest > summary::-webkit-details-marker { display: none; }
.appr-basis > summary::after, .appr-rest > summary::after { content: ""; width: 8px; height: 8px; margin: 0 4px 4px 0; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .15s ease-out; }
.appr-basis[open] > summary::after, .appr-rest[open] > summary::after { margin-bottom: 0; transform: rotate(-135deg); }
.appr-basis-body { display: grid; gap: 12px; padding: 4px 0 8px; }
.appr-basis-body > *, .appr-basis-body .appr-sums { margin-top: 0; }
.appr-basis-body .appr-sums { padding-top: 0; border-top: 0; }
.appr-basis-body .appr-origin { padding-top: 12px; border-top: 1px solid var(--line-soft); }
.appr-basis-body .appr-origin .appr-sum-row { color: var(--ink-3); font-size: 13px; }
.appr-rest { margin-top: 0; border-top: 1px solid var(--line-soft); }
.appr-rest > summary { min-height: 40px; }
.appr-rest > .appr-item { margin-bottom: 12px; }
.appr-actions { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1.2fr); align-items: center; }
.btn.text.appr-later { min-height: 48px; padding: 0 8px; color: var(--ink-2); font-size: 14px; font-weight: 600; }
.appr-request { margin-top: 4px; color: var(--ink-3); font-size: 14px; }
.appr-headline { margin-top: 8px; }
@media (max-width: 520px) {
  .appr-card { padding: 16px 16px 16px; }
  .appr-card .appr-level { margin-right: -16px; margin-left: -16px; padding-right: 16px; padding-left: 16px; }
}
/* —— 客户横幅：客户名 + 订单 + 一项相关事实；老客户/级别/性格标签收进“档案” —— */
.view-workbench .wb-banner { flex-wrap: wrap; align-items: center; row-gap: 4px; }
.cb-head, .cb-sub { display: flex; align-items: center; gap: 12px; min-width: 0; }
.cb-head { flex: 0 1 auto; }
.cb-head .customer-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cb-head .customer-tags { flex: none; }
.cb-sub { flex: 1 1 240px; }
.view-workbench .wb-banner .cb-sub .wb-meta { flex: 1 1 0; min-width: 0; margin-left: 0; }
.cb-file-btn { display: inline-flex; align-items: center; gap: 4px; min-height: 32px; padding: 0 8px; border: 0; border-radius: var(--r-chip); background: transparent; color: var(--ink-3); font: 600 13px/1 var(--font); cursor: pointer; }
.cb-file-btn:hover { background: var(--line-soft); }
.cb-file-btn::after { content: ""; width: 6px; height: 6px; margin: 0 2px 3px 0; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .15s ease-out; }
.cb-file-btn[aria-expanded="true"]::after { margin-bottom: 0; transform: rotate(-135deg); }
.cb-file { display: flex; flex: 1 0 100%; flex-wrap: wrap; align-items: center; gap: 8px; padding: 4px 0 4px 52px; }
.cb-file .customer-tags { display: inline-flex; flex-wrap: wrap; gap: 8px; }
.cb-file .customer-tags:empty { display: none; }
@media (max-width: 520px) {
  .cb-head, .cb-sub { flex-basis: 100%; }
  .cb-sub { padding-left: 44px; }
  .cb-file { padding-left: 44px; }
  .view-workbench .wb-banner .cb-sub .wb-meta { margin-left: 0; }
  .credit-bar { gap: 8px 12px; padding: 8px 12px; }
  .credit-text { flex: 1 1 calc(100% - 32px); min-width: 0; }
}
/* ===== 第四波 U1 结束 ===== */

/* ===== 10-24 Lane front：首页重排（颜色只用已有变量，间距只用 4/8/12/16/24，字号 ≥ 13px） ===== */
/* —— 外壳：卡片居中、页脚贴底。app.css 里 .home-card 带 overflow:hidden，会把“?”说明框裁掉，首页这张卡放开 —— */
.login-screen.home-lite { grid-template-rows: 1fr auto; row-gap: 24px; padding: 24px 16px 12px; }
.login-screen.home-lite .home-card { overflow: visible; }
/* 1700 宽以内的紧凑桌面（文件后面那段媒体查询）把所有 .btn 压成 12px，连首页的大按钮也被压；首页按钮字号在这里定死 */
.home-card .home-main, .home-card .home-second { font-size: 16px; }
.home-enterprise .login-submit { font-size: 14px; }
/* —— 两栏骨架：手机上下排（标识→标题→说明→按钮→全部场景→路线），≥900px 左右并排 —— */
.home-cols { display: flex; flex-direction: column; align-items: center; width: 100%; }
.home-main-col, .home-side { display: flex; flex-direction: column; align-items: center; width: 100%; min-width: 0; }
.home-side { margin-top: 24px; }
.home-side > * { width: 100%; }
.home-side > .home-route:first-child { margin-top: 0; }
/* —— 右栏第一块：“全部场景”入口块（竖排容器，后面可以接别的入口） —— */
.home-scenes { display: flex; flex-direction: column; gap: 8px; }
.home-scenes:empty { display: none; }
.home-scene-btn { display: flex; align-items: center; gap: 16px; width: 100%; min-height: 72px; padding: 12px 16px; border: 1px solid var(--edge-color); border-radius: var(--r-panel); background: var(--panel-strong); box-shadow: var(--edge-shadow); color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.home-scene-btn:hover { border-color: var(--carbon); background: #fff; }
.home-scene-btn::after { content: ""; flex: none; width: 8px; height: 8px; margin: 0 8px 0 auto; border-top: 2px solid var(--ink-3); border-right: 2px solid var(--ink-3); transform: rotate(45deg); }
.home-scene-ico { display: grid; place-items: center; flex: none; width: 48px; height: 48px; border-radius: var(--r-ctl); background: var(--carbon-wash); color: var(--carbon); }
.home-scene-ico .ic { width: 28px; height: 28px; }
.home-scene-title { font-size: 20px; font-weight: 650; line-height: 1.2; }
/* —— 3 分钟路线：每步一个岗位图标（角上挂第几步），岗位·姓名 + 做什么 —— */
.home-card .home-route-step { flex-wrap: nowrap; gap: 12px; min-height: 56px; }
.home-route-step .route-ico { position: relative; display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: var(--r-ctl); background: var(--carbon-wash); color: var(--carbon); }
.home-route-step .route-ico .ic { width: 22px; height: 22px; }
.home-route-step .route-ico b { position: absolute; top: -6px; left: -6px; width: 20px; height: 20px; background: var(--ink); color: #fff; font-size: 13px; font-weight: 600; line-height: 1; }
.home-route-step .route-text { display: grid; flex: 1 1 auto; gap: 4px; min-width: 0; }
.home-route-step .route-role { font-size: 14px; line-height: 1.2; }
.home-route-step .route-what { line-height: 1.3; }
.home-route-step::after { content: ""; flex: none; width: 8px; height: 8px; margin: 0 4px 0 auto; border-top: 2px solid var(--ink-3); border-right: 2px solid var(--ink-3); transform: rotate(45deg); }
/* —— 页脚：演示说明 + 极小的“企业登录”；表单展开在页脚里（没有演示账号 / 登录失败时表单直接在左栏按钮下面） —— */
.home-foot { display: flex; flex-direction: column; align-items: center; gap: 8px; width: 100%; max-width: 560px; color: var(--ink-3); font-size: 13px; text-align: center; }
.home-foot-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px 16px; }
.home-foot .login-mode { justify-content: center; margin: 0; padding: 0; background: transparent; color: var(--ink-3); font-size: 13px; }
.home-foot .tip::after { top: auto; bottom: calc(100% + 8px); max-width: min(240px, 70vw); }
.home-foot-link { min-height: 32px; padding: 0 8px; border: 0; border-radius: var(--r-chip); background: transparent; color: var(--ink-3); font: 600 13px/1 var(--font); text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
.home-foot-link:hover { background: var(--carbon-wash); color: var(--carbon); }
.home-foot .home-enterprise { margin-top: 0; padding: 16px; border: 1px solid var(--line); border-radius: var(--r-panel); background: var(--panel-strong); }
/* —— 点“体验一单”后：右栏换成六个岗位；切换岗位时右栏只留“正在进入” —— */
.home-side .home-roles, .home-side #demo-block, .home-side #switch-slot { width: 100%; }
[data-home-step="roles"] .home-scenes, [data-home-step="entering"] .home-scenes, [data-home-step="entering"] .home-foot { display: none; }
.home-side .home-roles-head { text-align: left; }
.home-side .switch-banner { margin-top: 0; }
@media (min-width: 900px) {
  .home-card { width: min(100%, 1040px); }
  .home-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: center; }
  .home-main-col { align-items: flex-start; padding-right: 24px; text-align: left; }
  .home-main-col h1 { font-size: clamp(36px, 4.8vw, 54px); }   /* 10-25 主标题“让企业的成长，/沉淀在自己的系统里”第二行 9 个字不能折开，字号要让它放得进左栏 */
  .home-main-col .home-brand, .home-main-col .home-actions { justify-content: flex-start; }
  .home-main-col .home-error { text-align: left; }
  .home-side { margin-top: 0; }
  .home-solo .home-card { width: min(100%, 560px); }
  .home-solo .home-cols { grid-template-columns: minmax(0, 1fr); }
  .home-solo .home-main-col { align-items: center; padding-right: 0; text-align: center; }
  .home-solo .home-main-col .home-brand, .home-solo .home-main-col .home-actions { justify-content: center; }
  .home-solo .home-main-col .home-error { text-align: center; }
}
/* ===== Lane front 首页重排 结束 ===== */

/* ===== 第四波 C4：新人练手 2.0（薄弱点条、场景页签、情景陪练、参考解答按步骤卡）（只由 C4 改；类名接着 pr- 家族，颜色只用上面已有的变量，间距只用 4/8/12/16/24，字号 ≥ 13px） ===== */
.pr[data-practice="drillresult"], .pr[data-practice="coach"] { max-width: 720px; }

/* 你的薄弱点：一条，最多 3 个标签（类别 + 正确率），点一个只练这一类 */
.pr-weak { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 12px 16px; border: 1px solid var(--edge-color); border-radius: var(--r-panel); background: var(--panel-bg); box-shadow: var(--edge-shadow); }
.pr-weak-title { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 650; }
.pr-weak-title .pr-ic { width: 18px; height: 18px; color: var(--red); }
.pr-weak-title .tip { margin: 0; }
.pr-weak-body { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.pr-weak-note { color: var(--ink-3); font-size: 14px; }
.pr-weak-chip { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 4px 12px; border: 1px solid var(--red); border-radius: 999px; background: var(--red-bg); color: var(--ink); font-size: 14px; cursor: pointer; }
.pr-weak-chip:hover { background: #FFFFFF; }
.pr-weak-chip:active { transform: scale(.97); }
.pr-weak-chip b { font-weight: 650; }
.pr-weak-chip i { color: var(--red); font-style: normal; font-weight: 700; }
.pr-link { min-height: 40px; padding: 4px 8px; border: 0; border-radius: var(--r-chip); background: transparent; color: var(--ink-3); font-size: 14px; cursor: pointer; }
.pr-link:hover { background: var(--line-soft); color: var(--ink); }

/* 场景页签：全部 / 询价 / 改单 / 售后 / 陪练 */
.pr-tabs { display: flex; gap: 8px; overflow-x: auto; padding: 4px 0; scrollbar-width: none; }
.pr-tabs::-webkit-scrollbar { display: none; }
.pr-tab { display: inline-flex; align-items: center; gap: 8px; flex: none; min-height: 40px; padding: 4px 16px; border: 1px solid var(--line); border-radius: 999px; background: rgba(255, 255, 255, .7); color: var(--ink-2); font-size: 15px; font-weight: 600; cursor: pointer; }
.pr-tab:hover { background: #FFFFFF; color: var(--ink); }
.pr-tab i { color: var(--ink-3); font-size: 13px; font-style: normal; font-weight: 500; }
.pr-tab.on { border-color: var(--ink); background: var(--ink); color: #FFFFFF; }
.pr-tab.on i { color: rgba(255, 255, 255, .75); }
.pr-top .pr-chip { flex: none; }

/* 情景陪练：自己写回复，程序逐项对照 */
.pr-coach .pr-ask .tip { vertical-align: 3px; }
.pr-coach-input { display: block; width: 100%; min-height: 160px; padding: 12px 16px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: #FFFFFF; color: var(--ink); font: 400 16px/1.6 var(--font); resize: vertical; }
.pr-coach-input:focus { border-color: var(--ink-3); outline: none; box-shadow: 0 0 0 3px var(--carbon-wash); }
.pr-coach-input:disabled { background: var(--line-soft); color: var(--ink-3); }
.pr-next:disabled { cursor: default; opacity: .5; }
.pr-chk { display: inline-flex; align-items: center; gap: 4px; padding: 4px 12px 4px 8px; border-radius: 999px; font-size: 13px; font-style: normal; font-weight: 600; line-height: 1.2; white-space: nowrap; }
.pr-chk .pr-ic { width: 14px; height: 14px; stroke-width: 3; }
.pr-chk.ok { background: var(--green-bg); color: var(--green); }
.pr-chk.bad { background: var(--red-bg); color: var(--red); }
.pr-cmt-label { font-size: 14px; font-weight: 650; }
.pr-cmt-text { color: var(--ink-2); line-height: 1.6; overflow-wrap: anywhere; }
.pr-cmt-text del { padding: 0 4px; border-radius: 4px; background: var(--red-bg); color: var(--red); text-decoration: line-through; }
.pr-cmt-text ins { padding: 0 4px; border-radius: 4px; background: var(--green-bg); color: var(--green); font-weight: 600; text-decoration: none; }

/* “怎么判的”：三层——你写的 / 程序读到的 / 评分依据 */
.pr-how { display: grid; gap: 12px; padding: 12px; border: 1px dashed var(--line); border-radius: var(--r-ctl); background: rgba(255, 255, 255, .7); }
.pr-how h3 { margin: 0; font-size: 15px; font-weight: 650; }
.pr-how h3 .tip { margin-left: 8px; }
.pr-how-text { margin: 0; padding: 8px 12px; border-radius: var(--r-chip); background: var(--line-soft); font-size: 14px; line-height: 1.6; white-space: pre-line; overflow-wrap: anywhere; }
.pr-how-vals { color: var(--ink-3); font-size: 13px; overflow-wrap: anywhere; }

/* 参考解答卡（改单、售后）：一段一块，几行字或几个小标签 */
.pr-sec { display: grid; gap: 8px; padding: 16px; border: 1px solid var(--edge-color); border-radius: var(--r-panel); background: var(--panel-bg); box-shadow: var(--edge-shadow); }
.pr-sec h3 { margin: 0; font-size: 16px; font-weight: 650; }
.pr-sec-rows { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; font-size: 15px; line-height: 1.6; }
.pr-sec-rows li { padding-left: 12px; border-left: 3px solid var(--line); overflow-wrap: anywhere; }
@media (max-width: 520px) {
  .pr-weak { padding: 12px; }
  .pr-weak-body { flex-basis: 100%; }
  .pr-coach-input { min-height: 144px; }
}
/* ===== 第四波 C4 结束 ===== */

/* ===== 军师 Lane H：登录后少一点“整齐的方块”（只由 Lane H 改；颜色只用上面已有的变量，间距只用 4/8/12/16/24，字号 ≥ 13px）=====
   首页：一句大字说今天有什么等你 → “一单的路”一条线串起六站 → 62/38 的主次两栏。
   工作台：标签下面一条“处理进度”，圆圈里的数字和卡片标题上的小圆圈数字是同一套。
   只加新类名，不改旧类名；演示动画（tour.js）画的页面没有这些新类名，不受影响。 */

/* ── 首页：身份只剩小标签，大字留给“今天有什么等你” ── */
.view-home .home-top { align-items: center; margin: 0 0 24px; }
.view-home .greet { gap: 8px; }
.view-home .greet-name { color: var(--ink); font-size: 14px; font-weight: 600; }
.view-home .greet-pack { padding: 4px 12px; border: 1px solid var(--line); border-radius: 999px; background: rgba(255, 255, 255, .6); color: var(--ink-2); font-size: 13px; }
.view-home .home-hero-wrap { margin: 0 0 24px; }
.view-home .home-hero { max-width: 26em; margin: 0; color: var(--ink); font-size: clamp(26px, 3vw, 40px); font-weight: 700; line-height: 1.25; letter-spacing: -.02em; text-wrap: balance; }
.view-home .home-hero b { font-weight: 800; }
.view-home .home-hero .rest { color: var(--ink-3); font-weight: 500; }
.view-home .home-hero-sub { margin: 12px 0 0; color: var(--ink-3); font-size: 16px; line-height: 1.6; }

/* ── 首页：一单的路（六站，每站一个浅底小块：站名 + 数字在一起；有件数的亮，已知为 0 或没读到的淡着；最要紧的那站高亮，垂下一根线接到“下一步”）。
   宽屏时前四站正好铺满下面的左栏、后两站铺满右栏（宽度和下面的 62/38 两栏用同一个算式） ── */
.view-home .home-river { margin: 0 0 24px; }
.view-home .river-head { display: flex; align-items: center; gap: 4px; margin: 0 0 8px; }
.view-home .river-title { color: var(--ink-3); font-size: 13px; font-weight: 650; letter-spacing: .12em; }
.view-home .river-head .tip { margin: 0; }
.view-home .river-scroll { position: relative; }
.view-home .river-track { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.view-home .river-stop { position: relative; min-width: 0; display: flex; }
.view-home .river-node { position: relative; width: 100%; min-height: 64px; padding: 12px 16px; display: flex; align-items: center; justify-content: space-between; gap: 8px; border: 1px solid var(--edge-color); border-radius: var(--r-ctl); background: rgba(255, 255, 255, .36); color: var(--ink-3); font: inherit; text-align: left; cursor: default; }
.view-home button.river-node { cursor: pointer; }
.view-home .river-stop + .river-stop .river-node::before { content: ""; position: absolute; right: 100%; top: 50%; width: 12px; height: 2px; margin-top: -1px; background: var(--ink-3); opacity: .35; }
.view-home .river-label { min-width: 0; color: var(--ink-3); font-size: 15px; font-weight: 500; line-height: 1.3; }
.view-home .river-count { flex: none; color: var(--ink-3); font-size: 15px; font-weight: 500; line-height: 1; opacity: .6; }
.view-home .river-stop.lit .river-node { border-color: var(--line); background: var(--panel-strong); box-shadow: var(--edge-shadow); }
.view-home .river-stop.lit .river-label { color: var(--ink); font-weight: 650; }
.view-home .river-stop.lit .river-count { color: var(--ink); font-size: 28px; font-weight: 700; letter-spacing: -.02em; opacity: 1; }
.view-home .river-stop.is-focus .river-node { border-color: var(--ink); background: #FFFFFF; box-shadow: 0 0 0 4px rgba(26, 93, 176, .2); }
.view-home .river-stop.is-focus .river-label { color: var(--ink); font-weight: 650; }
.view-home button.river-node:hover { border-color: var(--ink-3); background: var(--panel-strong); }
.view-home button.river-node:hover .river-label { color: var(--ink); }

/* ── 首页：62/38 的主次两栏。左边是一件最要紧的事（不是一张又一张的卡），右边是几张窄一点的小卡 ── */
.view-home .home-body { display: grid; grid-template-columns: minmax(0, 62fr) minmax(0, 38fr); gap: 24px; align-items: start; }
.view-home .home-body.single { grid-template-columns: minmax(0, 1fr); }
.view-home .home-prime { min-width: 0; display: grid; gap: 24px; align-content: start; }
.view-home .home-side { min-width: 0; display: grid; gap: 16px; align-content: start; }
.view-home .home-focus { position: relative; padding: 24px; border: 1px solid var(--edge-color); border-radius: var(--r-panel); background: var(--panel-strong); box-shadow: inset 4px 0 0 var(--ink), var(--edge-shadow); -webkit-backdrop-filter: var(--glass); backdrop-filter: var(--glass); }
.view-home .focus-kicker { display: flex; align-items: center; gap: 8px; }
.view-home .focus-kicker b { color: var(--ink); font-size: 13px; font-weight: 700; letter-spacing: .12em; }
.view-home .stage-tag { padding: 4px 12px; border-radius: 999px; background: var(--carbon-wash); color: var(--carbon); font-size: 13px; font-weight: 600; }
.view-home .focus-title { margin: 12px 0 0; color: var(--ink); font-size: 30px; font-weight: 700; line-height: 1.3; letter-spacing: -.01em; overflow-wrap: anywhere; }
.view-home .focus-meta { margin: 8px 0 0; color: var(--ink-3); font-size: 14px; line-height: 1.6; }
.view-home .focus-why { margin: 12px 0 0; color: var(--ink-2); font-size: 16px; line-height: 1.7; }
.view-home .focus-actions { display: flex; align-items: center; gap: 12px; margin: 24px 0 0; }
.view-home .focus-actions .btn.primary { min-height: 48px; padding: 8px 24px; font-size: 16px; }
.view-home .home-todo { min-width: 0; }
.view-home .home-sec-head { display: flex; align-items: center; gap: 8px; margin: 0 0 4px; }
.view-home .home-sec-title { margin: 0; color: var(--ink); font-size: 15px; font-weight: 600; }
.view-home .home-sec-note { color: var(--ink-3); font-size: 13px; }
.view-home .home-todo .todo-list { padding: 0; }
.view-home .home-todo .todo-row { padding: 12px 0; }
.view-home .home-todo .empty-line { padding: 8px 0; }
.view-home .mini-head-end { display: inline-flex; align-items: center; gap: 8px; }
.view-home .mini-count { color: var(--ink-3); font-size: 13px; white-space: nowrap; }
.view-home .mini-count b { color: var(--ink); font-weight: 650; }
.view-home .home-side .home-short { justify-self: start; }
.view-home .home-side .home-short b { font-weight: 650; }
.view-home .home-body + .module-strip { margin: 24px 0 0; }

/* 宽屏：最要紧的那一站垂下一根线，接到下面的“下一步” */
@media (min-width: 1001px) {
  .view-home .river-stop.is-focus::after { content: ""; position: absolute; left: 23px; top: 100%; width: 2px; height: 24px; background: var(--ink); }
  .view-home .river-stop.is-focus::before { content: ""; position: absolute; left: 19px; top: calc(100% + 19px); z-index: 1; width: 10px; height: 10px; border-radius: 50%; background: var(--ink); }
  /* 左栏 = 62fr、右栏 = 38fr、两栏之间 24px：前四站铺满左栏，后两站铺满右栏（中间留一个 0 宽的空列，和两栏之间的 24px 对上） */
  .view-home .river-track { grid-template-columns: repeat(4, calc(15.5% - 12.72px)) 0 repeat(2, calc(19% - 10.56px)); }
  .view-home .river-stop:nth-child(5) { grid-column: 6; }
  .view-home .river-stop:nth-child(6) { grid-column: 7; }
  .view-home .river-stop:nth-child(5) .river-node::before { width: 24px; }
  /* 下面只有一栏（没有右边的小卡）时，六站平分 */
  .view-home .home-river:has(+ .home-body.single) .river-track { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .view-home .home-river:has(+ .home-body.single) .river-stop:nth-child(5), .view-home .home-river:has(+ .home-body.single) .river-stop:nth-child(6) { grid-column: auto; }
  .view-home .home-river:has(+ .home-body.single) .river-stop:nth-child(5) .river-node::before { width: 12px; }
}
@media (max-width: 1200px) {
  .view-home .river-node { flex-direction: column; align-items: flex-start; justify-content: center; gap: 4px; }
}
@media (max-width: 1000px) {
  .view-home .home-body { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 850px) {
  .view-home .home-top { margin-bottom: 16px; }
  .view-home .home-hero-wrap { margin-bottom: 16px; }
  .view-home .home-hero { font-size: 26px; }
  .view-home .river-scroll { overflow-x: auto; scrollbar-width: none; padding-bottom: 8px; }
  .view-home .river-scroll::-webkit-scrollbar { display: none; }
  .view-home .river-track { grid-template-columns: repeat(6, minmax(132px, 1fr)); min-width: 852px; }
  .view-home .home-body { gap: 16px; }
  .view-home .home-prime { gap: 16px; }
  .view-home .home-focus { padding: 16px; }
  .view-home .focus-title { font-size: 24px; }
  .view-home .focus-actions .btn.primary { width: 100%; }
}

/* ── 工作台：处理进度（标签下面一条线，把卡片串成一条路） ── */
.view-workbench .wb-rail { display: flex; align-items: center; gap: 16px; margin: 0 0 12px; padding: 0 0 12px; border-bottom: 1px solid var(--line); }
.view-workbench .wb-rail-title { flex: none; color: var(--ink-3); font-size: 13px; font-weight: 650; letter-spacing: .12em; }
.view-workbench .wb-rail-scroll { position: relative; flex: 1 1 auto; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.view-workbench .wb-rail-scroll::-webkit-scrollbar { display: none; }
.view-workbench .wb-rail-steps { display: flex; align-items: center; width: 100%; min-width: max-content; margin: 0; padding: 0; list-style: none; }
.view-workbench .rail-step { position: relative; flex: 1 1 auto; display: flex; align-items: center; gap: 8px; color: var(--ink-3); font-size: 14px; white-space: nowrap; }
.view-workbench .rail-step:first-child { flex: 0 0 auto; }
.view-workbench .rail-step + .rail-step::before { content: ""; flex: 1 1 12px; min-width: 12px; height: 2px; margin-left: 8px; background: var(--line); }
.view-workbench .rail-step.done::before, .view-workbench .rail-step.current::before { background: var(--ink); }
.view-workbench .rail-dot { flex: none; width: 24px; height: 24px; display: grid; place-items: center; border: 2px solid var(--line); border-radius: 50%; background: var(--ground); color: var(--ink-3); font: normal 650 13px/1 var(--font); }
.view-workbench .rail-step[data-rail-step="read"] .rail-dot { width: 12px; height: 12px; margin: 0 6px; }
.view-workbench .rail-step.done .rail-dot { border-color: var(--ink); background: var(--ink); color: #FFFFFF; }
.view-workbench .rail-step.current .rail-dot { border-color: var(--ink); background: #FFFFFF; color: var(--ink); }
.view-workbench .rail-step.is-current .rail-dot { box-shadow: 0 0 0 4px rgba(26, 93, 176, .2); }
.view-workbench .rail-step.done .rail-label { color: var(--ink-2); }
.view-workbench .rail-step.is-current .rail-label { color: var(--ink); font-weight: 650; }
.view-workbench .rail-note { padding: 4px 8px; border-radius: 999px; background: var(--carbon-wash); color: var(--carbon); font-size: 13px; font-style: normal; font-weight: 600; }
/* 卡片标题上的小圆圈数字：和处理进度里的圆圈是同一套（标题文字本身不变，数字是画上去的） */
.view-workbench h2[data-wb-step]::before, .view-workbench .action-title[data-wb-step]::before { content: attr(data-wb-step); flex: none; display: inline-grid; place-items: center; width: 22px; height: 22px; margin-right: 8px; border-radius: 50%; background: var(--ink); color: #FFFFFF; font: normal 650 13px/1 var(--font); }
.view-workbench .action-title[data-wb-step]::before { align-self: center; }
@media (max-width: 850px) {
  .view-workbench .wb-rail { flex-direction: column; align-items: stretch; gap: 8px; }
  .view-workbench .wb-rail-steps { min-width: 560px; }
}
/* ===== 军师 Lane H 结束 ===== */

/* 推荐值（工单 R2）：缺着的关键参数按客户上次的单推荐一个，销售点「用这个」才填进去 */
.side-head-btns { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.frow-suggest { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; margin-top: 8px; padding: 8px 12px; border-radius: var(--r-ctl); background: var(--carbon-wash); color: var(--ink-2); font-size: 13px; line-height: 1.5; }
.frow-suggest strong { color: var(--carbon); font-size: 15px; font-weight: 600; }
.frow-suggest .suggest-why { color: var(--ink-3); }

/* ===== 倍熟练 R1：询价作业工作台（吸顶“进度 + 现在该做” + 四个整宽块） =====
   只作用在 .view-workbench 里新加的类（wb-qbar / wb-block / bubble / quote-image…）；改单、售后和还在跑的作业用的老类不动 */

/* ── 吸顶条：左五步、中一句话、右一个主按钮。沿用 .wb-bar 的吸顶 + 实心底（盖章靠 wb-bar 这个第一个类名找吸顶条） ── */
.view-workbench .wb-qbar { top: 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: 8px 20px; min-height: 60px; padding: 10px 16px; }
.view-workbench .wb-steps { flex: none; display: flex; align-items: center; margin: 0; padding: 0; list-style: none; }
.view-workbench .wb-step { display: flex; align-items: center; gap: 6px; color: var(--ink-3); font-size: 13px; white-space: nowrap; }
.view-workbench .wb-step + .wb-step::before { content: ""; width: 12px; height: 2px; margin: 0 8px; border-radius: 1px; background: var(--line); }
.view-workbench .wb-step.done + .wb-step::before { background: var(--green); }
.view-workbench .wb-dot { flex: none; width: 22px; height: 22px; display: grid; place-items: center; border: 2px solid var(--line); border-radius: 50%; background: #FFFFFF; color: var(--ink-3); font: normal 650 12px/1 var(--font); }
.view-workbench .wb-step.done .wb-dot { border-color: var(--green); background: var(--green); color: #FFFFFF; }
.view-workbench .wb-step.current .wb-dot { border-color: var(--carbon); color: var(--carbon); box-shadow: 0 0 0 4px rgba(26, 93, 176, .18); }
.view-workbench .wb-step.wait .wb-dot { border-color: var(--yellow); background: var(--yellow-bg); color: var(--yellow); box-shadow: 0 0 0 4px rgba(183, 121, 31, .2); }
.view-workbench .wb-step.done .wb-step-label { color: var(--ink-2); }
.view-workbench .wb-step.is-current .wb-step-label { color: var(--ink); font-weight: 650; }
.view-workbench .wb-step.wait .wb-step-label { color: var(--yellow); }
.view-workbench .wb-bar-now { flex: 1 1 260px; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.view-workbench .wb-bar-line { color: var(--ink); font-size: 14px; font-weight: 600; line-height: 1.4; overflow-wrap: anywhere; }
.view-workbench .wb-bar-line b { font-weight: 700; }
.view-workbench .wb-bar-hint { color: var(--ink-3); font-size: 13px; line-height: 1.4; }
.view-workbench .wb-qbar[data-bar-state="wait"] .wb-bar-line { color: var(--yellow); }
.view-workbench .wb-qbar[data-bar-state="rejected"] .wb-bar-line, .view-workbench .wb-qbar[data-bar-state="stale"] .wb-bar-line { color: var(--red); }
.view-workbench .wb-qbar[data-bar-state="done"] .wb-bar-line { color: var(--green); }
.view-workbench .wb-qbar .wb-bar-buttons { flex: none; flex-wrap: wrap; margin-left: auto; }
.view-workbench .wb-qbar .review-badge { align-self: center; }

/* ── 四个整宽块：从上往下 1 客户信息、2 核对、3 报价方案、4 回复客户 ── */
.view-workbench .wb-blocks { display: grid; gap: 16px; min-width: 0; }
.view-workbench .wb-block { position: relative; min-width: 0; padding: 16px 20px 20px; scroll-margin-top: 92px; border: 1px solid var(--edge-color); border-radius: var(--r-panel); background: var(--panel-bg); box-shadow: var(--edge-shadow); -webkit-backdrop-filter: var(--glass); backdrop-filter: var(--glass); }
.view-workbench .wb-block-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0 0 12px; }
.view-workbench .wb-block-head h2, .view-workbench .wb-fold > summary h2 { display: flex; align-items: center; margin: 0; font-size: 16px; font-weight: 650; }
.view-workbench .wb-block-count { margin-left: 10px; padding: 3px 10px; border-radius: 999px; background: var(--yellow-bg); color: var(--yellow); font-size: 13px; font-style: normal; font-weight: 600; }
.view-workbench .wb-block-tools { margin-left: auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; }
.view-workbench .wb-block-tools:empty { display: none; }
.view-workbench .wb-block-body { display: grid; gap: 16px; min-width: 0; }
.view-workbench .wb-block-body > * { min-width: 0; }      /* 网格里的子项默认不肯比内容窄：手机上会把整块撑出屏幕 */
.view-workbench .wb-block .action-card { background: var(--panel-strong); -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: none; border-color: var(--line-soft); }
.view-workbench .wb-alerts, .view-workbench .wb-extra { min-width: 0; }
.view-workbench .wb-alerts { margin: 0 0 16px; }
.view-workbench .wb-extra { margin-top: 16px; }

/* 1 客户信息：客户条和客户原话并成一张卡 */
.view-workbench .wb-block .customer-banner { min-height: 0; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.view-workbench .wb-block .credit-bar { margin: 0; }
.view-workbench .wb-source { display: grid; gap: 8px; padding-top: 14px; border-top: 1px solid var(--line-soft); }
.view-workbench .wb-source-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--ink-2); font-size: 14px; }
.view-workbench .wb-source-head strong { display: inline-flex; align-items: center; gap: 4px; font-weight: 650; }
.view-workbench .wb-source .source-peek { max-height: none; overflow: visible; }

/* 2 核对：没有要你看的项就收成一行 */
.view-workbench .wb-block-fold { padding: 0; }
.view-workbench .wb-fold > summary { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; padding: 14px 20px; list-style: none; cursor: pointer; }
.view-workbench .wb-fold > summary::-webkit-details-marker { display: none; }
.view-workbench .wb-fold > summary::after { content: "展开"; margin-left: auto; color: var(--ink-3); font-size: 13px; }
.view-workbench .wb-fold[open] > summary::after { content: "收起"; }
.view-workbench .wb-ok { color: var(--green); font-size: 14px; font-weight: 600; }
.view-workbench .wb-fold > .wb-block-tools { margin: 0; padding: 0 20px 8px; }
.view-workbench .wb-fold > .wb-block-body { padding: 4px 20px 20px; }

/* 3 报价方案：两套并排（放不下就上下排），每行展开成明细 */
.view-workbench .wb-block .options-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); gap: 16px; margin-top: 0; }
.view-workbench .option-cols, .view-workbench .ol-detail { display: grid; grid-template-columns: minmax(0, 1fr) 44px 112px 96px; align-items: start; gap: 4px 10px; }
.view-workbench .option-cols.no-price, .view-workbench .ol-detail.no-price { grid-template-columns: minmax(0, 1fr) 56px; }
.view-workbench .option-cols { align-items: center; padding-bottom: 4px; border-bottom: 1px solid var(--line-soft); color: var(--ink-3); font-size: 12px; }
.view-workbench .option-cols span:nth-child(n+2) { text-align: right; }
.view-workbench .ol-detail { min-height: 0; padding: 8px 0; border-bottom: 1px dashed var(--line-soft); }
.view-workbench .ol-detail:last-child { border-bottom: 0; }
.view-workbench .ol-detail .ol-name { color: var(--ink); font-size: 14px; font-weight: 600; line-height: 1.5; overflow-wrap: anywhere; }
.view-workbench .ol-detail .ol-qty, .view-workbench .ol-detail .ol-sub { color: var(--ink); font-size: 14px; text-align: right; font-variant-numeric: tabular-nums; }
.view-workbench .ol-detail .ol-sub { font-weight: 650; }
.view-workbench .ol-detail .ol-cell { display: flex; justify-content: flex-end; }
.view-workbench .ol-detail .ol-price { min-width: 0; color: var(--ink); font-size: 14px; }
.view-workbench .ol-detail .line-price input { width: 88px; }
.view-workbench .ol-chips { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.view-workbench .ol-note { color: var(--ink-3); font-size: 13px; }
.view-workbench .ol-chip { padding: 2px 8px; border-radius: 999px; background: var(--line-soft); color: var(--ink-2); font-size: 12px; font-weight: 600; }
.view-workbench .ol-chip.ok { background: var(--green-bg); color: var(--green); }
.view-workbench .ol-chip.bad { background: var(--red-bg); color: var(--red); }
.view-workbench .wb-old { padding: 10px 14px; border: 1px dashed var(--line); border-radius: var(--r-ctl); }
.view-workbench .wb-old > summary { color: var(--ink-3); font-size: 13px; cursor: pointer; }
.view-workbench .wb-old[open] > summary { margin-bottom: 12px; }
.view-workbench .wb-old > * + * { margin-top: 12px; }

/* 4 回复客户：话术拆成一条一条的短消息（像微信气泡），每条一个复制；下面是报价单图片 */
.view-workbench .wb-bubbles { display: grid; gap: 10px; }
.view-workbench .bubble { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; align-items: start; gap: 10px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 4px 16px 16px 16px; background: #FFFFFF; }
.view-workbench .bubble-no { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: var(--line-soft); color: var(--ink-2); font: normal 650 12px/1 var(--font); }
.view-workbench .bubble-text { min-width: 0; color: var(--ink); font-size: 14px; line-height: 1.75; white-space: pre-wrap; overflow-wrap: anywhere; }
.view-workbench .bubble-copy { align-self: start; min-width: 72px; }
.view-workbench .bubble.done { background: var(--green-bg); }
.view-workbench .bubble.done .bubble-no { background: var(--green); color: #FFFFFF; }
.view-workbench .wb-bubbles.locked .bubble { border-style: dashed; background: var(--line-soft); }
.view-workbench .wb-bubbles.locked .bubble-text { color: var(--ink-3); }
.view-workbench .quote-image { display: grid; gap: 10px; padding: 14px 16px; scroll-margin-top: 92px; border: 1px dashed var(--line); border-radius: var(--r-ctl); background: var(--panel-strong); }
.view-workbench .quote-image-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.view-workbench .quote-image-head strong { display: inline-flex; align-items: center; gap: 4px; font-size: 14px; }
.view-workbench .quote-image-tools { margin-left: auto; display: flex; gap: 8px; }
.view-workbench .quote-canvas { display: block; width: 100%; max-width: 760px; height: auto; border: 1px solid var(--line); border-radius: 6px; background: #FFFFFF; }

@media (max-width: 850px) {
  /* 手机：五步缩成小点 + 当前步名；句子和按钮换到第二行 */
  .view-workbench .wb-qbar { gap: 6px 12px; min-height: 0; padding: 8px 12px; }
  .view-workbench .wb-steps { flex: 1 0 100%; gap: 8px; }
  .view-workbench .wb-step { gap: 6px; }
  .view-workbench .wb-step + .wb-step::before { display: none; }
  .view-workbench .wb-dot { width: 12px; height: 12px; border-width: 2px; font-size: 0; box-shadow: none; }
  .view-workbench .wb-step.is-current .wb-dot { width: 14px; height: 14px; }
  .view-workbench .wb-step:not(.is-current) .wb-step-label { display: none; }
  .view-workbench .wb-bar-now { flex: 1 1 150px; }
  .view-workbench .wb-qbar .btn { min-height: 40px; padding: 8px 14px; }
  .view-workbench .wb-block { padding: 14px; scroll-margin-top: 132px; }
  .view-workbench .wb-fold > summary { padding: 12px 14px; }
  .view-workbench .wb-fold > .wb-block-tools { padding: 0 14px 8px; }
  .view-workbench .wb-fold > .wb-block-body { padding: 4px 14px 14px; }
  .view-workbench .quote-image { scroll-margin-top: 132px; }
}
@media (max-width: 640px) {
  .view-workbench .option-cols { display: none; }
  .view-workbench .ol-detail, .view-workbench .ol-detail.no-price { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .view-workbench .ol-detail .ol-name { grid-column: 1 / -1; }
  .view-workbench .ol-detail .ol-qty, .view-workbench .ol-detail .ol-sub { text-align: left; }
  .view-workbench .ol-detail .ol-cell { justify-content: flex-start; }
  .view-workbench .ol-detail [data-label] { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
  .view-workbench .ol-detail [data-label]::before { content: attr(data-label); color: var(--ink-3); font-size: 12px; font-weight: 400; }
  .view-workbench .bubble { grid-template-columns: 24px minmax(0, 1fr); }
  .view-workbench .bubble-copy { grid-column: 2; justify-self: end; }
}
/* ===== 倍熟练 R1 结束 ===== */

/* ===== 工单 P3（10-24 虎哥第五轮反馈）：订单中心在 1080p 笔记本上放得下、订单明细按属性分列、首页大标题后的小字 ===== */
/* 首页：大标题后面只留一句小字（最要紧的一件），比标题小很多 */
.view-home .home-hero-key { margin: 8px 0 0; line-height: 1.5; }

/* 订单中心：计时小条永远一行（“询价 · 等了 3 小时 5 分”靠左，“超时 1 小时 5 分”靠右），不够宽就让左边的列宽一点 */
@media (min-width: 851px) { .view-orders .order-grid { grid-template-columns: minmax(300px, 340px) minmax(0, 1fr); } }
.view-orders .order-wait { flex-wrap: nowrap; gap: 4px 6px; white-space: nowrap; }
.view-orders .order-wait .ow-left { padding-left: 4px; }
/* 订单明细：品牌 | 型号 | 规格 | 数量 | 售价 | 进价 | 毛利，一行一件货；来源小标签挨着型号，不再另起一行 */
.view-orders .order-lines { padding-bottom: 4px; }
.view-orders .order-lines .data-table td { padding-top: 6px; padding-bottom: 6px; vertical-align: middle; }
.view-orders .order-lines .lines-split .c-brand { color: var(--ink-2); }
.view-orders .order-lines .lines-split .c-spec { white-space: normal; }
.view-orders .order-lines .lines-split .spec-part { white-space: nowrap; }
.view-orders .order-lines .lines-split .dot-sep { margin: 0 4px; }
.view-orders .order-lines .lines-split .line-src-row { display: inline-flex; margin: 0 0 0 8px; vertical-align: middle; }
.view-orders .order-lines .lines-split .line-src { padding: 1px 6px; font-size: 13px; font-weight: 500; }
.view-orders .erp-row { min-height: 40px; margin-bottom: 12px; padding: 4px 16px; }
@media (min-width: 521px) { .view-orders .order-lines .lines-split .c-brand, .view-orders .order-lines .lines-split .c-model, .view-orders .order-lines .lines-split .num { width: 1%; white-space: nowrap; } }
.view-orders .order-lines .lines-split .c-model strong { font-weight: 600; }
.view-orders .order-sections + * { margin-top: 16px; }
.view-orders .timeline-item { grid-template-columns: 19px minmax(0, 1fr) 84px; align-items: baseline; }
.view-orders .timeline-item > .btn { grid-column: 3; grid-row: 1; justify-self: end; margin: 0; min-height: 0; padding: 0 4px; }
.view-orders .order-summary { margin-bottom: 12px; }
/* 下面的卡：客户档案占左边（四条资料排成两列，一眼看全），库存与缺料、报价摘要叠在右边一列 */
@media (min-width: 851px) {
  .view-orders .order-sections { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 16px; }
  .view-orders .order-sections > :only-child { grid-column: 1 / -1; }
  .view-orders .customer-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .view-orders .customer-facts .fact:only-child { grid-column: 1 / -1; }
}
.view-orders .order-stack { display: grid; gap: 16px; align-content: start; min-width: 0; }
.view-orders .order-stack > .card { min-width: 0; }
@media (max-width: 850px) {
  .view-orders .order-sections { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .view-orders .order-lines .lines-split tr { align-items: baseline; }
  .view-orders .order-lines .lines-split td.c-brand { flex: 0 0 auto; color: var(--ink-3); }
  .view-orders .order-lines .lines-split td.c-model { flex: 1 1 auto; }
  .view-orders .order-lines .lines-split td.c-spec { flex: 1 0 100%; }
  .view-orders .order-lines .data-table.lines-split td.c-brand[data-label]::before, .view-orders .order-lines .data-table.lines-split td.c-model[data-label]::before, .view-orders .order-lines .data-table.lines-split td.c-spec[data-label]::before { content: none; }
}

/* ── 低分辨率屏（1080p 笔记本、浏览器 90% 缩放，宽 ≤1700、高 ≤900）：整体紧一档——字小一号、间距收一收、左栏变窄；≥1920 的屏不动 ── */
@media (min-width: 851px) and (max-width: 1700px) and (max-height: 900px) {
  body { font-size: 13px; }
  .app-shell { grid-template-columns: 188px minmax(0, 1fr); }
  .sidebar { padding: 10px 8px; }
  .brand { padding: 2px 6px 12px; }
  .brand-mark svg { width: 48px; height: 24px; }
  .brand-name { font-size: 15px; }
  .nav-link { height: 34px; padding: 0 8px; gap: 8px; font-size: 13px; }
  .nav-count { height: 18px; min-width: 18px; font-size: 11px; }
  .topbar { flex: 0 0 52px; height: 52px; padding: 0 16px; --tb-h: 32px; gap: 12px; }
  .topbar .avatar { width: 26px; height: 26px; }
  .page-name { font-size: 16px; }
  .content { padding: 10px 16px 16px; }
  .btn { font-size: 12px; }
  .btn.small, .view-home .btn.small, .view-home .chip-btn, .view-workbench .btn.small { min-height: 28px; padding: 3px 10px; font-size: 12px; }
  .view-home .tag, .view-workbench .tag, .view-orders .tag, .view-admin .tag, .view-approvals .tag { padding: 2px 8px; font-size: 12px; }
  .view-home .status-pill, .view-workbench .status-pill, .view-orders .status-pill, .view-approvals .status-pill { padding: 2px 10px; font-size: 12px; }
  .card-title, .side-head h2 { font-size: 14px; }
  .mini-note, .empty-line { font-size: 12px; }
  .mini-head, .view-orders .mini-head { min-height: 36px; padding: 8px 12px 2px; }
  .mini-body, .view-orders .mini-body { padding: 0 12px 8px; }
  .mini-row, .view-orders .mini-row { min-height: 34px; padding: 6px 0; }
  .view-home .mini-main strong, .view-orders .mini-main strong, .view-orders .mini-right { font-size: 13px; }
  .view-home .mini-main > span, .view-home .mini-right, .view-home .mini-note, .view-orders .mini-main > span, .view-orders .mini-note, .view-orders .margin-note { font-size: 12px; }

  /* 首页 */
  .view-home .home-top { margin-bottom: 12px; }
  .view-home .home-hero-wrap { margin-bottom: 16px; }
  .view-home .home-hero { font-size: clamp(22px, 2.3vw, 32px); }
  .view-home .home-hero-sub { margin-top: 8px; font-size: 14px; }
  .view-home .home-hero-key { font-size: 14px; }
  .view-home .home-river { margin-bottom: 16px; }
  .view-home .river-node { min-height: 52px; padding: 8px 12px; }
  .view-home .river-label, .view-home .river-count { font-size: 14px; }
  .view-home .river-stop.lit .river-count { font-size: 24px; }
  .view-home .home-focus { padding: 16px 20px; }
  .view-home .focus-title { margin-top: 8px; font-size: 24px; }
  .view-home .focus-why { margin-top: 8px; font-size: 14px; }
  .view-home .focus-actions { margin-top: 16px; }
  .view-home .focus-actions .btn.primary { min-height: 40px; padding: 6px 20px; font-size: 14px; }
  .view-home .home-todo .todo-row { padding: 8px 0; }
  .view-home .todo-main strong { font-size: 13px; }
  .view-home .todo-main > span { font-size: 12px; }
  .view-home .home-side { gap: 12px; }

  /* 订单中心 */
  .view-orders .page-tools { margin-bottom: 8px; }
  .view-orders .order-grid { grid-template-columns: minmax(280px, 320px) minmax(0, 1fr); gap: 12px; }
  .view-orders .order-list { gap: 6px; }
  .view-orders .order-card { padding: 8px 12px; gap: 2px; }
  .view-orders .order-card strong { font-size: 13px; }
  .view-orders .order-card-sub { font-size: 12px; }
  .view-orders .order-wait { padding: 3px 8px; font-size: 12px; }
  .view-orders .order-detail { padding: 16px; }
  .view-orders .order-detail-head { margin-bottom: 8px; }
  .view-orders .order-detail h2 { font-size: 16px; }
  .view-orders .order-date, .view-orders .order-due { font-size: 12px; }
  .view-orders .order-summary { margin-bottom: 8px; }
  .view-orders .order-summary-main { font-size: 13px; }
  .view-orders .erp-row { min-height: 34px; margin-bottom: 8px; padding: 2px 12px; }
  .view-orders .erp-status { font-size: 13px; }
  .view-orders .order-lines { margin-bottom: 8px; padding: 0 12px 4px; }
  .view-orders .order-lines .data-table th, .view-orders .order-lines .data-table td { padding: 5px 12px 5px 0; font-size: 13px; }
  .view-orders .order-lines .data-table th { font-size: 12px; }
  .view-orders .order-lines .data-table .num { padding-left: 12px; padding-right: 0; }
  .view-orders .order-lines .lines-split .line-src { font-size: 12px; }
  .view-orders .section-head h3 { margin-bottom: 8px; font-size: 14px; }
  .view-orders .timeline-item { padding-bottom: 8px; }
  .view-orders .timeline-copy strong { font-size: 13px; }
  .view-orders .timeline-copy span, .view-orders .timeline-fold > summary, .view-orders .timeline-more > summary { font-size: 12px; }
  .view-orders .order-sections { gap: 12px; margin-top: 12px; }
  .view-orders .order-stack { gap: 12px; }
  .view-orders .customer-facts { gap: 6px; }
  .view-orders .fact { padding: 6px 10px; }
  .view-orders .fact strong { font-size: 12px; }
  .view-orders .fact span { margin-top: 2px; font-size: 13px; }
}
/* ===== 10-24 P1：作业工作台宽屏两栏 / 推荐项一框一句 / 点输入框不跳 / 追加还是替换一句话 ===== */

/* ── 宽屏（≥1200）：左 1 客户信息（带客户原话），右 2 核对；3 报价方案、4 回复客户整宽排在下面。手机仍是一栏 ── */
@media (min-width: 1200px) {
  .view-workbench .wb-blocks { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: start; }
  .view-workbench .wb-blocks > .wb-block[data-wb-block="3"], .view-workbench .wb-blocks > .wb-block[data-wb-block="4"] { grid-column: 1 / -1; }
}

/* ── 推荐项：推荐值直接写在输入框里，后面一小句淡字“系统推荐”（悬停看依据）；没有单项按钮 ── */
.view-workbench .sg-line { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; }
.view-workbench .sg-input { box-sizing: border-box; width: 168px; max-width: 100%; min-height: 36px; padding: 8px 12px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: #FFFFFF; color: var(--ink); font-size: 14px; line-height: 1.4; }
.view-workbench .sg-input:focus { outline: none; border-color: var(--carbon); box-shadow: 0 0 0 3px var(--carbon-wash); }
.view-workbench .sg-input[aria-invalid="true"] { border-color: var(--red); }
.view-workbench .sg-note { color: var(--ink-3); font-size: 12px; line-height: 1.4; opacity: .85; cursor: help; white-space: nowrap; }
.view-workbench .sg-note.manual { color: var(--yellow); opacity: 1; }

/* ── 点输入框不跳：方案表的单价格不管是文字还是输入框，一样高一样宽（选中方案 / 点进框，行高列宽不变）；
      核对里“点值就改”的保存条浮在格子下面，不撑高、不挤宽 ── */
.view-workbench .ol-detail { align-items: center; }
.view-workbench .ol-detail .ol-cell { min-height: 36px; align-items: center; }
.view-workbench .ol-detail .ol-price { display: inline-flex; align-items: center; justify-content: flex-end; box-sizing: border-box; width: 88px; height: 36px; padding: 0 8px; border: 1px solid transparent; font-variant-numeric: tabular-nums; }
.view-workbench .ol-detail .line-price { display: inline-flex; align-items: center; gap: 4px; height: 36px; }
.view-workbench .ol-detail .line-price input { box-sizing: border-box; width: 88px; height: 36px; padding: 0 8px; border-width: 1px; line-height: 1.4; text-align: right; font-variant-numeric: tabular-nums; }
.view-workbench .ol-detail .line-price input:focus { border-width: 1px; }
/* 表格里的格子：原来的按钮换成“同样的字、同样的内边距”的隐形占位，输入框浮在上面——格子的宽、高跟按钮时一模一样，列宽行高都不动 */
.kv-table .cell-edit { width: auto; }
.kv-table .cell-sizer { display: block; box-sizing: border-box; min-height: 36px; padding: 8px 12px; border: 1px solid transparent; font-size: 14px; line-height: 1.4; white-space: nowrap; visibility: hidden; }
.view-workbench .kv-table .cell-input { position: absolute; top: 0; left: 0; width: max(100%, 6.5em); min-width: 0; }
.view-workbench .cell-edit-pop { position: absolute; top: calc(100% + 2px); left: -2px; z-index: 6; min-width: 190px; padding: 6px 8px 8px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: #FFFFFF; box-shadow: 0 8px 24px -8px rgba(28, 32, 38, .28); white-space: normal; }
.view-workbench .cell-input:focus { border-width: 1px; }
/* ===== P1 结束 ===== */
/* ===== P2：方案表按 品牌 | 型号 | 规格 | 数量 | 单价 | 小计 分列；报价单图片预览外框 ===== */
/* 单价列：输入框 88px + 间距 4px + “¥” 约 13px，要放得下；原来 90px 会让“¥”压到数量上（写成“30¥”） */
.view-workbench .option-cols, .view-workbench .ol-detail { grid-template-columns: 4.4em minmax(5.6em, 1fr) minmax(0, 1.1fr) 30px 110px 76px; gap: 4px 8px; }
.view-workbench .option-cols.no-price, .view-workbench .ol-detail.no-price { grid-template-columns: 4.4em minmax(5.6em, 1fr) minmax(0, 1.1fr) 40px; }
.view-workbench .option-cols span:nth-child(-n+3) { text-align: left; }
.view-workbench .option-cols span:nth-child(n+4) { text-align: right; }
.view-workbench .ol-id { display: contents; }
.view-workbench .ol-detail .ol-brand { color: var(--ink-2); font-size: 13px; font-weight: 600; line-height: 1.5; overflow-wrap: anywhere; }
.view-workbench .ol-detail .ol-name.ol-model { font-size: 13px; overflow-wrap: break-word; }
.view-workbench .ol-detail .ol-spec { color: var(--ink-2); font-size: 13px; line-height: 1.5; }
.view-workbench .ol-detail .ol-spec .sp { display: inline-block; white-space: nowrap; }
.view-workbench .ol-detail .ol-spec .sp:not(:last-child)::after { content: "·"; margin: 0 2px 0 4px; color: var(--ink-3); }
.view-workbench .ol-detail .ol-none { color: var(--ink-3); }
.view-workbench .quote-canvas-wrap { max-width: 760px; max-height: 560px; overflow: auto; border: 1px solid var(--line); border-radius: 6px; background: #FFFFFF; }
.view-workbench .quote-canvas-wrap .quote-canvas { border: 0; border-radius: 0; max-width: none; }
@media (max-width: 640px) {
  .view-workbench .ol-detail, .view-workbench .ol-detail.no-price { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .view-workbench .ol-id { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; grid-column: 1 / -1; }
  .view-workbench .ol-id .ol-name { flex: 0 1 auto; }
  .view-workbench .ol-detail .ol-qty { text-align: left; }
}
/* ===== P2 结束 ===== */
/* ===== P8 客户发来的原图（放在客户原话旁边） ===== */
.view-workbench .source-photo { display: flex; align-items: center; gap: 12px; margin: 0 0 12px; min-width: 0; }
.view-workbench .source-photo-thumb { flex: none; display: block; width: 112px; height: 84px; padding: 0; overflow: hidden; border: 1px solid var(--line); border-radius: var(--r-ctl); background: #fff; cursor: zoom-in; }
.view-workbench .source-photo-thumb:hover { border-color: var(--ink-3); }
.view-workbench .source-photo-thumb:focus-visible { outline: 2px solid var(--carbon); outline-offset: 2px; }
.view-workbench .source-photo-thumb[hidden] { display: none; }
.view-workbench .source-photo-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top left; }
.view-workbench .source-photo-text { display: grid; gap: 4px; min-width: 0; font-size: 13px; line-height: 1.5; color: var(--ink-2); }
.view-workbench .source-photo-text strong { color: var(--ink); font-weight: 650; }
.view-workbench .source-photo-warn { color: var(--seal); font-weight: 600; }
.view-workbench .source-photo-note, .view-workbench .source-photo-gone { color: var(--ink-3); }
.view-workbench .source-photo-gone[hidden] { display: none; }
.view-workbench .source-photo.is-gone .source-photo-text strong, .view-workbench .source-photo.is-gone .source-photo-note { display: none; }
.photo-zoom { position: fixed; inset: 0; z-index: 95; display: grid; place-items: center; align-content: center; gap: 10px; padding: 24px; background: rgba(28, 32, 38, .78); cursor: zoom-out; }
.photo-zoom img { display: block; max-width: min(96vw, 1100px); max-height: calc(100vh - 96px); object-fit: contain; border-radius: var(--r-ctl); background: #fff; box-shadow: 0 24px 80px rgba(11, 24, 38, .45); }
.photo-zoom p { margin: 0; color: rgba(255, 255, 255, .8); font-size: 13px; }
.photo-zoom-close { position: absolute; top: 16px; right: 16px; width: 40px; height: 40px; font-size: 22px; line-height: 1; cursor: pointer; }
@media (max-width: 560px) {
  .view-workbench .source-photo-thumb { width: 88px; height: 66px; }
  .photo-zoom { padding: 12px; }
}

/* ===== P10 把图片拖进页面 / 库存与缺料分列 ===== */
.wz-drop-overlay { position: fixed; inset: 0; z-index: 300; display: none; place-items: center; padding: 24px; background: rgba(26, 93, 176, .16); pointer-events: none; }
.wz-drop-overlay.is-on { display: grid; }
.wz-drop-overlay::before { content: ""; position: absolute; inset: 14px; border: 3px dashed var(--carbon); border-radius: 20px; }
.wz-drop-card { position: relative; display: grid; justify-items: center; gap: 8px; max-width: min(440px, 100%); padding: 28px 36px; border-radius: 20px; background: rgba(255, 255, 255, .94); color: var(--carbon); text-align: center; box-shadow: 0 12px 40px rgba(28, 32, 38, .18); }
.wz-drop-icon { width: 56px; height: 56px; }
.wz-drop-card strong { font-size: 22px; font-weight: 700; line-height: 1.3; }
.wz-drop-card span { color: var(--ink-2); font-size: 14px; }
form[data-form="new-source"].is-drop { outline-width: 3px; background: var(--carbon-wash); }
form[data-form="new-source"].is-drop textarea { border-color: var(--carbon); background: #fff; }
form[data-form="new-source"].is-drop .wz-drop-hint { color: var(--carbon); font-size: 15px; font-weight: 700; }
/* 库存表：品牌 | 型号 | 规格 | 库存 | 售价（缩略图跟在品牌前面） */
.stock-split th:nth-child(1) { width: 148px; }
.stock-split th:nth-child(2) { width: 156px; }
.stock-split .stock-cell { gap: 10px; }
.stock-split .stock-brandname { min-width: 0; color: var(--ink-2); overflow-wrap: anywhere; }
.stock-split td.stock-model { overflow-wrap: anywhere; }
.stock-split td.stock-model strong { margin-right: 6px; font-weight: 600; }
.stock-split td.stock-model .short-badge { vertical-align: middle; }
.stock-split td.stock-spec .spec-part { white-space: nowrap; }
.stock-split td.stock-spec .dot-sep { margin: 0 4px; color: var(--ink-3); }
.short-spec .spec-part { white-space: nowrap; }
.short-spec .dot-sep { margin: 0 4px; }
/* 订单详情里“库存与缺料 / 采购成本”小卡：品牌 型号 + 规格；窄屏换行，不用省略号吃掉规格 */
.view-orders .mini-main strong:has(> [data-short-split]) { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
.view-orders .mini-main strong > .mini-spec { margin-left: 2px; color: var(--ink-3); font-size: 13px; font-weight: 400; }
@media (max-width: 600px) {
  .stock-split td.stock-brand { flex: 0 0 auto; }
  .stock-split td.stock-model { flex: 1 1 0; min-width: 0; }
  .stock-split td.stock-spec { flex: 0 0 calc(100% - 52px); margin-left: 52px; font-size: 13px; color: var(--ink-2); }
  .stock-split td.num:nth-child(4) { margin-left: 52px; }
  .stock-split td.stock-brand[data-label]::before, .stock-split td.stock-model[data-label]::before, .stock-split td.stock-spec[data-label]::before { content: none; }
  .wz-drop-card strong { font-size: 19px; }
}

/* ===== 工单 F4（10-24 虎哥）：首页是一屏差不多大小的小组件（像苹果小组件）===== */
/* 每张卡一个格子，同一行等高；鼠标移上去轻微放大；点哪张，哪张放大成对应的页面、左侧页签同时切过去（JS：hcZoom） */
.view-home .home-widgets { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); grid-auto-rows: minmax(272px, auto); gap: 16px; align-items: stretch; }
.view-home .home-widgets > [data-hc] { position: relative; display: flex; flex-direction: column; min-width: 0; margin: 0; cursor: pointer; transition: transform .18s ease, box-shadow .18s ease; }
@media (hover: hover) {
  .view-home .home-widgets > [data-hc]:hover { z-index: 2; transform: translateY(-2px) scale(1.015); box-shadow: 0 1px 2px rgba(28, 32, 38, .08), 0 14px 30px -10px rgba(28, 32, 38, .32); }
}
.view-home .home-widgets > [data-hc]:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
  .view-home .home-widgets > [data-hc] { transition: none; }
  .view-home .home-widgets > [data-hc]:hover { transform: none; }
}
/* 卡里的字：标题、说明限行，放不下的在放大后的页面里看全部 */
.view-home .home-widgets .mini-card .mini-body { flex: 1; min-height: 0; }
.view-home .home-widgets > .home-todo { padding: 16px; }
.view-home .home-widgets > .home-todo .todo-list { flex: 1; }
.view-home .home-widgets > .home-todo .more-link-inline { align-self: flex-start; margin-top: 4px; }
.view-home .home-widgets > .home-focus { padding: 20px 20px 16px; }
.view-home .home-widgets .focus-title { display: -webkit-box; margin: 10px 0 0; overflow: hidden; font-size: 20px; line-height: 1.35; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.view-home .home-widgets .focus-meta { margin: 6px 0 0; overflow: hidden; font-size: 13px; line-height: 1.5; text-overflow: ellipsis; white-space: nowrap; }
.view-home .home-widgets .focus-why { display: -webkit-box; margin: 8px 0 0; overflow: hidden; font-size: 14px; line-height: 1.6; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.view-home .home-widgets .focus-actions { margin: auto 0 0; padding-top: 12px; }
.view-home .home-widgets .focus-actions .btn.primary { min-height: 40px; padding: 6px 20px; font-size: 14px; }
.view-home .home-widgets .home-short { margin-top: 4px; }
/* 下面是一屏等大的小卡，不再有“左 62% 右 38%”：一单的路六站平分，也不再从站上垂一根线接到某张卡 */
@media (min-width: 1001px) {
  .view-home .river-stop.is-focus::after, .view-home .river-stop.is-focus::before { display: none; }
  .view-home .river-track { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .view-home .river-stop:nth-child(5), .view-home .river-stop:nth-child(6) { grid-column: auto; }
  .view-home .river-stop:nth-child(5) .river-node::before { width: 12px; }
}
/* 放大动画（10-25 改成只动 transform / opacity，不再用整页截图的 view-transition）：替身是 body 下的一块 position:fixed，自然大小 = 主区域，
   JS 用 transform 把它缩到被点的卡的位置再放大回来；滑块是左侧页签里亮着的那一块，垫在字的下面滑。 */
.hc-ghost { position: fixed; z-index: 58; box-sizing: border-box; margin: 0; border: 1px solid var(--edge-color); border-radius: var(--r-panel); background: rgba(255, 255, 255, .94); box-shadow: 0 1px 2px rgba(28, 32, 38, .07), 0 10px 28px -12px rgba(28, 32, 38, .24); transform-origin: 0 0; pointer-events: none; contain: layout paint; }
.hc-ghost-title { position: absolute; left: 28px; top: 22px; color: var(--ink); font-size: 18px; font-weight: 700; letter-spacing: -.01em; white-space: nowrap; }
.hc-nav-sliding { position: relative; }
.hc-nav-sliding .nav-link { position: relative; z-index: 1; }
.hc-nav-sliding .nav-link.active, .mobile-nav.hc-nav-sliding .nav-link.active { background: transparent; box-shadow: none; transition: none; }
.hc-pill { position: absolute; z-index: 0; pointer-events: none; transform-origin: 0 0; }
/* 进首页 / 落地页的入场：数据没到齐时文字和卡片先收着（不是 display:none，位置照占，量得到终点）；JS 只在入场期间挂这个类 */
.hc-intro-hold [data-home-widgets] > *, .hc-intro-hold .home-scene-btn, .hc-intro-hold .home-route-step, .hc-intro-hold .home-top, .hc-intro-hold .home-hero-wrap > *, .hc-intro-hold .home-river { opacity: 0; }
.hc-intro-run [data-home-widgets] > *, .hc-intro-run .home-scene-btn, .hc-intro-run .home-route-step { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
/* 原料联动卡内容多（涨跌、几项价格、按钮），占两格高，像苹果的“大号小组件”；内容怎么画不归这里管，只管外框 */
.view-home .home-widgets > [data-home="material"] { grid-row: span 2; }
/* 卡里没有东西时，那句“没有……”放在卡的正中，不贴在左上角 */
.view-home .home-widgets > .home-todo > .empty-line, .view-home .home-widgets .mini-body:has(> .empty-line:only-child) { display: grid; flex: 1; place-content: center; text-align: center; }
.view-home .home-widgets > .home-todo .todo-row { padding: 8px 0; }
/* 窄屏：一列，卡片按内容高；空的卡不撑成大白块 */
.view-home .home-widgets { grid-auto-flow: dense; }
@media (max-width: 850px) {
  .view-home .home-widgets { grid-auto-rows: auto; }
  .view-home .home-widgets > [data-hc] { min-height: 150px; }
  .view-home .home-widgets > [data-home="material"] { grid-row: auto; }
}
/* 按下去：小小回弹一下，像按一个小组件 */
@media (hover: hover) {
  .view-home .home-widgets > [data-hc]:active { transform: scale(.995); transition-duration: .08s; }
}

/* W36c: mobile cards stay in document flow, including during the dealing intro.
   Reserve a dock above navigation for the assistant instead of covering tasks. */
@media (max-width: 850px) {
  .content { margin-bottom: 134px; padding-bottom: 16px; }
  .view-home .home-widgets { grid-template-columns: minmax(0, 1fr); }
  .view-home [data-home-widgets] > [data-hc] {
    transform: none !important;
    opacity: 1 !important;
  }
  .mobile-nav .nav-link { grid-template-columns: auto auto; grid-template-rows: 20px auto; }
  .mobile-nav .nav-icon { grid-column: 1 / -1; grid-row: 1; }
  .mobile-nav .nav-link:has(.nav-count) .nav-icon { grid-column: 1; }
  .mobile-nav .nav-count { position: static; grid-column: 2; grid-row: 1; }
  .mobile-nav .nav-label-text { grid-column: 1 / -1; grid-row: 2; }
}