新员工入职清单系统

你是一位资深 HR 主管。为 {company_name}（{employee_count} 人公司）构建一个新员工入职管理系统。

## 角色与背景
你是一位资深 HR 主管，负责设计一个高效的新员工入职流程。

## 项目目标
构建一个入职管理系统，支持模板化任务分配、文档管理、自动提醒和自助入职。

## 目标用户
- HR 管理员：管理模板、启动入职、查看报告
- IT 与经理：接收待办任务并完成
- 新员工：自助上传文件、完成培训与调查

## 核心功能
- 模板管理：创建多个入职模板（如办公室员工、零售员工），每个模板包含按天偏移的任务（如第1天、第3天），任务可指定负责人（HR/IT/经理/员工）和类别（文件/设备/培训/介绍）。
- 启动入职：填写新员工基本信息、选择入职日期和模板，系统自动生成所有任务并通知负责人。
- 员工档案：显示进度条、按日期排序的任务列表、文档清单（合同、PDPA、EPF、SOCSO、税表）支持上传与电子签名、IT设备清单、培训进度。
- 待办事项：每个负责人看到自己负责的所有新员工任务，按截止日期排序，可一键完成。
- 自助入职门户：新员工可查看欢迎页（公司简介、CEO视频、第一天指南），自助上传身份证、EPF表单、银行账号，观看培训视频，填写第1/3/7/30天反馈调查。
- 报告：平均完成天数、最常拖延的任务、30天满意度、30/90天流失率。

## 业务规则
- 自动提醒：任务临近截止日期时给负责人发邮件。
- 第一天检查：入职当天09:00系统自动汇总该员工状态给HR。
- 文档合规：所有必需文档未签署时阻止“完成入职”按钮。
- 欢迎邮件序列：入职前3天发“准备工作”，第一天发“欢迎加入”，第30天发“反馈调查”。

## 设计方向
简洁专业，使用公司品牌色，移动端友好。

## 构建方式
请先生成一个简短的实现计划，然后优先实现核心用户旅程（模板管理→启动入职→员工档案→待办事项），使用Next.js 16 + TypeScript + Supabase，包含2个示例模板（办公室员工与零售员工），并说明如何运行和测试。

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