:root {
  --fs: 18px;               /* 1マスの文字サイズ */
  --pitch: calc(var(--fs) * 1.5);  /* 行送り（列の間隔） */
  --paper: #f8f4e9;
  --grid: #cdb9a0;
  --ink: #26221c;
  --chrome-bg: #26262b;
  --chrome-fg: #d8d8dc;
  --accent: #d4af37;        /* Studio Palette の金。道具棚(LP)と同じ系統に揃える */
  --accent-ink: #1a1206;    /* 金の上に載せる文字色 */
  --caret: #b8544a;         /* 文字カーソルは生成りの紙の上で目立つ朱のまま */
  --mincho: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", "Noto Serif JP", "MS PMincho", serif;
  --gothic: "Hiragino Kaku Gothic ProN", "Yu Gothic", "YuGothic", "Meiryo", "Noto Sans JP", sans-serif;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html, body {
  height: 100%;
  overflow: hidden;
  font-family: -apple-system, "Segoe UI", "Hiragino Sans", "Yu Gothic UI", "Meiryo", sans-serif;
  background: #37373d;
}

body {
  display: flex;
  flex-direction: column;
}

/* ---------- ツールバー ---------- */
#toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--chrome-bg);
  color: var(--chrome-fg);
  padding: 6px 12px;
  flex: none;
  user-select: none;
  gap: 12px;
  flex-wrap: wrap;
}
#toolbar-left { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
#file-btns { display: flex; align-items: center; gap: 2px; }
.tb {
  font-size: 12px;
  padding: 5px 9px;
  border: none;
  border-radius: 5px;
  background: transparent;
  color: #b6b6be;
  cursor: pointer;
}
.tb:hover { background: #3a3a42; color: var(--chrome-fg); }
.tb-sep {
  width: 1px;
  height: 16px;
  background: #46464e;
  margin: 0 6px;
}
#style-tabs { display: flex; gap: 4px; }
.tab {
  font-size: 12px;
  padding: 5px 14px;
  border: none;
  border-radius: 5px;
  background: transparent;
  color: var(--chrome-fg);
  cursor: pointer;
}
.tab:hover { background: #3a3a42; }
.tab.active { background: var(--accent); color: var(--accent-ink); font-weight: 700; }
#goal-label { font-size: 12px; color: #aaa; }
#goal-chars {
  width: 72px;
  background: #1c1c20;
  border: 1px solid #444;
  border-radius: 4px;
  color: var(--chrome-fg);
  font-size: 12px;
  padding: 3px 6px;
}

/* ---------- 組版設定パネル（台本の字数×行数） ---------- */
#scv-panel {
  position: fixed;
  top: 44px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 90;
  width: min(420px, calc(100vw - 32px));
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: var(--chrome-bg);
  border: 1px solid rgba(212, 175, 55, .38);
  border-radius: 8px;
  box-shadow: 0 8px 28px rgba(0, 0, 0, .55);
  padding: 14px 16px 12px;
}
#scv-panel[hidden] { display: none; }
.scv-head {
  font-size: 12px;
  letter-spacing: .14em;
  color: #ecc879;
  border-bottom: 1px solid rgba(212, 175, 55, .28);
  padding-bottom: 8px;
}
.scv-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
#scv-panel label { font-size: 12.5px; color: var(--chrome-fg); }
#scv-panel input[type="number"] {
  width: 62px;
  margin: 0 4px;
  background: #1c1c20;
  border: 1px solid #4a4a52;
  border-radius: 4px;
  color: var(--chrome-fg);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  padding: 4px 6px;
}
#scv-panel input[type="number"]:focus { outline: 2px solid rgba(212, 175, 55, .6); outline-offset: 1px; }
.scv-x { color: #8a8a92; }
.scv-preset {
  border: 1px solid #4a4a52;
  font-variant-numeric: tabular-nums;
}
.scv-preset:hover { border-color: #ecc879; color: #ecc879; background: transparent; }
.scv-check { display: flex; align-items: center; gap: 7px; cursor: pointer; }
.scv-note { font-size: 11px; line-height: 1.6; color: #9a9aa2; }
#scv-close { align-self: flex-end; border: 1px solid #4a4a52; }

/* ---------- 検索・置換パネル ---------- */
#find-panel {
  position: fixed;
  top: 44px;
  right: 16px;
  z-index: 90;
  display: flex;
  align-items: center;
  gap: 6px;
  background: var(--chrome-bg);
  border: 1px solid #46464e;
  border-radius: 8px;
  box-shadow: 0 6px 24px rgba(0, 0, 0, .5);
  padding: 8px 10px;
}
#find-panel[hidden] { display: none; }
#find-panel input {
  width: 130px;
  background: #1c1c20;
  border: 1px solid #444;
  border-radius: 4px;
  color: var(--chrome-fg);
  font-size: 12px;
  padding: 4px 6px;
}
#find-count { font-size: 11px; color: #9a9aa2; min-width: 3em; text-align: center; }

/* ---------- 登場人物パネル ---------- */
#cast-panel {
  position: fixed;
  top: 44px;
  left: 16px;
  z-index: 90;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  max-width: 420px;
  background: var(--chrome-bg);
  border: 1px solid #46464e;
  border-radius: 8px;
  box-shadow: 0 6px 24px rgba(0, 0, 0, .5);
  padding: 8px 10px;
}
#cast-panel[hidden] { display: none; }
.cast-name { border: 1px solid #46464e; }
.cast-hint { font-size: 11px; color: #9a9aa2; }

/* ---------- 柱一覧（シーンの目次） ---------- */
/* 長い台本で「あの場面」へ戻るための一覧。番号は本文と同じ採番を出す */
#hashira-panel {
  position: fixed;
  top: 44px;
  left: 16px;
  z-index: 90;
  display: flex;
  flex-direction: column;
  min-width: 240px;
  max-width: 380px;
  max-height: 70vh;
  overflow-y: auto;
  padding: 6px;
  background: var(--chrome-bg);
  border: 1px solid #46464e;
  border-radius: 8px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .55);
}
#hashira-panel[hidden] { display: none; }
.hashira-item {
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding: 5px 8px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--chrome-fg);
  font: inherit;
  font-size: 12px;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
}
.hashira-item:hover { background: #3a3a42; }
.hashira-no {
  flex: none;
  min-width: 2.2em;
  color: var(--accent);
  font-variant-numeric: tabular-nums;
  text-align: right;
}

/* ---------- ドロップダウン（ファイル・テンプレ） ---------- */
/* 常時使わない操作はここへ畳む。ツールバーには書く手を止めないものだけ残す */
.tb-menu { display: inline-flex; align-items: center; gap: 5px; }
.tb-caret { font-size: 9px; color: #8a8a92; }
.tb-menu.open { background: #3a3a42; color: var(--chrome-fg); }
.menu-pop {
  position: fixed;
  z-index: 95;
  min-width: 210px;
  display: flex;
  flex-direction: column;
  padding: 6px;
  background: var(--chrome-bg);
  border: 1px solid #46464e;
  border-radius: 8px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .55);
}
.menu-pop[hidden] { display: none; }
.mi {
  display: flex;
  align-items: baseline;
  gap: 10px;
  width: 100%;
  text-align: left;
  font-size: 12.5px;
  padding: 7px 10px;
  border: none;
  border-radius: 5px;
  background: transparent;
  color: var(--chrome-fg);
  cursor: pointer;
}
.mi:hover { background: #3a3a42; }
.mi-key { margin-left: auto; font-size: 10.5px; color: #77777f; white-space: nowrap; }
.mi-desc { margin-left: auto; font-size: 10.5px; color: #8a8a92; white-space: nowrap; }
.mi-sep { height: 1px; background: #46464e; margin: 5px 4px; }
.mi-head {
  font-size: 10.5px;
  letter-spacing: .12em;
  color: #ecc879;
  padding: 8px 10px 4px;
}

/* ---------- エディタ ---------- */
#editor-scroll {
  flex: 1;
  overflow: auto;
  padding: 0;
}
#editor-wrap {
  position: relative;
  background: var(--paper);
  box-shadow: 0 2px 14px rgba(0,0,0,.45);
  margin: 28px;
  padding: 48px;
  width: max-content;
  direction: ltr;
}
/* ルビ・傍点のライブプレビュー(カーソルの無い行で組版表示) */
#editor ruby { ruby-align: center; }
#editor rt {
  font-size: 0.45em;
  font-family: var(--mincho);
  font-weight: 400;
}
#editor .bouten {
  -webkit-text-emphasis: filled sesame;
  text-emphasis: filled sesame;
}
#editor {
  outline: none;
  color: var(--ink);
  font-family: var(--mincho);
  font-size: var(--fs);
  line-height: 1.5;
  caret-color: var(--caret);
  word-break: break-all;
}
#page-guides { position: absolute; inset: 48px; pointer-events: none; }
/* 紙面左上の作品タイトル(□柱/S#空柱の内容を自動表示) */
#paper-title {
  position: absolute;
  top: 12px;
  left: 16px;
  font-size: 12px;
  color: #8a7d6a;
  font-family: var(--gothic);
  pointer-events: none;
}
/* 改ページ: 新ページの先頭行の右側に本物の隙間を空ける(renderer.js PAGE_GAP と一致) */
body.v #editor .page-first { margin-right: 72px; }
/* 隙間の中央の「断ち目」— 紙が1ページずつ並んでいるように見せる */
.page-gutter {
  position: absolute;
  top: -48px;
  bottom: -48px;
  width: 16px;
  background: #37373d;
  box-shadow: inset 3px 0 4px rgba(0, 0, 0, .35), inset -3px 0 4px rgba(0, 0, 0, .35);
}
body.style-scenario-v .page-gutter { top: calc(-48px - var(--memo-e) - var(--line-gap)); }

