export default function AboutPage() {
  return (
    <div className="space-y-6 max-w-3xl">
      <div>
        <h1 className="text-2xl font-bold text-slate-900">策略说明</h1>
        <p className="text-slate-500 text-sm mt-1">资金费率套利原理与历史数据</p>
      </div>

      <div className="rounded-xl border border-slate-200 bg-white p-6 space-y-4">
        <h2 className="text-lg font-semibold text-blue-600">策略原理</h2>
        <p className="text-slate-700 text-sm leading-relaxed">
          永续合约每8小时结算一次资金费率。多头多时，多头付钱给空头（费率为正）；空头多时，空头付钱给多头（费率为负）。
        </p>
        <p className="text-slate-700 text-sm leading-relaxed">
          <span className="text-blue-600 font-medium">套利做法：</span>现货买入 + 永续做空，完全对冲币价风险，净收资金费率（USDT结算）。
        </p>
        <div className="bg-slate-50 rounded-lg p-4 text-sm font-mono text-slate-700 space-y-1">
          <div>买入 1 BTC 现货（$96,000）</div>
          <div>做空 1 BTC 永续（$96,000，1倍杠杆）</div>
          <div className="text-slate-500">───────────────────────</div>
          <div className="text-emerald-400">BTC涨跌：两边对冲，净盈亏 = 0</div>
          <div className="text-emerald-400">资金费率：每8小时直接收 USDT ✓</div>
        </div>
      </div>

      <div className="rounded-xl border border-slate-200 bg-white p-6 space-y-4">
        <h2 className="text-lg font-semibold text-blue-600">历史年化数据（2019-2026，露露×小周15轮验证）</h2>
        <table className="w-full text-sm">
          <thead>
            <tr className="border-b border-slate-200">
              <th className="text-left py-2 text-slate-500">资产</th>
              <th className="text-right py-2 text-slate-500">全周期毛年化</th>
              <th className="text-right py-2 text-slate-500">PM净年化</th>
              <th className="text-right py-2 text-slate-500">负费率占比</th>
            </tr>
          </thead>
          <tbody className="text-slate-700">
            <tr className="border-b border-slate-200/50">
              <td className="py-2 text-blue-600 font-medium">BTC</td>
              <td className="py-2 text-right">12.33%</td>
              <td className="py-2 text-right text-emerald-400 font-medium">11.67%</td>
              <td className="py-2 text-right">13.07%</td>
            </tr>
            <tr className="border-b border-slate-200/50">
              <td className="py-2 text-violet-400 font-medium">ETH</td>
              <td className="py-2 text-right">14.87%</td>
              <td className="py-2 text-right text-emerald-400 font-medium">14.09%</td>
              <td className="py-2 text-right">12.17%</td>
            </tr>
            <tr>
              <td className="py-2 text-emerald-400 font-medium">50/50组合</td>
              <td className="py-2 text-right">13.81%</td>
              <td className="py-2 text-right text-emerald-400 font-bold">13.08%</td>
              <td className="py-2 text-right">—</td>
            </tr>
          </tbody>
        </table>
        <p className="text-slate-400 text-xs">PM = Portfolio Margin模式，资金利用率约95%。数据来源：Binance fapi/v1/fundingRate官方API</p>
      </div>

      <div className="rounded-xl border border-slate-200 bg-white p-6 space-y-3">
        <h2 className="text-lg font-semibold text-blue-600">风险说明</h2>
        <div className="space-y-2 text-sm">
          {[
            { level: "🟡 中", risk: "市场周期", desc: "熊市年化可降至0-4%，但不亏本金" },
            { level: "🟢 低", risk: "费率持续为负", desc: "历史负费率仅12-13%，长期均值为正" },
            { level: "🟡 中", risk: "交易所对手方", desc: "FTX教训，建议考虑分散" },
            { level: "🟢 低", risk: "爆仓风险", desc: "1倍杠杆+对冲，理论需BTC翻倍才触发" },
            { level: "🟢 低", risk: "基差波动", desc: "长期持有不影响，只影响平仓时机" },
          ].map((r, i) => (
            <div key={i} className="flex items-start gap-3 bg-slate-50 rounded-lg px-4 py-2">
              <span className="text-xs w-12 shrink-0 mt-0.5">{r.level}</span>
              <span className="text-slate-700 font-medium w-24 shrink-0">{r.risk}</span>
              <span className="text-slate-500">{r.desc}</span>
            </div>
          ))}
        </div>
      </div>
    </div>
  );
}