ClipGrid - マルチコピー&ペースト拡張クリップボード

## 1. アプリの目的・ターゲットユーザー
コピー&ペースト作業を繰り返すライター・エンジニア・事務職・営業担当者向けに、複数のテキスト断片を「ボード」上にカード形式で保持し、組み合わせ・並び替え・テンプレート展開まで一気通貫で行える拡張クリップボードツール。ブラウザだけで完結し、登録不要・サーバー送信なし（LocalStorage保存）で安全に使える。

## 2. 主要機能
- **マルチクリップ保存**：テキストを最大30枚のカードとして保存。各カードにタイトル・タグ・色ラベルを付けられる。カードはワンクリックでコピー。
- **スナップ結合**：複数カードにチェックを入れ、区切り文字（改行 / スペース / カンマ / カスタム）を指定してワンクリックで結合コピー。複数パーツを組み合わせて1つの文章を作る作業に最適。
- **テンプレート変数展開**：`{{氏名}}` `{{日付}}` `{{金額}}` などのプレースホルダーをカード内に記述し、「展開モード」でフォームに値を入力すると完成テキストをコピーできる。
- **タグ&カラーフィルター**：タグ検索・色ラベルフィルターでカードを素早く絞り込み。最大10色、タグは自由入力。
- **ボードのエクスポート/インポート**：全カードをJSON形式でダウンロード・アップロード。チームメンバーへのボード共有やバックアップに使用。
- **使用頻度ソート**：コピー回数を自動カウントし、よく使うカードを上位表示できる「人気順」ビュー。

## 3. 画面構成
- **ヘッダー**：アプリ名ロゴ、タグ検索バー、色フィルタードット、ソート切替（追加順 / 人気順 / タグ順）、JSONエクスポート/インポートボタン
- **カード追加エリア（ページ上部）**：テキストエリア（貼り付け or 入力）、タイトル入力、タグ入力、カラーラベル選択、「追加」ボタン
- **カードグリッド（メインエリア）**：カード一覧をMasonryまたは3列グリッドで表示。各カードにタイトル・テキストプレビュー（最大3行）・タグバッジ・コピーボタン・選択チェックボックス・編集ボタン・削除ボタンを配置。コピー済は0.5秒「✓ コピー済」フィードバック。
- **スナップ結合バー（フッター固定）**：1枚以上チェック時に出現。選択枚数表示、区切り文字ドロップダウン、「結合してコピー」ボタン。
- **展開モーダル**：テンプレートカードのコピーボタン押下時に表示。変数一覧をフォームで入力し「完成テキストをコピー」。
- **編集モーダル**：カードのテキスト・タイトル・タグ・色を編集。

## 4. データ構造
DBは使用しない。全データをLocalStorageに保存。
```
clipgrid_cards: [
{
id: string (UUID),
title: string,
text: string,
tags: string[],
color: string (HEXまたはカラーキー),
copyCount: number,
createdAt: ISO8601,
updatedAt: ISO8601
}
]
clipgrid_settings: {
defaultSeparator: string,
theme: 'light' | 'dark'
}
```
JSONエクスポートはこのオブジェクトをそのままファイル出力。インポート時は既存カードとマージ（id重複はスキップ）。

## 5. デザインの方向性
- **配色**：ベースはオフホワイト（#F8F9FA）とチャコール（#343A40）のライトテーマ。ダークテーマ切替対応。カードの色ラベルは左ボーダー4pxで表現（赤 / オレンジ / 黄 / 緑 / 青 / 紫 / ピンク / 水色 / グレー / ブラック）。
- **フォント**：Noto Sans JP（Googleフォント）。カードタイトルは14px太字、本文は13px通常。
- **カードUI**：角丸8px、影は軽め（box-shadow: 0 1px 4px rgba(0,0,0,0.12)）。チェック選択時は青いリング枠で強調。コピー済フィードバックはボタン色が緑に変化しアニメーション。
- **レスポンシブ**：PCは3列グリッド、タブレットは2列、スマホは1列。スナップ結合バーはスマホでも下部に常時表示。
- **テイスト**：シンプルでプロフェッショナル。派手な装飾を避け、操作スピードを最優先にした情報密度高めのUI。
- **実装スタック**：PHP（静的ページ配信のみ、DB不使用）、HTML5、CSS3（Grid / Flexbox）、バニラJS（ES6+）。外部依存はGoogleフォントのみ。