/* --- 縦書きスタイル共通 --- */
body.v #editor-scroll { direction: rtl; }
/* 紙は画面の中央に置く。RTL のままだと紙が右端に貼り付き、左に画面の
   2/3ほどの空白が残っていた。margin-inline:auto なら、ページが増えて
   紙が画面幅を超えたときは auto が 0 になって普通に横スクロールできる
   （横書き側は既に margin:28px auto で中央寄せになっている）。 */
body.v #editor-wrap { margin-inline: auto; }
body.v #editor {
  writing-mode: vertical-rl;
}

/* +2px は端数丸めで最後の1字が折り返すのを防ぐ遊び */
/* 原稿用紙: 20字×20行 */
body.style-genko #editor { height: calc(var(--fs) * 20 + 2px); min-width: calc(var(--pitch) * 20); }
/* 台本(シナリオ縦): B5・既定 29字×17行/頁。
   字数と行数はツールバーの「組版」から変更でき、renderer.js が
   --scv-chars / --scv-cols を書き換える */
body.style-scenario-v #editor {
  height: calc(var(--fs) * var(--scv-chars, 29) + 2px);
  min-width: calc(var(--pitch) * var(--scv-cols, 17));
  line-height: 1.75;
}

/* --- 横書きスタイル --- */
body.h #editor-scroll { direction: ltr; }
body.h #editor-wrap { margin: 28px auto; width: auto; max-width: min(52em, calc(100% - 56px)); }
body.h #editor { min-height: 60vh; }
body.style-scenario-h #editor { max-width: 42em; }

