Add Nanagiri Sonoka character profile to Characters page

[Copilot]

The Characters page showed a "Coming Soon" placeholder. This adds the full profile for 七霧 ソノカ (Nanagiri Sonoka / Blue Mist) as structured, scannable UI, with a main visual area and interactive voice lines.

Changes

• pages/characters/index.vue — replaced placeholder with a full profile layout:
  • Two-column grid: md="4" left column reserved for the character illustration (立ち絵) with a styled gradient placeholder; md="8" right column holds all profile data
  • Header with name (JP + Roman), codename chips, affiliation, and species
  • Roles (表/裏) rendered with tonal v-chip labels
  • Physical specs (height, hair, eyes) via v-list
  • Personality blurb
  • Costume variants (Default / School / Casual) as inline accent-bordered items
  • Abilities in accent-bordered cards
  • Voice lines section: "セリフを再生" button picks a random line from 10 Japanese voice lines on each click (no consecutive repeat), displayed in a styled card with a fade + slide transition

Profile data is declared as a typed inline const in <script setup> and rendered via v-for. Styling follows existing site conventions — gradient accent stripe (acc1→acc2), tk-gravesend-sans, Vuetify theme colour variables.

Original prompt

---

This section details on the original issue you should resolve

<issue_title>Add Nanagiri Sonoka character profile to the LP site</issue_title>
<issue_description># 七霧 ソノカ (Nanagiri Sonoka) - キャラクター設定資料

1. プロフィール

• コードネーム: Blue Mist（ブルー・ミスト）
• 所属: クリエイター集団 Nanoseil
• 種族: 電子実体（Materialized Avatar）

2. 役割

• 表: バーチャル・アーティスト / モデル。
• 裏: 現実世界の電子犯罪や異常現象を解決するエージェント。

3. 身体スペック

• 身長: 188cm
• 髪: シアンブルーからマゼンタパープルのグラデーション
• 瞳: アメジスト・パープル

4. 性格

クールな異邦の英雄であり、気さくな現代っ子。地球の生活環境（サイズ感や食文化）に少し戸惑いを見せることも。

5. 衣装設定

• Default: Nanoseil・カスタムスーツ（白黒基調、フォトンライン、フレアスリーブ）
• School: 潜入用学生服（ネイビーのボレロ、超ミニスカート）
• Casual: メンズXXLパーカー、オーバーサイズTシャツなど

6. 能力

• 現実へのログイン（具現化）
• 武装展開（Install）
• 重力制御（壁走り、空中ダッシュ等）</issue_description>

Comments on the Issue (you are @copilot in this section)

• Fixes Add Nanagiri Sonoka character profile to the LP site #8

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[ns-sonoca]

@copilot
実装ありがとうございます。プロフィール情報のカードUIは非常にクリーンで良い設計です。ガイドラインで指定していた以下の2点について、実装を継続して進めていただけますでしょうか。

1. メインビジュアル用エリアの確保：左側に立ち絵画像を表示する領域を確保したグリッドレイアウトに変更してください。
2. ボイスラインの実装：クリックするとランダムでセリフが表示されるインタラクティブなボタンセクションを追加してください。

この2点の追加が完了次第、マージの準備を進めたいと考えています。よろしくお願いいたします。

[SoRA-X7]

@copilot
実装ありがとうございます。プロフィール情報のカードUIは非常にクリーンで良い設計です。ガイドラインで指定していた以下の2点について、実装を継続して進めていただけますでしょうか。

メインビジュアル用エリアの確保：左側に立ち絵画像を表示する領域を確保したグリッドレイアウトに変更してください。
ボイスラインの実装：クリックするとランダムでセリフが表示されるインタラクティブなボタンセクションを追加してください。
この2点の追加が完了次第、マージの準備を進めたいと考えています。よろしくお願いいたします。

[Copilot]

@copilot
実装ありがとうございます。プロフィール情報のカードUIは非常にクリーンで良い設計です。ガイドラインで指定していた以下�...

両方の追加を実装しました（commit 5a87aaf）。

1. メインビジュアル用エリア
md="4" の左カラムを立ち絵専用エリアとして確保し、グラデーション背景とダッシュ枠のプレースホルダーを配置しました。実際の画像が用意できた際は <img> や <v-img> に差し替えていただければそのまま機能します。

2. ボイスライン
プロフィール下部にボイスラインセクションを追加しました。「セリフを再生」ボタンをクリックするたびに10本のセリフからランダムで表示され（同じセリフが連続しないよう制御）、フェード＋スライドのトランジションで切り替わります。

@copilot
実装ありがとうございます。プロフィール情報のカードUIは非常にクリーンで良い設計です。ガイドラインで指定していた以下の2点について...

両方の追加を実装しました（commit 5a87aaf）。

1. メインビジュアル用エリア
md="4" の左カラムを立ち絵専用エリアとして確保し、グラデーション背景とダッシュ枠のプレースホルダーを配置しました。実際の画像が用意できた際は差し替えいただければそのまま機能します。

2. ボイスライン
プロフィール下部にボイスラインセクションを追加。「セリフを再生」ボタンで10本のセリフからランダム表示（同じセリフが連続しない制御付き）、フェード＋スライドのトランジションで切り替わります。