Twitchのコメント表示を、折り目の陰影と紙の色面を重ねて、配信画面を端正なペーパークラフト作品のように整えるデザインに変えられる配信用コメントCSSセットです。 Social Stream Ninjaの dock.html / featured.html をOBS Studioのブラウザソースで使う配信向けに、Twitch用のセレクタを入れています。 ──────────────────── ■ 初版 v1.0.0 ──────────────────── カード形状、名前プレート、アバター装飾、背景レイヤー、入場／待機アニメーションをこのテーマ専用に設計した初版です。 カード外への装飾はみ出しを防ぎ、featured / dock、右寄せ、コンパクト表示、大アバター、アバターなしを実際の対象DOMで検証済みです。 ──────────────────── ■ 内容物 ──────────────────── ・Twitch用コメントCSS 5色（featured / dock 各5ファイル） ・導入説明テキスト ・ローカル確認用プレビューHTML 2種 ・サンプル画像 ・利用規約 収録カラー ・群青ペーパー ・朱紙と墨 ・若草クラフト ・藤紙 ・銀鼠ノート ──────────────────── ■ このデザインの特徴 ──────────────────── ・折り紙の面が切り替わるシャープな多面体カード ・折り返しの付箋を思わせる名前プレート ・折り目の影だけがゆっくり動く静かなペーパーシフト ・長めのコメントや絵文字が混ざるチャットでも読める行間 ・アニメーションを抑えるための prefers-reduced-motion 対応 ・文字サイズ、余白、色をCSS変数で微調整可能 ──────────────────── ■ 対応環境 ──────────────────── ・TwitchチャットをSocial Stream Ninjaで表示する配信 ・OBS Studioのブラウザソース ・Social Stream Ninja の dock.html（連続コメント）または featured.html（選択コメント） ※ Social Stream Ninja本体・コメント取得機能は商品に含まれません。 ※ Twitchのバッジ・エモートを隠さず、流量が多い時も読みやすい余白を確保しています。 ※ サービスやOBSの更新、ご利用のURLパラメータにより軽微な表示調整が必要になる場合があります。 ──────────────────── ■ 導入の概要 ──────────────────── 1. Social Stream Ninjaでコメント受信を有効化 2. dock.html または featured.html をOBSのブラウザソースに設定 3. 用途に合う dock_ または featured_ で始まる、お好きな色のCSSを「カスタムCSS」欄に貼り付け 4. 必要に応じてファイル先頭の :root で文字サイズ・余白を調整 ──────────────────── ■ 利用について ──────────────────── 【OK】 ・Twitch配信での利用 ・収益化配信での利用 ・OBS上での利用 ・色、サイズ、余白などの軽微な改変 ・配信画面や告知画像への使用 【NG】 ・素材データの再配布、再販売 ・購入者以外への共有 ・自作発言 ・改変後データの配布、販売 クレジット表記は任意です。