/* クラス不要。要素セレクタのみで"モノクロ×見出し駆動"に整える */
html { box-sizing: border-box; }
*, *::before, *::after { box-sizing: inherit; }

body {
  margin: 0 auto; max-width: 720px; padding: 24px 20px;
  line-height: 1.8; font-size: 16px;
  font-family: system-ui, -apple-system, "Hiragino Kaku Gothic ProN",
               "Yu Gothic", Meiryo, sans-serif;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}

h1, h2, h3 { line-height: 1.3; margin: 1.2em 0 .6em; font-weight: 700; }
h1 { font-size: 1.9rem; margin-top: .2em; }
h2 { font-size: 1.35rem; padding-bottom: .25em; border-bottom: 1px solid #e5e5e5; }
h3 { font-size: 1.12rem; }

p, ul, ol { margin: .6em 0; }
ul, ol { padding-left: 1.2em; }
li { margin: .3em 0; }

table { border-collapse: collapse; width: 100%; margin: 1em 0; }
th, td { border: 1px solid #e5e5e5; padding: .6em; text-align: left; }

blockquote { margin: 1em 0; padding: 0 .8em; border-left: 3px solid #e5e5e5; }
img, video { max-width: 100%; height: auto; display: block; margin: 1em 0; }
a { text-decoration: underline; }

/* 既存の色付きピル・バッジ等を無彩色化（HTMLは触らない） */
[class*="tag"], [class*="badge"], [class*="label"], [class*="pill"] {
  color: inherit !important; background: transparent !important;
  border: 1px solid #e5e5e5 !important; padding: .2em .4em; border-radius: .25em;
}

/* 連続強調の視認性だけ微調整（色は付けない） */
b, strong { font-weight: 600; }

@media print {
  body { max-width: none; padding: 0; }
  a { text-decoration: none; }
  h2 { border-bottom: 1px solid #000; }
}

/* === Plain Mode: 本文だけを無彩色＆アイコン無しにする強制スコープ === */

/* 可読幅とタイポ（色は黒系のみ） */
body.sme-scope .article-plain {
  max-width: 960px;
  margin: 0 auto;
  padding: 32px 16px;
  line-height: 1.8;
  font-size: 16px;
  color: #111 !important;
}

/* 1) 本文の読みやすさ：行長・行間・段落リズム（列の内側だけ） */
body.sme-scope article.article-plain {
  --leading: 1.7;
  --para-gap: 0.9rem;
  line-height: var(--leading);
}
body.sme-scope article.article-plain p { margin: var(--para-gap) 0; }
body.sme-scope article.article-plain ul,
body.sme-scope article.article-plain ol {
  margin: calc(var(--para-gap) + .2rem) 0 .9rem 1.35rem;
}

/* 本文配下はすべて無彩色（既存クラスより強くするために !important） */
body.sme-scope .article-plain * {
  color: #111 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-color: #e5e5e5 !important;
}

/* 見出し（階層だけで整理） */
body.sme-scope .article-plain h1 { font-size: 2rem; font-weight: 700; line-height: 1.3; margin: 0 0 1rem 0; }
body.sme-scope .article-plain h2 { font-size: 1.5rem; font-weight: 700; line-height: 1.35;
  margin: 2rem 0 .75rem 0; padding-bottom: .5rem; border-bottom: 1px solid #e5e5e5 !important; }
body.sme-scope .article-plain h3 { font-size: 1.25rem; font-weight: 600; margin: 1.5rem 0 .5rem 0; }
body.sme-scope .article-plain h4 { font-size: 1.1rem;  font-weight: 600; margin: 1.25rem 0 .5rem 0; }

/* 段落・リスト */
body.sme-scope .article-plain p { margin: .9rem 0; }
body.sme-scope .article-plain ul, body.sme-scope .article-plain ol { margin: .9rem 0 .9rem 1.4rem; padding: 0; }

/* リンクは色を使わず下線だけ */
body.sme-scope .article-plain a { color: inherit !important; text-decoration: underline !important; }

/* バッジ/ピル/ラベル等の色面を無効化（線だけ） */
body.sme-scope .article-plain [class*="badge"], body.sme-scope .article-plain [class*="tag"],
body.sme-scope .article-plain [class*="label"], body.sme-scope .article-plain [class*="pill"],
body.sme-scope .article-plain .chip, body.sme-scope .article-plain .btn, body.sme-scope .article-plain .button {
  color: inherit !important;
  background: transparent !important;
  border: 1px solid #e5e5e5 !important;
  border-radius: .25em;
  padding: .2em .45em;
}

/* アイコン類の完全非表示（本文内のみ） */
body.sme-scope .article-plain i[class*="icon"], body.sme-scope .article-plain [class*=" icon-"], body.sme-scope .article-plain [class^="icon-"],
body.sme-scope .article-plain .fa, body.sme-scope .article-plain [class^="fa-"], body.sme-scope .article-plain [class*=" fa-"],
body.sme-scope .article-plain .material-icons, body.sme-scope .article-plain .material-symbols-outlined,
body.sme-scope .article-plain .lucide, body.sme-scope .article-plain [data-lucide],
body.sme-scope .article-plain .bi, body.sme-scope .article-plain [class^="bi-"],
body.sme-scope .article-plain img[class*="icon"], body.sme-scope .article-plain img[class*="Icon"],
body.sme-scope .article-plain svg.icon, body.sme-scope .article-plain svg.lucide, body.sme-scope .article-plain svg.bi {
  display: none !important;
}
/* 擬似要素で描くアイコン（FontAwesome等）も抑止 */
body.sme-scope .article-plain [class*="icon"]::before, body.sme-scope .article-plain [class*="icon"]::after,
body.sme-scope .article-plain .fa::before, body.sme-scope .article-plain .fa::after,
body.sme-scope .article-plain [class^="fa-"]::before, body.sme-scope .article-plain [class^="fa-"]::after,
body.sme-scope .article-plain .bi::before, body.sme-scope .article-plain .bi::after {
  content: none !important;
  display: none !important;
}

/* 表・引用（モノクロ） */
body.sme-scope .article-plain table { border-collapse: collapse; width: 100%; margin: 1rem 0; }
body.sme-scope .article-plain th, body.sme-scope .article-plain td { border: 1px solid #e5e5e5 !important; padding: .6rem; text-align: left; }
body.sme-scope .article-plain blockquote { margin: 1rem 0; padding: 0 .8rem; border-left: 3px solid #e5e5e5 !important; }

/* 画像・動画（挿絵は維持） */
body.sme-scope .article-plain img, body.sme-scope .article-plain video { max-width: 100%; height: auto; display: block; margin: 1rem 0; }

@media print {
  body.sme-scope .article-plain a { text-decoration: none !important; }
  body.sme-scope .article-plain h2 { border-bottom: 1px solid #000 !important; }
}

/* =========================
   A) 開発者コメントのアイコン完全除去
   ========================= */

/* 開発者コメントの包み（ラベルは任意。存在しなくても問題なし） */
body.sme-scope .article-plain .dev-comment,
body.sme-scope .article-plain [data-section="dev-comment"] {
  /* モノクロは既に全体で効いているので何もしない */
}

/* よく残るアイコン系クラスを追加網羅（Remix, MDI, Phosphor, Tabler, Iconify 等） */
body.sme-scope .article-plain .ri,
body.sme-scope .article-plain [class^="ri-"], body.sme-scope .article-plain [class*=" ri-"],
body.sme-scope .article-plain .mdi, body.sme-scope .article-plain [class^="mdi-"], body.sme-scope .article-plain [class*=" mdi-"],
body.sme-scope .article-plain .ph,  body.sme-scope .article-plain [class^="ph-"],  body.sme-scope .article-plain [class*=" ph-"],
body.sme-scope .article-plain .ti,  body.sme-scope .article-plain [class^="ti-"],  body.sme-scope .article-plain [class*=" ti-"],
body.sme-scope .article-plain .iconify, body.sme-scope .article-plain [class^="iconify"], body.sme-scope .article-plain [class*=" iconify"],
/* SVGやrole=imgで入ってくるものも丸ごと抑止 */
body.sme-scope .article-plain svg[role="img"],
body.sme-scope .article-plain svg[class],
/* 擬似要素で描くアイコン */
body.sme-scope .article-plain [class*="ri-"]::before, body.sme-scope .article-plain [class*="ri-"]::after,
body.sme-scope .article-plain [class*="mdi"]::before, body.sme-scope .article-plain [class*="mdi"]::after,
body.sme-scope .article-plain [class*="ph-"]::before,  body.sme-scope .article-plain [class*="ph-"]::after,
body.sme-scope .article-plain [class*="ti-"]::before,  body.sme-scope .article-plain [class*="ti-"]::after,
body.sme-scope .article-plain [class*="iconify"]::before, body.sme-scope .article-plain [class*="iconify"]::after {
  display: none !important;
  content: none !important;
}

/* 画像で混ざっている"アイコン風"も抑止（altにicon等を含むケース） */
body.sme-scope .article-plain img[alt*="icon" i],
body.sme-scope .article-plain img[class*="icon" i] {
  display: none !important;
}

/* ※ 絵文字（🔧など）だけは"文字"なのでCSSで消すと本文が変質します。
      もし開発者コメントに絵文字が含まれており、それも非表示にしたい場合は、
      その絵文字を <span class="emoji">🔧</span> と出力するテンプレ改修が唯一安全です。
      （今回はプログラム非変更のため、文字自体は残します） */


/* =========================
   B) 本文の横幅をホーム相当に拡張
   ========================= */

/* まず本文コンテナ自体の最大幅を広げる（トップに近い広さ） */
:root {
  /* 必要ならここを 1140/1200/1280 に調整可 */
  --article-max: 1140px;
}

body.sme-scope .article-plain {
  max-width: var(--article-max) !important;
}

/* "親側"や"内側"で max-width を縛っている共通クラスを無効化（本文範囲に限定） */
body.sme-scope .article-plain :where(.container, .container-sm, .container-md, .container-lg,
                      .prose, .content, .post, .post-body, .article, .markdown-body) {
  max-width: inherit !important;
}

/* Bootstrapのグリッドで左右に余白が残る場合の救済 */
/* Gridのガターはテーマ既定のまま残す */

/* 既存CSSが body, main, section に max-width 指定しているケースを上書き */
body.sme-scope .article-plain,
body.sme-scope main .article-plain,
body.sme-scope section .article-plain {
  max-width: var(--article-max) !important;
}

/* なお "サイト全体のコンテナ" が本文の外側で狭めているときは、
   テンプレで <main class="article-plain"> を
   その外の .container の"内側直下"に移すとさらに確実です（プログラム変更なしで可）。 */

/* === F1: ブレークアウト無効化（グリッド整合性復元） === */
body.sme-scope .article-plain.article-breakout,
body.sme-scope .article-plain:where(:not(.article-narrow)) {
  /* ブレークアウトを無効化 */
  position: static !important;
  left: auto !important;
  right: auto !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* 2) そのうえで "トップ相当" の読み幅に再収束（任意値に調整可） */
:root { --article-max: 1140px; }  /* 1200/1280などに変更可 */
body.sme-scope .article-plain > * {
  max-width: var(--article-max);
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Bootstrap等が内側でさらに幅を絞る場合を本文範囲で解除 */
body.sme-scope .article-plain :where(.container, .container-sm, .container-md, .container-lg,
                      .prose, .markdown-body, .content, .post, .article, .entry) {
  max-width: inherit !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
/* Gridのガターはテーマ既定のまま残す */

/* === アイコン：残留パターンの完全抑止（SVGアイコン特有の寸法を狙い撃ち） === */
/* 既存網羅に加えて、"寸法で判定"する無名SVGアイコンを消す */
body.sme-scope .article-plain svg[width="1em"], body.sme-scope .article-plain svg[height="1em"],
body.sme-scope .article-plain svg[width*="em"], body.sme-scope .article-plain svg[height*="em"],
body.sme-scope .article-plain svg[width="16"],  body.sme-scope .article-plain svg[height="16"],
body.sme-scope .article-plain svg[width="20"],  body.sme-scope .article-plain svg[height="20"],
body.sme-scope .article-plain svg[width="24"],  body.sme-scope .article-plain svg[height="24"],
body.sme-scope .article-plain svg[aria-hidden="true"],
body.sme-scope .article-plain svg[focusable="false"] {
  display: none !important;
}

/* "色付きPNGのアイコン" をグレイスケール化（写真は保持したい場合は外してOK） */
body.sme-scope .article-plain img[alt*="icon" i], body.sme-scope .article-plain img[class*="icon" i] {
  filter: grayscale(1) contrast(1.05) !important;
}

/* 絵文字（文字）は残す方針。もし消したい場合は、該当箇所だけ <span class="emoji"> を付与して非表示にする必要あり（今回はプログラム非変更のため見送り）。 */

/* === F3: BI以外のアイコン完全除去（包括ルール） === */

/* より包括的なアイコンセレクタ（非BIアイコンのみ標的） */
body.sme-scope .article-plain [class*="fa"],
body.sme-scope .article-plain [class*="material-"],
body.sme-scope .article-plain [class*="mdi"],
body.sme-scope .article-plain [class*="ri-"],
body.sme-scope .article-plain [class*="ph-"],
body.sme-scope .article-plain [class*="ti-"],
body.sme-scope .article-plain [class*="iconify"],
body.sme-scope .article-plain [class*="lucide"],
body.sme-scope .article-plain [class*="feather"],
body.sme-scope .article-plain [class*="tabler"],
body.sme-scope .article-plain [class*="heroicon"],
body.sme-scope .article-plain [class*="octicon"],
body.sme-scope .article-plain svg:not([class*="bi"]),
body.sme-scope .article-plain img[alt*="icon" i]:not([class*="bi"]),
body.sme-scope .article-plain img[class*="icon"]:not([class*="bi"]) {
  display: none !important;
}

/* 擬似要素アイコンも除去（非BIのみ） */
body.sme-scope .article-plain [class*="fa"]::before,
body.sme-scope .article-plain [class*="fa"]::after,
body.sme-scope .article-plain [class*="material-"]::before,
body.sme-scope .article-plain [class*="material-"]::after,
body.sme-scope .article-plain [class*="mdi"]::before,
body.sme-scope .article-plain [class*="mdi"]::after,
body.sme-scope .article-plain [class*="ri-"]::before,
body.sme-scope .article-plain [class*="ri-"]::after {
  content: none !important;
  display: none !important;
}

/* === F2: body幅制約の完全解除（グローバル） === */

/* 記事詳細ページでのみbody幅制約を解除 */
body.sme-scope:has(.article-plain) {
  max-width: none !important;
  padding: 0 !important;
}

/* F2: グローバルbody制約解除（720px制約除去） */
body {
  max-width: none !important;
}

/* Bootstrap Gridはテーマ既定のまま。幅上書きは行わない（SMEページの横幅破綻を防止） */

/* === [S-SPACE] 記事領域の上下余白を標準化（色やレイアウトは不変） === */
:root { --space-y: 16px; }  /* 必要なら 12/20 に微調整 */

body.sme-scope .article-plain {
  padding-top: var(--space-y);
  padding-bottom: var(--space-y);
}

/* 先頭/末尾の見出し・段落が持つ余白の合算を打ち消す（はみ出し防止） */
body.sme-scope .article-plain > :first-child { margin-top: 0 !important; }
body.sme-scope .article-plain > :last-child  { margin-bottom: 0 !important; }

/* Bootstrapの .my-4 による上下24px *2 を本文内では相殺 */
body.sme-scope main.container.my-4 .article-plain {
  margin-top: calc(-1 * var(--space-y)) !important;
  margin-bottom: calc(-1 * var(--space-y)) !important;
}

/* === [S-ICON] 外部リンクなどテーマの擬似要素アイコンを無効化（本文内だけ） === */
body.sme-scope .article-plain a[target="_blank"]::after { content: "" !important; background-image: none !important; display: none !important; }

/* 背景アイコン（data URI含む）はデフォルト無効。図表で必要なブロックは個別クラスで再許可 */
body.sme-scope .article-plain * { background-image: none !important; }

/* 無名SVGや <use> 参照のアイコンを抑止（図版でSVGを使う場合は許可クラスを付与） */
body.sme-scope .article-plain svg:not([data-keep-svg]),
body.sme-scope .article-plain svg use:not([data-keep-svg]) { display: none !important; }

/* 小サイズの"アイコン風"画像も抑止（必要なら alt/class で個別許可） */
body.sme-scope .article-plain img[alt*="icon" i], body.sme-scope .article-plain img[class*="icon" i] { display: none !important; }

/* レイアウト行の命名だけ（機能は付けない） */
body.sme-scope .insights-layout {
  /* no width/flex overrides */
}

/* --- ICON HARDEN: 擬似要素のマスク・フィルタ経由のアイコンまで無効化 --- */
body.sme-scope .article-plain a::before,
body.sme-scope .article-plain a::after,
body.sme-scope .article-plain i::before,
body.sme-scope .article-plain i::after {
  /* 既に content/background は切ってあるが、mask系も潰す */
  -webkit-mask: none !important;
  -webkit-mask-image: none !important;
  mask: none !important;
  filter: none !important;
}

/* 開発者視点コメントの自動アイコン注入はデフォルトで無効（テンプレ責務へ） */
body.sme-scope .expert-comment-section::before {
  content: none !important;
  display: none !important;
}

/* 必要箇所のみ opt-in（例: data-keep-icon="1"） */
body.sme-scope .expert-comment-section[data-keep-icon="1"]::before {
  content: '💡';
  display: inline-block;
}

/* 背景アイコンの取りこぼし（mask-imageで描いているUIテーマ対策） */
body.sme-scope .article-plain * {
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

/* どうしても残る"装飾目的の <span class="material-symbols-...">等" */
body.sme-scope .article-plain [class*="material-symbols"],
body.sme-scope .article-plain [class*="iconify"],
body.sme-scope .article-plain [class*="remixicon"],
body.sme-scope .article-plain [class*="tabler"],
body.sme-scope .article-plain [class*="ph-"] {
  display: none !important;
}

/* =========================
   Section Headings Rhythm (H2/H3)
   ========================= */
/* H2（同格5ブロック） */
body.sme-scope article.article-plain .section-title {
  margin-top: 2.2rem;
  margin-bottom: 0.85rem;
  line-height: 1.25;
  position: relative;
  scroll-margin-top: 80px; /* 固定ヘッダー対策 */
}

/* TOC: 見た目は控えめ・Grid非干渉 */
body.sme-scope .toc { font-size: 0.95rem; line-height: 1.5; }
body.sme-scope .toc ol { margin: 0; padding-left: 1.2rem; }
body.sme-scope .toc a { text-decoration: none; }
body.sme-scope .toc a:hover,
body.sme-scope .toc a:focus { text-decoration: underline; }
body.sme-scope .toc a[aria-current="true"] { font-weight: 600; }

/* --- TOC（本文冒頭）の見た目を整える：Grid非干渉 --- */
body.sme-scope .toc.toc--inline {
  margin: 1rem 0 1.6rem;
  padding: .75rem 1rem;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: .6rem;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
}
body.sme-scope .toc.toc--inline ol {
  display: flex; flex-wrap: wrap; gap: .5rem 1rem;
  margin: 0; padding: 0; list-style: none;
}
body.sme-scope .toc.toc--inline a {
  text-decoration: none;
  border-bottom: 1px dotted rgba(0,0,0,.3);
}
body.sme-scope .toc.toc--inline a:hover,
body.sme-scope .toc.toc--inline a:focus {
  text-decoration: underline;
}
body.sme-scope .toc.toc--inline a[aria-current="true"] {
  font-weight: 600; border-bottom-style: solid;
}

/* セクションの区切りを軽く統一（過剰な罫線は使わない） */
body.sme-scope article.article-plain .section-title:not(:first-of-type) { margin-top: 2.25rem; }
body.sme-scope article.article-plain .section-title:not(:first-of-type)::after {
  content: "";
  display: block;
  width: 36px; height: 2px; margin-top: .6rem;
  background: rgba(0,0,0,.08);
}
body.sme-scope article.article-plain .section-title + p { margin-top: 0 !important; }
/* 5) 引用やカードの“段差”解消（セクション直下だけ） */
body.sme-scope article.article-plain .section-title + .card,
body.sme-scope article.article-plain .section-title + blockquote { margin-top: .4rem; }

/* Skip link（フォーカス時のみ表示） */
body.sme-scope .skip-link {
  position: absolute; left: -9999px; top: auto;
}
body.sme-scope .skip-link:focus {
  left: 16px; top: 16px; z-index: 1000;
  background: #fff; padding: .5rem .75rem; border: 1px solid #ccc;
}

/* 6) フォーカス可視性（A11y強化、サイトトーンは維持） */
body.sme-scope a:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

/* 印刷最適化（PDF/プリント） */
@media print {
  .toc, .sidebar, nav, header, footer { display: none !important; }
  .article-plain .section-title { page-break-after: avoid; }
  .article-plain { font-size: 12pt; line-height: 1.5; }
}

/* H3（ブロック内の小見出し） */
body.sme-scope article.article-plain .sub-title {
  margin-top: 1.1rem;
  margin-bottom: 0.45rem;
  line-height: 1.35;
  font-weight: 600;
}

/* H2直下の最初のブロックの上マージン相殺 */
body.sme-scope article.article-plain .section-title + * {
  margin-top: 0 !important;
}

/* ===== Vertical rhythm tightening (SME article only) ===== */
/* Reduce default spacing below sections that use Bootstrap .mb-4 */
body.sme-scope article.article-plain .article-section.mb-4 { 
  margin-bottom: 0.1rem !important; 
}
/* Bring H2 a bit closer to its content and previous block */
body.sme-scope article.article-plain .section-title {
  margin-top: 0.1rem !important;
  margin-bottom: 0.1rem !important;
}
/* First section (summary) can start slightly tighter */
body.sme-scope article.article-plain .article-section:first-of-type .section-title {
  margin-top: 0.1rem !important;
}
/* Summary box often adds extra space; trim it */
body.sme-scope article.article-plain .summary-section {
  margin-bottom: 0.1rem !important;
}
/* Fine-tune H3 (subhead) spacing a touch more */
body.sme-scope article.article-plain .sub-title {
  margin-top: 0.1rem !important;
  margin-bottom: 0.1rem !important;
}

/* SME-only: glossary/dev-comment section lines off (border/shadow/underlines) */
body.sme-scope article.article-plain .glossary-card,
body.sme-scope article.article-plain .expert-comment-section {
  border: 0 !important;
  box-shadow: none !important;
}
/* Glossary H2 should keep the standard underline */
body.sme-scope article.article-plain h2.glossary-title {
  border-bottom: 1px solid #e5e5e5 !important;
}

/* ① hr（水平線）の不意な混入を無効化：記事内だけ線を出さない */
body.sme-scope article.article-plain hr {
  border: 0 !important;
  height: 0 !important;
  margin: 0 !important;
}

/* ② 画像と図版の左寄せ＆読みやすさ（テキストは既に左寄せ済み） */
body.sme-scope article.article-plain figure,
body.sme-scope article.article-plain img {
  display: block;
  margin: 0;
  max-width: 100%;
  height: auto;
}
body.sme-scope article.article-plain figcaption {
  margin-top: .35rem;
}

/* Business Insights: remove surrounding thin border around items container */
body.sme-scope article.article-plain .insight-unified-card {
  border: 0 !important;
  box-shadow: none !important;
  padding-top: 0.1rem !important;
}

/* Glossary: align H2 left with other sections (remove side padding on card) */
body.sme-scope article.article-plain .glossary-card {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Developer Comment: align content flush left (hide avatar; remove left padding) */
body.sme-scope article.article-plain .expert-comment-section {
  padding-left: 0 !important;
  padding-top: 0.1rem !important;
}
body.sme-scope article.article-plain .expert-comment-section .expert-avatar {
  display: none !important;
}

/* Summary: remove left bracket-like accent and shadow */
body.sme-scope article.article-plain .summary-section {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  padding-top: 0.1rem !important;
}

/* References: align heading and content flush-left like other sections */
body.sme-scope article.article-plain .card .card-body {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
body.sme-scope article.article-plain .card .card-header,
body.sme-scope article.article-plain .card .card-footer {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Tighten spacing under specific H2s (summary/insights/dev-comment) */
body.sme-scope article.article-plain h2#summary,
body.sme-scope article.article-plain h2#insights,
body.sme-scope article.article-plain h2#dev-comment {
  margin-bottom: 0.5rem !important;
}

/* TOC label spacing */
body.sme-scope .toc .toc-label { margin-right: .75rem; }

/* ===== SME: sectionの枠線/下線を全面禁止 ===== */
body.sme-scope article.article-plain .section-title::before,
body.sme-scope article.article-plain .section-title::after {
  content: none !important;
  display: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* （保険）もしarticleやsection自体に境界線が残っていたら打ち消す */
body.sme-scope article.article-plain,
body.sme-scope article.article-plain .article-section,
body.sme-scope article.article-plain .card,
body.sme-scope article.article-plain blockquote {
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  background-clip: padding-box;
}

/* 引用記事などでBootstrapの.card境界線が出るのを抑止（記事内に限定） */
body.sme-scope article.article-plain .card,
body.sme-scope article.article-plain .card-header,
body.sme-scope article.article-plain .card-footer {
  border: 0 !important;
}

/* ===== SME: 本文は常に左寄せ（見出し・本文・表・キャプション）===== */
body.sme-scope article.article-plain { text-align: left !important; }

body.sme-scope article.article-plain :is(
  h2,h3,h4,h5,h6,
  p,ul,ol,li,dl,dt,dd,
  blockquote,figcaption,
  table,thead,tbody,tfoot,tr,th,td
) {
  text-align: left !important;
}

/* 引用記事タイトルや任意のタイトルクラスも左寄せに統一 */
body.sme-scope article.article-plain .card-title,
body.sme-scope article.article-plain .expert-comment-title,
body.sme-scope article.article-plain .glossary-title {
  text-align: left !important;
}

/* ===== TOC（記事直下の箱）も枠線・影を除去 ===== */
body.sme-scope article.article-plain .toc.toc--inline {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* 既存の“段落リズム”は残しつつ、H2直後の余計な線や段差を抑制 */
body.sme-scope article.article-plain .section-title {
  position: static;           /* 線演出のためのrelativeがあれば無効化 */
  margin-top: 2.0rem;         /* リズムは維持（必要なら微調整可） */
  margin-bottom: .8rem;
  line-height: 1.25;
}

/* ===== 著者プロフィール ===== */
.author-profile {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding: 16px;
  border: 1px solid #eee;
  border-radius: 12px;
  background: #fafafa;
  margin: 24px 0;
}
.author-photo {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  object-fit: cover;
  flex: 0 0 auto;
}
.author-info { line-height: 1.6; }
.author-name { font-weight: 700; font-size: 1.05rem; }
.author-title { color: #666; margin-bottom: 6px; }
.author-bio { color: #333; font-size: 0.95rem; }
@media (max-width: 640px) {
  .author-profile { flex-direction: column; align-items: center; text-align: center; }
}