/* --- シナリオ自動整形 --- */
/* 縦書き: inline方向=上下。padding-inline-start が字下げになる */
body.style-scenario-v .l-togaki,
body.style-scenario-h .l-togaki {
  padding-inline-start: 3em;
}
body.style-scenario-v .l-serifu,
body.style-scenario-h .l-serifu {
  padding-inline-start: 4em;
  text-indent: -4em;
}
body.style-scenario-v #editor .l-hashira,
body.style-scenario-h #editor .l-hashira {
  /* 明朝はボールド非搭載で疑似太字が目立たないため、柱は脚本の慣習どおりゴシック太字 */
  font-family: var(--gothic);
  font-weight: 700;
}

/* --- 扉ブロックのエディタ表示: タイトルはページ中央寄りに大きく、作者は左寄り下がりに --- */
body.style-scenario-v #editor .l-tobira-title::before,
body.style-scenario-v #editor .l-tobira-title::after { content: none !important; }
body.style-scenario-v #editor .l-tobira-title {
  border: none;
  padding: 0 0.15em;
  margin-right: calc(var(--pitch) * 5.5);
  margin-left: calc(var(--pitch) * 3);
  font-family: var(--mincho);
  font-weight: 600;
  font-size: 1.6em;
  letter-spacing: 0.12em;
  text-indent: -1em; /* 行頭の□を枠外に追い出す */
  overflow: hidden;
}
body.style-scenario-v #editor .l-tobira-author {
  padding-inline-start: 10em; /* 下寄り(印刷の左下に相当) */
  margin-right: calc(var(--pitch) * 1.5);
}

