/* ==========================================================================
   saera.ai /game/* — game.css（site.css の上に重ねるゲーム共通の骨格）
   正本: DESIGN-SPEC §3.3・§5.5〜5.9 ＋ ADDENDUM B2
   地は本体と同じ白。色を持つのは表紙・API の箱・結果カードだけ（.theme-night / .theme-press）。
   機械ゲート（T10）: このファイルに生の hex 色・font-family の直書き・<style> を置かない。
   色と書体は site.css のトークン（var(--*)）経由だけで書く。書体は font-family:var(--f-*) / font:… var(--f-*) の形だけ許す
   （ゲートの grep は font-family:\s*(?!var\(--f-) で「var(--f-*) 以外の font-family」を探す。HANDOFF-T1 §4）。
   サブナビ（.subnav）とタブ（.tabs）と行組みの表（.rows）の本体は site.css にある。
   ========================================================================== */

/* ---------- 1. ゲームの表紙（紹介ページの page head の代わり） ---------- */
.gcover{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--r-l);box-shadow:var(--sh-2);
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:420px}
.gcover__body{display:flex;flex-direction:column;gap:var(--s-4);padding:var(--s-7) var(--s-6) var(--s-5);min-width:0}
.gcover__body h1{font-size:var(--t-3xl)}
.gcover__en{font-family:var(--f-latin);font-weight:700;font-size:var(--t-s);letter-spacing:0;color:var(--ink-2)}
.gcover__pitch{color:var(--ink-2)}
.gcover__art{position:relative;min-height:100%}
.gcover__art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  -webkit-mask-image:linear-gradient(90deg,transparent,black 28%);mask-image:linear-gradient(90deg,transparent,black 28%)}
.gcover .tabs{margin-top:auto;border-bottom-color:var(--rule)}
/* 直後に API の箱を食い込ませるとき、タブが隠れないように下を空ける */
.gcover:has(+ .apibox--overlap) .gcover__body{padding-bottom:calc(var(--s-5) + 32px)}
.gcover .crumb a{color:var(--lav-ink)}
/* 幻聴新聞社の表紙の見出し（T1 の骨格。T7 は game-press.css で上書きするだけにして、ここは消さない） */
.theme-press .gcover__body h1,.gcover.theme-press h1{font-family:var(--f-head,var(--f-mincho));font-weight:800}
/* runs 一覧・ランキング用の細い帯（高さ 120px 目安） */
.gcover--band{min-height:0;grid-template-columns:minmax(0,1fr);border-radius:var(--r-m);box-shadow:var(--sh-1)}
.gcover--band .gcover__body{flex-direction:row;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--s-3) var(--s-5);padding:var(--s-5) var(--s-6) 0}
.gcover--band .gcover__body h1{font-size:var(--t-2xl)}
.gcover--band .tabs{flex-basis:100%}
@media (max-width:760px){
  .gcover{grid-template-columns:minmax(0,1fr);min-height:0}
  .gcover__art{display:none}            /* モバイルは表紙に出さず、API の箱の後の .keyart に置く */
  .gcover__body{padding:var(--s-6) var(--s-5) var(--s-3)}
  .gcover--band .gcover__body{padding:var(--s-5) var(--s-5) 0}
}

/* 校了スタンプ（幻聴新聞社。20px 以上の太字と記号だけ） */
.stamp{display:inline-block;font:800 var(--t-l)/1.2 var(--f-mincho);color:var(--stamp,var(--ok));
  border:3px double currentColor;border-radius:8px;padding:2px 12px;rotate:-8deg}

/* ---------- 2. キーアート（16:9） ---------- */
.keyart{position:relative;margin:0;aspect-ratio:16/9;overflow:hidden;border-radius:var(--r-m);background:var(--grad-soft)}
.keyart img{display:block;width:100%;height:100%;object-fit:cover}
.keyart--m{display:none}
@media (max-width:760px){ .keyart--m{display:block} }
/* 淡い単色背景で生成した絵をなじませる（ADDENDUM A7。切り抜きはしない） */
.fade-edge{-webkit-mask-image:radial-gradient(closest-side,black 72%,transparent);mask-image:radial-gradient(closest-side,black 72%,transparent)}
.round-face{border-radius:50%;overflow:hidden;background:var(--grad-soft)}

/* ---------- 3. API の箱（§5.6。.theme-night と一緒に付ける） ---------- */
.apibox{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-3);padding:var(--s-5) var(--s-6);border-radius:var(--r-m);box-shadow:var(--sh-2);
  outline:1px solid color-mix(in srgb,var(--screen,var(--lav)) 45%,transparent);outline-offset:-1px}
.apibox h2,.apibox__h{font-size:var(--t-l);color:var(--ink)}
.apibox__row{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-2) var(--s-3)}
.apibox__url{flex:1 1 320px;min-width:0;display:block;padding:12px 16px;border-radius:var(--r-s);
  background:color-mix(in srgb,var(--ink) 7%,transparent);border:1px dashed color-mix(in srgb,var(--screen,var(--lav)) 50%,transparent);
  font:400 clamp(1rem,.9rem + .5vw,1.25rem)/1.5 var(--f-pixel);letter-spacing:.02em;color:var(--ink);
  -webkit-user-select:all;user-select:all;overflow-wrap:anywhere;word-break:normal}
/* ↑ grid の列を minmax(0,1fr) にして URL の min-content で箱が広がらないようにし、anywhere は最後の保険（折り返しは .nw＋<wbr> で / の後が優先）。T6 */
/* 改行は / の後だけ（layout.ts の apiUrlHtml() が / の後に <wbr> を入れる）。<wbr> はコピーに入らない */
.apibox__url .m{color:var(--screen,var(--lav-ink));margin-right:.6em}
.apibox__note{font-size:var(--t-s);color:var(--ink-2)}
.apibox__note+.apibox__note{margin-top:calc(var(--s-2) * -1)}
.apibox--overlap{margin-top:-32px;z-index:2}
.apibox--sm{padding:var(--s-3) var(--s-4);gap:var(--s-2);box-shadow:none;border-radius:var(--r-s)}
.apibox--sm .apibox__url{font-size:var(--t-s);padding:8px 12px;flex-basis:200px}
/* コピーの3状態（site.js が data-state を切り替える） */
[data-copy][data-state="copied"]{background:var(--ok-bg);border-color:var(--ok-bg);color:var(--ok)}
.theme-night [data-copy][data-state="copied"]{background:var(--screen);border-color:var(--screen);color:var(--paper)}
[data-copy][data-state="copy-failed"]{background:var(--blush);border-color:var(--blush);color:var(--pink-ink)}
.copy-status{min-height:1em}
@media (max-width:760px){ .apibox{padding:var(--s-5)} }
/* 360px 未満（320 など）: 余白と見出しを詰めて、夜の箱からはみ出さない。表紙のタブも3つを1段に（T6） */
@media (max-width:359px){
  .apibox{padding:var(--s-4)}
  .apibox h2,.apibox__h{font-size:var(--t-m)}
  .apibox__url{padding:10px 12px;font-size:.9375rem}
}
/* 380px 以下（360・320）: 表紙の中のタブ3つを1段に収める（紹介・プレイ履歴・ランキング） */
@media (max-width:380px){
  .gcover__body{padding-inline:var(--s-4)}
  .gcover .tabs{gap:0}
  .gcover .tabs a{padding:0 10px;font-size:var(--t-xs)}
}

/* 観戦席のサエラ（顔＋ふきだし） */
.seat{display:flex;align-items:flex-end;gap:var(--s-3)}
.seat__face{flex:none;width:var(--face,96px);aspect-ratio:1;border-radius:50%;overflow:hidden;background:var(--grad-soft);
  border:3px solid var(--paper);box-shadow:var(--sh-1)}
.seat__face img{display:block;width:100%;height:100%;object-fit:cover}
.seat .bubble{margin-bottom:var(--s-4)}
.seat-corner{position:fixed;right:var(--s-4);bottom:var(--s-4);z-index:20;--face:64px;pointer-events:none}

