SOURCE

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>多少钱才能财富自由</title>
<style>
  body { background: #2c1b3d; color: white; text-align: center; font-family: sans-serif; padding-top: 40px; padding-bottom: 40px; }
  input { padding: 10px; margin: 5px; font-size: 16px; width: 80px; border-radius: 5px; border: none; text-align: center; color: #e5d164; font-weight: bold; }
  .box { background: #3d2b52; padding: 30px; border-radius: 15px; display: inline-block; box-shadow: 0 4px 15px rgba(0,0,0,0.5); width: 90%; max-width: 600px; }
  h1 { color: #e5d164; font-size: 24px; margin-bottom: 5px; }
  .formula { color: #b3a0c6; font-size: 16px; font-weight: bold; margin-bottom: 20px; letter-spacing: 1px; }
  .row { margin-top: 15px; }
  label { font-size: 14px; color: #b3a0c6; display: inline-block; margin: 5px 10px; }
  .result { font-size: 36px; color: #e5d164; font-weight: bold; margin-top: 30px; padding-top: 20px; border-top: 1px dashed #b3a0c6; }
  .note { margin-top: 25px; font-size: 13px; color: #8c7c9e; text-align: left; line-height: 1.6; background: #2c1b3d; padding: 15px; border-radius: 8px; }
  .note span { color: #b3a0c6; font-weight: bold; }
</style>
</head>
<body>
  <div class="box">
    <h1>多少钱才能财富自由</h1>
    <div class="formula">480X + K * n + M + H</div>
    
    <div class="row">
      <label>月开销 X (万)<input type="number" id="x" value="5"></label>
      <label>每孩成本 K (万)<input type="number" id="k" value="80"></label>
    </div>
    
    <div class="row">
      <label>小孩数 n<input type="number" id="n" value="2"></label>
      <label>健康开销 M (万)<input type="number" id="m" value="100"></label>
      <label>重大投入 H (万)<input type="number" id="h" value="300"></label>
    </div>

    <div class="result" id="res">2960 万</div>

    <!-- 增加了关于 480 的备注 -->
    <div class="note">
      <span>💡 关于公式中的“480”：</span><br>
      这个数字是以【年化投资回报率为 2.5%】的情况计算得出的。具体公式为：12个月 ÷ 2.5% = 480。<br>
      意思是：只要你的本金达到每月开销的 480 倍，在 2.5% 的安全年化收益下，每个月的利息刚好可以覆盖你的日常开销，从而实现基础的财务自由。
    </div>
  </div>

  <script>
    function calc() {
      let x = parseFloat(document.getElementById('x').value) || 0;
      let k = parseFloat(document.getElementById('k').value) || 0;
      let n = parseFloat(document.getElementById('n').value) || 0;
      let m = parseFloat(document.getElementById('m').value) || 0;
      let h = parseFloat(document.getElementById('h').value) || 0;

      // 计算公式：480X + K * n + M + H
      let total = (480 * x) + (k * n) + m + h;
      
      if (Number.isInteger(total)) {
        document.getElementById('res').innerText = total + " 万";
      } else {
        document.getElementById('res').innerText = total.toFixed(2) + " 万";
      }
    }
    
    document.querySelectorAll('input').forEach(input => {
      input.addEventListener('input', calc);
    });
  </script>
</body>
</html>