---
format: 1080x1920
duration: 35s
message: "SNS縦動画で使えるテロップの動き10種を、1本で見比べられる"
arc: Cover → 10スタイルを順に点灯（定番→ポップ→説明→煽り→テック→強調→リズム→シネマ→数字→高級）
audience: CM制作のクライアント（テロップの動きを選ぶ人）
mode: autonomous
---

コンセプト1文: 「実案件でそのまま使える10種のテロップ動作を、暗いショールームに1つずつ順番に点灯させる」

デザイン（design source無しのためここに確定）:
- palette: bg #0F1216 / fg #F2EFE8 / accent #FFC94A（アクセント1色。スタイル固有色=グリッチ#FF4D4D×#38E1FF・マーカー#FDD835はそのスタイル内のみ）
- type: Noto Sans JP 700/400（テロップ本文・バンドル済）× IBM Plex Mono 400/700（番号・タグ＝データ声）。display -0.03em
- focal: 中央のデモテロップ（92〜150px）。edge anchors: 左上チローム（番号+名前）・下部進捗ドット（bottom 300px=UIセーフ上）
- background: ホストにビネット+微細ドットグリッド（超低速ドリフト）、チロームにゴースト番号（5%白・560px）

構造: 各スタイル= compositions/tNN-*.html（変数 text/accent つき純テロップユニット）。
カタログ表示= compositions/chrome-01〜10.html（scripts/gen_chrome.py が生成。lintが同一composition idの
複数インスタンスを禁止するため1スタイル=1ファイルに展開）track 2 に重畳。
トラック: 0=base背景 / 1=cover+スタイル / 2=チローム。

## Frame 1 — Cover

- scene: 「テロップモーションパック」タイトルが立ち上がり、10 STYLESバッジがポップ
- duration: 2.2s
- transition_in: cut
- status: animated
- src: compositions/cover.html
- rules: animate-text mask-reveal-up + spring-pop-entrance（calm settle）

パック名を名乗るだけの静かな扉。0.9sで読める文字量に抑える。

## Frame 2 — 01 マスクリビール

- scene: 「期間限定/キャンペーン開催中」が2行、マスクから立ち上がる
- duration: 3.2s
- transition_in: cut
- status: animated
- src: compositions/t01-mask-reveal.html
- rules: animate-text mask-reveal-up（760ms / stagger 90ms / cubic-bezier(0.22,1,0.36,1) / blur 6→0）

定番・上品枠。どの案件にも合う基準スタイルを最初に置く。

## Frame 3 — 02 ポップイン

- scene: 「今だけ、/送料/無料。」が語ごとに弾んで登場
- duration: 3.0s
- transition_in: cut
- status: animated
- src: compositions/t02-spring-pop.html
- rules: spring-pop-entrance（playful variant: back.out(1.7)・rotation±6°交互・stagger 0.14）

バラエティ・娯楽枠。playful register を明示して bouncy 変種を採用。

## Frame 4 — 03 タイプライター

- scene: 「ここだけの話です。」が1字ずつステップ表示、カーソル追従→点滅
- duration: 3.2s
- transition_in: cut
- status: animated
- src: compositions/t03-typewriter.html
- rules: animate-text typewriter（stagger 46ms→JP向け70ms / steps(1,end)）+ context-sensitive-cursor（矩形波点滅はtl.set境界トグル）

解説・vlog枠。全角文字幅=1emを使いカーソル位置は計算で出す（実測しない）。

## Frame 5 — 04 ビートスラム

- scene: 「圧倒的/コスパ/最強」が1拍ずつ別モーションで叩き込まれ、最後に下線スイープ
- duration: 4.0s
- transition_in: cut
- status: animated
- src: compositions/t04-beat-slam.html
- rules: kinetic-beat-slam（PULSE=0.4 / BEATS=[0.4,1.6,2.8] / scale+blur slam・side snap・rise+rotate / finale repeat=floor式）+ css-marker-patterns underline

煽り・ハイプ枠。唯一4.0s（拍間1.2sを守るため）。

## Frame 6 — 05 グリッチ

- scene: 「常識が、変わる。」がRGBズレ+伸長で出現し、一拍置いてバースト1回→クリーン
- duration: 3.0s
- transition_in: cut
- status: animated
- src: compositions/t05-glitch.html
- rules: chromatic-glitch（Form A glitch-stretch entrance GLITCH_DUR 0.45s + emphasis burst 0.15s / JITTER_STEP 1/24 / 量子化ハッシュ・rest clamp）

テック・ゲーム枠。ベース最前面・可読性維持。

## Frame 7 — 06 マーカーハイライト

- scene: 「ここが/最大のポイント」表示後、蛍光マーカーが「最大のポイント」を掃く（文字色は帯同期で反転）
- duration: 3.2s
- transition_in: cut
- status: animated
- src: compositions/t06-marker.html
- rules: css-marker-patterns highlight mode（scaleX 0→1 / power2.out / skewX -2°）

解説・注意喚起枠。マーカー#FDD835、反転色はbg色。

## Frame 8 — 07 ウォーターフォール

- scene: 「見逃したら、/もったい/ない。」が下から鞭のように連鎖到着
- duration: 3.0s
- transition_in: cut
- status: animated
- src: compositions/t07-waterfall.html
- rules: waterfall-entry（binary tl.set + power4.out / 重さ別オフセット60/45/40px / 最終語分割）

リズム・テンポ枠。フェード禁止＝二値出現を守る。

## Frame 9 — 08 フォーカスブラー

- scene: 「静かに、上質に。」が深いボケからピントが合う
- duration: 3.2s
- transition_in: cut
- status: animated
- src: compositions/t08-blur-focus.html
- rules: animate-text focus-blur-resolve（760ms / blur14→0 / scale1.01→1 / cubic-bezier(0.22,1,0.36,1)、blurはプロキシtween+onUpdate）

シネマ・高級枠その1。whole-element。

## Frame 10 — 09 スロットカウンター

- scene: 「満足度」ラベルの横で数字2桁がスロット回転して「98%」に着地
- duration: 3.6s
- transition_in: cut
- status: animated
- src: compositions/t09-slot-counter.html
- rules: vertical-spring-ticker（数字型 / additive springs / back.out 1.8→最終列2.3 / tabular-nums / 着地後dwell≥1s）

数字テロップ枠（価格・％・件数）。マスク高=行高を厳守。

## Frame 11 — 10 グラデーションスイープ

- scene: 「本日、堂々公開。」の字面を金のシアンバンドが一度だけ通過して静止
- duration: 3.4s
- transition_in: cut
- status: animated
- src: compositions/t10-gradient-sweep.html
- rules: gradient-text-sweep（one-pass sheen変種: background-size 300% / 100%→0% / ease none / twin無し=occlusion回避）

高級・締め枠。glyphは動かさない。
