shikigami-ai-works 挿絵入り A4 冊子（HTML から PDF）
原則
- 正本は作業フォルダの
<slug>/<slug>.htmlの1ファイル。PDF、ページ画像、ZIP は全部そこから作る物で、直すのは必ず HTML 側。 - 原作がある冊子（ゲームのルール要約、作品のファンガイドなど）では、公式の文章と表を写さない。ルールの数値と仕組みは事実として自分の文で書く。細部が不確かなら断定せず、「正式には公式のルールブックを参照」へ逃がす。表紙と最終ページに非公式、二次創作である旨の断り書きを入れる（文面は
template.htmlの中にある）。原作の権利者が二次創作の指針を出していれば、先に読んで従う。 - 1章を1ページ（A4）にする。入りきらないときは
.tightを付けるか章を分ける。ページからのはみ出しは不合格。
要る物
- Python 3.10 以上と Pillow（
pip install pillow）。PDF にするだけなら Pillow は要らない - Chrome か Chromium 系のブラウザ（Windows では Edge でもよい）。
render.pyが既定の場所と PATH を探す。別の場所なら--chrome <path>か環境変数CHROME_PATHで渡す
手順
- 企画: 対象と版、章立て（表紙、序と目次、本文の章 × N、早見表）を決める。複数の作業日に渡る規模なら、進み具合を記録するファイルも作る。
- 骨格: この Skill の
template.htmlを<slug>/<slug>.htmlへ複製し、書名、版の表記、断り書きを差し替える。紙の質感のタイルはpython render.py <slug>.html --make-noiseでimg/noise.pngに作る。 - 執筆: 章ごとに
.pageを書く。各ページに h2（<span class="num">章番号</span>）とフッター（書名とページ番号）を必ず入れる。図解はインライン SVG で描く。色は既定の5色（緑＝補足、紫＝例、赤＝警告、真鍮＝飾り、濃紺＝見出し）から選び、色数を増やさない。語りとキャプションは短い文にし、冊子の中で口調をそろえる。 - 検証:
python render.py <slug>.html --screenshot --page-count <N>で縦長の PNG を撮ってページごとに分け、全ページを開いて見てから次へ進む。はみ出し（本文がフッターに食い込む）は、そのページだけ.tightを付けて撮り直す。 - PDF にする:
python render.py <slug>.html --pdfで出す。script が出すページ数と大きさを確かめてから渡す。 - 挿絵（頼まれたとき）: 先に
image-prompts.mdに全枚の指示文を書く。全枚に同じ画風の文を付けて絵柄をそろえる。指示文の書き方は使う画像生成の道具に合わせる（自然文が効く物と、単語を並べる形が効く物がある）。原本の PNG はフォルダ直下、PDF に埋め込む JPEG（幅の上限 1200px、品質 82）はimg/に置き、両者の連番を崩さない。口絵は.plateのページとして章の間に入れ、キャプションは一言にする。 - ページ番号の3点: ページを増やしたり減らしたりしたら、必ず ① 目次のページ番号 ② それ以降の全ページのフッターの番号 ③ 本文中の
→P.xの相互参照 の3か所を直す。 - 仕上げ:
python render.py <slug>.html --screenshot --page-count <N> --scale 2で高解像度のページ画像を作り、--zipで PNG 版と JPEG 版の ZIP を作って、PDF と一緒に渡す。
落とし穴（すべて実際に起きた）
- 紙の質感に SVG の
feTurbulenceを data URI で使うと、Chrome で印刷したとき全ページが画像にされ、PDF が 5.1MB から 34.5MB へ膨らんだ。96px の PNG タイルをbackground-repeatで敷く。 - 古い
--headlessは--print-to-pdfで exit 1 のまま何も言わずに失敗する。--headless=newを使う（render.pyはそうしている）。 - Web フォントの読み込みより先に撮影や印刷が走ることがある。
--virtual-time-budget=25000を付ける（render.pyは付けている）。 - 普段使いの Chrome が起動していると、ヘッドレスの Chrome が何も書かずに終わることがある。
render.pyは一時の--user-data-dirを使い、PDF の更新時刻が変わらなければ止まる。 - ページ画像の境目には隣のページの帯が 1px 混ざる。上下 2px を削って消す（
render.pyがやる）。 - 分割の1ページの高さは 296mm＝1118.74px（
render.pyの既定値。--page-hで変えられる）。この値がずれると後半のページほど上端が欠けて写る。分けた後は最終ページの下端（断り書きとフッター）まで確かめる。 - ダウンロードした挿絵をフォルダから拾うときは、「直前に記録した時刻より新しいファイル」だけに絞る。「一番新しい1件」を掴むと、ダウンロードが遅れたときに無関係なファイルを拾う。
参照ファイル
template.html: 検証済みの CSS 一式（A4 固定の.page、表紙、口絵.plate、.tight、目次、フッター、断り書きの雛形）render.py: 質感のタイル作り、撮影と分割、PDF 化、ZIP 作りを1本にした実行 script。使い方はファイル冒頭のコメントにある