SoundMap - 世界の環境音・BGM探索プレイヤー

## 1. アプリの目的・ターゲットユーザー
世界各地の環境音（カフェ・雨・森・海・都市・夜の虫の声など）をブラウザで再生し、集中・リラックス・睡眠導入に活用できる無料アンビエントサウンドプレイヤー。外部APIなしに内製の音声データ（Web Audio API で生成するプロシージャル音響＋プリセットのmp3/ogg）で完結させる。ターゲットは在宅ワーカー・学生・睡眠改善を求める大人・ASMR好きな若年層。

## 2. 主要機能
- **サウンドマップ**: SVGまたはCanvas描画の世界地図上に「音のピン」を配置。ピンをクリック／タップするとその場所の環境音が再生される（例：東京→雑踏、パリ→カフェ、アマゾン→熱帯雨林、北極→風雪、ニューヨーク→地下鉄）。合計20〜30種類のロケーション収録。
- **ミックスプレイヤー**: 複数の音を同時に重ねて再生できる。各チャンネルに個別ボリュームスライダーを設け、「雨＋カフェ＋ジャズ」などオリジナルミックスを作成可能。
- **タイマー付きスリープモード**: 15・30・60・90分のタイマーをセットするとフェードアウトして停止。就寝前の利用を想定。
- **マイミックス保存**: localStorage にお気に入りのミックス設定（使用音源IDとボリューム値）を最大5件保存・呼び出し。
- **ムード別プリセット**: 「集中」「リラックス」「睡眠」「自然」「都市」の5カテゴリーからワンクリックでおすすめミックスを即起動。
- **ビジュアライザー**: 再生中の音に合わせてCanvas上でゆらぎのあるアニメーション（波紋・粒子・星空など背景に合わせて変化）を表示。

## 3. 画面構成
- **ヘッダー**: ロゴ「SoundMap」、ムード別プリセットボタン（5種）、スリープタイマーボタン
- **メインエリア（左寄せ or 上部）**: インタラクティブ世界地図。ピンをホバーで地名と音の種類をツールチップ表示、クリックで追加再生
- **ミックスコンソール（右サイドまたは下部）**: 現在再生中のチャンネル一覧。各行にアイコン・地名・音種・ボリュームスライダー・削除ボタン。最大4チャンネル同時再生。
- **ビジュアライザーエリア**: 地図の背景または全画面モードで表示切替可能なアニメーション
- **保存済みミックスパネル**: 5スロットのカード型UI、保存・ロードボタン
- **フッター**: 音源クレジット表記、使い方ヒント
- スマホ時はタブ切替（マップ ／ ミックス ／ 保存済み）でナビゲーション

## 4. データ構造
DBは不要（フルクライアントサイド）。

```js
// sounds_data.js（静的JSONオブジェクト）
const SOUNDS = [
{ id: 'tokyo_city', label: '東京 - 都市の雑踏', region: 'asia', lat: 35.68, lng: 139.69, file: 'audio/tokyo_city.mp3', category: '都市' },
{ id: 'amazon_rain', label: 'アマゾン - 熱帯雨林', region: 'america', lat: -3.47, lng: -62.21, file: 'audio/amazon_rain.mp3', category: '自然' },
// ... 合計28件
];

// localStorage保存形式
{
"savedMixes": [
{ "name": "夜の作業", "channels": [ {"id": "cafe_paris", "vol": 0.6}, {"id": "rain_london", "vol": 0.4} ] },
...
]
}
```

音声ファイルはサーバーに mp3/ogg を設置。一部（ホワイトノイズ・ピンクノイズ・バイノーラルビート）は Web Audio API でプロシージャル生成しファイル不要にする。

## 5. デザインの方向性
- **テーマカラー**: 深海ネイビー (#0d1b2a) ベース、アクセントは水色 (#4fc3f7) と琥珀 (#ffb74d)
- **雰囲気**: プラネタリウム・夜空を連想させるダークモード固定。地図は暗めのウォームグレー地に発光するピン
- **フォント**: 見出しは細めのサンセリフ（Noto Sans JP）、英語部分はモノスペース系でトラベル感を演出
- **アニメーション**: ピンが微細にパルスして生きているように見せる。ビジュアライザーはゆったりとした波紋エフェクト
- **全体感**: 地図を眺めながら旅しているような没入感。余白を広く取り、夜のリラックスシーンに馴染む落ち着いたUI