戦闘画面モンスタードット絵のCanvas自動生成リッチ化（部位別カラーパレット＋アニメーション）

## 1. 目的
現在の戦闘画面ではモンスターのドット絵がCanvas描画で生成されているが、全モンスターが類似したシルエット・色使いになりやすい。モンスターの種別（スライム系・ドラゴン系・アンデッド系・悪魔系・魔法生物系など）ごとに専用の「部位別描画ルール」と「カラーパレット」を定義し、より個性的なドット絵を自動生成する。さらにアイドルアニメーション（上下ゆらぎ・点滅）を加えてSFC風の迫力を演出する。

## 2. 具体的な仕様

### 2-1. モンスタータイプ分類
`rpgsf_assets()` の `enemies` 配列に `sprite_type` キーを追加する。値は以下のいずれか：
- `slime` / `dragon` / `undead` / `demon` / `beast` / `golem` / `humanoid` / `insect` / `elemental`

既存の enemies 配列に `sprite_type` が未定義の場合は、敵の `tags` や名前から自動推定するフォールバック関数 `rpgsf_guess_sprite_type(array $enemy): string` を lib.php に追加する。

### 2-2. Canvas描画関数の拡張（JavaScript側）
play.php のインライン `<script>` 内に `drawMonster(canvas, spriteType, seed, frame)` 関数を実装する。

```
function drawMonster(canvas, spriteType, seed, frame) {
// seedはモンスターIDや名前から生成した整数 (seededRandom)
// frameは0か1（アニメ用）
// spriteTypeに応じてボディ・目・翼・角・尻尾などの部位を
// 12x12〜16x16ドットのピクセルブロックで描画
}
```

各 `spriteType` ごとに以下を定義する：
- **ボディ形状**：矩形の組み合わせ（例: slimeは丸い楕円ブロック、dragonは三角の首と胴、humanoidは二足歩行シルエット）
- **カラーパレット**：メインカラー・影色・ハイライト色・目の色を seed から決定論的に選択
- slime: 緑/青/ピンク/黄などの半透明感ある色相
- dragon: 赤/紫/緑の濃い鱗色
- undead: 灰/茶/白の骨色
- demon: 黒/赤/紫
- beast: 茶/オレンジ/白
- golem: 灰/岩色
- humanoid: 肌色+装備色
- insect: 緑/茶/黒
- elemental: 水色/炎色/土色（タイプ別）
- **アイドルアニメ**：`frame` が0/1で縦方向に1〜2px上下シフト、または目の開閉を切り替え

### 2-3. アニメーションループ
play.php の既存Canvas描画ループ（またはrequestAnimationFrame）に以下を追加：
```javascript
let _monsterFrame = 0;
setInterval(function() {
_monsterFrame = _monsterFrame === 0 ? 1 : 0;
if (currentBattleCanvas) drawMonster(currentBattleCanvas, currentSpriteType, currentSeed, _monsterFrame);
}, 600); // 600msごとにフレーム切り替え
```

### 2-4. HPに応じた演出
- モンスターHP 50%以下：ボディに「ひびワレ」ライン（横線2本）を重ねて描画
- HP 25%以下：色相を全体的に暗くし、点滅（opacityを0.7/1.0で交互）

### 2-5. 勝利エフェクト
モンスター撃破時、Canvasを上方向にスライドアウト（translateYアニメ 300ms）してから非表示にする。

## 3. 既存機能との整合
- 既存の `drawMonster` 関数がある場合はそれを上書き拡張する（関数名・呼び出し箇所を維持）
- monster_book（図鑑）ページでも同じ `drawMonster` 関数を呼び出して図鑑内のサムネを描画することで、図鑑表示も自動的にリッチ化される
- PHP側の enemies 配列に `sprite_type` を追加するだけで既存の戦闘ロジック・セーブデータには影響しない
- スマホ・PC両対応：Canvas サイズは既存の responsive 設定を維持し、pixel ratio に応じて `devicePixelRatio` スケーリングを適用

## 4. 実装規模
- lib.php: `sprite_type` 追加 + `rpgsf_guess_sprite_type()` 関数（約30行）
- play.php インラインJS: `drawMonster()` 拡張（約150〜200行）、アニメループ追加（約20行）
- monster_book表示部: Canvas呼び出し1行追加
- 合計: 250行程度、1サイクルで完成可能な規模