# トップ 仕様（v3 / top）— 2026-10-15 初回 3案

置き場所: `v3/top/` — 共通部品は `../scene/mock/screens.js` / `screens.css`（シーン選択と共有）。
- `mock/top.html?p=a|b|c&lang=ja|zh-TW`（`top.js` / `top.css`）、`mock/render.py`
- 比較シートは `../scene/mock/compare.py` が作る。
- 想定は2回目以降の来訪（01 クリア済み・次は 02）。スキンは C 夜市。

## 守っていること
- 舞台は記号の吹き出しだけ・言葉はパネルだけ・ちびキャラ4人の雑談・止め絵（SCENE-SPEC と同じ）。
- 公式マーク（手描き白線の切り抜き、#FF2D95、描き直しなし）は「タイトル画面のロゴ」として使う（CHARACTERS.md の使う場所）。キャラや吹き出しとは重ねない。ワードマーク「nika typing」は Nunito。
- 結果画面と同じ部品・色・書体（ネオン管の額縁、シアンの主ボタン＋Enter 札、副ボタン、金のパック札）。
- ノンゴール: ランキング・オンライン人数・フレンド・ログイン誘導・課金は出さない。出すのは自分の進み具合（コミケ 1/5）と学習ペア（繁中 ⇄ 日本語）だけ。
- 右上は UI 言語ピル（日本語／繁中）。タグライン ja「好きな場面の、使いたいひとことを。」／zh「在喜歡的場景，打出想說的那句話。」

## 3案
- **案A タイトル舞台（おすすめ）** — 4人の雑談が画面の主役。上にロゴ、下に YOUR TURN 型のパネルを1枚だけ置き、主ボタンは「つづきから（NEXT · 02 列に並んで雑談）」。副は「シーンを選ぶ」「せってい」。開いてすぐ、どんな遊びか・次に何をするかが分かる。
- **案B つづき＋パック** — 結果画面 P1 と同じ「左＝舞台／右＝パネル」。右パネルに「つづきから」のカード、パック（コミケ 1/5、つぎのパックは準備中）、世界観の3択（ロビー／旅／夜市）、ヒントと設定まで1画面に並べる。できることは一目で分かるが、情報は多め。
- **案C ワンボタン** — ぼかした舞台の上に、大きなロゴと「はじめる」だけ。いちばん静かで迷わないが、雑談の記号が出せず（ぼかしキャラと合わない）、ゲームらしさは弱い。

## 書き出し（`png/`）
- `compare-top.png` … まず見せる1枚（PC 3案＋スマホ 3案、おすすめ枠つき）
- `compare-top-lang.png` … 案A の日本語／繁中
- `top-{A,B,C}-ja--{desktop,mobile}.png`、`top-A-zh-TW--{desktop,mobile}.png`

## 確認して直したこと
- 下パネルの土台スタイルがシーン選択側にしかなく、トップでパネルが画面上端に出ていた → 共通 CSS へ移動。
- 案B: 下段の学習ペアとチップが重なっていた → 共通の行レイアウトに。主ボタンの小見出しがカードの題と重複 → 外した。
- 案A スマホ: キャラが浮いて見えた → 大きくしてパネル上端でフェード。右端の吹き出しが切れていた → 内側へ。
- 案C スマホ: 区切りの「·」が行頭に残っていた → スマホでは外す。進捗バーの中身が消えていた → セレクタを修正。

## 残課題
- 初回来訪の版（主ボタン「はじめる · 01 ブースで雑談」、学習ペアの選択）はまだ作っていない。
- 「せってい」の中身（ヒント表示、世界観、UI 言語）は未設計。

## 磨き1（2026-10-15夜デイリー）
3案のレイアウトは変えず、「次に何をするか」と「どこまで進んだか」を読みやすくした。止め絵のまま（animation／@keyframes なし）。ロゴは手描き白線の切り抜きのまま、キャラ・吹き出しとは重ねていない。
- 実装: `mock/polish1.css` / `mock/polish1.js`（top.js の描画後に後処理。body に `.p1x`）。**既定で磨き1が入る**。初稿は `top.html?…&v=0`。
- 書き出し: `mock/render-polish1.py`（2x・`--check` あり）、比較シートは `../scene/mock/compare-polish1.py`。

### 変えたこと
- **進捗を5つの札で（A/B/C 共通）**: バーをやめて、5シーンを札で見せる（クリア＝金にランク「A」／つぎ＝シアンの縁／まだ＝点線）。数字「1/5」は Nunito 22px の金で大きく。
- **案A つづきから**: 上に「NEXT 02 · 列に並んで雑談」（シーン名の先読みはそのまま）、下にひとこと「列の最後尾、聞ける？」（繁中 UI は「敢開口問隊伍的最後面嗎？」）。ボタンを少し高く（PC 78px／スマホ 66px）。
- **案B 引き算**: 「パック」見出し（COMIKET 札と重複）、「つぎのパックは準備中」カード、ヒント札、「雑談5つ」を外した。世界観は見出しをやめて、行頭の小さな「🎨 世界観 · いつでも変えられます」に。つづきからのカードに最初のひとこと（日本語／ローマ字／繁中の3段）を出し、主ボタンは「雑談にまざる」だけで二重の見出しなし。空いた分は世界観サムネを大きく。
- **案C**: 最小のまま、進捗チップの縁と背景を少し濃く、5つの札で。主ボタンには案A と同じ先読みとひとこと。

### 書き出し（`png/`）
- `compare-top-polish1.png` … まず見せる1枚（PC 3案＋スマホ 3案、案A おすすめ枠）
- `compare-top-lang-polish1.png` … 案A の日本語／繁中
- `top-{A,B,C}-ja-polish1--{desktop,mobile}.png`、`top-A-zh-TW-polish1--{desktop,mobile}.png`（2x）

### 確認して直したこと
- 案B: ボタンにも「NEXT 02 · 列に並んで雑談」とひとことを入れたら、カードの題・フレーズと二重になった → 案B のボタンは1段に戻した。
- 案B PC: 引き算で下が空いた → 世界観サムネを 112px に。

### 残課題
- 初回来訪の版（主ボタン「はじめる · 01 ブースで雑談」、学習ペアの選択）はまだ作っていない。
- 「せってい」の中身（ヒント表示、世界観、UI 言語）は未設計。
- ひとこと「列の最後尾、聞ける？」はシーンごとに1つ必要（01〜05 の文案）。

## 決定（2026-10-16）
- トップは **案A「タイトル舞台」（磨き1）で確定**。シーンに鍵はかけない。
- 初回来訪の版は `../first/FIRST-SPEC.md`、「せってい」は `../settings/SETTINGS-SPEC.md` に分けて設計中（2026-10-16 初回3案）。