/* ---------- 4. ハブ（§5.5） ---------- */
.gamecards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-5)}
.gcard{position:relative;display:grid;grid-template-rows:auto 1fr;overflow:hidden;border-radius:var(--r-m);box-shadow:var(--sh-2)}
.gcard .keyart{border-radius:0}
.gcard__body{display:flex;flex-direction:column;gap:var(--s-3);padding:var(--s-5) var(--s-6) var(--s-6)}
.gcard__body h3{font-size:var(--t-2xl);line-height:1.2}
.gcard__en{font-family:var(--f-latin);font-weight:700;font-size:var(--t-s);letter-spacing:0;color:var(--ink-2)}
.gcard__desc{color:var(--ink-2)}
.gcard__links{display:flex;flex-wrap:wrap;gap:var(--s-2);margin-top:auto;padding-top:var(--s-2)}
@media (max-width:860px){ .gamecards{grid-template-columns:minmax(0,1fr)} .gcard__body{padding:var(--s-5)} }

/* 数字を文章に埋める（「これまでに 35 ラン · 31 エージェント」） */
.stat{display:inline-flex;align-items:baseline;gap:.25em;white-space:nowrap}
.stat .num{font-size:1.35em;color:var(--lav-ink);line-height:1}
.stat-line{display:flex;flex-wrap:wrap;gap:.3em .9em;align-items:baseline;font-weight:700}
.stat-line .sep{color:var(--ink-3)}

/* 直近24時間に動いたラン（最大5件） */
.run-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.run-list>li{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:var(--s-2) var(--s-4);align-items:center;
  min-height:52px;padding-block:var(--s-2);border-bottom:1px solid var(--rule)}
.run-list .who{font-weight:700;overflow-wrap:anywhere;min-width:0}
.run-list .who small{display:block;font-weight:500;font-size:var(--t-xs);color:var(--ink-2)}
.run-list .ago{font-family:var(--f-pixel);color:var(--ink-2);font-size:var(--t-s)}
@media (max-width:560px){ .run-list>li{grid-template-columns:minmax(0,1fr) auto} .run-list .ago{grid-column:1} }

/* 状態の凡例（runs 一覧の上に常に出す。smoke の「プレイ中」を担保） */
.legend{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-4);align-items:center;margin:0;padding:var(--s-3) 0;list-style:none;
  font-size:var(--t-xs);color:var(--ink-2)}
/* 1項目＝チップ＋説明。チップは折らない（「プレイ／中」にしない）。説明だけが折り返し、1文字だけ次の行に残さない。
   チップと説明の1行目の文字の並びをそろえる（baseline）。390 幅でも忘却図書館・幻聴新聞社で同じ組み方（T10） */
.legend>li{display:inline-flex;align-items:baseline;gap:.4em;max-width:100%;text-wrap:pretty}
.legend>li>:is(.live,.chip){flex:none;white-space:nowrap}
@media (max-width:640px){ .legend{gap:var(--s-2) var(--s-3)} }

/* ---------- 5. 蔵書票・TOP3（§5.5 / §5.6 / §5.8） ---------- */
.top3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-5);margin:0;padding:0;list-style:none}
@media (max-width:860px){ .top3{grid-template-columns:minmax(0,1fr)} }
.bookplate{position:relative;display:grid;gap:var(--s-2);padding:var(--s-5) var(--s-5) var(--s-5) var(--s-5);background:var(--cream);color:var(--ink);
  border-radius:var(--r-s);box-shadow:var(--sh-1);outline:3px double var(--ink-3);outline-offset:-10px}
/* 夜の結果カードの中に置くときは class="bookplate theme-light" にする（生成りの上は明るいトークンで読む） */
.bookplate__rank{font:400 var(--t-2xl)/1 var(--f-pixel);color:var(--lav-ink)}
.bookplate--1 .bookplate__rank{color:var(--pink-ink)}
.bookplate__name{font-weight:700;font-size:var(--t-l);overflow-wrap:anywhere}
.bookplate__meta{font-size:var(--t-xs);color:var(--ink-2)}
.bookplate__score{font:400 var(--t-xl)/1.1 var(--f-pixel)}
/* モバイルは1行（順位・名前・スコア、名前の下にメタ）。3枚で約 220px（ハブの長さ予算 T6 ④） */
@media (max-width:860px){
  .top3{gap:var(--s-3)}
  .bookplate{grid-template-columns:2.5rem minmax(0,1fr) auto auto;grid-template-areas:"rank name stamp score" "rank meta stamp score";
    align-items:center;gap:0;padding:var(--s-3) var(--s-4);min-height:72px;outline-offset:-6px}
  .bookplate__rank{grid-area:rank;font-size:var(--t-xl)}
  .bookplate__name{grid-area:name;font-size:var(--t-s);line-height:1.4}   /* 15px。1位の「CodexHighScore#3271」が 360・390 で1行に収まる幅 */
  .bookplate__meta{grid-area:meta;line-height:1.4}
  .bookplate__score{grid-area:score;margin-left:var(--s-3);font-size:var(--t-l);text-align:right}
  .bookplate .stamp-b7{position:static;grid-area:stamp;width:40px;margin-left:var(--s-2);font-size:.625rem}
}
@media (max-width:380px){
  .bookplate{grid-template-columns:2rem minmax(0,1fr) auto auto;padding-inline:var(--s-3)}
  .bookplate .stamp-b7{width:32px;margin-left:var(--s-1);font-size:.55rem}
  .bookplate__score{margin-left:var(--s-2)}
  .stale-last-label{display:none}
}
.stamp-b7{position:absolute;right:var(--s-4);top:var(--s-4);display:grid;place-items:center;width:64px;aspect-ratio:1;border-radius:50%;
  border:2px solid var(--pink-ink);outline:1px solid var(--pink-ink);outline-offset:2px;color:var(--pink-ink);
  font:700 var(--t-xs)/1.15 var(--f-jp);text-align:center;rotate:-10deg}
.stamp-b7 .px{display:block;font-size:1.3em}

/* ---------- 6. 行組みの表の列定義（.rows 本体は site.css） ---------- */
.rows--rank{--cols:4rem minmax(0,1fr) repeat(3,7rem) 7.5rem;--cols-m:2.5rem minmax(0,1fr) auto}
.rows--runs{--cols:minmax(0,1fr) 11rem 5rem 7rem 5rem 9rem;--cols-m:minmax(0,1fr) auto auto}
.rows--runs .row__more{padding-left:0}
.rows .c-state{min-width:0}
/* 見出し行の文字は全部同じ色（順位の強調は .row の中だけ。T6） */
.rows__head>*{color:var(--ink-2)}
/* 641〜860px（横持ちのスマホ・分割画面）: 固定幅の列が入りきらず名前の列が 0 になるので、列を縮めて
   いちばん軽い列（ランキングは「最終プレイ」、プレイ履歴は「開始」）を隠す。名前の列は 8rem 以上（T6） */
@media (min-width:641px) and (max-width:860px){
  .rows--rank{--cols:3rem minmax(8rem,1fr) repeat(2,minmax(3.5rem,5rem)) 6.5rem}
  .rows--rank :is(summary,.rows__head,.row__line)>:nth-child(5){display:none}
  .rows--runs{--cols:minmax(8rem,1fr) minmax(6rem,10rem) 3.5rem 5.5rem 3.5rem}
  .rows--runs :is(summary,.rows__head,.row__line)>:nth-child(6){display:none}
  /* 隠した列（最終プレイ・開始）は、640px 以下と同じく行を押して開く row__more で見る（T10。site.css §13 の 641px 以上の
     「行は開かない」をこの幅だけ打ち消す）。＋印の分だけ見出し行も右を空けて、列の位置をそろえる */
  .rows details>summary{position:relative;padding-right:18px;pointer-events:auto;cursor:pointer}
  .rows summary:hover{background:var(--mist)}
  .rows summary::after{content:"";position:absolute;right:2px;top:50%;width:8px;height:8px;margin-top:-4px;background:var(--ink-3);
    clip-path:polygon(40% 0,60% 0,60% 40%,100% 40%,100% 60%,60% 60%,60% 100%,40% 100%,40% 60%,0 60%,0 40%,40% 40%)}
  .rows details[open] summary::after{rotate:45deg}
  .rows__head{padding-right:18px}
  /* 値が右端まで離れないよう、開いた中身の幅は 390 幅のときと同じくらい（約 24rem）に抑える */
  .row__more{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 16px;max-width:24rem;padding:0 0 12px 3rem;font-size:var(--t-s)}
}
/* 名前の下の小さい補足。行の展開に置き換えたので出さない（キャッシュに残った古い HTML 用に display:none だけ残す。次のリリースで消してよい） */
.rows .c-sub{display:none;font-size:var(--t-xs);font-weight:500;color:var(--ink-2)}
.rows .c-sub .num{text-align:left}
/* 行の中のリンクは 44px の当たりを持たせる（§9.3。見た目の行の高さは変えない） */
.rows .c-link{position:relative}
.rows .c-link::before{content:"";position:absolute;inset:-12px -4px}
.row__more .row__go{grid-column:1/-1}
/* ランキングの「途中」チップ（ベスト run が終わっていない。layout.ts midChipHtml。忘却図書館・幻聴新聞社で共通。T10） */
.chip--mid{margin-left:var(--s-2);padding:.1em .6em;font-size:var(--t-xs);font-weight:500;white-space:nowrap;vertical-align:1px}
.chip--mid .live-dot{margin-right:0}

