/* =========================================================
   article_body.css  ── 記事本文・見出し・テーブル・補助導線リンク

   【このファイルの責務】
   - .lb-article（記事ページのレイアウトラッパー）
   - .lb-body（記事本文エリア：段落・リスト・引用・リンク）
   - .lb-h3 / .lb-body h3（本文内 h3 見出し）
   - .lb-figure（図・表のコンテナ）
   - .entry-content（WordPress 標準の記事本文エリア）
   - .entry-title（記事タイトル・固定ページタイトル）
   - テーブル（.entry-content table, .lb-body table）
   - KaTeX（.katex-display, .katex）
   - .lb-dochead__kicker（記事種別バッジ）
   ★ .lb-assist-link（補助導線リンクの基準スタイル）
      「ロビーへ戻る」「書架へ戻る」「続きを読む」などに使う共通クラス

   【触るべきとき】
   ・本文フォントサイズを変えたい          → .lb-body の --fz-body / .entry-content p の font-size
   ・本文行間を変えたい                    → .lb-body の line-height
   ・h3 見出しスタイルを変えたい           → .lb-body h3, .lb-h3
   ・記事タイトルデザインを変えたい        → .entry-title, .page .entry-title
   ・テーブルデザインを変えたい            → .entry-content table, .lb-body table
   ・補助導線リンクの色・フォントを変えたい → .lb-assist-link（tokens.css の --link-border も参照）

   【関連ファイル】
   - 会話 UI                    → article_talk.css
   - サイドバーナビ・関連記事   → article_nav.css
   - 写真枠                     → cards_photo.css
   - Sphinx 記事専用            → sphinx_article.css
   - archive の more-link 差分  → archive.css（差分のみ）
   - レスポンシブ               → responsive.css
========================================================= */

/* =========================================================
   20 Article Layout  ── 記事ページの外枠
========================================================= */
.lb-article .hero,
.lb-article .section,
.lb-article .lobby-links {
  max-width: var(--maxw-article);
}

/* 記事ページ内の hero / section のサイズ調整 */
.lb-article .hero         { margin-bottom: 28px; }
.lb-article .hero__inner  { max-width: 760px; }
.lb-article .section__head  { margin-bottom: 24px; }
.lb-article .section__title { font-size: 20px; }
.lb-article .section__desc  { font-size: 20px; }

/* 記事全体のドキュメントラッパー */
.lb-doc {
  max-width: var(--maxw-article);
  margin: 0 auto;
}

/* =========================================================
   補助導線リンク  .lb-assist-link
   ── 「ロビーへ戻る」「書架へ戻る」「続きを読む」など
      サイト内を補助する小さなテキストリンクの基準スタイル。

   【正本】このクラスが補助導線リンクの唯一の基準定義です。
   - archive.css の .more-link は差分（矢印・margin・transform）だけを持つ
   - 新たに補助導線リンクを使うときは HTML に class="lb-assist-link" を付ける

   使用例:
     <a class="lb-assist-link" href="/"> ← ロビーへ戻る</a>
     <a class="lb-assist-link" href="/management/">書架へ戻る</a>
========================================================= */

/* 補助導線リンク共通スタイル（.lb-assist-link の正本） */
.lb-assist-link,
.lb-body > p > a[href*="shimaphoto03.com"]:only-child,
.lb-body .lb-nav-back,
.entry-content > p > a.lb-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-family: var(--font-ui);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: .06em;
  text-decoration: none;
  border-bottom: 1px solid var(--link-border);
  padding-bottom: 1px;
  transition: var(--link-transition);
}

.lb-assist-link:hover,
.lb-body > p > a[href*="shimaphoto03.com"]:only-child:hover,
.lb-body .lb-nav-back:hover,
.entry-content > p > a.lb-back:hover {
  color: var(--ink);
  border-bottom-color: var(--link-border-hover);
}

/* 戻るリンクには先頭に「←」を自動付与 */
.lb-body > p > a[href*="shimaphoto03.com"]:only-child::before {
  content: "←";
  font-size: 13px;
}

/* =========================================================
   記事種別バッジ（例：SERIES / SPECIAL など）
========================================================= */
.lb-dochead__kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  color: var(--label-color);
  font-family: var(--font-ui);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .16em;
}

.lb-dochead__kicker::before {
  content: "";
  width: 18px;
  height: 1.5px;
  background: rgba(195,168,70,.55);
}

/* =========================================================
   21 Article Body  ── 記事本文（.lb-body）
========================================================= */
.lb-body {
  max-width: 760px;
  margin: 0 auto;
  color: var(--ink);
  font-family: var(--font-body);
}

/* 段落・リスト・引用の基本スタイル */
.lb-body > p,
.lb-body > ul,
.lb-body > ol,
.lb-body > blockquote {
  font-size: var(--fz-body);
  line-height: var(--lh-body);
  letter-spacing: .01em;
  color: var(--ink);
}

/* 要素間の上マージン */
.lb-body > p + p,
.lb-body > p + ul,
.lb-body > p + ol,
.lb-body > p + .talk,
.lb-body > p + .lb-card,
.lb-body > p + .lb-box,
.lb-body > p + .lb-note,
.lb-body > p + .lb-pre,
.lb-body > p + .lb-figure,
.lb-body > ul + p,
.lb-body > ol + p,
.lb-body > .talk + p,
.lb-body > .lb-card + p,
.lb-body > .lb-box + p,
.lb-body > .lb-note + p,
.lb-body > .lb-pre + p,
.lb-body > .lb-figure + p,
.lb-body > h3 + p,
.lb-body > .lb-h3 + p {
  margin-top: 1.15em;
}

.lb-body > ul,
.lb-body > ol {
  padding-left: 1.5em;
}

