レシピ缶詰メーカー - 冷蔵庫の残り食材からレシピを自動生成

## 1. アプリの目的・ターゲットユーザー
冷蔵庫にある食材を入力すると、その食材だけで作れる料理レシピを自動提案するWebアプリ。「今日の献立が思いつかない」「食材を余らせたくない」という悩みを持つ一人暮らし〜ファミリー層がターゲット。外部APIなしで動作する内製レシピDBを活用する。

## 2. 主要機能
- **食材タグ入力**: テキスト入力 or よく使う食材ボタン (野菜・肉・魚・調味料など) をタップして食材リストを構築
- **レシピ自動マッチング**: 入力食材とDBレシピを照合し「完全一致」「8割一致 (少し買い足し)」「アレンジ可能」の3段階で候補を提示
- **レシピ詳細表示**: 材料一覧・手順・調理時間・カロリー目安・難易度をカード形式で表示
- **お気に入り保存**: LocalStorage を使ってお気に入りレシピをブラウザに保存
- **ジャンル・調理時間フィルター**: 和食/洋食/中華/鍋/スープ/丼 × 15分以内/30分以内/1時間以内でフィルタリング
- **季節のおすすめ**: 現在の月から季節の旬食材を使ったレシピをトップにピックアップ表示

## 3. 画面構成
- **トップ画面**: アプリロゴ + 食材入力エリア (タグ型テキストフィールド) + よく使う食材クイックボタン群 (最大20個) + 「レシピを探す」ボタン + 季節のおすすめレシピカード (横スクロール)
- **検索結果画面**: マッチ度別タブ (完全一致 / もう少し / アレンジ) + レシピカードグリッド (サムネイルアイコン・料理名・調理時間・難易度・マッチ食材数表示) + フィルターバー
- **レシピ詳細モーダル**: 料理名・絵文字アイコン・調理時間・難易度・カロリー目安 / 材料リスト (手持ち食材はハイライト、不足食材は赤字) / ステップバイステップの手順 / お気に入りボタン
- **お気に入りページ**: 保存済みレシピ一覧 (削除ボタン付き)
- **ヘッダー**: ロゴ + ナビ (ホーム / お気に入り)

## 4. データ構造
レシピデータは PHP の連想配列 or JSON ファイルとして静的に管理 (DB不要・100〜150レシピを内包)。
```
recipes.json
[
{
"id": 1,
"name": "豚キムチ炒め",
"emoji": "🥩",
"genre": "和食",
"time": 15,
"difficulty": 1,
"calories": 380,
"season": [1,2,3,4,5,6,7,8,9,10,11,12],
"ingredients": ["豚肉","キムチ","ごま油","醤油","ニラ"],
"steps": ["豚肉を一口大に切る", "フライパンで豚肉を炒める", "キムチを加えて炒め合わせる", "醤油・ごま油で味を整える", "ニラを加えてさっと炒めて完成"]
},
...
]
```
お気に入りは LocalStorage に recipe id の配列として保存。アクセスログのみ必要な場合は MySQL テーブル (logs: id, searched_ingredients TEXT, created_at) を任意で追加。

## 5. デザインの方向性
- カラーテーマ: 食欲をそそる温かみのあるオレンジ〜クリーム系 (#FF8C42 / #FFF5E4 / #4A4A4A)
- フォント: 丸みのある読みやすい日本語フォント (Noto Sans JP)
- 食材タグ: 丸角バッジ + ×ボタンで削除できるピル型UI
- レシピカード: 影付きの白カード・絵文字アイコンで画像なしでも映えるデザイン
- マッチ度インジケーター: 緑/黄/グレーのバッジで直感的に識別
- スマホ優先のボトムナビ、PC ではサイドバー構成
- アニメーション: 検索ボタン押下時に食材がカップに「ぽちゃん」と落ちる小さなCSS演出