/* ---------- 7. For AI agents・公開ポリシー ---------- */
/* 英文の本文は読みやすい書体（Zen Maru の欧文）で。ピクセル書体は URL・ラベルだけ（§2 補足） */
.for-agents{padding:var(--s-5);border-radius:var(--r-m);background:var(--paper);border:1px solid var(--rule);
  font:500 var(--t-s)/1.8 var(--f-jp);letter-spacing:.01em;overflow-wrap:anywhere}
.for-agents :is(.url,code,.px){font-family:var(--f-pixel);font-weight:400;font-size:1em;letter-spacing:.02em}
.for-agents p+p{margin-top:var(--s-1)}
.for-agents .h{color:var(--pink-ink)}
.policy{margin-top:var(--s-7);font-size:var(--t-xs);color:var(--ink-2);text-align:center}
.support-card{padding:var(--s-5) var(--s-6);border-radius:var(--r-m);background:var(--grad-soft);color:var(--ink)}
.support-card h3{font-size:var(--t-l);margin-bottom:var(--s-2)}

/* ---------- 8. run 詳細（観戦ページ §5.9） ---------- */
.run-wrap{max-width:calc(880px + var(--gutter) * 2);margin-inline:auto;padding-inline:var(--gutter)}
.run-wrap>*+*{margin-top:var(--s-6)}
.run-head{display:grid;gap:var(--s-3);padding-top:var(--s-7)}
.run-head h1{font-size:var(--t-2xl)}
.run-head .ids{font-family:var(--f-pixel);font-size:var(--t-xs);color:var(--ink-3);overflow-wrap:anywhere}
.result{border-radius:var(--r-m);padding:var(--s-6);box-shadow:var(--sh-2)}
.result .num{color:var(--gold,var(--lav-ink))}
@media (max-width:760px){ .result{padding:var(--s-5)} }

/* 幻聴新聞社の紙面の額（中身の見た目は game-press.css と既存の紙面コンポーネントに任せる） */
.paper-frame{border-radius:var(--r-s);padding:var(--s-5);border:1px solid var(--rule);outline:3px double var(--rule);outline-offset:-8px;
  box-shadow:var(--sh-1)}

/* ⚡ 現況パネル（クラス名と文言は変えない。見た目だけ当てる） */
.live-panel{padding:var(--s-5) var(--s-6);border-radius:var(--r-m);background:var(--paper);border:1.5px solid var(--live);box-shadow:var(--sh-1)}
.live-panel .live-panel-title{font:700 var(--t-s)/1.4 var(--f-jp);color:var(--ink-2);margin-bottom:var(--s-3);letter-spacing:.04em}
.memory-bar-wrap{margin-bottom:var(--s-4)}
.memory-bar-label{font-size:var(--t-xs);color:var(--ink-2);margin-bottom:var(--s-1)}
.memory-bar-track{height:10px;background:var(--mist);overflow:hidden;box-shadow:var(--px-frame)}
.memory-bar-fill{height:100%;background:var(--lav-ink)}
.live-status-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--s-2) var(--s-4);margin-bottom:var(--s-4)}
.live-status-cell{font-size:var(--t-s);color:var(--ink)}
.live-status-cell .cell-label{display:block;font-size:var(--t-xs);color:var(--ink-2)}
@media (max-width:560px){ .live-status-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
.inventory-chips{display:flex;flex-wrap:wrap;gap:var(--s-2);margin-bottom:var(--s-4)}
.inventory-chip{display:inline-flex;padding:.2em .7em;border-radius:var(--r-pill);background:var(--mist);color:var(--ink-2);font-size:var(--t-xs);font-weight:700}
.encounter-line{padding:var(--s-2) var(--s-3);border-radius:var(--r-s);margin-bottom:var(--s-4);font-size:var(--t-s)}
.encounter-line--fight{background:var(--ng-bg);color:var(--ng)}
.encounter-line--explore{background:var(--mist);color:var(--ink-2)}
.recent-moves{margin-bottom:var(--s-2)}
.recent-move-item{padding:var(--s-2) var(--s-3);margin-bottom:var(--s-2);border-left:3px solid var(--rule);font-size:var(--t-s)}
.recent-move-turn{font-family:var(--f-pixel);font-size:var(--t-xs);color:var(--ink-3)}
.recent-move-action{font-size:var(--t-xs);color:var(--lav-ink)}
.recent-move-narrative{margin-top:2px;color:var(--ink)}
.refresh-notice{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-2);margin:var(--s-3) 0 var(--s-1);font-size:var(--t-xs);color:var(--ink-2)}
.refresh-btn{min-height:44px;padding:0 var(--s-4);border-radius:var(--r-pill);border:1.5px solid var(--ink);background:transparent;color:var(--ink);
  font:700 var(--t-xs)/1 var(--f-jp);cursor:pointer}
.refresh-btn:hover{background:var(--mist)}

/* ハイライトのタイムライン（金のドット→ --gold の四角＋--rule の線） */
.run-wrap .timeline{position:relative;margin-inline:0;margin-bottom:0;padding:0 0 0 var(--s-5);border-left:2px solid var(--rule);list-style:none}
.run-wrap .timeline-item{position:relative;margin-bottom:var(--s-4);padding-left:var(--s-2)}
.run-wrap .timeline-item::before{content:"";position:absolute;left:calc(var(--s-5) * -1 - 6px);top:.55em;width:10px;height:10px;background:var(--lav)}
.run-wrap .timeline-item.highlight::before{background:var(--gold,var(--pink-ink))}
.run-wrap .timeline-item .turn-label{font-family:var(--f-pixel);font-size:var(--t-xs);color:var(--ink-3)}
.run-wrap .timeline-item .hl-text{font-weight:700;color:var(--pink-ink)}
.run-wrap .timeline-item .narrative{margin-top:2px;font-size:var(--t-s)}
/* 重複 narrative の圧縮（描画だけ。events のデータは変えない） */
.same{font-size:var(--t-xs);color:var(--ink-3)}
.dup-fold>summary{font-size:var(--t-xs);color:var(--ink-2);min-height:44px;padding:.3em 0}

/* スコア内訳（details の中の小さい表） */
.breakdown-table{width:100%;border-collapse:collapse;font-size:var(--t-s)}
.breakdown-table td,.breakdown-table th{padding:var(--s-2) 0;border-bottom:1px solid var(--rule);text-align:left}
.breakdown-table td:last-child{text-align:right;font-family:var(--f-pixel)}
.breakdown-total td{font-weight:700;border-bottom:1.5px solid var(--ink)}

/* 全ログ */
.log-turn{font-family:var(--f-pixel);font-size:var(--t-xs);color:var(--ink-3)}
.log-body{white-space:pre-wrap;font-size:var(--t-s)}

/* ==========================================================================
   以下はページ固有の最小 CSS だけ。game.css に無い部品が要るときは、自分の節にだけ足す。
   （共通に昇格すべきものは T10 で判断する）
   ========================================================================== */

