用途：这是 /cmo 流程中的视觉确认环节，/visual-style 负责写入品牌识别，本技能负责把它渲染出来给用户看。它读取 brand/creative-kit.md 中的 Colors、Typography、Visual Brand Style，以及 brand/voice-profile.md、brand/positioning.md、brand/audience.md，生成一个自包含的 HTML 文件（内联 CSS 与 JS，唯一外部依赖是 Google Fonts），写到项目根目录 brand-playground.html，并用 open brand-playground.html 在浏览器打开。
主要能力：页面分三个标签页——Brand System（色板、对比度、字体样张、Logo 组合、语气快照）、Social Card（实时社交卡片，可选居中/分栏/叠加/极简布局与渐变/纯色/深色/浅色背景，并展示 Twitter 1200x675、LinkedIn 1200x627、Instagram 1080x1080、Story 1080x1920 多尺寸预览）、OG Image（标题、描述、作者、分类标签，editorial/minimal/bold 布局，1200x630）。左侧可折叠控制面板实时更新预览，底部输出结构化 JSON 令牌并提供 Copy Tokens 按钮，还内置 WCAG 对比度治理检查。
使用方式：用户把复制的 JSON 粘贴回对话，智能体解析后与 creative-kit.md 做差异对比，确认后写回相应章节，并在 brand/assets.md 记录一次更新。
限制：品牌文件缺失时使用占位默认值（L0 仍可用）；字体不在 Google Fonts 时回退到系统字体；Logo 路径无法解析时显示占位文本；HTML 为生成产物，按惯例加入 gitignore，可随时重新运行生成。具体收费、价格与平台支持情况暂未提供。