didixuxu/didi-skills/competitive-landscape

1. 明确分析对象 → 确认行业、竞品、分析目的
2. 数据收集     → WebSearch 搜索真实市场数据
3. 框架分析     → 套用分析框架
4. 生成报告     → 输出 HTML + Chart.js 可视化
5. 打开浏览器   → open 命令预览

搜索1: "[品牌A] vs [品牌B] vs [品牌C] 市场份额 [年份]"
搜索2: "[行业] market share [品牌] [年份]"
搜索3: "[产品A] vs [产品B] 参数 价格 对比 [年份]"
搜索4: "[行业] 趋势 预测 [年份]"（可选）

/* 色彩 */
--bg: #ffffff;
--card-bg: #f5f5f7;
--text: #1d1d1f;
--text-secondary: #86868b;
--border: #d2d2d7;
--accent: #0071e3;          /* 苹果蓝，用于强调 */
 
/* 为每个竞品分配一个低饱和度的品牌色 */
/* 例: --brand-a: #6e6e73; --brand-b: #0071e3; --brand-c: #bf4800; */
 
/* 字体 */
font-family: -apple-system, 'SF Pro Display', 'Helvetica Neue', sans-serif;
 
/* 标题层级 */
h1: 48px, font-weight: 700, letter-spacing: -0.02em  /* 报告主标题 */
h2: 28px, font-weight: 600                            /* 章节标题 */
h3: 21px, font-weight: 600                            /* 子标题 */
body: 17px, line-height: 1.65                          /* 正文 */
caption: 12px, color: var(--text-secondary)            /* 图表注释 */
 
/* 间距 */
章节间距: 80px
卡片内边距: 32px
卡片圆角: 16px
卡片无边框，用背景色区分: background: var(--card-bg)
 
/* 布局 */
max-width: 980px
单列为主，数据对比时用双列

<script src="https://cdn.jsdelivr.net/npm/chart.js@4"></script>

// 全局默认
Chart.defaults.color = '#86868b';
Chart.defaults.borderColor = '#e5e5e5';
Chart.defaults.font.family = "-apple-system, 'SF Pro Display', sans-serif";
// 配色原则：低饱和、高辨识
// 好的配色: ['#0071e3', '#86868b', '#bf4800', '#1d1d1f']
// 避免的配色: 霓虹绿、亮紫、荧光橙
// 图表通用设置
{
  responsive: true,
  plugins: {
    legend: {
      position: 'bottom',
      labels: { usePointStyle: true, padding: 20, font: { size: 13 } }
    },
    title: {
      display: true,
      font: { size: 17, weight: '600' },
      color: '#1d1d1f',
      padding: { bottom: 20 }
    }
  }
}
// 柱状图: borderRadius: 8, 不要边框
// 饼图/环形图: cutout: '55%', borderWidth: 0
// 雷达图: 填充透明度 0.08, 线条宽度 2
// 气泡图: 透明度 0.5, 边框宽度 1.5

1. 标题区
   - 报告标题（大字）
   - 副标题（一行说明分析范围和日期）
 
2. 核心指标卡片（3-4个）
   - 每个竞品一张卡片
   - 1个核心数字 + 1行说明
 
3. 市场格局（图表 + 洞察文字）
 
4. 竞品画像对比（表格）
 
5. 产品/参数矩阵（表格 + 图表）
 
6. 分析框架输出（选用的框架）
   - 波特五力：雷达图 + 评分表
   - 定位地图：气泡图
   - 蓝海策略：四象限卡片
   - 综合雷达图
 
7. 结论与建议
   - 每个竞品一句话总结
   - 关键洞察（2-3条）
 
8. 数据来源（底部小字）

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 15px;
}
th {
  text-align: left;
  padding: 12px 16px;
  border-bottom: 2px solid #1d1d1f;  /* 表头用深色粗线 */
  font-weight: 600;
  font-size: 13px;
  color: #86868b;
}
td {
  padding: 14px 16px;
  border-bottom: 1px solid #e5e5e5;  /* 行分隔用浅灰细线 */
}
/* 无竖线，无外边框 */