/* --- 前付(表紙・ビリング・スタッフ表…)は画面でも紙と同じく中央に揃える。
       紙の左右中央へ寄せるぶんは renderer.js が余白で作る --- */
/* 前付はカット割りをしないので、紙の上の余白は使わない。
   ※ 画面で行を上へ伸ばして紙を使い切る案は、ページ計算が崩れる例が出たため
   　 見送り中(印刷側は newPage の plain 分岐で紙いっぱいに組んでいる) */
body.style-scenario-v #editor .l-mae { text-align: center; }
/* 表(スタッフ表・キャスト表・登場人物)は行の頭を揃える */
body.style-scenario-v #editor .l-mae-table { text-align: start; }
/* 題名の左右の空きは中央揃えが受け持つ(扉用の余白を残すと中央からずれる) */
body.style-scenario-v #editor .l-mae.l-tobira-title { margin-right: 0; margin-left: 0; }
body.style-scenario-v #editor .l-mae.l-togaki { padding-inline-start: 0; }
body.style-scenario-v #editor .l-mae.l-serifu { padding-inline-start: 0; text-indent: 0; }

/* --- 改ページ記号(＝＝＝ だけの行)。編集はできるが紙には出ない目印 --- */
#editor .l-pagebreak {
  color: #b98f2e;
  opacity: .75;
  letter-spacing: -0.35em; /* ＝が繋がって1本の区切り線に見えるように */
}
/* 縦書きでは紙の1行を占めないよう細く畳む(数えないぶん組版とも一致する)。
   幅を残しておくのは、クリックしてカーソルを置けるようにするため */
body.v #editor .l-pagebreak {
  width: 10px;
  overflow: hidden;
}

/* --- シーンナンバー (JSが採番して data-scene に格納。S#式・O's記号式共通) --- */

/* 縦書き台本: 本文上部に撮影メモ・カット割りスペース(全幅横罫線で仕切る)。
   本家実機と同じく本文の約半分の高さ(75mm/6mm=12.5字分)を確保する */
body.style-scenario-v {
  --memo-e: calc(var(--fs) * 12.5);
  --pitch: calc(var(--fs) * 1.75); /* 本家台本の開いた行間(行送り1.75倍) */
  --line-gap: calc(var(--fs) * 0.6); /* 横罫線と本文行頭の間隔 */
}
body.style-scenario-v #editor-wrap { padding-top: calc(48px + var(--memo-e) + var(--line-gap)); }
body.style-scenario-v #editor-wrap::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: calc(48px + var(--memo-e));
  border-top: 1px solid var(--ink);
}
body.style-scenario-v #page-guides { top: calc(48px + var(--memo-e) + var(--line-gap)); }
/* 前付(表紙・ビリング・スタッフ表…)にはカット割りの余白と罫線を出さない。
   罫線は編集領域に1本通してあるので、前付のぶんだけ紙と同じ色で覆って隠す
   (印刷側は最初から前付に罫線を刷らない) */
