ワードアーキテクト - 文字ブロックで街を建設するワードパズルゲーム

## 1. アプリの目的・ターゲットユーザー
既存のワードゲームやパズルゲームとは異なり、「単語を作ること」が直接「街の建設」に繋がるユニークなゲームループを提供する。単語を作るたびにビルや施設が建ち、街が成長していく達成感が楽しめる。小学生高学年〜大人まで幅広く対象とし、語彙力を活かしながらまちづくりを楽しみたいユーザー向け。

## 2. 主要機能
- **単語建設システム**: 7×7のランダムひらがなタイルから文字を選んで単語を作ると、文字数に応じた建物（2文字=小屋、3文字=民家、4文字=ビル、5文字以上=タワー）が街に出現する
- **街マップ表示**: 10×10のグリッドマップに建物が自動配置されていく。建物のピクセルアートはCSSで描画し、街の人口・発展度スコアをリアルタイム表示
- **時間制＆ターン制の2モード**: 「タイムアタックモード」（3分間でスコアを最大化）と「じっくり建築モード」（制限なし、200ターンで完成度を競う）
- **コンボ・テーマボーナス**: 同カテゴリの単語（動物・食べ物・乗り物など）を連続して作るとコンボボーナス発動。テーマに沿ったビルのアイコンに変化する演出あり
- **デイリーチャレンジ**: 毎日共通の文字セットで遊べるデイリーモード。スコアをDBに保存してランキングに登録可能（ニックネームのみ）
- **街の保存・共有**: 完成した街のスナップショット（Canvas→PNG）をダウンロードできる

## 3. 画面構成
- **タイトル画面**: モード選択（タイムアタック / じっくり建築 / デイリー）、ルール説明、ランキングボタン
- **ゲーム画面（メイン）**:
- 上部: スコア・残り時間 or ターン数・人口カウンター
- 中央左: 7×7ひらがなタイルパネル（タップで文字を選択→単語候補欄に追加）
- 中央右: 10×10の街マップ（Canvas描画、建物がポップアップアニメーションで出現）
- 下部: 選択中の単語表示欄・「確定」ボタン・「クリア」ボタン・コンボ表示
- **結果画面**: 最終スコア・建てた建物一覧・作った単語リスト・街の完成PNG・ランキング登録フォーム
- **ランキング画面**: デイリー / 全期間の上位20件をスコア順に表示

## 4. データ構造
```sql
-- ランキング保存テーブル（デイリーチャレンジのみDBを使用）
CREATE TABLE word_architect_ranking (
id INT AUTO_INCREMENT PRIMARY KEY,
nickname VARCHAR(20) NOT NULL,
mode ENUM('daily','timeattack') NOT NULL,
score INT NOT NULL,
word_count INT NOT NULL,
building_count INT NOT NULL,
daily_seed DATE, -- デイリー用の日付シード
created_at DATETIME DEFAULT CURRENT_TIMESTAMP
);
```
- タイルの生成・単語判定・街マップはすべてブラウザ側JS処理
- 単語辞書: ひらがな約5000語の内製JSON辞書（動物・食べ物・乗り物・自然・日用品など10カテゴリ付き）をJSファイルに同梱
- じっくり建築モードの途中保存はLocalStorageを使用

## 5. デザインの方向性
- **ポップなピクセルアート風**: 建物はCSSのbox-shadowとborder-radiusで16bit風に表現。背景は薄い空色グラデーション
- **カラーパレット**: 空色 (#87CEEB) ・草緑 (#6ABF69) ・レンガ (#D97B55) ・ビル灰 (#90A4AE) ・ゴールド (#FFD54F) を基調とした明るい街並み
- **アニメーション**: 建物出現時にポップアップ（transform: scaleY）、コンボ時に花火エフェクト（CSSキーフレーム）
- **フォント**: 見出しに丸ゴシック系Webフォント（Noto Sans JP）、タイルは大きめの太字で視認性重視
- **スマホ対応**: タイルは最低44pxのタッチターゲット、街マップはスクロールなしで収まるようレスポンシブ調整。縦並びレイアウトに切り替え