research-html-reportlisted

# 单页研究报告 HTML（编辑研究风） 把一次研究/调研的结果，变成一份**读者 10 分钟内能读完、且读得下去**的单页 HTML： 浅纸底、国际蓝、Mono 编号、细边框卡片、Chart.js 图表；零构建依赖，一个 `.html` 文件直接分享。 ## 核心原则 1. **结论先行**：每一屏回答一个问题，标题就是结论，正文是证据。不允许"背景-过程-结论"式汇报顺序。 2. **事实与推测分离**：年报/官网/公告 = 事实，可直接写；市占率/口碑/预测 = 口径，必须标注来源或"公司口径/推测"。页脚固定有来源与免责区。 3. **数字优先**：能用 KPI 卡和图表说的，不用段落。每张图只表达一个观点，图题就是结论句。 4. **信息密度高但克制**：细边框、无阴影堆砌、无 emoji、无渐变装饰；深色卡（`.dark`/`.insight-box`/`.script-box`）全篇不超过 3 处，只用于"必须让读者停下来读"的结论。 5. **研究材料可以有犀利判断**（如"决策者此刻在焦虑什么"），但措辞对事不对人。 ## 工作流 1. 明确受众与用途（自己看 / 老板看 / 会前准备），确定全篇唯一的核心问题。 2. 收集事实并标注来源；信息不足时先检索，不得编造数字。区分：已核实事实 / 对方宣传口径 / 分析推测。 3. `cp assets/template.html "<输出目录>/<主题>-<报告类型>-<YYYYMMDD>.html"`，在模板上改，不要从零写 CSS。 4. 按下方"标准结构"取舍章节（不是每份报告都要全部组件，删掉用不上的 section）。 5. 填完自查（见文末清单），然后 `open` 文件确认渲染（macOS；其他系统提示用户打开），再向用户汇报。 ## 标准结构（按需取舍） 1. **Hero**：kicker（英文小标签）+ 大标题（可两行，第二行 `<em>`）+ 副标题（一句话定位，加粗关键词）+ meta 行（成立/总部/关键人物/来源等 4-7 项） 2. **一句话定位 + KPI 数字带**：1 段定位文字 + 4-6 个 `.kpi-cell`；数字下滑/亏损用 `.neg` 3. **洞察框（insight-box）**：紧接 KPI，回答"所以呢"——这是全篇第一个深色停顿点 4. **业务/现状拆解**：`.grid-3` 卡片（板块）+ `.biz-table`（产品/业务表）+ 图表 + 深色案例卡 5. **痛点/问题**：`.pain-grid` 五连格，每格"标题判断 + 证据"，关键数字用 `.hl` 标红 6. **机会/方案/发现**：分组卡片（如 A/B/C 三类），重点卡加 `.reco` + 角标；可配气泡优先级矩阵图 7. **路径/节奏**：`.cut-timeline` 三刀式（近期快赢 → 中期 → 长期），每步写目标、动作、为什么这个顺序 8. **证据弹药**：`.case-table`（同行案例要有硬数据列）+ `.policy-card`（政策/预算，通用场景可换成"标准/规范/对标"） 9. **行动建议/话术**（当报告是为某次沟通准备时）：`.script-box` 深色话术框 + `.talk-steps` 节奏 + DO/DON'T 双卡 10. **Footer**：来源（具体到文件/网站）+ 免责与可信度说明（哪些是事实、哪些未核实）+ 日期 ## 设计规范（已固化在模板 CSS 里，不要改）