@charset "UTF-8";
/* ══ 工作台界面优化稿（Tim 10-11，设计稿「工作台界面优化稿」）══════════════════════════════════════
   在 styles.css、mobile.css 之后、motion.css 之前加载。颜色、字号、圆角照 docs/design/WORKBENCH-STYLE.md。
   内容：页头 · 操作结果通知 · 表格 · 空状态 · 加载中骨架 · 对话框两列 · 实机验收新版式。动效写在 motion.css。
   不碰扫码会话的区域：扫码键、扫码层、成品 › SN 标签（.sn-board）、发货单（.ship-layout）、送样对话框。 */

/* ── 页头：标题、一句说明、右侧操作同一行；不显示「机箱上的猫 · INTERNAL」小字（面包屑已经写了） ── */
@media (min-width:721px){.page-heading{align-items:flex-end;gap:12px 24px}.page-heading>div:first-child{flex:1 1 auto;min-width:0}}
.page-heading .eyebrow{display:none}
.page-heading .page-title-row h1{margin:0}
.page-heading #page-description{margin:6px 0 0;max-width:76ch}
.page-heading #page-description:empty{display:none}
.page-heading .back-link{margin-bottom:8px}
@media (min-width:861px){.page-heading .page-tools{flex-wrap:wrap;justify-content:flex-end}}