.lb-body > ul li + li,
.lb-body > ol li + li {
  margin-top: .45em;
}

.lb-body strong {
  color: var(--ink);
  font-weight: 700;
}

/* インラインリンク */
.lb-body a {
  color: #7a6818;
  text-decoration: underline;
  text-decoration-color: rgba(130,110,30,.30);
  text-underline-offset: 3px;
}

.lb-body a:hover {
  color: #60520e;
  text-decoration-color: rgba(100,86,22,.48);
}

/* 引用 */
.lb-body blockquote {
  padding: 18px 20px;
  border-left: 3.5px solid rgba(195,168,70,.55);
  border-radius: 0 18px 18px 0;
  background: rgba(255,253,220,.88);
  box-shadow: var(--shadow-xs);
  color: var(--ink-soft);
}

/* 区切り線 */
.lb-body hr {
  border: 0;
  height: 1px;
  margin: 2.2em 0;
  background: linear-gradient(90deg, transparent, var(--line-strong), transparent);
}

/* h3 見出し（本文内の小見出し） */
.lb-body h3,
.lb-h3 {
  font-family: var(--font-heading);
  font-size: 20px;
  line-height: 1.7;
  font-weight: 700;
  letter-spacing: .02em;
  color: var(--ink);
  margin-top: 2.2em;
  padding-left: 14px;
  border-left: 3.5px solid rgba(200,175,80,.55);
}

/* 図・表コンテナ */
.lb-figure {
  margin: 22px 0;
  padding: 16px;
  border-radius: 16px;
  border: 1px solid var(--line);
  background:
    linear-gradient(180deg, rgba(255,255,255,.95) 0%, rgba(248,243,235,.96) 100%);
  box-shadow: var(--shadow-xs);
}

.lb-figure figcaption {
  margin-top: 10px;
  color: var(--muted);
  font-family: var(--font-ui);
  font-size: 13px;
  line-height: 1.85;
  letter-spacing: .04em;
}

/* =========================================================
   22 Tables / KaTeX
========================================================= */
.entry-content table,
.lb-body table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.4em 0;
  overflow: hidden;
  border-radius: 14px;
  border-style: hidden;
  box-shadow: 0 0 0 1px var(--line), var(--shadow-xs);
  background: rgba(255,255,255,.95);
}

.entry-content th,
.entry-content td,
.lb-body th,
.lb-body td {
  padding: 12px 14px;
  border: 1px solid var(--line);
  font-size: 15px;
  line-height: 1.8;
  text-align: left;
}

.entry-content th,
.lb-body th {
  background: #f8f2c8;
  color: var(--ink);
  font-family: var(--font-ui);
  font-weight: 700;
  letter-spacing: .04em;
}

/* KaTeX（数式） */
.katex-display {
  margin: 1.35em 0;
  padding: 8px 0;
  overflow-x: auto;
  overflow-y: hidden;
}

.katex { color: var(--ink); }

/* =========================================================
   26 Generic Entry Content  ── WordPress 標準の entry-content
========================================================= */

/* 記事タイトル（全ページ共通ベース） */
.entry-title {
  color: var(--ink);
  font-family: var(--font-heading);
  font-weight: var(--font-weight-title);
}

/* 固定ページのタイトル（カテゴリ入口ページなど） */
.page .entry-title:not(.home .entry-title) {
  font-family: var(--font-heading);
  font-size: clamp(28px, 4vw, 42px);
  line-height: 1.4;
  letter-spacing: .05em;
  margin-bottom: 36px;
  position: relative;
  padding-bottom: 20px;
  font-weight: var(--font-weight-title);
}

/* タイトル下のゴールドラインアクセント */
.page .entry-title:not(.home .entry-title)::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 48px;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--shelf-wood), rgba(212,170,72,.20));
}

/* 記事本文エリア */
.entry-content {
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 2.05;
  letter-spacing: .01em;
}

.entry-content p {
  font-size: 17px;
  line-height: 2.05;
  margin-bottom: 1.45em;
}

/* h2 見出し（大セクション区切り） */
.entry-content h2 {
  font-family: var(--font-heading);
  font-size: 24px;
  font-weight: 700;
  line-height: 1.55;
  letter-spacing: .02em;
  margin-top: 2.8em;
  margin-bottom: .85em;
  padding-bottom: .48em;
  border-bottom: 1px solid var(--line);
}

/* h3 見出し */
.entry-content h3 {
  font-family: var(--font-heading);
  font-size: 20px;
  line-height: 1.6;
  letter-spacing: .02em;
  margin-top: 2.2em;
  margin-bottom: .7em;
}

/* リスト */
.entry-content ul,
.entry-content ol {
  padding-left: 1.5em;
  margin-bottom: 1.35em;
  font-size: 17px;
  line-height: 2.0;
}

.entry-content li + li { margin-top: .38em; }

/* インラインリンク */
.entry-content a:not([class]) {
  color: #7a6818;
  text-decoration: underline;
  text-decoration-color: rgba(130,110,30,.30);
  text-underline-offset: 3px;
  transition: color .16s ease, text-decoration-color .16s ease;
}

.entry-content a:not([class]):hover {
  color: #60520e;
  text-decoration-color: rgba(100,86,22,.48);
}

/* =========================================================
   SP（680px以下）
========================================================= */
@media (max-width: 680px) {
  .card__inner > p,
  .card__inner > ul,
  .card__inner > ol,
  .lb-body > p,
  .lb-body > ul,
  .lb-body > ol,
  .entry-content p,
  .entry-content ul,
  .entry-content ol {
    font-size: var(--fz-body-sp);
    line-height: 2.0;
  }

  .lb-body h3,
  .lb-h3,
  .entry-content h3 { font-size: 18px; }

  .entry-content h2 {
    font-size: 21px;
    font-weight: 700;
  }
}