保险报价与保单管理系统

你是一位资深全栈开发者，为马来西亚保险代理人构建一套「保险报价与保单管理系统」。使用 Next.js 14 App Router + TypeScript + Tailwind CSS + shadcn/ui + Supabase。

## 代理行配置
- 代理行名称：{agency_name}
- 保险类型：{insurance_types}
- 默认佣金率：{commission_rate}%
- 续保提醒天数：{renewal_reminder_days} 天前通知

## 角色与目标
为马来西亚保险代理人打造业务效率工具，替代纸质报价和电子表格保单追踪。核心任务：2分钟内生成准确报价、追踪每份保单续保日期、记录佣金收入、管理理赔。

## 核心功能
- **客户数据库**：完整客户资料录入（姓名、IC号码、出生日期、电话、邮箱、职业、是否吸烟），支持搜索与筛选。客户详情页以标签页展示保单、报价、理赔、文件。IC号码在列表中脱敏显示。
- **汽车保险报价计算器**：按马来西亚NCD折扣表（0%/25%/38.33%/45%/55%）计算保费。公式：基本保费 - NCD折扣 + 附加费 + 印花税RM10 + SST 8%。并排对比至少三家保险公司（如Allianz、AIA、Zurich）报价。
- **多险种报价向导**：步骤指示器（选险种→填资料→查看报价→确认），支持人寿、医疗、火险、旅游保险。
- **保单生命周期管理**：状态流转（报价→申请→生效→续保→失效）。保单列表可搜索、按状态/险种/到期日筛选。一键复制续保。
- **续保提醒系统**：保单到期前 {renewal_reminder_days} 天自动生成提醒。仪表板显示即将续保列表，逾期保单标红。支持通过WhatsApp/邮件手动发送续保通知。
- **佣金追踪**：保单生效时自动按 {commission_rate}% 生成佣金记录。月度佣金报告（成交件数、总保费、总佣金、已收/待收）。支持按险种设置不同佣金率。
- **理赔管理**：登记理赔申请，关联保单，追踪状态至结案。理赔记录影响续保NCD。
- **PDF生成**：使用@react-pdf/renderer生成报价单、保单摘要、续保通知书PDF。

## 界面设计
- 配色：深海军蓝 #0F172A（导航）、金黄 #FCD34D（强调）、白色背景、浅灰卡片。
- 仪表板：4个KPI卡片（活跃保单数、本月佣金、即将续保件数、待处理报价）+ 续保列表 + 活动流。
- 报价向导：侧边栏实时保费预览，保险公司报价以卡片网格展示。
- 移动端友好：代理人可在现场用手机快速报价。

## 马来西亚业务规则
- 所有金额以RM X,XXX.XX格式显示。
- IC号码格式验证。
- SST 8%适用于净保费（NCD后、印花税前）。
- 印花税：汽车和火险RM10，寿险/医疗/旅游不适用。
- 佣金基于总保费（SST和印花税前）。

## 安全与权限
- 所有表启用行级安全，代理人只能查看自己的数据。
- 文件存储桶私有，通过签名URL访问。

## 交付要求
请先生成一个简短的实现计划，然后优先构建主要用户旅程（客户录入→报价→保单创建→续保提醒）。使用合理的技术决策和真实示例内容，并说明如何运行和测试。

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