/* ── 操作结果通知（toast.js）：右上角，白底细边，成功绿点、失败红点；读屏仍由 #page-message 播报 ── */
html.has-toast #page-message{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
#toast-region{position:fixed;inset:16px 16px auto auto;z-index:1000;display:flex;flex-direction:column;gap:8px;width:min(360px,calc(100vw - 32px));height:auto;max-height:none;margin:0;padding:0;border:0;background:transparent;color:inherit;overflow:visible;pointer-events:none}
#toast-region:empty{display:none}
.toast{pointer-events:auto;display:flex;gap:10px;align-items:flex-start;padding:11px 8px 11px 14px;border:1px solid #ebedf0;border-radius:10px;background:#fff;color:#14181d;font-size:14px;line-height:1.55;box-shadow:0 8px 24px rgba(20,24,29,.10)}
.toast-dot{flex:none;width:8px;height:8px;margin-top:7px;border-radius:50%;background:#2f6b46}
.toast.is-error{border-color:#efc9c2}
.toast.is-error .toast-dot{background:#b23a2b}
.toast-body{flex:1;min-width:0}
.toast-text{margin:0;overflow-wrap:anywhere}
.toast-next{display:flex;flex-wrap:wrap;gap:2px 14px;margin-top:4px}
.toast-next .next-step,.toast-next .link-button{margin:0;padding:0;background:none;color:#3d6e8c;font-size:13px;font-weight:500;text-decoration:none;text-align:left}
.toast-next .next-step:hover,.toast-next .link-button:hover{text-decoration:underline;text-underline-offset:3px}
.toast-close{flex:none;display:grid;place-items:center;width:28px;height:28px;min-height:0;margin:-3px 0 0;padding:0;border:0;border-radius:6px;background:transparent;color:#98a0aa;font-size:18px;line-height:1}
.toast-close:hover{background:#f3f5f7;color:#14181d}

/* ── 表格：表头随滚动固定（电脑端，表格区域最多一屏高）；鼠标经过的行浅底；整列数字右对齐、等宽（ui-polish.js 标 .is-num） ── */
td,th{font-variant-numeric:tabular-nums}
:is(th,td).is-num{text-align:right}
.table-panel tbody tr:hover>td{background:#f7f9fb}
.table-panel tbody tr:hover>td[colspan]{background:transparent}
@media (min-width:721px){
  #page-content .table-panel:not(:is(.sn-board,.ship-layout) *)>.table-scroll{max-height:calc(100vh - 96px)}
  #page-content .table-panel:not(:is(.sn-board,.ship-layout) *) thead th{position:sticky;top:0;z-index:2}
}
/* 危险操作（报废、删除）红字：成品行的「报废」原来是普通文字按钮 */
.row-actions .gated button.action-danger{color:#b23a2b}
.row-actions .gated button.action-danger:disabled{color:#c9a19b}

/* ── 状态标签补两种：进行中（钢蓝）、完成（绿），照 WORKBENCH-STYLE.md 2.2 ── */
.status.run{background:#eff5f9;color:#3d6e8c}
.status.done{background:#eaf2ec;color:#2f6b46}

/* ── 空状态：一句说明加一个主按钮 ── */
.empty .empty-action{margin-top:16px}
.empty .empty-action :is(.primary,.secondary){min-height:40px;padding:0 18px}

/* ── 加载中：灰色骨架行占位，代替「正在加载数据…」文字 ── */
.skeleton-panel{border:1px solid #ebedf0;border-radius:10px;background:#fff;overflow:hidden}
.skeleton-head{padding:20px;border-bottom:1px solid #ebedf0;background:#fafafa}
.skeleton-head .skeleton-bar{width:140px}
.skeleton-row{display:grid;grid-template-columns:2fr 1.4fr 1fr 1fr;gap:24px;padding:22px 20px;border-bottom:1px solid #ebedf0}
.skeleton-row:last-child{border-bottom:0}
.skeleton-bar{position:relative;display:block;height:10px;border-radius:4px;background:#eef0f3;overflow:hidden}
.skeleton-row .skeleton-bar:nth-child(1){width:72%}
.skeleton-row .skeleton-bar:nth-child(2){width:56%}
.skeleton-row .skeleton-bar:nth-child(3){width:44%}
.skeleton-row .skeleton-bar:nth-child(4){width:36%}
.skeleton-row:nth-child(odd) .skeleton-bar:nth-child(1){width:60%}
.skeleton-row:nth-child(odd) .skeleton-bar:nth-child(2){width:48%}

/* ── 对话框：短字段两列（电脑端），底栏固定在下方（styles.css 已是 sticky），主按钮在右 ── */
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}
.form-grid>.field{min-width:0}
.form-grid :is(input,select){width:100%}
#editor .dialog-actions{border-top:1px solid #ebedf0;margin-top:20px}
/* 「恢复出厂」对话框：标题已经在对话框标题栏，卡片里那一行不再重复 */
#editor .factory-dev-reset>h2{display:none}
#editor .factory-dev-reset select,#editor .factory-dev-reset input{width:100%}
#editor .factory-dev-reset button{margin-top:12px}
.fa-create-why{display:block;margin:14px 0 0}

/* ══ 实机验收（设计稿「实机验收页 · 改后」）══════════════════════════════════════════════════
   左栏验收记录（进行中 / 今天完成）· 右边记录头 → 三步进度条 → 当前步骤面板；完成后绿色完成卡 */
.factory-layout{display:block;max-width:none}
.factory-layout .mono{font-family:"Cascadia Mono",Consolas,ui-monospace,monospace;font-weight:600;letter-spacing:-.2px}
.fa-notice{margin:0 0 20px}
.fa-grid{display:grid;grid-template-columns:270px minmax(0,1fr);min-height:560px;border:1px solid #ebedf0;border-radius:10px;background:#fff;overflow:hidden}
.fa-runs{min-width:0;padding:14px 12px;border-right:1px solid #ebedf0;background:#fafafa}
.fa-runs h3{margin:14px 8px 6px;font-size:12px;font-weight:500;letter-spacing:.04em;color:#6b747f}
.fa-runs h3:first-child{margin-top:4px}
.fa-run{display:block;width:100%;min-height:0;margin:0 0 4px;padding:10px 12px;border:1px solid transparent;border-radius:8px;background:none;color:#14181d;font-size:14px;font-weight:400;text-align:left}
.fa-run:hover{background:#f3f5f7}
.fa-run.is-on{border-color:#ebedf0;background:#fff;box-shadow:0 1px 2px rgba(20,24,29,.04)}
.fa-run-top{display:flex;align-items:center;justify-content:space-between;gap:8px;font-weight:500}
.fa-run-title{min-width:0;overflow-wrap:anywhere}
.fa-run .status{flex:none;padding:2px 8px;font-size:12px}
.fa-run small{display:block;margin-top:2px;color:#98a0aa;font-size:12px;overflow-wrap:anywhere}
.fa-run small .mono{font-weight:500}
.fa-runs-empty{margin:2px 8px 8px;color:#98a0aa;font-size:13px}
.fa-runs-foot{margin:18px 8px 0;color:#98a0aa;font-size:12px;line-height:1.6}
.fa-runs-foot .link-button{font-size:12px;text-decoration:none}
.fa-main{min-width:0;padding:20px 28px 28px}
.fa-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.fa-title{margin:0;font-size:18px;font-weight:600;overflow-wrap:anywhere}
.fa-facts{margin:4px 0 0;color:#5b636d;font-size:13px;overflow-wrap:anywhere}
.fa-head>.status{flex:none}
.fa-stepper{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:18px 0 0;padding:0;list-style:none}
.fa-stepper li{min-width:0}
.fa-step{display:flex;align-items:center;gap:10px;width:100%;height:100%;min-height:58px;margin:0;padding:10px 14px;border:1px solid #ebedf0;border-radius:0;background:#fff;color:#5b636d;font-size:13.5px;font-weight:400;text-align:left}
.fa-stepper li:first-child .fa-step{border-radius:10px 0 0 10px}
.fa-stepper li:last-child .fa-step{border-radius:0 10px 10px 0}
.fa-stepper li+li .fa-step{border-left:0}
.fa-step:hover{background:#fafafa}
.fa-step.is-cur{background:#eff5f9;color:#14181d;box-shadow:inset 0 0 0 1px #a7c1d9}
.fa-step[aria-pressed=true]:not(.is-cur){background:#fafafa;box-shadow:inset 0 -2px 0 #3d6e8c}
.fa-step-n{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#eef0f3;color:#5b636d;font-size:12px;font-weight:600}
.fa-step.is-done .fa-step-n{background:#2f6b46;color:#fff}
.fa-step.is-cur .fa-step-n{background:#3d6e8c;color:#fff}
.fa-step-text{min-width:0}
.fa-step b{display:block;color:#14181d;font-weight:500}
.fa-step small{display:block;color:#98a0aa;font-size:12px}
.fa-grid :is(.fa-step-n,.fa-tick,.fa-test-mark) svg{display:block;width:14px;height:14px}
.fa-grid :is(.fa-step-n,.fa-tick) path{fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.fa-bar{height:3px;margin:8px 0 16px;border-radius:3px;background:#ebedf0;overflow:hidden}
.fa-bar .motion-progress{display:block;height:100%;background:#3d6e8c}
.fa-main .factory-next{margin:0 0 8px;padding:12px 16px;border:1px solid #ebedf0;border-radius:10px;background:#fafafa;color:#14181d;font-size:14px;line-height:1.7}
.fa-main .factory-next a{color:#3d6e8c}
.fa-status{margin:0 0 14px;color:#5b636d;font-size:13px}
.fa-main .factory-callout{margin:0 0 14px}
.fa-panel{margin:0 0 14px;padding:16px 18px;border:1px solid #ebedf0;border-radius:10px;background:#fff}
.fa-panel>h3{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;margin:0 0 10px;font-size:15px;font-weight:600}
.fa-panel>h3 small{color:#98a0aa;font-size:13px;font-weight:400}
.fa-panel>p{margin:6px 0}
.fa-panel label{display:block;margin:14px 0 6px;color:#6b747f;font-size:13px;font-weight:400}
.fa-panel :is(input,select){max-width:100%}
.fa-panel button{margin:0}
.fa-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin-top:12px}
.fa-actions .factory-why,.fa-panel .factory-why{margin:0}
.fa-sub{margin-top:14px;padding-top:2px;border-top:1px solid #f0f2f4}
.fa-tests{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin:12px 0 0;padding:0;list-style:none}
.fa-test{display:flex;align-items:flex-start;gap:6px;min-width:0;padding:8px 10px;border:1px solid #ebedf0;border-radius:8px;color:#5b636d;font-size:12.5px;line-height:1.35}
.fa-test-mark{flex:none;width:14px;height:14px;margin-top:1px;color:#b23a2b;font-size:12px;font-weight:700;line-height:14px;text-align:center}
.fa-test-mark path{fill:none;stroke:#2f6b46;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.fa-test.is-pending .fa-test-mark::before{content:"";display:block;width:8px;height:8px;margin:3px;border:1.5px solid #c3c9d0;border-radius:50%;box-sizing:border-box}
.fa-test-body{display:flex;flex-direction:column;gap:1px;min-width:0}
.fa-test-name{color:#14181d;overflow-wrap:anywhere}
.fa-test strong{color:#98a0aa;font-size:12px;font-weight:400}
.fa-test small{color:#b23a2b;font-size:12px;overflow-wrap:anywhere}
.fa-test small:empty{display:none}
.fa-test.is-fail{border-color:#efc9c2;background:#fbf1ef}
.fa-test.is-fail :is(.fa-test-name,strong){color:#b23a2b}
/* 开发测试设备「暂不测」（Tim 10-12）：灰格子，虚线框 */
.fa-test.is-skipped{border-style:dashed;background:#fafafa}
.fa-test.is-skipped .fa-test-name{color:#6b747f}
.fa-test.is-skipped .fa-test-mark{color:#98a0aa}
.fa-test .fa-skip{align-self:flex-start;margin:2px 0 0;font-size:12px}
.fa-skip-list{margin:8px 0 0;padding-left:20px;font-size:13px;line-height:1.7}
.fa-confirm{display:grid;gap:8px;margin:14px 0 0}
.fa-confirm-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.fa-confirm-row>span{min-width:64px;color:#5b636d;font-size:13px}
.fa-confirm-row button{min-height:34px;padding:0 12px;font-size:13px}
.fa-panel .factory-test-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin-top:14px;padding:12px 0 4px;border-top:1px solid #ebedf0}
.fa-checks{margin:0;padding:0;list-style:none}
.fa-check{display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:start;gap:12px;padding:12px 0;border-top:1px solid #ebedf0}
.fa-check:first-child{border-top:0;padding-top:4px}
.fa-tick{display:grid;place-items:center;width:24px;height:24px;margin-top:1px;border:1.5px solid #dde0e5;border-radius:50%}
.fa-check.is-done .fa-tick{border-color:#2f6b46;background:#2f6b46}
.fa-check-body{min-width:0}
.fa-check-body>b{font-weight:500}
.fa-check-body>small{display:block;margin-top:2px;color:#6b747f;font-size:12.5px;line-height:1.55}
.fa-check.is-done .fa-check-body>small{color:#2f6b46}
.fa-check-act{display:flex;gap:8px}
.fa-check-act button{white-space:nowrap}
.fa-check .fa-sub{margin-top:6px;border-top:0}
.fa-check .fa-sub label{margin-top:6px}
.fa-check .factory-scan{margin-top:10px;border-width:1px;border-color:#a7c1d9}
.fa-check .factory-scan .scan-bar{margin:0}
.fa-check .factory-scan label{margin:0 4px 0 0}
.fa-check .factory-scan .factory-scan-row input{flex:0 1 240px;width:240px;min-width:0;margin:0}
.fa-check .fa-more>summary{display:inline-block;margin-top:6px;color:#3d6e8c;font-size:12.5px;cursor:pointer}
.fa-check .fa-more[open]>summary{margin-bottom:2px}
.fa-panel .factory-resume{margin:12px 0 0}
.fa-done{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;margin:16px 0 0;padding:16px 18px;border:1px solid #cfe3d5;border-radius:10px;background:#eaf2ec}
.fa-done-mark{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#2f6b46}
.fa-done-mark svg{display:block;width:22px;height:22px}
.fa-done-mark path{fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.fa-done-text{flex:1 1 280px;min-width:0}
.fa-done-text>b{display:block;color:#2f6b46;font-size:15px}
.fa-done-text p{margin:2px 0 0;color:#5b636d;font-size:13px;line-height:1.6}
.fa-done-more .link-button{font-size:13px}
.fa-done-actions{display:flex;flex-wrap:wrap;gap:8px;margin-left:auto}
.fa-done-actions button{margin:0}
.fa-empty{padding:96px 24px}
.fa-main .factory-run-tools{margin:8px 0 0;text-align:right}
@media (max-width:1180px){.fa-tests{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:1000px){.fa-grid{grid-template-columns:230px minmax(0,1fr)}.fa-main{padding:18px 20px 24px}}

/* ── 手机（≤ 720 px）：通知占满一行、在顶部窄栏下面；实机验收左栏叠到上面；小格 2 列 ── */
@media (max-width:720px){
  #toast-region{inset:calc(64px + env(safe-area-inset-top)) 12px auto 12px;width:auto}
  .form-grid{grid-template-columns:1fr}
  .skeleton-row{grid-template-columns:2fr 1fr;gap:16px}
  .skeleton-row .skeleton-bar:nth-child(n+3){display:none}
  .fa-grid{grid-template-columns:1fr;min-height:0}
  .fa-runs{border-right:0;border-bottom:1px solid #ebedf0}
  .fa-run{min-height:44px}
  .fa-main{padding:16px}
  .fa-head{flex-wrap:wrap}
  .fa-step{flex-direction:column;align-items:flex-start;gap:6px;min-height:44px;padding:10px}
  .fa-step small{display:none}
  .fa-tests{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fa-check{grid-template-columns:28px minmax(0,1fr)}
  .fa-check-act{grid-column:2;flex-wrap:wrap}
  .fa-confirm-row button{min-height:44px}
  .fa-done-actions{width:100%;margin-left:0}
  .fa-empty{padding:48px 16px}
}

/* 采购单（Tim 10-11）：显示 / 采购日期并进上面的工具条，控件同高；合计区「物料小计 · 运费 · 合计」三行右对齐 */
.supply-toolbar :is(input,select){height:40px;box-sizing:border-box}
.supply-toolbar .filter-dates{flex:1.6 1 280px;max-width:360px}
.filter-range{display:flex;align-items:center;gap:6px}
.supply-toolbar .filter-range input{flex:1 1 0;min-width:0;max-width:none}
.filter-range span{flex:none;color:#98a0aa;font-size:12px}
.supply-toolbar>.toolbar-clear{align-self:flex-end;min-height:38px;margin:0;padding:0 4px;white-space:nowrap}
.purchase-head{align-items:start}
.purchase-sum{margin:14px 0 16px;padding:2px 14px;border:1px solid #ebedf0;border-radius:8px;background:#fafafa}
.purchase-sum-row{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:44px;font-size:13px;color:#5b636d}
.purchase-sum-row+.purchase-sum-row{border-top:1px solid #ebedf0}
.purchase-sum-row label{margin:0;font-size:13px;font-weight:400;color:#5b636d}
.purchase-sum-row label{white-space:nowrap}
.purchase-sum-row .number-control{flex:0 0 200px;width:200px;height:38px;margin:0}
.purchase-sum-row .number-control input{text-align:right;font-variant-numeric:tabular-nums;padding:0 10px}
/* 物料行：物料 / 供应商 / 数量 / 单价四格同高、去掉各自的下边距，标签才能排成一条线 */
.purchase-line .line-fields label{display:block;margin:0 0 8px;line-height:16px}
.purchase-line .line-fields :is(select,.number-control,.line-material-picker>summary){height:44px;margin:0;box-sizing:border-box}
.purchase-line .line-fields .picked-material{min-height:44px;padding:0;display:flex;flex-direction:column;justify-content:center}
.purchase-line .line-fields .line-material-picker>summary{padding:0 12px;line-height:42px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.purchase-line .line-fields>[data-remove-line]{height:44px;margin:0}
.purchase-head :is(input,select){height:46px;margin-bottom:0;box-sizing:border-box}
@media (min-width:651px){.purchase-line .line-fields :is(select,input,summary){font-size:14px}}
.purchase-sum-num{font-variant-numeric:tabular-nums;color:#14181d}
.purchase-sum-total,.purchase-sum-total .purchase-sum-num{font-size:14px;font-weight:600;color:#14181d}
.line-landed{margin:8px 0 0;font-size:12px;color:#6b747f;font-variant-numeric:tabular-nums}
.purchase-order-summary{background:#fafafa;border:1px solid #ebedf0}
.purchase-freight-line .action-link{font-size:inherit;padding:0;margin:0;vertical-align:baseline}
@media (max-width:650px){
  .supply-toolbar .filter-dates{flex-basis:100%;max-width:none}
  .purchase-sum-row input{width:120px}
}