.mae-mask {
  position: absolute;
  top: calc(-1 * (var(--memo-e) + var(--line-gap)));
  height: calc(var(--memo-e) + var(--line-gap) + 1px);
  background: var(--paper);
  pointer-events: none;
}

body.style-scenario-v #editor .l-hashira[data-scene] { position: relative; }
body.style-scenario-v #editor .l-hashira[data-scene]:not(.l-norule) {
  padding: 0.2em 0.1em; /* 枠線は::beforeが番号区画ごと一筆で描く(継ぎ目ゼロ) */
}
/* 柱記号(○●◎□■△等)は画面では消え、枠+番号区画が柱を表す(O's Editor2と同じ挙動)。
   テキスト自体には記号が残る。-1.2em = 記号1文字ぶん+padding0.2emを
   番号区画(不透明背景)の裏に送り込む */
body.style-scenario-v #editor .l-hashira[data-scene]:not(.l-scene):not(.l-scene-empty) {
  text-indent: -1.2em;
}
/* 枠: 番号ゾーン+罫線下の隙間+柱本体を1つの矩形として描く(段差が出ない) */
body.style-scenario-v { --nz: calc(var(--fs) * 1.7); } /* 番号ゾーンの高さ */
body.style-scenario-v #editor .l-hashira[data-scene]:not(.l-norule)::before {
  content: '';
  position: absolute;
  top: calc(0px - var(--nz) - var(--line-gap));
  left: 0;
  right: 0;
  height: calc(100% + var(--nz) + var(--line-gap));
  border: 1px solid var(--ink);
  box-sizing: border-box;
  pointer-events: none;
}
/* 番号: 罫線上のゾーンに表示。背景で隠した柱記号と罫線を覆う */
body.style-scenario-v #editor .l-hashira[data-scene]::after {
  content: attr(data-scene);
  position: absolute;
  top: calc(0px - var(--nz) - var(--line-gap) + 1px); /* +1px=枠の上辺を隠さない */
  left: 1px;
  right: 1px;
  height: calc(var(--nz) + var(--line-gap));
  line-height: var(--nz);
  writing-mode: horizontal-tb;
  text-align: center;
  text-indent: 0;
  font-size: 0.85em;
  font-family: var(--mincho);
  font-weight: 400;
  background: var(--paper);
}

/* 横書きシナリオ: 縦書きと同じ作法。柱は内容幅の枠+左端に番号区画、柱記号は区画の裏に隠す */
body.style-scenario-h #editor .l-hashira[data-scene] {
  position: relative;
  border: 1px solid var(--ink);
  padding: 0.15em 0.6em 0.15em 2.8em;
  width: fit-content;
  max-width: 100%;
  box-sizing: border-box;
}
body.style-scenario-h #editor .l-hashira[data-scene]:not(.l-scene):not(.l-scene-empty) {
  text-indent: -1em; /* 柱記号(○等)を番号区画の裏に送る */
}
body.style-scenario-h #editor .l-hashira[data-scene]::before {
  content: attr(data-scene);
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 2.2em;
  border-right: 1px solid var(--ink);
  background: var(--paper);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mincho);
  font-weight: 400;
  text-indent: 0;
}
/* 記号が番号区画からはみ出す残り(2.2em〜2.8em)を隠すパッチ */
body.style-scenario-h #editor .l-hashira[data-scene]:not(.l-scene):not(.l-scene-empty)::after {
  content: '';
  position: absolute;
  left: 2.2em;
  top: 0;
  bottom: 0;
  width: 0.6em;
  background: var(--paper);
}
/* ● ◇ 罫線なし: 柱の枠と番号箱の枠を消す(基本ルールより後に置いて上書き) */
body.style-scenario-h #editor .l-hashira.l-norule { border: none; }
body.style-scenario-h #editor .l-hashira.l-norule::before { border-color: transparent; }
/* ■ ▲ ◆ 欠番: 番号に×印 (縦書きは番号ゾーン=::after、横書きは番号箱=::before) */
body.style-scenario-v #editor .l-hashira.l-kesuban::after,
body.style-scenario-h #editor .l-hashira.l-kesuban::before {
  background-size: 100% var(--nz, 100%);
  background-repeat: no-repeat;
  background-position: top;
  background-image:
    linear-gradient(to top right, transparent 45%, currentColor 45%, currentColor 55%, transparent 55%),
    linear-gradient(to bottom right, transparent 45%, currentColor 45%, currentColor 55%, transparent 55%);
}
/* ◎ 撮影済み: 番号ゾーン/番号箱が赤くなる */
body.style-scenario-v #editor .l-hashira.l-shot::after,
body.style-scenario-h #editor .l-hashira.l-shot::before {
  background-color: #c9463d;
  border-color: #c9463d;
  color: #fff;
}

