/*
 * 模块价值：标准230×136业务轮廓在五档工作画布尺寸中保持同一安全文字区与交互状态。
 * 依赖：tokens/pages/canvas-voice后加载；输入views共享shape HTML，输出继承深浅主题的局部呈现。
 * 输入stage的--canvas-node-scale；占用、端点和框选由同一尺寸模块接线，不在CSS猜业务坐标。
 * 副作用仅视觉；不改人工位置或保存。用途/标题/业务摘要/状态分层，完整原文在aria/title和详情保留。
 */
.canvas-page .canvas-node[data-business-shape]{--node-unit:calc(1px * var(--canvas-node-scale,1));width:calc(230 * var(--node-unit));height:calc(136 * var(--node-unit));min-height:calc(136 * var(--node-unit));padding:0;border:0;border-radius:0;background:transparent;display:block;overflow:visible;outline:0;box-shadow:none;color:var(--ink)}
.business-shape-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.business-shape-outline{fill:var(--surface,#fff);stroke:var(--control-line,#9aada4);vector-effect:non-scaling-stroke}
.business-shape-detail{fill:none;stroke:var(--line,#ced9d3);stroke-width:1;vector-effect:non-scaling-stroke}
/* 纸盒的顶面折线与封口线是识别结构，单独强化线色/线宽；不新增穿过居中文字的竖线。 */
.canvas-node[data-business-shape="product"] .business-shape-detail{stroke:color-mix(in srgb,var(--ink) 48%,var(--control-line));stroke-width:1.5}
.canvas-node[data-business-shape="product"].is-selected .business-shape-detail{stroke:var(--accent)}
.business-shape-glyph{fill:none;stroke:var(--accent,#28684e);stroke-width:1.7}
.canvas-node[data-business-shape] .canvas-node-top{position:absolute;left:calc(45 * var(--node-unit));right:calc(22 * var(--node-unit));top:calc(13 * var(--node-unit));width:auto;height:calc(18 * var(--node-unit));gap:calc(5 * var(--node-unit));font-size:calc(10 * var(--node-unit));line-height:calc(18 * var(--node-unit));overflow:hidden;white-space:nowrap}
.canvas-node[data-business-shape] .canvas-node-title{position:absolute;left:calc(var(--shape-text-left) * var(--canvas-node-scale,1));top:calc(var(--shape-text-top) * var(--canvas-node-scale,1));width:calc(var(--shape-text-width) * var(--canvas-node-scale,1));font-size:calc(var(--shape-title-size) * var(--canvas-node-scale,1));line-height:calc(20 * var(--node-unit));max-height:calc(40 * var(--node-unit));display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;overflow-wrap:anywhere;text-wrap:pretty}
.canvas-node[data-business-shape] .canvas-node-role{position:absolute;left:calc(var(--shape-text-left) * var(--canvas-node-scale,1));top:calc((var(--shape-text-top) + 44px) * var(--canvas-node-scale,1));width:calc(var(--shape-text-width) * var(--canvas-node-scale,1));line-height:calc(16 * var(--node-unit));font-size:calc(11 * var(--node-unit));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.canvas-node[data-business-shape] .node-status{position:absolute;left:calc(var(--shape-text-left) * var(--canvas-node-scale,1));top:calc(108 * var(--node-unit));width:calc(var(--shape-text-width) * var(--canvas-node-scale,1));font-size:calc(10 * var(--node-unit));line-height:calc(14 * var(--node-unit));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.canvas-node[data-business-shape] .node-identity{display:none}
/* 执行徽标随节点缩放而保留同一顶部留白，不挤进业务标题安全区。 */
.canvas-node[data-business-shape].has-execution-marker .canvas-node-top{right:calc(42 * var(--node-unit))}
.canvas-execution-marker{position:absolute;right:calc(9 * var(--node-unit));top:calc(8 * var(--node-unit));width:calc(24 * var(--node-unit));height:calc(24 * var(--node-unit));display:grid;place-items:center;border:1px solid var(--line,#ced9d3);border-radius:calc(6 * var(--node-unit));background:var(--surface,#fff);color:var(--accent,#28684e);pointer-events:none}
.canvas-execution-marker svg{width:calc(18 * var(--node-unit));height:calc(18 * var(--node-unit))}
.canvas-execution-marker svg,.canvas-relation-marker{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.canvas-relation-marker{color:var(--accent,#28684e);overflow:visible}
.canvas-node[data-business-shape].is-selected .business-shape-outline{stroke:var(--accent);stroke-width:2.4;fill:color-mix(in srgb,var(--soft) 38%,var(--surface))}
.canvas-node[data-business-shape]:focus-visible .business-shape-outline{stroke:var(--focus,var(--accent));stroke-width:3.5;stroke-dasharray:7 3}
.canvas-node[data-business-shape].is-voice-draft .business-shape-outline{fill:var(--soft);stroke:var(--accent);stroke-dasharray:6 4}
.canvas-node[data-business-shape].is-voice-modified .business-shape-outline{stroke:var(--accent);stroke-width:2.5;stroke-dasharray:6 3}
.canvas-node[data-business-shape] .node-voice-label{margin-left:auto;font-size:calc(9 * var(--node-unit));color:var(--accent)}
.canvas-node[data-business-shape] .node-workflow-boundary{font-size:calc(9 * var(--node-unit))}
.canvas-node[data-business-shape="decision"] .canvas-node-top,.canvas-node[data-business-shape="person"] .canvas-node-top{display:none}
.canvas-node[data-business-shape="decision"] .canvas-node-title{text-align:center;font-size:calc(14 * var(--node-unit))}
.canvas-node[data-business-shape="decision"] .node-status{left:calc(84 * var(--node-unit));top:calc(93 * var(--node-unit));width:calc(62 * var(--node-unit));text-align:center;font-size:calc(9 * var(--node-unit))}
.canvas-node[data-business-shape="decision"] .canvas-node-role,.canvas-node[data-business-shape="person"] .canvas-node-role{display:none}
.canvas-node[data-business-shape="person"] .canvas-node-title{text-align:center}
.canvas-node[data-business-shape="person"] .node-status{top:calc(110 * var(--node-unit));text-align:center}
.canvas-node:is([data-business-shape="factory"],[data-business-shape="warehouse"],[data-business-shape="product"],[data-business-shape="raw-material"],[data-business-shape="store"]) .canvas-node-top{top:calc(34 * var(--node-unit));left:calc(45 * var(--node-unit))}
.canvas-node[data-business-shape="factory"] .business-shape-glyph,.canvas-node[data-business-shape="warehouse"] .business-shape-glyph,.canvas-node[data-business-shape="product"] .business-shape-glyph,.canvas-node[data-business-shape="raw-material"] .business-shape-glyph,.canvas-node[data-business-shape="store"] .business-shape-glyph{transform:translate(22px,34px) scale(.72)}
.canvas-node[data-business-shape="factory"] .canvas-node-role,.canvas-node[data-business-shape="warehouse"] .canvas-node-role,.canvas-node[data-business-shape="product"] .canvas-node-role,.canvas-node[data-business-shape="raw-material"] .canvas-node-role,.canvas-node[data-business-shape="store"] .canvas-node-role{display:none}
@media(prefers-reduced-motion:reduce){.canvas-node[data-business-shape] *{transition:none}}

/* 1.5.5：图形表达语义，低强调工作面承载真实业务内容；同族样式同时用于待配置与正式节点。
 * 保持230×136及原文字安全区。家族仅作辅助，图标、用途文字和轮廓共同传意，不靠颜色编码。 */
.canvas-page .canvas-node[data-business-shape]{font-family:inherit;text-align:left;font-variant-numeric:tabular-nums}
.business-shape-outline{fill:var(--surface);stroke:color-mix(in srgb,var(--control-line) 76%,var(--surface))}
.business-shape-detail{stroke:var(--line);opacity:.85}
.business-shape-glyph{stroke:var(--accent);stroke-width:1.8}
.canvas-node[data-business-shape]:hover .business-shape-outline{stroke:var(--accent);fill:color-mix(in srgb,var(--paper) 65%,var(--surface))}
.canvas-node[data-business-shape] .canvas-node-top{font-weight:550;color:var(--muted);letter-spacing:.015em}
.canvas-node[data-business-shape] .canvas-node-title{font-weight:620;letter-spacing:-.018em;-webkit-line-clamp:var(--shape-title-lines,2)}
.canvas-node[data-business-shape] .canvas-node-summary{position:absolute;left:calc(var(--shape-text-left) * var(--canvas-node-scale,1));top:calc((var(--shape-text-top) + 44px) * var(--canvas-node-scale,1));width:calc(var(--shape-text-width) * var(--canvas-node-scale,1));font-size:calc(11 * var(--node-unit));line-height:calc(16 * var(--node-unit));color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.canvas-node[data-business-shape] .node-status{font-weight:500;color:var(--muted)}
.canvas-node[data-business-shape] .node-status.status-blocked{color:var(--danger)}
.canvas-node[data-business-shape] .node-status.status-draft,.canvas-node[data-business-shape] .node-status.status-unknown{color:var(--warning)}
.canvas-node[data-business-shape="person"] .canvas-node-summary{text-align:center}
/* 高轮廓的标题区位于图形下半部；有摘要时收为一行，不让新内容挤入状态行。 */
.canvas-node:is([data-business-shape="factory"],[data-business-shape="warehouse"],[data-business-shape="product"],[data-business-shape="raw-material"],[data-business-shape="store"]).has-business-summary .canvas-node-title{-webkit-line-clamp:1;max-height:calc(20 * var(--node-unit))}
.canvas-node:is([data-business-shape="factory"],[data-business-shape="warehouse"],[data-business-shape="product"],[data-business-shape="raw-material"],[data-business-shape="store"]) .canvas-node-summary{top:calc(84 * var(--node-unit))}
.canvas-node[data-business-shape="decision"] .canvas-node-summary{left:calc(66 * var(--node-unit));top:calc(81 * var(--node-unit));width:calc(98 * var(--node-unit));text-align:center;font-size:calc(10.5 * var(--node-unit))}
.canvas-node[data-business-shape="person"].has-business-summary .canvas-node-title{-webkit-line-clamp:1;max-height:calc(20 * var(--node-unit))}
.canvas-node[data-business-shape="person"] .canvas-node-summary{top:calc(88 * var(--node-unit))}
/* 待配置使用相同真实轮廓和命中盒，虚线与文案保留未采用边界。 */
.canvas-page .canvas-catalog-draft[data-business-shape]{padding:0;border:0;border-radius:0;background:transparent;gap:0;display:block;min-height:calc(136 * var(--node-unit))}
.canvas-catalog-draft[data-business-shape] .business-shape-outline{stroke-dasharray:5 4}
.canvas-catalog-draft[data-business-shape].is-selected{outline:none}
.canvas-catalog-draft[data-business-shape] .node-status{color:var(--warning)}

/* 条件含摘要时单行标题与状态分开，最小档也不发生文字区交叠。 */
.canvas-node[data-business-shape="decision"].has-business-summary .canvas-node-title{-webkit-line-clamp:1;max-height:calc(20 * var(--node-unit))}
.canvas-node[data-business-shape="decision"].has-business-summary .node-status{top:calc(104 * var(--node-unit))}

/* 产品/物料的用途行避开顶部折线，标题与状态居中且留在下部斜边内。
 * 两行标题66..102，摘要86..102，状态108..120；随五档尺寸统一缩放，不改外形/端点/坐标。 */
.canvas-node-kind-icon { flex:none; width:calc(14 * var(--node-unit)); height:calc(14 * var(--node-unit)); fill:none; stroke:var(--accent); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.canvas-node:is([data-business-shape="product"],[data-business-shape="raw-material"]) .business-shape-glyph { display:none; }
.canvas-node:is([data-business-shape="product"],[data-business-shape="raw-material"]) .canvas-node-top { left:calc(24 * var(--node-unit)); right:auto; top:calc(49 * var(--node-unit)); width:calc(182 * var(--node-unit)); height:calc(14 * var(--node-unit)); line-height:calc(14 * var(--node-unit)); justify-content:center; text-align:center; }
.canvas-node:is([data-business-shape="product"],[data-business-shape="raw-material"]) .canvas-node-title { top:calc(66 * var(--node-unit)); text-align:center; line-height:calc(18 * var(--node-unit)); max-height:calc(36 * var(--node-unit)); }
.canvas-node:is([data-business-shape="product"],[data-business-shape="raw-material"]).has-business-summary .canvas-node-title { max-height:calc(18 * var(--node-unit)); }
.canvas-node:is([data-business-shape="product"],[data-business-shape="raw-material"]) .canvas-node-summary { top:calc(86 * var(--node-unit)); text-align:center; }
.canvas-node:is([data-business-shape="product"],[data-business-shape="raw-material"]) .node-status { left:calc(60 * var(--node-unit)); top:calc(108 * var(--node-unit)); width:calc(110 * var(--node-unit)); line-height:calc(12 * var(--node-unit)); text-align:center; }
.canvas-node:is([data-business-shape="product"],[data-business-shape="raw-material"]) .node-voice-label { margin-left:0; }