ワールドマップのバイオーム別モンスター図鑑カード表示：フィールド種別に応じた敵出現テーブルをビジュアル化

## 1. 目的
現在、フィールド種別（town / outdoor / dungeon）によるエンカウント分離は実装済みだが、プレイヤー視点では「どのエリアにどんな敵が出るか」を事前に確認する手段がない。ワールドマップ上のバイオーム（草原・砂漠・森・沼・海岸・火山）ごとに出現モンスターを図鑑カードとして事前表示し、探索動機と没入感を高める。

## 2. 具体的な仕様

### 2-1. フィールドモンスター出現テーブルUI
- play.php のゲームUI内に「図鑑」タブ（スマホ用コマンド/ログタブの隣）を追加する
- 図鑑タブを開くと、シナリオのフィールド種別ごとに「出現モンスターカード」を縦列表示する
- カード1枚の構成：
- 左側: 64×64px Canvas（既存のモンスタードット絵生成関数を流用して描画）
- 右側: モンスター名 / 出現エリア名 / HP / 攻撃力 / 撃破回数（0のときは「???」でグレーアウト）

### 2-2. モンスター画像の都度生成
- 図鑑タブを開いたとき、JS側でシナリオJSONのモンスターリストをループし、各モンスターの既存Canvas描画関数（種別・パレット・部位別）を呼び出して64×64 Canvasを生成する
- 既に戦闘で撃破済みのモンスターはカラー表示、未遭遇は白黒（globalAlpha 0.35 + grayscaleフィルタ）で表示し、名前を「???」にする
- 図鑑タブを開くたびに再描画（毎回新規生成）し、撃破状況をリアルタイム反映する

### 2-3. バイオーム別グループヘッダー
- モンスターカードをバイオーム（草原 / 砂漠 / 森 / 沼 / 海岸 / ダンジョン）でグループ化し、各グループのヘッダーにバイオーム名と地形アイコン（既存 terrain マークを流用）を表示する
- town フィールドのモンスターは「町では戦闘は起きません」と表示し、カードは出さない

### 2-4. 撃破カウント連携
- 既存の monster_bestiary（図鑑記録）から撃破回数を読み取り、カード右下に「撃破 N 回」を表示する
- 撃破回数が1以上になった瞬間（戦闘終了時の state 更新後）に、図鑑タブバッジ（赤丸 NEW）を表示し、タブを開くと消える

## 3. 実装方針

### PHP側 (play.php)
- `$scenario['monsters']` をバイオーム別に分類した配列を PHP で生成し、`json_encode` で JS 変数に渡す
- `$state['monster_bestiary']` の撃破情報も同様に JS へ渡す
- 既存の図鑑関連コードが既にある場合はそこへ統合し、重複を避ける

### JS側 (play.php インライン)
- `renderBestiaryTab()` 関数を新規追加
- 呼び出しごとに既存の `drawMonsterCanvas(ctx, monsterDef, hpPct, angry, statusEffect)` 相当の関数を 64×64 サイズで実行
- 未撃破モンスターは `ctx.filter = 'grayscale(100%)'` を適用後に描画し、フィルタをリセット
- タブ切替イベント（既存スマホタブと同じ仕組み）に「図鑑」を追加し、クリック時に `renderBestiaryTab()` を呼ぶ
- NEW バッジは `localStorage` ではなく JS変数（`unseenBestiary`）で管理し、ページリロード時はサーバーから撃破数を再取得してリセット

## 4. 既存機能との整合（壊さない点）
- 既存の戦闘画面モンスターCanvas描画・図鑑記録・スマホタブUIには一切手を加えない
- 図鑑タブはオプション表示として追加するだけで、戦闘・移動・セーブの既存フローに影響しない
- town フィールドの「エンカウントなし」ロジックはそのまま維持し、図鑑表示でも明示する

## 5. スマホ/PC対応
- スマホでは既存のコマンド/ログタブ行に「図鑑」ボタンを追加（横スクロール対応）
- PCでは右パネルまたはモーダルとして表示する（既存レイアウト幅に依存して切り替え）