ナンバーフォール - 数字落下パズル計算バトルゲーム

## 1. アプリの目的・ターゲットユーザー
空から降ってくる数字を組み合わせて「目標値」ちょうどにする計算パズルゲーム。四則演算を瞬時に判断する「計算反射神経」を楽しく鍛えられる。小学生高学年〜大人まで幅広く対象。「落ち物パズル×計算ゲーム」という既存アプリにない切り口で差別化する。

---

## 2. 主要機能
- **落下数字の選択・計算**: 画面上から1〜9の数字パネルが複数列に落下。プレイヤーは「+」「-」「×」「÷」ボタンを使って選択した数字を組み合わせ、画面下部に表示される「目標値」ぴったりの計算式を完成させる。正解するとパネルが消えスコア加算。
- **3モード搭載**:
- **エンドレスモード**: 難易度が段階的に上昇（目標値が大きくなる／落下速度アップ）し、ミス3回でゲームオーバー。スコアをDBに登録してランキング掲載。
- **60秒タイムアタック**: 制限時間内に何問正解できるかを競う。スコアDBに登録。
- **デイリーチャレンジ**: 毎日同一シード値で生成された共通問題セット20問に挑戦。全ユーザーが同じ問題を解き、日付ごとのランキングに登録。
- **コンボシステム**: 連続正解でコンボボーナス倍率（×1.5→×2.0→×3.0）が発動。コンボ時にエフェクト演出。
- **スコアランキング**: モード別・難易度別のランキングをDBに保存・表示（ニックネーム入力形式）。
- **難易度選択**: かんたん（1〜9、目標値10以下、足し算のみ）／ふつう（四則演算、目標値50以下）／むずかしい（四則演算＋括弧あり相当の複数ステップ、目標値100以下）。

---

## 3. 画面構成

### タイトル画面
- ゲームロゴ（「ナンバーフォール」大文字）
- 3モードボタン（エンドレス／タイムアタック／デイリー）
- 難易度選択ボタン（かんたん／ふつう／むずかしい）
- 「ランキングを見る」ボタン
- 簡易ルール説明（折りたたみ）

### ゲーム画面
- **上部**: スコア、残りミス数（♥アイコン）、コンボ数、モード別タイマーまたは難易度表示
- **メインエリア（Canvas）**: 縦6列の落下レーン。数字パネルがゆっくり落下。プレイヤーはパネルをクリック／タップで選択（選択済みはハイライト）
- **下部操作バー**: 選択した数字を表示する「式エリア」（例: 3 + 5 = ?）、演算子ボタン（＋－×÷）、決定ボタン、クリアボタン
- **目標値表示**: 画面中央下寄りに大きく現在の目標値を表示（例: 「目標: 12」）
- **正解エフェクト**: 正解時にパネルが光って消えるアニメーション＋「+100!」スコア表示。コンボ時は画面全体フラッシュ。
- **不正解エフェクト**: パネルが赤く振動し♥が1つ減る演出

### ゲームオーバー画面
- 最終スコア、最大コンボ数、正解数
- ニックネーム入力欄＋「ランキングに登録」ボタン
- 「もう一度」「タイトルへ」ボタン

### ランキング画面
- タブ切替: エンドレス（かんたん／ふつう／むずかしい）／タイムアタック／デイリー（日付選択）
- 上位20件をテーブル表示（順位・ニックネーム・スコア・日時）

---

## 4. データ構造（DBテーブル）

```sql
-- スコアランキング
CREATE TABLE scores (
id INT AUTO_INCREMENT PRIMARY KEY,
nickname VARCHAR(20) NOT NULL,
mode ENUM('endless','time_attack','daily') NOT NULL,
difficulty ENUM('easy','normal','hard') NOT NULL,
score INT NOT NULL,
combo_max INT DEFAULT 0,
correct_count INT DEFAULT 0,
daily_date DATE DEFAULT NULL, -- デイリーチャレンジ時のみ
created_at DATETIME DEFAULT CURRENT_TIMESTAMP
);
```

- デイリーチャレンジの問題はサーバー側で `date → seed` に変換してPHPで乱数生成。DBには問題データを保存しない（シードから再現可能）。
- ニックネームは入力時にサーバー側でサニタイズ。8文字以内。

---

## 5. デザインの方向性
- **カラーテーマ**: 深紺（#0D1B2A）背景＋蛍光グリーン（#00FF88）・シアン（#00D4FF）・オレンジ（#FF6B35）のネオンポップ配色。数字パネルは半透明グラスモーフィズム風。
- **フォント**: 数字は太めのモノスペースフォント（Courier New / monospace）で視認性重視。UIテキストは丸ゴシック系。
- **アニメーション**: CSSトランジション＋Canvas描画の組み合わせ。パネル落下はCanvas、UI部分はHTML/CSS。
- **サウンド**: Web Audio APIでシンプルな正解音（高音ポン）・不正解音（低音ブー）・コンボ音（上昇音）を生成。外部ファイル不要。
- **レスポンシブ**: Canvasサイズをウィンドウ幅に合わせてスケール。スマホでは下部操作バーを固定配置し親指で操作しやすいレイアウト。
- **全体トーン**: 気軽に遊べる「脳トレゲーム感」ではなく、スピード感のあるアーケード風の緊張感を演出する。