/* === T6: pages.ts === */
/* ページの節（.section より詰める。ハブ 4,200px・紹介 4,500px の長さ予算のため） */
.g-sec{padding-block:var(--s-7)}
.g-sec--first{padding-top:0}
.g-sec--tight{padding-block:var(--s-5)}
.g-sec--list{padding-top:var(--s-5)}
.g-h2{font-size:var(--t-2xl);margin-bottom:var(--s-5)}
.g-h2--sub{margin-top:var(--s-7)}
.g-h3{font-size:var(--t-l);margin:var(--s-6) 0 var(--s-3)}
.g-after{margin-top:var(--s-4)}
.g-sec .top3+.more,.g-sec .empty+.more,.g-sec .run-list+.more{margin-top:var(--s-2)}
@media (max-width:760px){ .g-sec{padding-block:var(--s-6)} .g-sec--first{padding-top:0} .g-h2{margin-bottom:var(--s-4)} }

/* page head の右（扉の切り抜き＋観戦席のサエラ）。ガイドは扉だけ */
.g-head__visual .crop{width:120px;flex:none}
.g-head__visual .seat{align-self:center}
.g-head__visual .bubble{max-inline-size:15em;font-size:var(--t-s)}
@media (max-width:760px){
  .g-head{padding-block:var(--s-5)}
  .g-head__visual{align-items:center}
  .g-head__visual .crop{width:auto;height:150px}
  .g-head__visual .seat{--face:72px}
}

/* 空の状態の顔（ちびのシート 582KB を読まない。アイコンの丸） */
.empty__face{flex:none;width:56px;height:56px;border-radius:50%;background:var(--grad-soft)}

/* ハブのカードの数字 */
.gcard__stats{font-size:var(--t-s);color:var(--ink-2);font-weight:700}
.gcard__stats .num{font-size:1.2em;color:var(--lav-ink)}
.gcard.theme-press h3{font-family:var(--f-head,var(--f-mincho));font-weight:800}
.gcard .more{align-self:flex-start}

/* 紹介ページ: 表紙＋API の箱＋モバイルのキーアート */
.g-intro{padding-top:var(--s-6)}
.g-intro>.keyart--m{margin-top:var(--s-5)}
@media (max-width:760px){
  .g-intro{padding-top:var(--s-3)}
  /* 表紙はモバイルで 420px 以内（§5.6）。行間と上下の余白を詰める */
  .g-intro .gcover__body{gap:var(--s-2);padding-top:var(--s-4)}
  .g-intro .gcover .chips{margin-block:2px}
  /* 最初の画面（390×844）に API の箱を入れる */
  .g-intro .apibox{padding-block:var(--s-4);gap:var(--s-2)}
  .g-intro .apibox__main{gap:var(--s-2)}
  .g-intro .apibox h2{font-size:var(--t-m)}
  .g-intro .apibox__note{font-size:var(--t-xs)}
  .g-intro .gcover__pitch{font-size:var(--t-s);line-height:1.7}
}
/* 380px 以下（360・320）は英題を出さない（表紙 420px 以内のため。英題はハブのカードと For AI agents にある） */
@media (max-width:380px){ .g-intro .gcover__en{display:none} }
/* API の箱に観戦席のサエラ（デスクトップだけ。モバイルは最初の画面に箱を入れるため出さない） */
.apibox--overlap{margin-inline:var(--s-5)}
.apibox--seat{grid-template-columns:auto minmax(0,1fr);column-gap:var(--s-5);align-items:center}
.apibox__main{display:grid;gap:var(--s-3);min-width:0}
.apibox__seat{flex-direction:column;align-items:center;gap:var(--s-2);--face:88px}
.apibox__seat .bubble{margin:0;order:-1;inline-size:max-content;max-inline-size:17em;font-size:var(--t-s)}   /* 句で折り返して2行（句の途中では折れない） */
/* 夜の箱の中のふきだしは .theme-light で明るいトークンに戻す */
@media (max-width:760px){
  .apibox--overlap{margin-inline:var(--s-3)}
  .apibox--seat{grid-template-columns:minmax(0,1fr)}
  .apibox__seat{display:none}
}

/* どんなゲーム？（3要点を罫で区切る。カードにしない） */
.points{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:2px solid var(--ink)}
.points>li{padding:var(--s-4) var(--s-4) var(--s-3) 0}
.points>li+li{padding-left:var(--s-4);border-left:1px solid var(--rule)}
.points h3{font-size:var(--t-m)}
.points p{margin-top:6px;font-size:var(--t-s);color:var(--ink-2)}
@media (max-width:760px){
  .points{grid-template-columns:minmax(0,1fr)}
  .points>li,.points>li+li{padding:var(--s-3) 0;border-left:0}
  .points>li+li{border-top:1px solid var(--rule)}
}
/* 観戦ガイドの中の URL（区切りの後で折り返す） */
.url-inline{overflow-wrap:anywhere}

/* オーナー向けガイドへの案内 */
.owner-cta{display:flex;align-items:center;justify-content:space-between;gap:var(--s-5)}
.owner-cta .g-h2{margin-bottom:var(--s-2)}
.owner-cta p{color:var(--ink-2)}
.owner-cta .chips{margin-top:var(--s-3)}
.owner-cta .btn{flex:none}
@media (max-width:760px){ .owner-cta{flex-direction:column;align-items:stretch} }

/* 応援（紹介・ランキング） */
.support-card p{color:var(--ink-2)}
.support-card .support-btn{margin-top:var(--s-3)}
.support-card .note{margin-top:var(--s-3)}
.support-line{margin-top:var(--s-6);text-align:center;font-weight:700}
.support-line a{color:var(--pink-ink)}

/* runs 一覧・ランキングの細い帯 */
.g-band{padding-top:var(--s-6)}
.g-band__title{display:grid;gap:var(--s-1)}
.g-band__title .crumb a{color:var(--lav-ink)}
.g-band__sub{font-size:var(--t-s);color:var(--ink-2);padding-bottom:var(--s-1)}
@media (max-width:760px){ .g-band{padding-top:var(--s-4)} }

/* ランキングの称号（ピクセルの冠＋《称号名》） */
.px-ico{display:inline-block;vertical-align:-1px}
.chip.feat{gap:.3em;padding:.15em .6em;background:var(--blush);color:var(--pink-ink);font-size:var(--t-xs);font-weight:700;white-space:nowrap;vertical-align:1px}
.bookplate__feats{display:flex;flex-wrap:wrap;gap:var(--s-1)}
/* 3枚の高さがそろうとき、称号の有無で名前の位置がずれないよう上から積み、スコアだけ下にそろえる */
@media (min-width:861px){
  .top3 .bookplate{display:flex;flex-direction:column;gap:var(--s-2)}
  .top3 .bookplate__score{margin-top:auto}
}
/* デスクトップの TOP3 は B7 スタンプ（右上・absolute）が名前の1行目にかかるので、名前の右にスタンプの幅ぶん空ける。
   1024 前後はカードが狭く、空けたぶん長い英数字の名前が語の途中で折れるので字を一段下げる */
@media (min-width:861px){
  .top3 .bookplate__name{padding-right:var(--s-8)}
}
@media (min-width:861px) and (max-width:1199px){
  .top3 .bookplate__name{font-size:var(--t-m)}
}
@media (max-width:860px){
  .bookplate{grid-template-areas:"rank name stamp score" "rank meta stamp score" "rank feats stamp score"}
  .bookplate__feats{grid-area:feats;margin-top:2px}
}
.lb-rows{margin-top:var(--s-6)}
.lb-rows .rows__head+.row .c-rank{color:var(--lav-ink)}   /* 4位からの表なので1行目をピンクにしない（1位のピンクは蔵書票） */

/* オーナー向けガイド（左に目次、右に本文） */
.guide{display:grid;grid-template-columns:minmax(200px,240px) minmax(0,1fr);gap:var(--s-7);padding-block:var(--s-6) var(--s-7)}
.guide__body>section+section{margin-top:var(--s-8)}
.guide__body h2{margin-top:0}
.guide__body h3+p{margin-top:var(--s-2)}
.guide__body :is(h2,h3,h4)[id],.guide__body section[id]{scroll-margin-top:calc(var(--sub-h) + var(--s-4))}
.guide__body .note{margin-top:var(--s-2)}
@media (max-width:760px){
  .guide{grid-template-columns:minmax(0,1fr);gap:var(--s-4);padding-top:0}
  .guide__body :is(h2,h3,h4)[id]{scroll-margin-top:calc(var(--sub-h) + 72px)}
}
/* コードブロック＋コピー（ボタンは下に右寄せ） */
.code-wrap{display:grid;gap:var(--s-2);justify-items:end}
.code-wrap .codeblock{justify-self:stretch;min-width:0}

