広大スクロールマップ：20×20タイル以上のCanvas描画＋スムーズスクロール対応

## 1. 目的
現在のマップは 9〜10行×12列程度の固定小サイズで、ブラウザ全画面化した際に余白が目立ち「広大な世界」の没入感が乏しい。マップサイズを 24×24 タイル以上に拡張し、プレイヤー中心のビューポートでCanvas描画＋スムーズスクロールを実装することで、探索の楽しさと視覚的迫力を大幅に向上させる。

## 2. 具体的な仕様

### 2-1. マップデータ拡張（PHP側 lib.php の rpgsf_assets()）
- `maps` および `submaps` の `rows` を 24行×24列（最小）に拡張する
- 既存の 9×12 テンプレートは中央部分として再利用し、外周をランダム地形（草・山・森）で自動パディングする PHP 関数 `rpgsf_expand_map(array $rows, int $target_w, int $target_h): array` を追加
- シナリオ生成時（`rpgsf_create_scenario`）に `rpgsf_expand_map` を呼び出し、`scenario_json` 内の `map.rows` / `submap.rows` を 24×24 以上で保存する
- 既存シナリオの後方互換：ロード時に `rows` が 12行未満なら `rpgsf_expand_map` で動的拡張する

### 2-2. Canvas描画エンジン（JS側 pages/play.php インライン）
- タイル1枚サイズ：PC=32px、スマホ=24px（`window.innerWidth < 600` で切り替え）
- ビューポート：画面中央エリアの幅×高さに収まるタイル数だけ描画（例：PC で 640×480px → 20×15タイル表示）
- `camera = { x, y }` をプレイヤー座標に追従させ、描画オフセットを計算する
- スクロールは即時切り替えではなく `requestAnimationFrame` で 8フレームかけて線形補間（lerp）するスムーズスクロールを実装
- タイル描画は既存の手描き風ドット絵Canvas関数（`drawTile(ctx, tileId, px, py, size)`）を流用し、未実装タイルはフォールバックで色塗り＋1文字表示
- プレイヤー・NPC・宝箱・敵スポーンアイコンはタイル上にオーバーレイ描画（既存スプライト Canvas 関数を呼び出し）

### 2-3. 移動処理との整合
- 移動アクション（`action=move&dir=up` 等）はサーバー側の `rpgsf_apply_action` でタイル座標を更新する既存ロジックを維持
- JS側は POST 後のリダイレクト先でサーバーから返却される `state.hero.x / state.hero.y` を読み取り、canvas 再描画時に camera を更新する
- タイル座標が 24×24 範囲内に収まるよう移動チェックを修正（既存の境界チェックを `count($rows)-1` と `strlen($rows[0])-1` で動的に行っているなら変更不要）

### 2-4. ミニマップ更新
- 既存のミニマップ Canvas を 24×24 タイル対応に拡張（1タイル=4px で描画、最大 96×96px）
- 既訪問タイルのみ表示する既存ロジックはそのまま維持
- カメラ範囲を白枠で示すビューポートインジケーターを追加

### 2-5. スマホ対応
- タイルサイズ 24px、ビューポートを `window.innerWidth × (window.innerHeight * 0.55)` に設定しマップエリアを確保
- 既存のスワイプ移動ボタン（十字キー）は位置・サイズ変更なし

### 2-6. 変更しない点（後方互換）
- `rpgsf_assets()` の terrain 定義・NPC/宝箱/敵の配置ロジックは変更しない
- セーブ/ロード・戦闘・ショップ・ナレーション・オーブトラッカーの動作は変更しない
- 既存シナリオ（小マップ）は動的拡張で問題なく動作させる

## 3. 実装ファイル
- `lib.php`：`rpgsf_expand_map()` 追加、`rpgsf_create_scenario` 内で呼び出し、`rpgsf_normalize_state` でロード時拡張
- `pages/play.php`：Canvas描画JS の camera/lerp/viewport ロジック更新、ミニマップ更新
- 既存の `drawTile` / スプライト描画関数は変更なし・流用