パレットのCSS/Sass/Tailwind変数スニペット一括コピー機能の追加

## 1. 目的
デザイナー・フロントエンドエンジニアが生成したパレットをそのまま実装に持ち込めるよう、現在表示中のパレット（最大6色）をCSS Custom Properties / Sass変数 / Tailwind設定スニペットとして即座にコピーできる機能を追加する。色ごとに個別コピーするステップを省き、コーディング開始までのフリクションをゼロにする。

## 2. 具体的な仕様

### 2-1. UI配置
- パレット表示エリア（自動生成・画像抽出・プリセット共通）の下部に、既存の「保存」ボタンと横並びで **「コードコピー」ボタン** を追加する。
- ボタンクリックで小さなモーダル（または同一画面内のドロワー）を表示。スマホでは画面下部からスライドアップするボトムシート形式にする。

### 2-2. モーダル内のタブ構成
タブ3種を横並びで配置：
| タブ名 | 出力形式 |
|---|---|
| CSS | CSS Custom Properties (`:root {}`) |
| Sass | Sass変数 (`$color-1: ...;`) |
| Tailwind | `tailwind.config.js` の `extend.colors` オブジェクト |

### 2-3. 各フォーマットの出力仕様
**CSS タブ出力例（パレット名がある場合はコメントに使用）：**
```css
/* MyPalette */
:root {
--color-1: #FF6B6B;
--color-2: #FFE66D;
--color-3: #4ECDC4;
--color-4: #45B7D1;
--color-5: #96CEB4;
}
```

**Sass タブ出力例：**
```scss
// MyPalette
$color-1: #FF6B6B;
$color-2: #FFE66D;
$color-3: #4ECDC4;
$color-4: #45B7D1;
$color-5: #96CEB4;
```

**Tailwind タブ出力例：**
```js
// tailwind.config.js > theme.extend.colors
colors: {
'palette-1': '#FF6B6B',
'palette-2': '#FFE66D',
'palette-3': '#4ECDC4',
'palette-4': '#45B7D1',
'palette-5': '#96CEB4',
}
```

### 2-4. 変数名のカスタマイズ
- モーダル内に **プレフィックス入力欄**（デフォルト: `color` / `palette`）を設置し、リアルタイムでプレビューに反映する。
- 入力欄はシンプルな `<input type="text" maxlength="20">` で実装。英数字・ハイフン・アンダースコアのみ許可（JSで入力バリデーション）。

### 2-5. コピーボタン
- モーダル下部に **「クリップボードにコピー」** ボタンを配置。
- `navigator.clipboard.writeText()` でコピー、フォールバックとして `document.execCommand('copy')` を使用（外部APIなし）。
- コピー成功時はボタンテキストを「✓ コピーしました」に0.8秒変化させてフィードバック。

### 2-6. カラーフォーマット選択
- モーダル右上に小さなセレクトボックスで出力する色フォーマットを選択可能にする：`HEX`（デフォルト） / `RGB` / `HSL`。
- 選択に応じてプレビューの色値がリアルタイム切替。

## 3. 既存機能との整合
- 自動生成・画像抽出・プリセットの3種すべてのパレット表示状態から同一コンポーネントを呼び出す設計にし、表示中の色配列（最大6色）を引数として渡すだけで動作させる。
- 既存の「ワンクリックコピー（単色HEX）」機能はそのまま維持し、本機能はあくまで「パレット全体をまとめてコード化する」上位操作として追加する。
- DBへの保存ロジック・ギャラリー・アクセシビリティチェック・Webレイアウトプレビューへの影響は一切なし。
- PHPファイル追加は不要。JS関数とモーダル用HTML/CSSの追加のみで完結する。