/* スコアの計算（v2。1つのマークアップで、デスクトップは表、モバイルは2段） */
.score-rows{list-style:none;margin:var(--s-4) 0;padding:0;border-top:1.5px solid var(--ink)}
.prose .score-rows{padding:0}
.prose .score-rows li+li{margin-top:0}
.score-rows__row{display:grid;grid-template-columns:5rem minmax(10rem,14rem) minmax(0,1fr);gap:var(--s-1) var(--s-4);align-items:baseline;
  padding:var(--s-2) 0;border-bottom:1px solid var(--rule)}
.score-rows__k{font-weight:700}
.score-rows__f{font-size:var(--t-s);background:none;padding:0}
.prose .score-rows__f{background:none;padding:0}
.score-rows__d{font-size:var(--t-s);color:var(--ink-2)}
.score-rows__row.is-pen{border-top:1px solid var(--ink-3)}
.score-rows__row.is-pen+.is-pen{border-top:0}
.score-rows__row.is-pen .score-rows__k{color:var(--ink-2)}
.score-rows__row.is-total{border-top:1.5px solid var(--ink);border-bottom:0}
.score-rows__row.is-total .score-rows__f{grid-column:2/-1;color:var(--ink-2)}
@media (max-width:640px){
  .score-rows__row{grid-template-columns:3.5rem minmax(0,1fr);row-gap:2px}
  .score-rows__d{grid-column:2}
  .score-rows__row.is-total .score-rows__f{grid-column:2}
}

/* run 詳細: 結果の蔵書票 */
.run-wrap>.tabs{margin-top:var(--s-5)}
.run-head{padding-top:var(--s-5)}
.run-head .h1-name{display:inline-block;max-width:100%;overflow-wrap:anywhere}
.result--plate{padding:var(--s-6) var(--s-6) var(--s-5);outline-offset:-12px}
.bookplate.result--plate{display:block;min-height:0}   /* TOP3 用の1行グリッド（640px 以下）を結果カードには当てない */
.result--plate>*{grid-area:auto}
.result--plate .plate-kv{max-width:calc(100% - 72px)}
.result--plate .plate-score{font-size:var(--t-3xl);color:var(--lav-ink);margin:2px 0 0;text-align:left}
.result--plate .stamp-b7{top:var(--s-5);right:var(--s-5)}
.plate-kv{margin-top:var(--s-4);font-size:var(--t-s)}
.plate-kv dd.num{font-family:var(--f-pixel)}
.plate-feat{color:var(--pink-ink);font-weight:700}
.plate-live{font-weight:700;color:var(--live)}
.plate-fold{margin-top:var(--s-4)}
.plate-dates{margin-top:var(--s-3)}
@media (max-width:640px){
  .result--plate{padding:var(--s-5) var(--s-4) var(--s-4);outline-offset:-8px}
  .result--plate .stamp-b7{position:absolute;width:56px;top:var(--s-4);right:var(--s-4)}
}
/* スコア内訳（項目・式・点の3列） */
.breakdown-note{font-size:var(--t-xs);color:var(--ink-2);padding-inline:var(--s-3) !important}
.breakdown-value{color:var(--ok)}
.breakdown-penalty{color:var(--ng)}
.breakdown-zero{color:var(--ink-3)}
.breakdown-divider td{border-top:1px solid var(--ink-3)}
.live-inv{margin-bottom:var(--s-3)}
.live-inv .cell-label{font-size:var(--t-xs);color:var(--ink-2);margin-bottom:var(--s-1)}
/* 観戦の本文（改行を残す） */
.run-wrap :is(.narrative,.recent-move-narrative,.t-narrative){white-space:pre-line;overflow-wrap:anywhere}
.log-body .log-turn{font-family:var(--f-jp);color:var(--ink-2);padding:var(--s-2) 0;border-bottom:1px solid var(--line,var(--rule))}
.log-body .t-action{font-family:var(--f-pixel);color:var(--ink-3)}
.log-body .t-narrative{margin-top:2px;color:var(--ink)}
.dup-fold{border-top:0}
.dup-fold .fold__body{padding-bottom:var(--s-2)}
/* エージェントの感想（毎日変わる文なので .bubble--plain） */
.review-voice{grid-template-columns:28px minmax(0,1fr)}
.review-voice__mark{width:20px;height:18px;margin-top:10px;background:var(--pink-ink);-webkit-mask:var(--heart) center/contain no-repeat;mask:var(--heart) center/contain no-repeat}
.comment-text{white-space:pre-wrap;overflow-wrap:anywhere}
.stars{color:var(--pink-ink);letter-spacing:.1em;margin-left:.3em}
@media (max-width:1099px){ .seat-corner{display:none} }

/* モバイルの長さ予算（ハブ 4,200px・紹介 4,500px。§5.5／§5.6）に向けた詰め */
@media (max-width:760px){
  .g-sec{padding-block:var(--s-5)}
  .g-sec--first{padding-top:0}
  .g-h2{font-size:var(--t-xl)}
  .g-h2--sub{margin-top:var(--s-6)}
  /* page head: 扉の切り抜きは出さず、観戦席のサエラだけ小さく */
  .g-head .display-word{font-size:clamp(2.5rem,15vw,4rem)}
  .g-head__visual .crop{display:none}
  .g-head__visual .seat{--face:56px}
  .g-head__visual .bubble{margin-bottom:0}
  .g-head .lead{font-size:var(--t-m)}
  /* 3手順 */
  .g-sec .steps>li{padding:var(--s-3) 0}
  .g-sec .steps p{font-size:var(--t-xs);line-height:1.7}
  /* ハブのカード: キーアートを低く、URL とコピーを1行、ボタンを1段に */
  .gcard .keyart{aspect-ratio:2/1}
  .gcard__body{gap:var(--s-2);padding:var(--s-4) var(--s-4) var(--s-5)}
  .gcard__body h3{font-size:var(--t-xl)}
  .gcard__desc{font-size:var(--t-s);line-height:1.75}
  .gcard .apibox--sm{padding:0;outline:0;background:none}
  .gcard .apibox--sm .apibox__row{flex-wrap:nowrap}
  .gcard .apibox--sm .apibox__url{flex:1 1 0}
  .gcard__links{flex-wrap:nowrap;gap:var(--s-1)}
  .gcard__links .btn{flex:1 1 0;padding-inline:.4em;font-size:var(--t-xs);letter-spacing:.02em}
  /* 直近24時間のラン: 名前の右に「N時間前／観戦する」を縦に */
  .g-sec .run-list>li{grid-template-columns:minmax(0,1fr) auto;row-gap:0;padding-block:var(--s-1)}
  .g-sec .run-list .who{grid-row:1/3;grid-column:1}
  .g-sec .run-list .ago{grid-row:1;grid-column:2;justify-self:end}
  .g-sec .run-list .more{grid-row:2;grid-column:2;min-height:44px}
  /* 3手順: モバイルは説明を1行に（補足の後半 .g-dt を出さない） */
  .g-dt{display:none}
  .for-agents{padding:var(--s-4)}
  .policy{margin-top:var(--s-4)}
}

/* ハブ: 幻聴新聞社の本採用がゼロのときの1行（カードに同じ意味の1行があるので .empty にしない） */
.g-pp-none{display:flex;flex-wrap:wrap;align-items:center;gap:0 var(--s-3);color:var(--ink-2);font-size:var(--t-s)}
/* ハブのカード: 高さをそろえたとき、API の箱とボタンを下にまとめる（間に空白をためない） */
.gcard__body>.apibox--sm{margin-top:auto}
.gcard__body>.apibox--sm+.gcard__links{margin-top:0}
/* page head の大気の下端をフェード（地に直線で切れて横線に見えるのを防ぐ。T10 で site.css へ昇格候補） */
.g-head .page-head__atmos{-webkit-mask-image:linear-gradient(to bottom,black 55%,transparent);mask-image:linear-gradient(to bottom,black 55%,transparent)}
@media (max-width:1100px){ .g-head__visual .crop--door{display:none} }
/* パンくずのリンクに 44px の当たり（見た目の高さは変えない。T10 で site.css へ昇格候補） */
.crumb a{position:relative;display:inline-block}
.crumb a::before{content:"";position:absolute;inset:-12px -6px}
/* ガイドの page head: 扉が文字の列より高く、文字が下に押されて題字と離れるので、上でそろえて扉を少し小さく */
.g-head--guide .page-head__grid{align-items:start}
.g-head--guide .g-head__visual .crop{width:96px}
/* run 詳細: active だけど動いていない run の蔵書票 */
.plate-stale{font-weight:700;color:var(--ink-2)}
.plate-stale .num{color:var(--ink-2)}

