企业预算与现金流预测系统

你是一位资深全栈工程师，专门为马来西亚中小企业开发财务管理系统。请帮我构建一套完整的「企业预算与现金流预测系统」，让老板告别 Excel 预算表，实现数字化财务管控。

【公司背景】
公司名称：{{company_name}}
财政年度起始月：{{fiscal_year_start}}
部门/成本中心：{{departments}}
预算类别：{{budget_categories}}
货币：马来西亚令吉（RM）

【技术栈】
- 前端框架：Next.js 14（App Router）
- 样式系统：Tailwind CSS + shadcn/ui 组件库
- 数据库：Supabase（PostgreSQL + RLS 行级安全）
- 图表库：Recharts（用于瀑布图、折线图、饼图）
- 表格导出：xlsx 库（导出 Excel 给会计）
- 日期处理：date-fns
- 数字格式化：Intl.NumberFormat（RM 货币格式）

【核心功能】
1. 年度预算创建：新建预算年度，按月份×类别的网格式录入界面，支持按比例分配年度预算到各月份，批量复制上一年度预算，预算提交审批后锁定。
2. 预算与实际对比：实时录入每月实际收入和支出，计算差异金额和百分比，RAG 状态指示（绿<5%、黄5-10%、红>10%），按部门、类别、月份多维度分析。
3. 现金流追踪：记录每笔现金流入和流出，支持设置周期性项目（月租、月薪等自动生成），银行存款余额实时更新。
4. 3至6个月现金流预测：基于周期性项目自动生成未来预测，结合历史趋势调整，瀑布图展示每月资金变化，最低现金预警，计算现金跑道。
5. 部门预算分配：为每个成本中心设置预算上限，实时进度条显示使用率，跨部门预算调拨申请和审批。
6. 报表与导出：月度预算执行报告、季度财务回顾报告、导出完整预算表到 Excel、现金流量表。

【仪表盘设计】
顶部摘要卡片（4个）：年度预算总额、年初至今实际支出、总体差异、当前现金余额。
主要图表：月度收支对比柱状图、现金流瀑布图、3个月现金流预测折线图、部门预算使用率饼图。
预警区域：超预算项目列表、即将到期的大额付款提醒、现金余额低于安全线预警。

【UI 设计规范】
- 配色：深色导航栏（#0F172A）、白色内容区、黄色（#FCD34D）重点操作按钮
- 预算表格：斑马纹行、悬停高亮、差异列使用红绿色背景
- 货币显示统一使用「RM 1,234,567.89」格式
- 支持手机端查看仪表盘（响应式设计）
- 中文界面为主，关键术语附英文

【业务规则】
- 差异超过 10% 自动标红并触发通知
- 预算一经审批锁定，修改需要重新提交审批
- 滚动预测每月自动更新（基于最新实际数据）
- 所有金额精确到分（两位小数）
- 历史数据只读，不可删除（合规要求）

请先生成一个简短的实现计划，优先实现主要用户旅程，做出合理的技术决策，使用真实的示例内容，并说明如何运行和测试。

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