/** * ACT-WORK-05 差异评估的四份目标件样式表 —— **机械抽取,一个数值都不许改** * (《HTML报告生成规范》§7:有目标件时「搬」,不要「照着做」;样式表整段搬,标记逐块搬)。 * * 来源(`docs/SS02-ACT-WORK-05-html/`): * · `P08_CSS` ← `ACT-WORK-05-数据工单-01-芯片主数据创建.html` 的两段 `` 之间的原文,再拿抽出来的内容包回 * `` 与源文件同一行区间做 `diff`,四份全部「零差异」——过程写在 * task-5-report.md,这里不重复贴证据。 * * 这份文件只装**目标件自己的样式**,不装平台绑定用的开关(三态占位、缺项红带、 * `data-class-of` 的 `v-*` 别名这类)——那些是本活动自己加出来的东西,活在 * `report.ts` 的 `BIND_CSS_*` 常量里,两处不要混。 */ export const P08_CSS = ` :root{ --ink:#1f2329; --ink-2:#41464e; --ink-3:#646a73; --ink-4:#8f959e; --line:#dee0e3; --line-soft:#e8eaed; --soft:#f8f9fb; --brand:#3370ff; --brand-deep:#245bdb; --brand-soft:#e1eaff; --brand-wash:#f0f4ff; --data:#3370ff; --data-soft:#e1eaff; --data-line:#c3d6ff; --ok:#278717; --ok-soft:#e8f8e4; --danger:#d83931; --danger-soft:#feeae9; --mono:"SF Mono",Menlo,Consolas,monospace; } *{box-sizing:border-box} html,body{margin:0;padding:0} body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;background:#eef1f6;color:var(--ink);font-size:14px;line-height:1.7;-webkit-font-smoothing:antialiased} .page{margin:0;padding:0} .card{background:#fff;overflow:hidden;border:0;border-radius:0;box-shadow:none} .card-head{display:flex;align-items:center;gap:14px;padding:18px 22px;border-bottom:2px solid var(--ink);background:linear-gradient(120deg,#f0f5ff 0%,#fff 55%,#eef4ff 100%)} .badge{flex:none;width:44px;height:44px;border-radius:10px;display:grid;place-items:center;background:var(--data);color:#fff;font-weight:800;font-size:13px;box-shadow:0 6px 16px rgba(51,112,255,.25)} .tit{flex:1;min-width:0} .tit .kick{font-size:11px;letter-spacing:.08em;color:var(--ink-4);font-weight:700} .tit h1{margin:2px 0 0;font-size:19px;font-weight:800;line-height:1.3} .tit .sub{font-size:12px;color:var(--ink-3);margin-top:3px} .side{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex:none} .tag{font-size:11px;font-weight:800;padding:2px 10px;border-radius:999px;color:var(--data);background:var(--data-soft);border:1px solid var(--data-line)} .step{font-size:12px;color:var(--ink-3)} .deadline{font-size:12px;color:var(--ink-3)} .deadline b{color:var(--danger)} .card-bd{padding:20px 22px} .zone{font-size:11px;font-weight:800;letter-spacing:.12em;color:var(--ink-4);margin:0 0 8px} .zone b{color:var(--ink-3)} .note{border:1px solid var(--line);border-left:3px solid var(--data);border-radius:8px;background:var(--soft);padding:14px 16px;margin-bottom:16px} .note p{margin:0 0 6px;font-size:13px;color:var(--ink-2)} .note p:last-child{margin-bottom:0} .note b{color:var(--ink)} .note .done{color:var(--ok);font-weight:700} .note .need{color:var(--data);font-weight:700} .jc-editgate{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:14px 0 10px;padding:9px 12px;border-radius:9px;background:var(--soft);border:1px solid var(--line-soft);font-size:12px;color:var(--ink-3)} .jc-editgate-t{flex:1 1 auto;min-width:0} .jc-editgate-t b{color:var(--ink-2);font-weight:700} .jc-egbtn{flex:none;display:inline-flex;align-items:center;gap:5px;cursor:pointer;border:1px solid var(--line);border-radius:7px;padding:6px 13px;font:inherit;font-size:12px;font-weight:700;color:var(--ink-2);background:#fff;transition:border-color .16s,color .16s,background .16s} .jc-egbtn:hover{border-color:var(--brand);color:var(--brand)} .jc-egbtn.save{color:#fff;background:var(--data);border-color:var(--data)} .jc-egbtn.save:hover{filter:brightness(1.06);color:#fff} .jc-editgate .eg-cancel,.jc-editgate .eg-save{display:none} .jc-editgate.on{background:var(--brand-wash);border-color:var(--data-line);color:#1e40af} .jc-editgate.on .eg-open{display:none} .jc-editgate.on .eg-cancel,.jc-editgate.on .eg-save{display:inline-flex} .tbl-wrap{border:1px solid var(--line-soft);border-radius:10px;overflow:hidden} table{width:100%;border-collapse:collapse;font-size:12.5px} th{text-align:left;background:var(--soft);font-size:11px;letter-spacing:.03em;font-weight:800;color:var(--ink-3);padding:9px 10px;border-bottom:1px solid var(--line)} th.req::after{content:" *";color:var(--danger);font-size:11px} td{padding:8px 10px;border-bottom:1px solid var(--line-soft);vertical-align:middle} tr:last-child td{border-bottom:0} td.rn{position:relative;width:38px;white-space:nowrap;font-family:var(--mono);font-size:11px;color:var(--ink-4);text-align:center} .jc-vcell{display:block;font-size:12.5px;color:var(--ink);line-height:1.5;overflow-wrap:anywhere} .jc-vcell.mono{font-family:var(--mono);font-size:11.5px;color:var(--ink-2)} .jc-cell{display:none;width:100%;min-width:60px;border:1px solid var(--line);border-radius:6px;padding:6px 8px;font:inherit;font-size:12.5px;color:var(--ink);background:#fff} .jc-cell.mono{font-family:var(--mono);font-size:11.5px} .jc-cell:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-wash);outline:none} table.on td>.jc-vcell{display:none} table.on td>.jc-cell{display:block} td.rn .jc-rowdel{display:none;width:22px;height:22px;margin:0 auto;cursor:pointer;border:1px solid var(--line);border-radius:6px;padding:0;font:inherit;font-size:14px;line-height:1;color:var(--ink-3);background:#fff} td.rn .jc-rowdel:hover{border-color:var(--danger);color:var(--danger);background:var(--danger-soft)} table.on td.rn .jc-rn-num{display:none} table.on td.rn .jc-rowdel{display:block} .jc-addrow{display:none;margin:8px 0 0;padding:8px 12px;border-radius:9px;background:var(--soft);border:1px dashed var(--line);font-size:12px;color:var(--ink-3)} .jc-addrow.show{display:flex;align-items:center;gap:8px} .jc-addrow button{cursor:pointer;border:1px solid var(--brand-soft);border-radius:7px;padding:5px 12px;font:inherit;font-size:12px;font-weight:700;color:var(--brand-deep);background:var(--brand-wash)} .jc-addrow button:hover{background:var(--brand-soft)} .jc-addrow em{font-style:normal;font-size:11.5px;color:var(--ink-4)} .flow{margin-top:16px;padding:9px 12px;border-radius:8px;background:var(--soft);border:1px dashed var(--line);font-size:12px;color:var(--ink-3)} .flow b{color:var(--ink)} .card-foot{padding:13px 22px;border-top:1px solid var(--line-soft);font-size:11.5px;color:var(--ink-4);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px} @media(max-width:600px){.card-head{flex-wrap:wrap}.side{align-items:flex-start}} /* 补充:数据工单专用标识(仅追加,不改动基件样式) */ .mono{font-family:var(--mono);font-size:12px;color:var(--ink-2)} .pre{font-style:normal;font-size:10.5px;font-weight:800;color:var(--data);background:var(--data-soft);border:1px solid var(--data-line);border-radius:999px;padding:0 7px;margin-left:6px;white-space:nowrap} table.on td>.pre{display:none} .ct{display:inline-block;font-size:11px;font-weight:700;padding:1px 8px;border-radius:999px;border:1px solid transparent;white-space:nowrap} .ct.hard{color:var(--danger);background:var(--danger-soft);border-color:#f3b9b5} .ct.soft{color:var(--ink-3);background:#eef1f6;border-color:var(--line)} .tbl-gap{margin-top:18px} /* ===== 视觉补充段 v3(通用批量模板:字段即表头、每行一条;不改基件样式与 JS 钩子) ===== */ .hic{flex:none;width:26px;height:26px;color:var(--data)} .zic{width:14px;height:14px;color:var(--ink-3);vertical-align:-2px;margin-right:3px} /* 表头内字段说明(第二行小字) */ .thd{display:block;font-size:10px;font-weight:600;color:var(--ink-4);letter-spacing:0;margin-top:1px;line-height:1.4} /* 表 1:字段即表头,内容多列,允许横向滚动 */ #tbl1{min-width:1240px} #tbl1 .jc-vcell{display:inline} /* 表 2 列宽 */ #tbl2 th:nth-child(2){width:150px} #tbl2 th:nth-child(3){width:18%} #tbl2 th:nth-child(4){width:14%} #tbl2 th:nth-child(5){width:8%;text-align:center;white-space:nowrap} #tbl2 th:nth-child(6){width:13%;text-align:center;white-space:nowrap} #tbl2 td:nth-child(5),#tbl2 td:nth-child(6){text-align:center;white-space:nowrap} /* 说明列(只读注释,编辑态保持可见) */ .desc{color:var(--ink-3);font-size:12px;line-height:1.5} table.on td>.jc-vcell.ro{display:block} .tbl-wrap{overflow-x:auto} @media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}} `; export const EXEC_CSS = ` :root{ --ink:#1f2329; --ink-2:#41464e; --ink-3:#646a73; --ink-4:#8f959e; --line:#dee0e3; --line-soft:#e8eaed; --soft:#f8f9fb; --brand:#3370ff; --brand-deep:#245bdb; --brand-soft:#e1eaff; --brand-wash:#f0f4ff; --human:#a9711e; --human-soft:#f6ecd8; --human-line:#e6d3a8; --ok:#278717; --ok-soft:#e8f8e4; --danger:#d83931; --danger-soft:#feeae9; --mono:"SF Mono",Menlo,Consolas,monospace; } *{box-sizing:border-box} html,body{margin:0;padding:0} body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;background:#eef1f6;color:var(--ink);font-size:14px;line-height:1.7;-webkit-font-smoothing:antialiased} .page{margin:0;padding:0} .card{background:#fff;overflow:hidden;border:0;border-radius:0;box-shadow:none} .card-head{display:flex;align-items:center;gap:14px;padding:18px 22px;border-bottom:2px solid var(--ink);background:linear-gradient(120deg,#fffaf1 0%,#fff 55%,#fbf6ea 100%)} .badge{flex:none;width:44px;height:44px;border-radius:10px;display:grid;place-items:center;background:var(--human);color:#fff;font-weight:800;font-size:13px;box-shadow:0 6px 16px rgba(169,113,30,.25)} .tit{flex:1;min-width:0} .tit .kick{font-size:11px;letter-spacing:.08em;color:var(--ink-4);font-weight:700} .tit h1{margin:2px 0 0;font-size:19px;font-weight:800;line-height:1.3} .tit .sub{font-size:12px;color:var(--ink-3);margin-top:3px} .side{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex:none} .tag{font-size:11px;font-weight:800;padding:2px 10px;border-radius:999px;color:var(--human);background:var(--human-soft);border:1px solid var(--human-line)} .step{font-size:12px;color:var(--ink-3)} .deadline{font-size:12px;color:var(--ink-3)} .deadline b{color:var(--danger)} .card-bd{padding:20px 22px} .zone{font-size:11px;font-weight:800;letter-spacing:.12em;color:var(--ink-4);margin:0 0 8px} .zone b{color:var(--ink-3)} .note{border:1px solid var(--line);border-left:3px solid var(--human);border-radius:8px;background:var(--soft);padding:14px 16px;margin-bottom:16px} .note p{margin:0;font-size:13px;color:var(--ink-2)} .note b{color:var(--ink)} .note .done{color:var(--ok);font-weight:700} .note .need{color:var(--human);font-weight:700} .jc-editgate{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:14px 0 10px;padding:9px 12px;border-radius:9px;background:var(--soft);border:1px solid var(--line-soft);font-size:12px;color:var(--ink-3)} .jc-editgate-t{flex:1 1 auto;min-width:0} .jc-editgate-t b{color:var(--ink-2);font-weight:700} .jc-egbtn{flex:none;display:inline-flex;align-items:center;gap:5px;cursor:pointer;border:1px solid var(--line);border-radius:7px;padding:6px 13px;font:inherit;font-size:12px;font-weight:700;color:var(--ink-2);background:#fff;transition:border-color .16s,color .16s,background .16s} .jc-egbtn:hover{border-color:var(--brand);color:var(--brand)} .jc-egbtn.save{color:#fff;background:var(--human);border-color:var(--human)} .jc-egbtn.save:hover{filter:brightness(1.06);color:#fff} .jc-editgate .eg-cancel,.jc-editgate .eg-save{display:none} .jc-editgate.on{background:var(--human-soft);border-color:var(--human-line);color:#7c4a12} .jc-editgate.on .eg-open{display:none} .jc-editgate.on .eg-cancel,.jc-editgate.on .eg-save{display:inline-flex} .tbl-wrap{border:1px solid var(--line-soft);border-radius:10px;overflow:hidden} table{width:100%;border-collapse:collapse;font-size:12.5px} th{text-align:left;background:var(--soft);font-size:11px;letter-spacing:.03em;font-weight:800;color:var(--ink-3);padding:9px 10px;border-bottom:1px solid var(--line)} th.req::after{content:" *";color:var(--danger);font-size:11px} td{padding:8px 10px;border-bottom:1px solid var(--line-soft);vertical-align:middle} tr:last-child td{border-bottom:0} td.rn{position:relative;width:38px;white-space:nowrap;font-family:var(--mono);font-size:11px;color:var(--ink-4);text-align:center} .jc-vcell{display:block;font-size:12.5px;color:var(--ink);line-height:1.5;overflow-wrap:anywhere} .jc-vcell.mono{font-family:var(--mono);font-size:11.5px;color:var(--ink-2)} .jc-cell{display:none;width:100%;min-width:60px;border:1px solid var(--line);border-radius:6px;padding:6px 8px;font:inherit;font-size:12.5px;color:var(--ink);background:#fff} .jc-cell.mono{font-family:var(--mono);font-size:11.5px} .jc-cell:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-wash);outline:none} table.on td>.jc-vcell{display:none} table.on td>.jc-cell{display:block} td.rn .jc-rowdel{display:none;width:22px;height:22px;margin:0 auto;cursor:pointer;border:1px solid var(--line);border-radius:6px;padding:0;font:inherit;font-size:14px;line-height:1;color:var(--ink-3);background:#fff} td.rn .jc-rowdel:hover{border-color:var(--danger);color:var(--danger);background:var(--danger-soft)} table.on td.rn .jc-rn-num{display:none} table.on td.rn .jc-rowdel{display:block} .jc-addrow{display:none;margin:8px 0 0;padding:8px 12px;border-radius:9px;background:var(--soft);border:1px dashed var(--line);font-size:12px;color:var(--ink-3)} .jc-addrow.show{display:flex;align-items:center;gap:8px} .jc-addrow button{cursor:pointer;border:1px solid var(--brand-soft);border-radius:7px;padding:5px 12px;font:inherit;font-size:12px;font-weight:700;color:var(--brand-deep);background:var(--brand-wash)} .jc-addrow button:hover{background:var(--brand-soft)} .jc-addrow em{font-style:normal;font-size:11.5px;color:var(--ink-4)} .flow{margin-top:16px;padding:9px 12px;border-radius:8px;background:var(--soft);border:1px dashed var(--line);font-size:12px;color:var(--ink-3)} .flow b{color:var(--ink)} .card-foot{padding:13px 22px;border-top:1px solid var(--line-soft);font-size:11.5px;color:var(--ink-4);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px} @media(max-width:600px){.card-head{flex-wrap:wrap}.side{align-items:flex-start}} /* 补充:评估输入清单状态标识(仅追加,不改动基件样式) */ .mono{font-family:var(--mono);font-size:12px;color:var(--ink-2)} .st{display:inline-block;font-size:11px;font-weight:700;padding:1px 8px;border-radius:999px;border:1px solid transparent;white-space:nowrap} .st.bound{color:var(--ink-3);background:#eef1f6;border-color:var(--line)} .st.ok{color:var(--ok);background:var(--ok-soft);border-color:#c9ecc2} .st.miss{color:var(--human);background:var(--human-soft);border-color:var(--human-line)} .st.def{color:var(--brand-deep);background:var(--brand-wash);border-color:var(--brand-soft)} tr.ro td{background:var(--soft)} table.on td>.jc-vcell.ro{display:block} `; /* * 两张验收件(ACC1 差异评估结论审核 / ACC2 评审放行与落账确认)的主题色**不再逐字节等于目标件**: * 目标件的题头用 #b23a2e 红(--ledger),2026-08-27 用户定「中央 HTML 模版区域如果是验收工单, * 标题部分的红色改为和验收卡一样的绿色」—— 与对话区验收卡同一枚 #0aa294(app.css --st-collab)。 * 只换主题变量与题头渐变 / 徽章投影;ACC2 的 CONDITIONAL 状态徽标是语义色,保留原红。 * ACC1 于 2026-08-27 下午随目标件改版整段重搬(「一个候选一张表」:.cand* / .rec* / .stat*,CONDITIONAL 改蓝), * 主题色仍取卡的那一枚绿。 */ export const ACC1_CSS = ` :root{ --ink:#1f2329; --ink-2:#41464e; --ink-3:#646a73; --ink-4:#8f959e; --line:#dee0e3; --line-soft:#e8eaed; --soft:#f8f9fb; --brand:#3370ff; --brand-deep:#245bdb; --brand-soft:#e1eaff; --brand-wash:#f0f4ff; --ledger:#0aa294; --ledger-soft:#e4f8f5; --ledger-line:#b5e6df; /* 验收绿(2026-08-27 用户定:与对话区验收卡同色;目标件 2026-08-27 改版写的是 #16a34a,这里取卡的那一枚) */ --ok:#278717; --ok-soft:#e8f8e4; --danger:#d83931; --danger-soft:#feeae9; --amber:#8f6a12; --amber-soft:#fdf3d7; --amber-line:#ecd9a0; --mono:"SF Mono",Menlo,Consolas,monospace; } *{box-sizing:border-box} html,body{margin:0;padding:0} body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;background:#eef1f6;color:var(--ink);font-size:14px;line-height:1.7;-webkit-font-smoothing:antialiased} .page{margin:0;padding:0} .card{background:#fff;overflow:hidden;border:0;border-radius:0;box-shadow:none} .card-head{display:flex;align-items:center;gap:14px;padding:18px 22px;border-bottom:2px solid var(--ink);background:linear-gradient(120deg,#eefaf8 0%,#fff 55%,#ecf8f5 100%)} .badge{flex:none;width:44px;height:44px;border-radius:10px;display:grid;place-items:center;background:var(--ledger);color:#fff;font-weight:800;font-size:13px;box-shadow:0 6px 16px rgba(10,162,148,.25)} .tit{flex:1;min-width:0} .tit .kick{font-size:11px;letter-spacing:.08em;color:var(--ink-4);font-weight:700} .tit h1{margin:2px 0 0;font-size:19px;font-weight:800;line-height:1.3} .tit .sub{font-size:12px;color:var(--ink-3);margin-top:3px} .side{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex:none} .tag{font-size:11px;font-weight:800;padding:2px 10px;border-radius:999px;color:var(--ledger);background:var(--ledger-soft);border:1px solid var(--ledger-line)} .step{font-size:12px;color:var(--ink-3)} .deadline{font-size:12px;color:var(--ink-3)} .deadline b{color:var(--danger)} .card-bd{padding:20px 22px} .zone{font-size:11px;font-weight:800;letter-spacing:.12em;color:var(--ink-4);margin:0 0 8px} .zone b{color:var(--ink-3)} .note{border:1px solid var(--line);border-left:3px solid var(--ledger);border-radius:8px;background:var(--soft);padding:14px 16px;margin-bottom:16px} .note p{margin:0;font-size:13px;color:var(--ink-2)} .note b{color:var(--ink)} .criteria{border:1px solid var(--ledger-line);border-radius:10px;background:var(--ledger-soft);padding:13px 16px;margin-bottom:18px} .criteria .c-title{font-size:11px;font-weight:800;letter-spacing:.08em;color:var(--ledger);margin-bottom:7px} .criteria ul{margin:0;padding-left:18px;font-size:12.5px;color:var(--ink-2)} .criteria li{margin:4px 0} .criteria b{color:var(--ink)} .tbl-wrap{border:1px solid var(--line-soft);border-radius:10px;overflow:hidden} table{width:100%;border-collapse:collapse;font-size:13px} th{text-align:left;background:var(--soft);font-size:11px;letter-spacing:.05em;font-weight:800;color:var(--ink-3);padding:9px 12px;border-bottom:1px solid var(--line)} td{padding:11px 12px;border-bottom:1px solid var(--line-soft);vertical-align:top} tr:last-child td{border-bottom:0} .cand .tbl-wrap{border:0;border-radius:0} .num{font-family:var(--mono);color:var(--ink-4);white-space:nowrap} .cust{font-weight:700} .reason{font-size:12.5px;color:var(--ink-2)} .flow{margin-top:16px;padding:9px 12px;border-radius:8px;background:var(--soft);border:1px dashed var(--line);font-size:12px;color:var(--ink-3)} .flow b{color:var(--ink)} .card-foot{padding:13px 22px;border-top:1px solid var(--line-soft);font-size:11.5px;color:var(--ink-4);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px} @media(max-width:600px){.card-head{flex-wrap:wrap}.side{align-items:flex-start}} /* 四态结论 pill 与风险等级 */ .st{display:inline-block;padding:1px 9px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.04em;font-family:var(--mono);white-space:nowrap;border:1px solid transparent} .st.ok{color:var(--ok);background:var(--ok-soft);border-color:#bfe6b4} .st.miss{color:var(--danger);background:#feeae9;border-color:#f3b9b5} .st.unknown{color:var(--amber);background:var(--amber-soft);border-color:var(--amber-line)} .st.cond{color:var(--brand-deep);background:var(--brand-wash);border-color:var(--brand-soft)} .risk{font-weight:800;font-size:12.5px} .risk.low{color:var(--ok)} .risk.mid{color:var(--amber)} .risk.hi{color:var(--danger)} .mono{font-family:var(--mono);font-size:12px;color:var(--ink-2)} /* 推荐程度 pill */ .rec{display:inline-block;padding:2px 11px;border-radius:999px;font-size:11.5px;font-weight:800;white-space:nowrap;border:1px solid transparent} .rec.yes{color:var(--ok);background:var(--ok-soft);border-color:#bfe6b4} .rec.cond{color:var(--amber);background:var(--amber-soft);border-color:var(--amber-line)} .rec.no{color:var(--danger);background:#feeae9;border-color:#f3b9b5} /* 差异统计(结论表内) */ .stat{font-family:var(--mono);font-size:11.5px;color:var(--ink-3);white-space:nowrap} .stat b{font-weight:800} .stat .m{color:var(--ok)} .stat .x{color:var(--danger)} .stat .u{color:var(--amber)} .stat .c{color:var(--brand-deep)} /* 候选 PN 明细块:一个候选一张表 */ .cand{border:1px solid var(--line-soft);border-radius:10px;overflow:hidden;margin-bottom:16px} .cand:last-of-type{margin-bottom:0} .cand-head{display:flex;align-items:center;gap:10px;padding:11px 14px;background:linear-gradient(120deg,#f6f8fc 0%,#fff 70%);border-bottom:1px solid var(--line);flex-wrap:wrap} .cand-idx{flex:none;width:22px;height:22px;border-radius:6px;display:grid;place-items:center;background:var(--ink);color:#fff;font-size:11px;font-weight:800;font-family:var(--mono)} .cand-name{font-weight:800;font-size:14px} .cand-brand{color:var(--ink-3);font-size:12px} .cand-vs{font-family:var(--mono);font-size:11.5px;color:var(--ink-4)} .cand-con{margin-left:auto;display:flex;align-items:center;gap:8px} `; export const ACC2_CSS = ` :root{ --ink:#1f2329; --ink-2:#41464e; --ink-3:#646a73; --ink-4:#8f959e; --line:#dee0e3; --line-soft:#e8eaed; --soft:#f8f9fb; --brand:#3370ff; --brand-deep:#245bdb; --brand-soft:#e1eaff; --brand-wash:#f0f4ff; --ledger:#0aa294; --ledger-soft:#e4f8f5; --ledger-line:#b5e6df; /* 验收绿(2026-08-27 用户定:与对话区验收卡同色,原目标件是 #b23a2e 红) */ --ok:#278717; --ok-soft:#e8f8e4; --danger:#d83931; --danger-soft:#feeae9; --mono:"SF Mono",Menlo,Consolas,monospace; } *{box-sizing:border-box} html,body{margin:0;padding:0} body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;background:#eef1f6;color:var(--ink);font-size:14px;line-height:1.7;-webkit-font-smoothing:antialiased} .page{margin:0;padding:0} .card{background:#fff;overflow:hidden;border:0;border-radius:0;box-shadow:none} .card-head{display:flex;align-items:center;gap:14px;padding:18px 22px;border-bottom:2px solid var(--ink);background:linear-gradient(120deg,#eefaf8 0%,#fff 55%,#ecf8f5 100%)} .badge{flex:none;width:44px;height:44px;border-radius:10px;display:grid;place-items:center;background:var(--ledger);color:#fff;font-weight:800;font-size:13px;box-shadow:0 6px 16px rgba(10,162,148,.25)} .tit{flex:1;min-width:0} .tit .kick{font-size:11px;letter-spacing:.08em;color:var(--ink-4);font-weight:700} .tit h1{margin:2px 0 0;font-size:19px;font-weight:800;line-height:1.3} .tit .sub{font-size:12px;color:var(--ink-3);margin-top:3px} .side{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex:none} .tag{font-size:11px;font-weight:800;padding:2px 10px;border-radius:999px;color:var(--ledger);background:var(--ledger-soft);border:1px solid var(--ledger-line)} .step{font-size:12px;color:var(--ink-3)} .deadline{font-size:12px;color:var(--ink-3)} .deadline b{color:var(--danger)} .card-bd{padding:20px 22px} .zone{font-size:11px;font-weight:800;letter-spacing:.12em;color:var(--ink-4);margin:0 0 8px} .zone b{color:var(--ink-3)} .note{border:1px solid var(--line);border-left:3px solid var(--ledger);border-radius:8px;background:var(--soft);padding:14px 16px;margin-bottom:16px} .note p{margin:0;font-size:13px;color:var(--ink-2)} .note b{color:var(--ink)} .criteria{border:1px solid var(--ledger-line);border-radius:10px;background:var(--ledger-soft);padding:13px 16px;margin-bottom:18px} .criteria .c-title{font-size:11px;font-weight:800;letter-spacing:.08em;color:var(--ledger);margin-bottom:7px} .criteria ul{margin:0;padding-left:18px;font-size:12.5px;color:var(--ink-2)} .criteria li{margin:4px 0} .criteria b{color:var(--ink)} .tbl-wrap{border:1px solid var(--line-soft);border-radius:10px;overflow:hidden} table{width:100%;border-collapse:collapse;font-size:13px} th{text-align:left;background:var(--soft);font-size:11px;letter-spacing:.05em;font-weight:800;color:var(--ink-3);padding:9px 12px;border-bottom:1px solid var(--line)} td{padding:11px 12px;border-bottom:1px solid var(--line-soft);vertical-align:top} tr:last-child td{border-bottom:0} .num{font-family:var(--mono);color:var(--ink-4);white-space:nowrap} .cust{font-weight:700} .prio{font-family:var(--mono);font-weight:800} .prio.hi{color:var(--danger)} .prio.mid{color:var(--ink-2)} .reason{font-size:12.5px;color:var(--ink-2)} .flow{margin-top:16px;padding:9px 12px;border-radius:8px;background:var(--soft);border:1px dashed var(--line);font-size:12px;color:var(--ink-3)} .flow b{color:var(--ink)} .card-foot{padding:13px 22px;border-top:1px solid var(--line-soft);font-size:11.5px;color:var(--ink-4);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px} @media(max-width:600px){.card-head{flex-wrap:wrap}.side{align-items:flex-start}} /* 补充:推荐等级 pill 与状态强调(仅追加,不改动基件样式) */ .st{display:inline-block;padding:1px 9px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.04em;font-family:var(--mono);white-space:nowrap;border:1px solid transparent} .st.ok{color:var(--ok);background:var(--ok-soft);border-color:#bfe6b4} .st.miss{color:var(--danger);background:var(--danger-soft);border-color:#f3b9b5} .st.unknown{color:#8f6a12;background:#fdf3d7;border-color:#ecd9a0} .st.cond{color:#b23a2e;background:#f7e4e0;border-color:#ecc5bd} .risk{font-weight:800;font-size:12.5px} .risk.mid{color:#8f6a12} .mono{font-family:var(--mono);font-size:12px;color:var(--ink-2)} .tbl-gap{margin-top:18px} `;