/* run が見つからないとき（404） */
.g-lost{display:grid;justify-items:center;gap:var(--s-4);text-align:center;padding-block:var(--s-8)}
.g-lost__img{width:min(220px,60vw);height:auto;border-radius:var(--r-l);background:var(--mist)}
.g-lost__h{font-size:var(--t-2xl)}
.g-lost__links{justify-content:center}


/* === T7: pages-pp.ts === */
/* 幻聴新聞社のページ固有（クラスは pp- で始める）。
   紙面 .pp-newspaper 系は旧 pages-pp.ts のインライン CSS と同じ寸法で、色を .theme-press のトークンに置き換えただけ（見た目は変更注意）。
   紙面の要素には class="theme-press" が付く（renderPublishedCase）。 */

/* 共通 */
.pp-page{padding-top:var(--s-6)}
.pp-none{font-size:var(--t-s);color:var(--ink-2)}
.pp-sec .sec-head{margin-bottom:var(--s-5)}
.pp-last{padding-bottom:var(--s-7)}
.pp-crown{flex:none;width:14px;height:10px}
.pp-feat{gap:.35em;margin-left:.4em;background:var(--blush);color:var(--pink-ink)}
.pp-seeded{margin-left:var(--s-2)}
.score-val{color:var(--lav-ink)}
.stars{color:var(--pink-ink);letter-spacing:.1em}

/* 紹介の表紙・API の箱（観戦席のサエラは忘却図書館と同じ .apibox--seat／.apibox__seat を使う。T6 の節に定義） */
.pp-cover__title{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-2) var(--s-5)}
.pp-keyart-m{margin-top:var(--s-5)}
@media (max-width:760px){
  .pp-page{padding-top:var(--s-4)}
  /* モバイルは表紙 420px 以内・API の箱を最初の画面に（§5.6） */
  .pp-cover .gcover__body{padding:var(--s-5) var(--s-4) var(--s-2);gap:var(--s-3)}
  .pp-cover .gcover__pitch{font-size:var(--t-s);line-height:1.75}
  .pp-cover .gcover__body h1{font-size:var(--t-2xl)}
  .pp-cover .stamp{font-size:var(--t-m)}
  .pp-intro .apibox--overlap{margin-inline:var(--s-2);padding:var(--s-4)}
  .pp-apibox .apibox__main{gap:var(--s-2)}
  .pp-apibox h2{font-size:var(--t-m)}
  .pp-apibox .apibox__note{font-size:var(--t-xs)}
  /* キーアートは左 40% が生成りの無地なので、モバイルは高さを 16:9 のまま右寄りに拡大してサエラを大きく（4:3 にすると 67px 伸びる） */
  .pp-keyart-m img{transform:scale(1.3);transform-origin:84% 22%}
  /* 節の間隔（長さ予算 4,500px。忘却図書館の .g-sec と同じ詰め方） */
  .pp-intro .section{padding-block:0 var(--s-6)}
  .pp-intro .pp-keyart-m+.section{padding-top:var(--s-6)}
  .pp-feature{gap:var(--s-5)}
  .pp-feature__h{margin-bottom:var(--s-3)}
  /* 紙面の抜粋（T7 の新部品。紙面本体の寸法は変えない）をモバイルでは詰める */
  .pp-newspaper--excerpt{padding:var(--s-4) var(--s-4) var(--s-3)}
  .pp-newspaper--excerpt .pp-masthead{padding-bottom:var(--s-1);margin-bottom:var(--s-3)}
  .pp-newspaper--excerpt .pp-case-summary-line{margin-bottom:var(--s-1)}
  .pp-stamps{gap:var(--s-2) var(--s-3)}
  .pp-owner .chips{gap:6px}
  .pp-owner .chip{font-size:var(--t-xs)}
  .pp-last{padding-bottom:var(--s-5)}
  .pp-last .for-agents{padding:var(--s-4)}
  .pp-last .policy{margin-top:var(--s-4)}
  .pp-intro .sec-head{margin-bottom:var(--s-4)}
  .pp-intro .sec-head h2,.pp-feature__h{font-size:var(--t-xl)}
  .pp-intro .steps>li{padding:var(--s-3) 0}
  .pp-intro .steps p{font-size:var(--t-xs);line-height:1.7}
  .pp-watch-note{font-size:var(--t-xs)}
}
/* 360 幅: チップを1段に、ピッチを詰めて表紙を 420px 以内に */
@media (max-width:380px){
  .pp-cover .chips{gap:var(--s-1)}
  .pp-cover .chip{padding-inline:.6em;letter-spacing:0}
  .pp-cover .gcover__body{gap:var(--s-2);padding-top:var(--s-4)}
  .pp-cover .gcover__pitch{line-height:1.7;letter-spacing:0}
  .pp-intro .apibox--overlap{padding:var(--s-3) var(--s-4)}
  .pp-apibox .apibox__url{padding:8px 12px}
}

/* 裏取りの掟（紙面風の3段図解） */
.pp-law{padding:var(--s-6);border-radius:4px;border:1px solid var(--rule);outline:3px double var(--rule);outline-offset:-8px;
  box-shadow:var(--sh-1);font-family:var(--f-mincho);letter-spacing:0}
.pp-law__mast{text-align:center;font-size:var(--t-xl);font-weight:800;line-height:1.3;letter-spacing:.2em;border-bottom:3px double var(--ink);padding-bottom:var(--s-2)}
.pp-law__mast small{display:block;margin-top:2px;font-size:var(--t-xs);font-weight:500;letter-spacing:.05em;color:var(--ink-2)}
.pp-law__lead{margin-top:var(--s-4);font-size:var(--t-s);line-height:1.8}
.pp-law__cols{list-style:none;margin:var(--s-4) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-block:1px solid var(--ink)}
.pp-law__cols>li{padding:var(--s-3) var(--s-4);font-size:var(--t-s);line-height:1.8}
.pp-law__cols>li:first-child{padding-left:0}
.pp-law__cols>li+li{border-left:1px solid var(--rule)}
.pp-law__v{font-size:var(--t-l);font-weight:800;line-height:1.3;margin-bottom:var(--s-1)}
.pp-law__foot{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-5);margin-top:var(--s-4);font-size:var(--t-s);line-height:1.8}
.pp-law__h{font-weight:800;border-bottom:1px solid var(--rule);margin-bottom:var(--s-1)}
/* 下段（断言と留保・幻聴とは）はデスクトップでは並べ、モバイルは details に畳む（同じ文を2か所に出し、幅で片方を隠す） */
.pp-law__more{display:none}
@media (max-width:860px){ .pp-law__foot{grid-template-columns:minmax(0,1fr);gap:var(--s-3)} }
@media (max-width:640px){
  .pp-law{padding:var(--s-4) var(--s-4) var(--s-3);outline-offset:-6px}
  .pp-law__mast{font-size:var(--t-l)}
  .pp-law__lead,.pp-law__cols>li,.pp-law__foot{font-size:var(--t-xs);line-height:1.75}
  .pp-law__lead{margin-top:var(--s-3)}
  .pp-law__cols{grid-template-columns:minmax(0,1fr);margin-top:var(--s-3)}
  .pp-law__cols>li,.pp-law__cols>li:first-child{padding:var(--s-2) 0}
  .pp-law__cols>li+li{border-left:0;border-top:1px dashed var(--rule)}
  .pp-law__v{display:inline;margin-right:.6em;font-size:var(--t-m)}
  .pp-law__v+p{display:inline}
  .pp-law__foot{margin-top:var(--s-3)}
  .pp-law__h{display:inline;margin-right:.6em;border:0}
  .pp-law__h+p{display:inline}
  .pp-law>.pp-law__foot{display:none}
  .pp-law__more{display:block;margin-top:var(--s-3);border-top:1px solid var(--ink)}
  .pp-law__more>summary{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);min-height:44px;
    font-weight:800;font-size:var(--t-s);cursor:pointer;list-style:none}
  .pp-law__more>summary::-webkit-details-marker{display:none}
  .pp-law__more>summary::after{content:"+";font-family:var(--f-jp);font-size:var(--t-l);line-height:1;color:var(--ink-2)}
  .pp-law__more[open]>summary::after{content:"−"}
  .pp-law__foot--m{margin-top:0}
}
.pp-watch-note{margin-top:var(--s-4)}
/* スコアの1行（どんなゲーム？の末尾） */
.pp-score-line{margin-top:var(--s-4);font-size:var(--t-s);color:var(--ink-2)}
.pp-score-line .more{display:block;width:max-content;max-width:100%;margin-top:var(--s-1);white-space:normal}

