戦闘中にモンスターSVG画像をターン毎に再生成し、毎回異なる外観を表示する機能の追加

## 1. 追加・改善する機能の目的

リリースノートに「シナリオ生成時に毎回異なるSVGモンスター画像を作成」と記載されているが、現状の実装はシナリオ生成時（create時）に1度だけSVGを生成してJSONに保存する方式である。そのため同一シナリオを繰り返しプレイすると常に同じモンスター画像が表示され、「毎回異なる」という体験が薄れる。また、同一シナリオ内でも同じモンスター種が複数回出現する場合に全て同じ画像になる。

管理者指針「モンスターの画像生成を毎回行う」に対応し、戦闘開始のたびにJS側でモンスターパラメータ（種別・色・サイズ・パーツ位置）を乱数で再構築してSVGをCanvas描画する仕組みに改める。

## 2. 具体的な仕様

### 2-1. PHPサイド（play.php / lib.php）
- 戦闘開始時に `state['battle']` へ格納するモンスターデータに、以下の「モンスター生成シード」フィールドを追加する：
- `monster_seed`: `mt_rand(1000, 9999)` で生成した整数（毎エンカウント毎に異なる値）
- `monster_type`: 既存の種別文字列（`slime`, `dragon`, `ghost` 等）
- `monster_palette`: 種別に応じた基本カラーパレット配列（最大5色）
- `rpgsf_apply_action` 内でエンカウント処理を行う箇所にて、上記フィールドをセットする。

### 2-2. JSサイド（play.phpインラインスクリプト）
- 既存の `drawMonsterCanvas()` 関数（または相当する関数）を拡張し、`monster_seed` と `monster_type` を受け取ってモンスターSVGをCanvas上に手続き型描画する `generateMonsterSVG(type, seed, palette)` 関数を実装する。
- 乱数はシード固定のLCG（線形合同法）をJS内で実装し、同じseedなら同じ画像になる（デバッグ可能）が、エンカウント毎にseedが変わるため毎回異なる画像になる。
- 描画パラメータ例（種別`slime`の場合）:
- 体の横幅: `40 + (seed % 20)` px
- 目の間隔: `seed % 8` px
- カラー: `palette[seed % palette.length]`
- 光沢ハイライトの位置: `seed % 5` パターン
- 種別ごとに最低4パーツ（胴体・頭部・目・特徴部位）を描画するCanvasロジックを実装する。対応種別は既存モンスターリストの全種（最低8種）。
- 戦闘開始イベント（`battle_fx` 受信時）に `generateMonsterSVG` を呼び出してCanvasを更新する。

### 2-3. 戦闘アニメーション連動
- 既存の待機・攻撃・被弾・撃破ポーズアニメーションは、生成したSVGパーツを変形（translateY, rotate）することで継続して動作させる。
- 撃破時はCanvas上でフェードアウト（globalAlpha を 1.0 → 0 へ8フレームかけて遷移）。

### 2-4. フィールド種別との整合
- `field_type === 'town'` のサブマップではエンカウントが発生しない（既存仕様）ため、monster_seed の生成は outdoor / dungeon エンカウント時のみ実行される。既存の分離ロジックは変更しない。

## 3. 既存機能との整合（壊さない点）
- `state['battle']` への追加フィールドは任意キーのため、未対応クライアントは無視して既存フォールバック画像（SVG文字列）を表示する後方互換を維持する。
- 図鑑（モンスター図鑑）には `monster_seed` ではなく `monster_type` と `monster_palette` を記録し、図鑑表示時は固定seed（例: `monster_type` の文字コード合計値）で描画して一貫した図鑑画像にする。
- セーブ/ロード（冒険の書）は `state['battle']` ごと保存するため、ロード後も同じ戦闘画面が復元される。
- スマホ対応：Canvas描画はCSSの `max-width: 100%` で収まるサイズ（最大160×160px）に制限し、既存レイアウトを崩さない。