Lumi 租房真实成本计算器

创建一个高保真、可交互的 Web 应用，把醒目的租金价格转换为真实月度成本和真实年度成本。

## 核心理念
用户经常只看到房源标价并比较月租，却忽略押金、中介费、水电费、入住费用和通勤。这个计算器要以清晰、略带现实检验感的语气揭示真实成本。

## UX 目标
* 使用快速、没有杂乱内容、适合移动端
* 输入方式像真实租房场景
* 输出立即易懂，并透明展示明细
* 语气：冷静、实用、略带机智，从不评判用户

## 布局
单页、3 个区块，桌面端固定结果卡片：

1. 房源基础信息
2. 隐性费用
3. 通勤成本
右侧：Reality Check Summary 卡片（移动端时摘要移到下方，并通过浮动的“摘要”按钮保持可访问）。

## 输入项

### 1) 房源基础信息
* 货币选择器（默认：SGD）
* 月租（数字）
* 租期（月）选择器：6 / 12 / 18 / 24（默认 12）
* 入住日期（可选，仅用于 UI 打磨，不影响计算）
* “租金可议吗？”切换项（可选）
  开启后：显示“折扣”滑块，范围 0% 到 10%，用于调整租金

### 2) 隐性费用
所有费用都应支持带友好预设的常见模式：

* 押金
  * 下拉选项：1 个月、2 个月、自定义
  * 自定义时：数字输入（金额）

* 中介费
  * 下拉选项：无、半个月、1 个月、自定义
  * 自定义时：数字输入（金额）

* 水电等月度费用
  * 电费（数字）
  * 水费（数字）
  * 网络费（数字）
  * 可选：“其他月度费用”（数字）

* 一次性入住费用（可选）
  * 清洁费（数字）
  * 家具 / 家电（数字）
  * 搬家服务（数字）
  * “其他一次性费用”（数字）

### 3) 通勤成本
让用户选择是否计入通勤成本。

* 切换项：“计入通勤成本”（默认开启）
  开启后显示：
* 每月工作日（默认 22）
* 交通方式标签页：“公共交通”、“驾车”、“混合”
  每种方式提供：
* 单程费用（数字）
* 单程时间（分钟）

* 可选：“计算我的时间价值”切换项（默认关闭）
  * 开启后：每小时价值（数字）
  * 将通勤时间转换为成本：time_cost = (minutes * 2 * workdays / 60) * hourly_value

## 计算

### 调整后租金
* rent_adjusted = monthly_rent * (1 - discount_percent)

### 每月固定成本
* utilities_monthly = electricity + water + internet + other_monthly_fees
* commute_cash_monthly = cost_per_one_way * 2 * workdays
* commute_time_monthly = (one_way_minutes * 2 * workdays / 60) * hourly_value（仅在时间价值切换项开启时）
* recurring_monthly = rent_adjusted + utilities_monthly +（通勤切换项开启时的通勤成本）

### 一次性费用总额
* deposit_amount = 预设月数 * rent_adjusted，或自定义金额
* agent_fee_amount = 预设月数 * rent_adjusted，或自定义金额
* move_in_one_time = cleaning + furniture + moving + other_one_time
* one_time_total = deposit_amount + agent_fee_amount + move_in_one_time

### 将一次性费用按租期摊销
* one_time_monthly_equivalent = one_time_total / lease_length_months

### 实际月度与年度成本
* real_monthly = recurring_monthly + one_time_monthly_equivalent
* real_annual = real_monthly * 12

### 同时展示“租期总成本”
* lease_total = recurring_monthly * lease_length_months + one_time_total

## 输出（Reality Check Summary 卡片）
展示大号数字：
* 实际月度成本
* 实际年度成本
* 租期总成本

然后展示清晰的明细列表：
* 租金（调整后）
* 水电等费用
* 通勤（现金）
* 通勤（时间价值），仅在启用时
* 一次性费用（按月折算）
  同时展示：
* “隐性成本增幅”：real_monthly - rent_adjusted
* “增幅百分比”：增幅 / rent_adjusted

再加一行“成本驱动因素”洞察：
* 找出除租金外金额最大的贡献项，并写一句话，例如：
  “最大附加项：中介费按租期摊销。”

## 交互
* 修改时即时重新计算
* 通过 Tooltip 提供押金 / 中介费示例
* 预设按钮：“典型 12 个月租期”、“无中介费”、“基础水电”
* “与另一套房源比较”小功能：
  * 按钮“保存为场景 A”
  * 按钮“保存为场景 B”
  * 显示 A 与 B 在 real_monthly 和 lease_total 上的差异

## 视觉风格
* 温暖、现代的 UI，圆角卡片，细微阴影
* 清晰排版，可访问对比度
* 数字变化使用微动画（计数递增）
* 小型进度样式条，显示“租金与隐性成本”的比例

## 文案语气
使用短促、有力的标签：
* 标题：“Rent Reality Check”
* 副标题：“把标价转换成真实的月度和年度成本。”
* CTA 按钮：“Reality check it”
* 页脚说明：“仅供估算，实际账单可能有所不同。”

## 边界情况
* 防止负数
* 如果 lease_length_months 很短（6 个月）且中介费为 1 个月，突出显示：“短租期会放大一次性费用。”