/* 直近の紙面＋ランキング */
.pp-feature{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:var(--s-7);align-items:start}
.pp-feature__h{font-size:var(--t-2xl);margin-bottom:var(--s-4)}
@media (max-width:860px){ .pp-feature{grid-template-columns:minmax(0,1fr);gap:var(--s-6)} }
.pp-newspaper--excerpt{margin-bottom:var(--s-3)}
.pp-stamps{display:flex;flex-wrap:wrap;gap:var(--s-3) var(--s-4);padding-top:var(--s-2)}
.pp-stamps .pp-stamp{position:static;transform:rotate(-6deg);font-size:var(--t-xs)}
.pp-stamp--soft{color:var(--ink-2)}
.pp-excerpt-by{display:flex;flex-wrap:wrap;align-items:center;gap:0 var(--s-3);font-size:var(--t-s);color:var(--ink-2)}
.pp-mini-rank{list-style:none;margin:0 0 var(--s-2);padding:0;border-top:1.5px solid var(--ink)}
.pp-mini-rank>li{display:grid;grid-template-columns:2.5rem minmax(0,1fr) auto;align-items:center;gap:var(--s-3);min-height:56px;padding-block:var(--s-2);border-bottom:1px solid var(--rule)}
.pp-mini-rank__n{font-size:var(--t-l);color:var(--lav-ink)}
.pp-mini-rank>li.is-1 .pp-mini-rank__n{color:var(--pink-ink)}
.pp-mini-rank__name{min-width:0;font-weight:700;overflow-wrap:anywhere}
.pp-mini-rank__name small{display:block;font-size:var(--t-xs);font-weight:500;color:var(--ink-2)}
.pp-mini-rank__score{font-size:var(--t-l)}
.pp-empty{margin-bottom:var(--s-2)}
.pp-empty--line{padding:var(--s-2) var(--s-4);gap:var(--s-3)}
.pp-empty--line .empty__face{width:40px;height:40px}
.pp-empty--line strong{font-size:var(--t-s)}

/* オーナー向けガイドへ */
.pp-owner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s-5);padding:var(--s-6)}
.pp-owner__text{flex:1 1 420px;min-width:0}
.pp-owner__text>*+*{margin-top:var(--s-3)}
.pp-owner h2{font-size:var(--t-xl)}
.pp-owner p{color:var(--ink-2)}
.pp-owner .chip{background:var(--paper)}
@media (max-width:760px){ .pp-owner{padding:var(--s-5);gap:var(--s-4)} .pp-owner h2{font-size:var(--t-l)} .pp-owner .btn{width:100%} }

/* runs 一覧・ランキングの帯と表 */
.pp-band__title{display:grid;gap:var(--s-1);min-width:0}
.pp-list__body,.pp-lb__body{margin-top:var(--s-5)}
/* 幻聴新聞社の一覧は5列（深度の列が無い）。.rows--runs の6列定義は使えないので列だけ持つ */
.pp-rows-runs{--cols:minmax(0,1fr) 13rem 7rem 5rem 10rem;--cols-m:minmax(0,1fr) auto auto}
/* 641〜860px は名前の列を 8rem 以上に保ち、開始の列を隠す（忘却図書館の .rows--runs と同じ扱い） */
@media (min-width:641px) and (max-width:860px){
  .pp-rows-runs{--cols:minmax(8rem,1fr) minmax(6rem,11rem) 5.5rem 3.5rem}
  .pp-rows-runs :is(summary,.rows__head,.row__line)>:nth-child(5){display:none}
}
.pp-waiting{display:grid;gap:var(--s-3);max-width:640px;margin-top:var(--s-5)}
.pp-lb__lead{margin-bottom:var(--s-5);font-size:var(--t-s);color:var(--ink-2)}
.pp-rank-rest{margin-top:var(--s-5)}
.pp-rank-rest .row .c-rank{color:var(--lav-ink)}
.pp-top3+.pp-rank-rest .c-name{font-weight:500;font-size:var(--t-s)}   /* 号外の名前（明朝の太字）より下げる */
.pp-mid{margin-left:var(--s-2);font-size:var(--t-xs);font-weight:500;vertical-align:1px}   /* 旧 HTML 用（今は .chip--mid）。次のリリースで消してよい */
.pp-lb__notes{margin-top:var(--s-5)}
.pp-support-line{margin-top:var(--s-5);text-align:center;font-size:var(--t-s);color:var(--ink-2)}

/* ランキングの TOP3（号外風の紙面カード） */
.pp-top3{list-style:none;margin:0 0 var(--s-5);padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-5)}
.pp-top3--compact{margin-bottom:0}
.pp-gougai{position:relative;display:flex;flex-direction:column;gap:var(--s-1);padding:var(--s-5);border-radius:4px;border:1px solid var(--rule);
  box-shadow:var(--sh-1);font-family:var(--f-mincho);letter-spacing:0}
.pp-gougai__mast{text-align:center;font-weight:800;letter-spacing:.3em;border-bottom:3px double var(--ink);padding-bottom:var(--s-1);margin-bottom:var(--s-2)}
.pp-gougai__rank{font-size:var(--t-2xl);line-height:1;color:var(--lav-ink)}
.pp-gougai--1 .pp-gougai__rank{color:var(--pink-ink)}
.pp-gougai__name{font-size:var(--t-l);font-weight:800;line-height:1.35;overflow-wrap:anywhere}
.pp-gougai__meta{display:flex;flex-wrap:wrap;gap:0 .9em;font-family:var(--f-jp);font-size:var(--t-xs);color:var(--ink-2)}
.pp-gougai__meta .nw{white-space:nowrap}
.pp-gougai__feats .pp-feat{margin-left:0}
.pp-gougai__score{margin-top:auto;font-size:var(--t-xl);text-align:right}
@media (max-width:860px){
  .pp-top3{grid-template-columns:minmax(0,1fr);gap:var(--s-3)}
  .pp-gougai{display:grid;grid-template-columns:2.5rem minmax(0,1fr) auto;grid-template-areas:"mast mast mast" "rank name score" "rank meta score" "rank feats score";
    column-gap:var(--s-3);row-gap:0;padding:var(--s-3) var(--s-4)}
  .pp-gougai__mast{grid-area:mast;font-size:var(--t-xs);margin-bottom:var(--s-1)}
  .pp-gougai__rank{grid-area:rank;font-size:var(--t-xl)}
  .pp-gougai__name{grid-area:name;font-size:var(--t-m)}
  .pp-gougai__meta{grid-area:meta}
  .pp-gougai__date{flex-basis:100%}
  .pp-gougai__feats{grid-area:feats}
  .pp-gougai__score{grid-area:score;margin-top:0;font-size:var(--t-l)}
  /* ハブの号外（称号なし）は「最終」を改行させず、上下を詰める（ハブの長さ予算） */
  .pp-top3--compact .pp-gougai{padding-block:var(--s-2) var(--s-3)}
  .pp-top3--compact .pp-gougai__date{flex-basis:auto}
}
/* 640px 以下のハブは「号外」の題字の段を省き、上端の二重罫だけで号外の紙面らしさを残す（ハブの長さ予算 4,200px） */
@media (max-width:640px){
  .pp-top3--compact .pp-gougai{grid-template-areas:"rank name score" "rank meta score" "rank feats score";border-top:3px double var(--ink);padding-block:var(--s-3)}
  .pp-top3--compact .pp-gougai__mast{display:none}
}
.pp-gougai__meta .num,.pp-mini-rank__name small .num{white-space:nowrap}

