html-ppt-taste-brutalist

HTML PPT — 戦術テレメトリー／CRT ターミナル

プロジェクトの振り返り、セキュリティレビュー、インフラのインシデント報告、運用手順の解説など、「売り込みではなく、報告です」というプレゼンテーションに適した16:9のスライドデッキです。ピッチデッキではなく、機密解除されたミッション資料のような印象です。

このスキルでは、単一の基盤（ダーク CRT）を採用します。同じ成果物で、明るいスイス印刷モードと混在させないでください。

ソース

Leonxlnx/taste-skill — skills/brutalist-skill/SKILL.md §2.2（Tactical Telemetry & CRT Terminal）から要点を抽出しています。スライドデッキのシステムは、プロジェクト既存の html-ppt 規約（16:9スライド、直接開いたときの縦積みフォールバック）に従います。

厳守事項

• 基盤： CRT の電源が切れた状態を思わせるチャコール #0A0A0A／#121212。純黒は使用しないでください。
• 前景色： 白い蛍光体色 #EAEAEA。セカンダリー #9A9A98。
• アクセント： 色は1色のみ — ハザードレッド #E61919。アラート、分類、最新のデータポイントに使用します。スライドの背景塗りには使用しないでください。
• 任意： デッキ全体で特定の UI 要素1つに限り、ターミナルグリーン #4AF626 を使用できます（例：単一のステータスインジケーター）。必要性がなければ省略してください。
• 書体： モノスペースを中心にします。本文とメタ情報には JetBrains Mono／IBM Plex Mono を使用します。スライドタイトルに限り、太字のコンデンス・グロテスク体（Archivo Black／Inter Black）を使用します。
• タイトルのスケール： clamp(56px, 7vw, 96px)、大文字、字間 -0.04em、行送り 0.9。
• ジオメトリ： border-radius: 0。1px のヘアライン（チャコール上に #2A2A28）を見える状態にします。完璧なセルを描画するには、ヘアライン色の背景上で display: grid; gap: 1px を使用します。
• 走査線オーバーレイ： 2px / 4px 周期の控えめな repeating-linear-gradient を使用し、不透明度は ≤ 0.08 とします。固定の pointer-events-none レイヤーとして適用します。
• 蛍光体ノイズ： 任意で SVG グレインの疑似要素を使用できます。不透明度は ≤ 0.06 とします。
• スライドのクローム： すべてのスライドに、分類、スライド ID、タイムスタンプ、座標を含む上部のレジスターストリップと、シリアル番号＋ページ番号を含む下部バーを配置します。

禁止事項

• border-radius を0より大きくすること。
• ドロップシャドウ、グラデーション、グラスモーフィズム、グロー。
• チャコール、蛍光体色、ハザードレッド、および最大1つのターミナルグリーン要素以外の色。
• 本文にサンセリフ体を使うこと。本文はモノスペースにします。
• ピッチデッキ風の「楽しさ」 — 絵文字、イラスト、ストック写真、親しみやすいアイコン。
• 同じデッキ内で、どこかにライトモードのスライドを含めること。
• 即時カット以外のスライド遷移。

必須のスライド構成（全10～14枚）

1. 分類カバー — 左側に巨大な数字またはコールサイン、タイトルの上に黒塗りバー、右側にモノスペースのメタ情報列。
2. ブリーフィングストリップ — ミッション ID、日付、主要人物、分類を含む、モノスペースの8セルレジスター。
3. 番号付き目標 — ヘアラインで区切られた3～5つの主張。それぞれに >>> マーカーを付けます。
4. テレメトリーグリッド — モノスペースのキーと値のセルを display: grid; gap: 1px で配置します。傾向を崩す変数を赤で強調します。
5. 脅威／リスクレジスター — 重大度列を赤で示したヘアラインテーブル。
6. シーケンス／タイムライン — 左側に2pxの縦線、重要なイベントにハザードマーカーを付けた、モノスペースの縦並びリスト。
7. 図／配線図 — CSS のみで作成したボックスとラインの概略図。ヘアライン付きの長方形と ASCII 矢印を使用します。
8. 標本 — 画面の端まで達するスケールで表示する、単一のモノスペース文字または単語。視覚的な支点として使用します。
9. アラート — デッキ内で最も重要な一文を入れた、斜めのハザードストライプブロック（repeating-linear-gradient(135deg, ...)）。
10. 監査ログ — タイムスタンプ＋アクター＋イベントを記録した、追記専用のモノスペースエントリー。
11. クロージング・コロフォン — オペレーター、システム、ビルド、分類、承認欄。

モーション

この美学は機械的で、即時性があります。

• スライド間の切り替えはカットのみ — フェードなし。任意で60msのちらつき（opacity: 0.85 → 1）を加えられます。
• カバーの点滅カーソル（▌）と、ライブステータスドットの単発パルスのみを動かします。それ以外は動かしません。

事前確認

• 下地はチャコール、前景は蛍光色、アクセントは警告色の赤のみです
• すべての border-radius は 0 で、すべての角度は 90°です
• タイトルスライドに分類 + シリアル番号 + タイムスタンプ + 座標が含まれています
• 少なくとも 1 つの display: grid; gap: 1px テレメトリーモジュールがあります
• スキャンラインオーバーレイが、固定の pointer-events-none 要素として適用され、透明度は 0.08 以下です
• 少なくとも 1 つの斜線ハザードストライプ警告ブロックがあります
• ASCII 構文装飾（[ ... ]、>>>、///）がスライド全体で 4 回以上登場します
• 数値データには tabular-nums と monospace を使用しています
• 絵文字、曲線、グラデーション、影の効果はありません
• ターミナルグリーンを使用する要素は 0 個または 1 個のみです。本文の文字色には使用しません