客户评价与评分系统

你是一位资深全栈开发者。请为「{business_name}」构建一个客户评价与评分系统，用于收集、管理和展示客户反馈。

## 角色与背景
你是一位资深全栈开发者，擅长使用 Next.js、Supabase 和现代 UI 库构建生产级应用。

## 项目目标
为马来西亚中小企业打造一个类似简化版 Google Reviews 的评价管理工具，支持评价提交、审核、回复、邀请、分析仪表板和可嵌入展示小工具。

## 目标用户
- 商家管理员：审核评价、回复客户、发送邀请、查看分析。
- 客户：提交评价、浏览公开评价页面。

## 核心体验与页面
- **公开评价提交页**：无需登录，客户可填写整体评分（1-{rating_scale} 星）、分类评分（依据 {review_categories}）、评价内容、照片上传和个人信息。提交后显示感谢页。
- **公开展示页**：显示商家名称、平均评分、评分分布、分类评分、评价列表（可排序），支持无限滚动。每条评价显示客户姓名（部分隐藏）、星级、日期、内容、照片缩略图、商家回复和已验证购买徽章。
- **管理后台**：
  - 评价收件箱：按状态筛选，批量操作，一键发布/拒绝/标记。
  - 评价详情面板：显示完整信息、分类评分雷达图、照片、回复编辑器（支持模板）。
  - 邀请管理：单次或批量发送评价邀请（邮件/WhatsApp），追踪状态。
  - 小工具配置：创建可嵌入的展示小工具（轮播、网格、列表、徽章），生成嵌入代码。
  - 分析仪表板：总评价数、平均评分、评分分布、30天趋势、分类平均分、情感分析饼图。

## 主要工作流程
1. 客户提交评价 → 系统根据评分自动发布或进入待审核。
2. 管理员审核评价 → 发布、拒绝或标记。
3. 管理员回复评价 → 回复公开显示。
4. 管理员发送邀请 → 客户通过链接提交评价。
5. 公开展示页和小工具展示已发布的评价。

## 业务规则
- 评分 ≥ {auto_publish} 星自动发布，否则进入待审核。
- 同一邮箱对同一商家同一产品只能提交一次评价。
- 评价内容触发脏话过滤则自动待审核。
- 每条评价可被举报，3次举报后自动标记。
- 邀请链接30天过期。
- 提供订单编号可获“已验证购买”徽章。

## 设计方向
- 深色导航栏（#0F172A）、白色内容区、金色强调色（#FCD34D）。
- 星级填充色 #FCD34D，未填充 #E2E8F0。
- 评价卡片圆角、细边框、悬停阴影。
- 状态标签使用不同颜色（绿/黄/红）。
- 中文使用 Noto Sans SC，英文使用 Inter。
- 所有异步操作显示骨架屏。

## 构建方式
- 使用 Next.js 14 (App Router) + TypeScript + Tailwind CSS + shadcn/ui。
- 使用 Supabase 作为数据库和认证。
- 使用 Recharts 绘制图表。
- 连接邮件服务发送邀请邮件。
- 连接 WhatsApp 发送邀请。
- 先给出简短实施计划，然后逐步构建，优先实现主要用户流程。使用真实示例内容，确保可运行和测试。

## 构建顺序（请严格遵守）
请按以下顺序开发，让我尽早在屏幕上看到成果，不要长时间没有画面：
1. 先做界面：用接近真实的示例数据，把所有页面做出来（暂时不接数据库），让我能马上看到、能点击。做完先停下来，等我确认。
2. 再做功能：我确认界面后，才让按钮、表单和计算真正可用（继续用示例数据）。
3. 再接 Supabase：功能都正常后，才连接 Supabase 保存真实数据和登录（如需要）。
4. 最后上线：先确保在我电脑上运行正常，再把代码上传到 GitHub，经我同意后部署到 Vercel。
请保持简单——我是非技术背景的老板。有不清楚或需要决定的事，先问我，不要自己假设。