/* フレミング邸の殺人事件 — 世界観の微調整
   preset: paper（生成り紙×万年筆インク×封蝋赤）/ layout: dossier（事件簿・耳タブ見出し・二重枠）
   ここで上書きするのは、このゲーム固有の3点だけ。
   1. 死亡診断書の実物画像を「調書」として見せる枠
   2. 欄の番号バッジ（診断書の欄順を示す）
   3. 章カードの背表紙風の帯
   --pi-* の色は patterns.css の preset-paper をそのまま使う（コントラストは監査済み）。 */

/* 1. 死亡診断書の実物画像 */
.fleming-site .cert-sheet {
  margin: 18px 0 8px;
  padding: 10px;
  background: var(--pi-panel);
  border: 1px solid var(--pi-line);
  box-shadow: 4px 4px 0 var(--pi-shadow);
}
.fleming-site .cert-sheet img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid var(--pi-line);
  background: #faf7ef;
}
.fleming-site .cert-sheet figcaption {
  margin-top: 8px;
  font-size: 12.5px;
  color: var(--pi-muted);
}

/* 2. 欄の番号バッジ（診断書の欄順） */
.fleming-site .slot-no {
  display: inline-block;
  min-width: 2.1em;
  margin-right: 6px;
  padding: 0 5px;
  background: var(--pi-panel);
  border: 1px solid var(--pi-line);
  border-radius: 2px;
  color: var(--pi-accent-text);
  font-size: 11.5px;
  font-weight: 700;
  text-align: center;
  font-variant-numeric: tabular-nums;
}

/* 3. 章カードの背表紙帯 */
.fleming-site .p-card {
  position: relative;
}
.fleming-site .p-card > .chapter-band {
  display: block;
  margin: -12px -12px 10px;
  padding: 4px 12px;
  background: var(--pi-panel);
  border-bottom: 1px solid var(--pi-line);
  color: var(--pi-accent-text);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .16em;
}

/* 章ページの冒頭に置く「事件簿」ヘッダ */
.fleming-site .case-head {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 12px;
  align-items: start;
  margin: 0 0 18px;
  padding: 12px;
  background: var(--pi-panel);
  border: 3px double var(--pi-accent-border);
}
.fleming-site .case-head img {
  width: 96px;
  height: 96px;
  object-fit: cover;
  border: 1px solid var(--pi-line);
}
.fleming-site .case-head dl {
  margin: 0;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 2px 10px;
  font-size: 13px;
}
.fleming-site .case-head dt {
  color: var(--pi-muted);
  font-weight: 700;
}
.fleming-site .case-head dd {
  margin: 0;
}

@media (max-width: 560px) {
  .fleming-site .case-head { grid-template-columns: 64px 1fr; }
  .fleming-site .case-head img { width: 64px; height: 64px; }
}
