const UpdateTab = () => {
  const updates = [
    {
      version: "v4.2",
      date: "2026-05-15",
      changes: [
        {
          category: "System & Accessories",
          items: [
            "アクセサリー『鋼鉄の意志』が1戦闘中に何度も発動してしまう不具合を修正しました",
            "『鋼鉄の意志』の効果残り回数（ガード回数・怒りモード回数）をバトル画面中央に表示するようにしました"
          ]
        },
        {
          category: "Global Network",
          items: [
            "グローバルランキングシステムを実装しました。到達階層を世界中のプレイヤーと競い合うことができます",
            "ユーザープロフィール機能を実装し、ユーザー名の登録が可能になりました（SYSTEMタブより変更可能）"
          ]
        },
        {
          category: "Balance & UI",
          items: [
            "エンドゲームにおける敵の攻撃力上昇曲線を再調整し、より緊張感のあるバランスにしました",
            "バトルの開始・終了時などの内部フラグ処理を最適化し、不整合が発生しにくいよう改善しました",
            "新武器を追加を追加しました"
          ]
        }
      ]
    },
    {
      version: "v4.1",
      date: "2026-05-14",
      changes: [
        {
          category: "Prestige & Scaling",
          items: [
            "プレステージに新項目「シナジー同調」「真・鋼の身体」「真・戦闘本能」「真・反応強化」を追加しました",
            "「真」シリーズは基礎ステータス強化をMAXにすることで解放される、強力な最終乗算ボーナスです",
            "階層が進むにつれて敵の攻撃力がより鋭く上昇するように難易度曲線を調整しました"
          ]
        },
        {
          category: "Synergy & Balance",
          items: [
            "シナジー効果を全面的にリバランシングし、種類を整理・統合しました",
            "最強だった「アルティメット・カオス」をナーフし、新たな最上位シナジー「オメガ・シンギュラリティ」を実装しました",
            "これまで用途がなかった「タキオンドライブ」と「特異点エンジン」に専用シナジーを追加しました",
            "ボスパーツを3つ、4つ、あるいは6つ贅沢に使用した「高度複合ボスシナジー」を3種類追加しました",
            "「幸運の手」の効果がユニークレアリティのドロップにも適用されるよう改善しました",
            "エンチャントガチャにおいて「幸運の手」の効果が通常の2倍適用されるよう強化しました"
          ]
        },
        {
          category: "UI & Quality of Life",
          items: [
            "SHOPのアクセサリーおよびDATABASEのエンチャント一覧がレア度順に並ぶよう整理しました",
            "新たなアクセサリー「死神の鎌」を追加しました",
            "アクセサリーのレア度設定（ヴァンパイアチップ、守護の護符など）を実用度に合わせて見直しました"
          ]
        }
      ]
    },
    {
      version: "v4.0",
      date: "2026-05-13",
      changes: [
        {
          category: "UI/UX",
          items: [
            "パーツのアイコンを独自のもの（Ghost, Atom, Wind, Eyeなど）に変更し、カラーを付与して視認性を向上させました",
            "DATABASEタブにエンチャント一覧の「レア度」バッジとテーマカラー表示を追加し、性能がより直感的にわかるようにしました",
            "新しいUPDATEタブ（現在ご覧のタブ）を実装し、更新履歴を確認できるようにしました",
            "上部のタブのサイズを小さくし、全体的にごちゃごちゃしてたのを整理しました",
            "ファビコンを追加しました"
          ]
        },
        {
          category: "System & Balance",
          items: [
            "エンチャントにレア度（Normal, Rare, Epic, Legend, Unique）を実装し、強さに応じて色分けされるようになりました",
            "「虚無」をLegend、「呪われた」をEpicに調整し、すべてのエンチャントがレア度に基づく固定確率で出現するよう調整しました",
            "武器を分解した際、単にパーツが返還されるだけでなく「武器のレア度」と「エンチャントのレア度」に応じたスクラップを獲得できるようになりました",
            "「実績の書」の仕様を変更し、取得数に応じた自動解読から、任意で1冊消費して未解読のシークレット実績を手動で解読する機能に変更しました",
            "解読可能なシークレット実績が残っていない場合、ボスから「実績の書」がドロップしないよう入手制限を追加しました"
          ]
        },
        {
          category: "New Feature",
          items: [
            "SHOPタブに新機能「エンチャントガチャ（コスト: 300スクラップ）」を実装しました",
            "ガチャは10階層到達で解放され、手持ちの武器も含めて好きな武器のエンチャントを再抽選できます",
            "ガチャ実行時はハズレ（なし）が出ず、最低でも「錆びた」が付与される仕様になっています",
            "60F〜100Fの各ボスに固有のユニークドロップパーツを追加しました",
            "新規ボスパーツシナジーを6種追加しました",
            "60Fおよび80Fのボス撃破アチーブを新たに追加しました",
            "新しいシークレットアチーブを追加しました",
            "新システム「アクセサリー」を追加しました。SHOPでスクラップを消費して購入・装備できます",
            "アクセサリーは最大5種類（ヴァンパイアチップ・守護の護符・再生パルス・バーサーカーコア・鋼鉄の意志）を実装しました",
            "初期スロット数は1つ。プレステージに「アクセサリー拡張」を追加し、最大3スロットまで拡張できます"
          ]
        }
      ]
    }
  ];

  return (
    <div className="p-4 lg:p-16 max-w-4xl mx-auto space-y-8 animate-fade-in-up">
      <h2 className="text-xl lg:text-2xl font-bold border-b border-gray-700 pb-4 text-fuchsia-400 flex items-center gap-3">
        <Activity size={24} /> アップデート履歴 - UPDATE LOG
      </h2>

      <div className="space-y-10">
        {updates.map((update, index) => (
          <div key={index} className="bg-gray-800/80 border border-gray-700 rounded-2xl p-6 lg:p-10 shadow-xl relative overflow-hidden group">
            {/* 装飾 */}
            <div className="absolute top-0 right-0 w-64 h-64 bg-fuchsia-500/5 rounded-full -mr-20 -mt-20 blur-3xl group-hover:bg-fuchsia-500/10 transition-colors pointer-events-none"></div>
            
            <div className="flex flex-col sm:flex-row justify-between items-start sm:items-center mb-8 border-b border-gray-700/50 pb-6 relative z-10">
              <div className="flex items-center gap-4">
                <div className="bg-fuchsia-900/40 text-fuchsia-400 font-black text-xl px-4 py-2 rounded-xl border border-fuchsia-700/50 tracking-widest shadow-inner">
                  {update.version}
                </div>
                <div className="text-gray-500 font-bold tracking-widest uppercase text-sm">
                  {update.date}
                </div>
              </div>
            </div>

            <div className="space-y-8 relative z-10">
              {update.changes.map((change, cIdx) => (
                <div key={cIdx}>
                  <h3 className="text-lg font-black text-gray-300 mb-4 flex items-center gap-2">
                    <div className="w-1.5 h-6 bg-fuchsia-500 rounded-full"></div>
                    {change.category}
                  </h3>
                  <ul className="space-y-3 pl-4">
                    {change.items.map((item, iIdx) => (
                      <li key={iIdx} className="flex items-start gap-3 text-sm text-gray-400 leading-relaxed">
                        <span className="text-fuchsia-500 mt-1">▶</span>
                        {item}
                      </li>
                    ))}
                  </ul>
                </div>
              ))}
            </div>
          </div>
        ))}
      </div>
    </div>
  );
};