Coral Callout Field

先选择准确的数据表达，再把说明组织成一组环绕主绘图区的编辑式 callout。虚线是稳定构图关系，不编码具体扇区、节点或数据坐标；数据映射由主图和直接标签负责。

Signature invariants

• 覆盖式珊瑚标题带、斜纹纸框和单一海军蓝数据场共同构成海报舞台。
• 一个居中的白色焦点标记承载主标签，外围 callout 围绕其四个象限，通过青色虚线连接到绘图区的固定边缘锚点。
• Abril Fatface 大值与 Roboto Condensed 说明形成角色反差；珊瑚负责数值信号，青色负责图标和连接。
• 精确比例、字体、颜色和容量以 design-model.yaml 为准。

Composition grammar

Connected share field — default

• 适合构成、份额、预算分配、占比和有限类别比较。
• 主视觉固定在舞台中央，callout 占据四个象限形成清楚的环绕秩序，而不是排成普通图例或左右清单。
• 仅当整体关系真实存在时使用饼、环或极坐标形式。最大类别使用白色主标记与内嵌标签，其余类别按浅灰到蓝灰排列。
• callout 线从文字组边缘出发，终止于绘图区边界或边界内侧的固定锚点；不追踪扇区、标记或数据坐标，也不使用箭头和端点圆点暗示精确指向。
• 饼/环图由图表库绘制扇区，HTML 放置 callout，覆盖整个数据场的 SVG 按当前布局使用固定连线路径。主图位于中央，外部标签用珊瑚大值、紧凑说明和青色虚线形成四象限环绕；禁止默认图例、默认引导线和没有环绕关系的孤立居中饼图。
• callout 的数值与说明必须来自真实数据，但连线只表达“该说明属于主图”，不表达“该说明对应线端附近的扇区”。需要精确类别映射时在主图内直接标注。

Connected focal field

• 适合关系网络、流程、阶段、地图、空间或其他存在中心对象与外围解释的数据。
• 白色用于一个焦点节点、路径、区域或阶段；灰阶表现上下文。外围 callout 通过固定青色虚线与主绘图区形成整体。
• 若不存在清楚的焦点对象，不强行使用本 Skill；改用更符合数据结构的视觉语言。

Expression and capacity

• 用户明确指定图表类型时保留该类型；未指定时再选择能够形成焦点对象和环绕 callout 构图的表达。
• 构成数据使用白色突出主份额，#CFD1DB、#9FA3B7、#6E7593、#3E476E 表现其余层级。准确数值必须写在主标签或 callout 中。
• 单系列比较使用白色主标记与灰阶上下文，珊瑚色只用于数值文字，青色只用于图标、连线或一个明确的选择状态。
• 高类别密度时减少 callout，只有业务允许时才聚合尾部，不缩小圆章和文字硬塞。
• 字体、字号、构图比例和容量只读取 design-model.yaml；图表族细节读取 references/visual-grammar.md。

Responsive transformation

• landscape：标题带覆盖横向数据场，主视觉居中，callout 分布在四个象限。
• square / portrait：主视觉居中，callout 移到两侧和下方并使用短连接。
• wide_short：使用浅标题带、横向主视觉场和两侧 callout。
• 中央主图必须根据焦点容器的宽高共同计算尺寸并占据其主导区域；不得使用只适用于 900×600 的固定像素半径或最大宽度。
• 圆章保持圆形，焦点标记不拉伸；每个保留的 callout 都连接到当前版式预设的绘图区锚点，具体容量和降级顺序读取 design-model.yaml。

Build sequence

1. 确认主标记、次级数据项、单位以及每条 callout 的真实数值和说明。
2. 建立标题带、斜纹纸框和单一海军蓝数据场，再将主视觉放在数据场中央。
3. 放置主标记内嵌标签与 3–5 个环绕 callout；标准横屏优先使用四象限位置，最后按当前版式绘制固定青色虚线路径。
4. 先检查标准横屏中的标题覆盖、纸框、圆章、连线避让和长标签，再按 references/platform-mapping.md 验证四类宽高比；连线不得穿过文字或造成精确数据指向的错觉。

完成前反向检查：如果饼/环图仍是“居中图形 + 默认图例/随意外部文字”，没有形成稳定的四象限环绕关系，或连线没有把 callout 与绘图区组织成一个整体，必须重做而不是只换颜色。

实现前读取 design-model.yaml、references/tokens.md、references/visual-grammar.md 和 references/platform-mapping.md。