/* run 詳細 */
.pp-run-state{--cluster:var(--s-2)}
.pp-last-action{font-size:var(--t-s);color:var(--ink-2)}
.pp-summary{padding:var(--s-5)}
/* active で結果のまだ無い run は、1行の細い帯にする（大きなカードに1行だけで空きが目立つため） */
.pp-summary--slim{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--s-1) var(--s-5);padding:var(--s-3) var(--s-5)}
.pp-summary--slim .pp-kv{display:flex;gap:var(--s-3);min-width:0}
.pp-summary--slim .pp-kv dt{flex:none;white-space:nowrap}
.pp-summary--slim .pp-times{margin:0}
/* ⚡ 現況の6セルはデスクトップで 3列×2段（モバイルは既定の 2列×3段） */
@media (min-width:561px){ .pp-run .live-status-grid{grid-template-columns:repeat(3,minmax(0,1fr))} }
.pp-kv{font-size:var(--t-s)}
.pp-kv dd{min-width:0;overflow-wrap:anywhere}
.pp-cause{color:var(--ng)}
.pp-times,.pp-extend{font-size:var(--t-xs);color:var(--ink-2)}
.pp-block__h{font-size:var(--t-xl);padding-bottom:var(--s-2);margin-bottom:var(--s-4);border-bottom:1px solid var(--rule)}
.pp-result>.pp-block__h{margin-top:var(--s-6)}
.pp-result>.pp-newspaper:last-child{margin-bottom:0}
.pp-live-wait{font-size:var(--t-s);color:var(--ink-2)}
.pp-asof{color:var(--ink-2)}
.pp-trust{margin-bottom:var(--s-4)}
.pp-trust--hi{background:var(--ok)}
.pp-trust--mid{background:var(--cat-voice)}
.pp-trust--lo{background:var(--ng)}
.run-wrap .timeline-item.pp-dup{padding-left:0}
.run-wrap .timeline-item.pp-dup::before,.pp-dup-list .timeline-item::before{display:none}
.pp-dup-list{list-style:none;margin:var(--s-2) 0 0;padding:0}
.pp-dup-list .timeline-item{padding-left:0;margin-bottom:var(--s-3)}
.review-block{padding:var(--s-4) var(--s-5);border-left:3px solid var(--lav);border-radius:0 var(--r-m) var(--r-m) 0;background:var(--mist)}
.review-block .agent-name{margin-bottom:var(--s-1);font-size:var(--t-xs);color:var(--ink-2)}
.review-block .comment-text{white-space:pre-wrap;overflow-wrap:anywhere}
.pp-run .support-card>*+*{margin-top:var(--s-3)}
.pp-run .support-card p{font-size:var(--t-s)}
.pp-run .support-en{font-size:var(--t-xs);color:var(--ink-2)}
.pp-run .log-body{white-space:normal;padding-bottom:var(--s-4)}
.pp-run .log-turn{margin-bottom:var(--s-3);padding:var(--s-2) var(--s-3);border-left:2px solid var(--rule);font-family:var(--f-jp);font-size:var(--t-s);color:var(--ink)}
.pp-run .t-action{font-size:var(--t-xs);color:var(--lav-ink)}
.pp-run .t-narrative{color:var(--ink-2);white-space:pre-line}

/* 幻覚プロファイル・信用度のバー */
.pp-profile-grid{display:grid;gap:var(--s-4)}
.pp-profile-label{display:flex;justify-content:space-between;gap:var(--s-4);margin-bottom:var(--s-1);font-size:var(--t-s)}
.pp-profile-val{font-family:var(--f-pixel);font-variant-numeric:tabular-nums;color:var(--lav-ink)}
.pp-profile-track{height:10px;overflow:hidden;background:var(--mist);box-shadow:var(--px-frame)}
.pp-profile-fill{height:100%;background:var(--lav-ink)}
.pp-profile-stats{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-5);margin-top:var(--s-4);font-size:var(--t-s);color:var(--ink-2)}
.pp-profile-stats strong{font-family:var(--f-pixel);font-weight:400;color:var(--ink)}
.pp-profile-note{margin-top:var(--s-3);font-size:var(--t-xs);color:var(--ink-2)}
.pp-feat-note{display:flex;align-items:center;gap:.4em;font-size:var(--t-s);font-weight:700;color:var(--pink-ink)}

/* 見つからない run は忘却図書館と同じ .g-lost（T6 の節）を使う */

/* ---- 紙面（新聞ブロック）。旧インライン CSS の寸法のまま。色は .theme-press のトークン ---- */
.pp-newspaper{background:var(--paper);color:var(--ink);border:1px solid var(--rule);border-radius:4px;padding:1.5rem 1.75rem;margin-bottom:1.5rem;
  font-family:var(--f-mincho);font-size:1rem;font-weight:400;line-height:1.7;letter-spacing:0;box-shadow:var(--sh-1)}
.pp-newspaper strong{font-weight:700}
.pp-masthead{text-align:center;border-bottom:3px double var(--ink);padding-bottom:.6rem;margin-bottom:1rem}
.pp-masthead-title{font-size:1.35rem;letter-spacing:.2em;font-weight:700}
.pp-masthead-sub{font-size:var(--t-xs);color:var(--ink-2);margin-top:.3rem;letter-spacing:.05em}
.pp-headline{font-size:1.2rem;font-weight:700;border-bottom:1px solid var(--ink);padding-bottom:.4rem;margin-bottom:.5rem}
.pp-case-summary-line{display:flex;flex-wrap:wrap;gap:.4rem 1rem;margin-bottom:1rem;font-size:var(--t-xs);color:var(--ink-2)}
.pp-case-summary-line strong{color:var(--ink)}
.pp-perfect{color:color-mix(in srgb,var(--stamp) 75%,var(--ink))}
.pp-articles-grid{display:grid;grid-template-columns:1fr;gap:0}
@media (min-width:640px){
  .pp-articles-grid{grid-template-columns:1fr 1fr;column-gap:1.5rem}
  .pp-articles-grid .pp-question-block:nth-child(odd){border-right:1px solid var(--rule);padding-right:1rem}
  .pp-articles-grid .pp-question-block:nth-child(even){padding-left:1rem}
}
.pp-question-block{position:relative;border-bottom:1px dashed var(--rule);padding:.85rem 0}
.pp-question-block:last-child,.pp-question-block:nth-last-child(2){border-bottom:none}
.pp-q-index{font-size:var(--t-xs);color:var(--ink-2);letter-spacing:.05em}
.pp-claim-text{font-size:.95rem;line-height:1.8;margin:.15rem 0 .4rem;padding-right:3.2rem}
.pp-verdict-line{font-size:.84rem;color:color-mix(in srgb,var(--ink) 75%,var(--ink-2))}
.pp-verdict-line .pp-wrong-note{color:var(--ng)}
.pp-sources-line{font-size:var(--t-xs);color:var(--ink-2);margin-top:.25rem}
.pp-stamp{position:absolute;top:.6rem;right:.4rem;font-family:var(--f-mincho);font-weight:700;border:3px solid;border-radius:6px;padding:.15rem .5rem;
  transform:rotate(-9deg);font-size:.82rem;line-height:1.7;letter-spacing:.1em;opacity:.88;background:color-mix(in srgb,var(--paper) 40%,transparent)}
.pp-stamp--ok{color:color-mix(in srgb,var(--stamp) 75%,var(--ink))}
.pp-stamp--miss{color:var(--ng)}
.pp-stamp--ghost{color:var(--lav-ink)}
.pp-reveal{margin-top:1.1rem;padding-top:.85rem;border-top:1px solid var(--rule);font-size:.84rem;color:color-mix(in srgb,var(--ink) 75%,var(--ink-2))}
.pp-reveal h4{font-family:var(--f-mincho);font-size:var(--t-xs);font-weight:700;color:var(--ink-2);letter-spacing:.05em;line-height:1.7;margin:0 0 .35rem}
.pp-reveal ul{padding-left:1.1rem;margin:0 0 .6rem;line-height:1.7}
.pp-reveal ul:last-child{margin-bottom:0}
.pp-newspaper-note{margin:-.75rem 0 1rem;text-align:center;font-size:var(--t-xs);color:var(--ink-3)}
@media (max-width:640px){
  .pp-claim-text{padding-right:2.6rem}
  .pp-stamp{font-size:.72rem;padding:.1rem .4rem}
}