房产刊登与经纪人管理系统

你是一位资深全栈开发者，精通 Next.js 16、Tailwind CSS 4、Supabase 和马来西亚房地产行业。请为 {agency_name} 构建一个完整的房产刊登与经纪人管理系统，替代 PropertyGuru / iProperty 的核心功能。

## 项目概述
- 公司名称：{agency_name}
- 公司类型：{agency_type}
- 经纪人数量：{num_agents}
- 覆盖区域：{coverage_area}
- 品牌主色：{primary_color}

## 技术栈
- 前端：Next.js 16 (App Router) + TypeScript
- 样式：Tailwind CSS 4 + shadcn/ui
- 后端：Supabase (Postgres + Auth + Storage + RLS)
- 地图：Google Maps JavaScript API
- 部署：Vercel

## 核心功能
1. **公开网站**：首页（精选楼盘、搜索入口、热门区域、团队预览）、楼盘搜索页（筛选器含买/租、区域、州属、类型、价格、卧室数、浴室数、面积、产权、装修；列表/地图视图切换；无限滚动）、楼盘详情页（图库、信息卡片、地图、设施、房贷计算器、经纪人联系卡片、询盘表单、相似推荐）、经纪人档案页（个人资料、活跃楼盘、WhatsApp 联系）、房贷计算器（月供、总利息、印花税、律师费估算）。
2. **经纪人仪表盘**：统计总览、潜客管道（看板视图，支持拖拽更新状态）、我的楼盘（表格管理，含搜索、筛选、编辑、下架）、楼盘编辑器（分步表单：基本信息→详细信息→位置→照片上传→预览发布，自动计算 price_per_sqft 和生成 slug）、个人档案编辑。
3. **业务规则**：新询盘通过 Supabase Edge Function 通知经纪人；楼盘状态改为 sold/rented 后自动隐藏；精选楼盘按 featured 和 featured_until 显示；记录浏览统计；基于标题和区域生成 slug；图片上传时压缩；搜索支持多条件 AND 查询；州属/区域联动下拉。
4. **马来西亚特定**：货币 RM 千位分隔符、面积单位 sq ft、州属列表、房产类型、SPA 术语、经纪人注册号（REN/REA/PEA）、界面以英文为主中文为辅。

## 设计方向
- 主色调 {primary_color}，白色背景，浅灰辅助，深色标题，Slate 正文。
- 卡片白底加边框和悬停阴影，价格大字号加粗主色调。
- 响应式移动优先，搜索页移动端筛选器用 Sheet 抽屉。
- 图片使用 next/image，16:10 封面比例，blur placeholder。
- 加载状态用 Skeleton 动画，空状态用友好插图和引导文案。

## 构建方式
- 先给出简短实施计划，优先实现主要用户旅程（公开搜索和详情页）。
- 使用 Server Components 获取数据，搜索筛选器用 URL searchParams。
- 使用 cursor-based 分页，React Suspense + Skeleton 流式加载。
- 包含示例数据：8 个马来西亚真实楼盘（涵盖不同区域、类型、价格）和 3 位经纪人。
- 确保代码可运行，解释如何运行和测试。

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