/* ---------- ステータスバー ---------- */
#statusbar {
  flex: none;
  display: flex;
  gap: 18px;
  background: var(--chrome-bg);
  color: #9a9aa2;
  font-size: 12px;
  padding: 5px 14px;
  user-select: none;
}
#st-style { margin-left: auto; }
#st-version { color: #5c5c66; font-size: 11px; }
#st-goal.over { color: #e8a13c; }

/* ---------- 完了カード（次の工程パネル） ---------- */
#promo-panel {
  position: fixed;
  right: 16px;
  bottom: 40px;
  width: 264px;
  background: var(--chrome-bg);
  color: var(--chrome-fg);
  border: 1px solid #46464e;
  border-radius: 8px;
  box-shadow: 0 6px 24px rgba(0,0,0,.5);
  padding: 10px;
  z-index: 100;
  font-size: 12px;
}
.promo-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #9a9aa2;
  margin-bottom: 8px;
}
#promo-close {
  border: none;
  background: transparent;
  color: #9a9aa2;
  font-size: 14px;
  cursor: pointer;
  padding: 0 4px;
}
#promo-close:hover { color: #fff; }
.promo-card {
  display: block;
  text-decoration: none;
  color: var(--chrome-fg);
  background: #2e2e34;
  border-radius: 6px;
  padding: 8px 10px;
  margin-bottom: 6px;
}
.promo-card:hover { background: #3a3a42; }
.promo-title { display: block; font-weight: 600; margin-bottom: 2px; }
.promo-pr {
  display: inline-block;
  margin-left: 6px;
  font-size: 10px;
  font-weight: 400;
  color: #9a9aa2;
  border: 1px solid #55555e;
  border-radius: 3px;
  padding: 0 3px;
  vertical-align: 1px;
}
.promo-desc { display: block; color: #9a9aa2; }
.promo-foot { text-align: center; color: #77777f; margin-top: 4px; }
.promo-foot a { color: #9a9aa2; }

/* ---------- 印刷 ---------- */
#print-root { display: none; }

#print-root.measuring {
  display: block;
  position: fixed;
  left: -20000px;
  top: 0;
}

@media print {
  #toolbar, #editor-scroll, #statusbar, #promo-panel { display: none !important; }
  html, body { overflow: visible; background: #fff; height: auto; }
  #print-root { display: block; }
}

.p-doc {
  font-family: var(--mincho);
  color: #000;
  word-break: break-all;
}

/* 縦書き印刷ページ（A4横） */
.p-doc.pv .p-sheet {
  position: relative;
  break-after: page;
  box-sizing: content-box;
  padding: 9mm 0;
  margin: 0 auto; /* @page マージンの遊び(renderer.js 参照)の中でセンタリング */
  line-height: 0; /* inline-block の p-page が行ボックスの高さで溢れないように */
}
.p-doc.pv .p-sheet:last-child { break-after: auto; }
.p-doc.pv .p-page {
  writing-mode: vertical-rl;
  /* inline-block でアトミック化しないと、縦書きブロックは幅がページ高さを
     超えた時点でブラウザ印刷が横方向にフラグメントし空白ページを生む */
  display: inline-block;
  vertical-align: top;
  /* visible: シーン番号区画(柱の::before)をメモゾーンへはみ出させるため */
  overflow: visible;
  line-height: 1.5;
  width: 100%;
  height: 100%;
}
.p-pagenum {
  position: absolute;
  writing-mode: horizontal-tb;
  bottom: 0;
  left: 0; right: 0;
  text-align: center;
  font-size: 3.2mm;
  color: #555;
}
.p-header {
  position: absolute;
  writing-mode: horizontal-tb;
  /* 用紙上端のプリンタ非印字領域にかからないよう下げる */
  top: 4mm;
  left: 0; right: 0;
  text-align: left;
  font-size: 3.2mm;
  color: #555;
}

/* 扉ページ: 中央にタイトル・左下に作者(罫線・ノンブルなし) */
.p-doc.pv .p-sheet.p-tobira { position: relative; }
.p-tobira-title {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  writing-mode: vertical-rl;
  max-height: 86%;
  font-family: var(--mincho);
  font-weight: 600;
  font-size: 11mm; /* 中央にドーンと */
  letter-spacing: 0.14em;
}
/* 表紙の添え行(脚本・稿数・日付など)。左下に控えめに、右から左へ積む */
.p-tobira-subs {
  position: absolute;
  left: 12mm;
  bottom: 20mm;
  writing-mode: vertical-rl;
  max-height: 72%;
  font-family: var(--mincho);
  font-size: 4mm;
  letter-spacing: 0.1em;
  line-height: 2.4;
}

/* 前付(ビリング・スタッフ表・キャスト表・連絡票): ノンブル・柱ヘッダ・メモ罫線なし。
   表組みの行が勝手に字下げされないよう、ト書き・セリフの整形は効かせない */
.p-doc.pv .p-sheet.p-mae .l-togaki { padding-inline-start: 0; }
.p-doc.pv .p-sheet.p-mae .l-serifu { padding-inline-start: 0; text-indent: 0; }
/* 前付は紙の中央に据える。縦書きなので flex の主軸=行が並ぶ方向(右→左)、
   交差軸=行の中(上→下)。inline-flex なのは p-page のアトミック化を保つため
   (ブロックにすると印刷が横方向にフラグメントして空白ページが出る) */
.p-doc.pv .p-sheet.p-mae .p-page {
  display: inline-flex;
  flex-direction: column;
  justify-content: center; /* 紙の左右中央へ */
  align-items: center;     /* 行の中も中央へ(ビリングなどのクレジット) */
}
/* 見出しのある紙(スタッフ表・キャスト表・登場人物)は表なので行の頭を揃える。
   stretch=各行を紙いっぱいに伸ばす→中身は行頭から始まる */
.p-doc.pv .p-sheet.p-mae.p-mae-table .p-page { align-items: stretch; }
/* 行が縮むと「収まったか」の判定が狂うので、伸縮させない */
.p-doc.pv .p-sheet.p-mae .p-page > * { flex: none; max-block-size: 100%; }

/* ルビ・傍点(印刷時に記法を解釈して表示。中付き=親文字の中央揃え) */
.p-doc ruby { ruby-align: center; }
.p-doc rt {
  font-size: 0.45em;
  font-family: var(--mincho);
  font-weight: 400;
}
.p-doc .bouten {
  -webkit-text-emphasis: filled sesame;
  text-emphasis: filled sesame;
}

/* 横書き印刷 */
.p-doc.ph { font-size: 10.5pt; line-height: 1.8; }

.p-doc .l-togaki { padding-inline-start: 3em; }
.p-doc .l-serifu { padding-inline-start: 4em; text-indent: -4em; }
.p-doc .l-hashira { font-family: var(--gothic); font-weight: 700; }

/* --- 印刷: シーンナンバー (data-scene) --- */

/* 縦書き台本印刷: 柱の枠は::beforeが番号ゾーンごと一筆で描く(下の番号区画ブロック参照) */
.p-doc.pv .l-hashira[data-scene]:not(.l-norule) {
  padding: 0.2em 0.1em;
}
.p-memoline {
  position: absolute;
  left: 0;
  right: 0;
  border-top: 0.3mm solid #000;
}
/* 番号区画: 柱の枠を番号ゾーンごと::beforeが1つの矩形として描く(継ぎ目・段差ゼロ)。
   16mm = 番号ゾーン12mm + 罫線下の隙間4mm(renderer.jsのGと一致) */
.p-doc.pv .l-hashira[data-scene] { position: relative; }
.p-doc.pv .l-hashira[data-scene]:not(.l-norule)::before {
  content: '';
  position: absolute;
  top: -16mm;
  left: 0;
  right: 0;
  height: calc(100% + 16mm);
  border: 0.3mm solid #000;
  box-sizing: border-box;
  pointer-events: none;
}
/* 番号: 罫線上のゾーンに表示。背景には依存しない(印刷の「背景のグラフィック」オフでも成立) */
.p-doc.pv .l-hashira[data-scene]::after {
  content: attr(data-scene);
  position: absolute;
  top: -16mm;
  left: 0.3mm;
  right: 0.3mm;
  height: 12mm; /* ゾーンは罫線(下から4mm=G)の上で完結 */
  line-height: 12mm;
  writing-mode: horizontal-tb;
  text-align: center;
  text-indent: 0;
  font-size: 4.2mm;
  font-family: var(--mincho);
  font-weight: 400;
}
.p-doc.pv .l-hashira.l-kesuban::after {
  text-decoration: line-through;
  text-decoration-thickness: 0.5mm;
}
.p-doc.pv .l-hashira.l-shot::after {
  color: #c9463d;
  font-weight: 700;
}
/* ページ跨ぎの続き行では枠上部・番号を出さない(基本ルールより後に置く) */
.p-doc.pv .l-hashira.cont::before,
.p-doc.pv .l-hashira.cont::after { content: none; }

/* 横書き印刷: 柱を内容幅の枠で囲み、番号箱をインラインで前置 */
.p-doc.ph .l-hashira[data-scene] {
  border: 0.3mm solid #000;
  padding: 0.15em 0.6em 0.15em 0.15em;
  width: fit-content;
  max-width: 100%;
  box-sizing: border-box;
}
.p-doc.ph .l-hashira[data-scene]::before {
  content: attr(data-scene);
  display: inline-block;
  writing-mode: horizontal-tb;
  border: 0.3mm solid #000;
  min-width: 1.5em;
  min-height: 1.3em;
  text-align: center;
  font-size: 0.85em;
  font-family: var(--mincho);
  font-weight: 400;
  box-sizing: border-box;
  margin-right: 0.5em;
}
.p-doc.ph .l-hashira.l-norule { border: none; }
.p-doc.ph .l-hashira.l-norule::before { border-color: transparent; }
.p-doc.ph .l-hashira.l-kesuban::before {
  background-image:
    linear-gradient(to top right, transparent 45%, currentColor 45%, currentColor 55%, transparent 55%),
    linear-gradient(to bottom right, transparent 45%, currentColor 45%, currentColor 55%, transparent 55%);
}
.p-doc.ph .l-hashira.l-shot::before {
  background-color: #c9463d;
  border-color: #c9463d;
  color: #fff;
}
/* ページ跨ぎの続き行では番号を重複させない(基本ルールより後に置く) */
.p-doc.ph .l-hashira.cont::before { content: none; }