/*
 * 全ページ共通の基盤：リセット＋基本タイポグラフィ＋レイアウト土台。
 * tokens.css のデザイントークンに依存。全ページで読み込む。
 * 出典：docs/mock/top-synth-c.html の base 相当（2026-06-25 確定）。
 */
html{color-scheme:light; font-size:106.25%; scroll-behavior:smooth;}
*{box-sizing:border-box;}
body{margin:0; color:var(--ink); background:var(--bg); font-family:var(--sans); font-weight:500; line-height:1.85; font-feature-settings:"palt"; line-break:strict; word-break:auto-phrase; -webkit-font-smoothing:antialiased; overflow-x:hidden;}
img,svg,video{max-width:100%; height:auto;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 38px;}
a{color:var(--ink); text-decoration:none;}
strong{font-weight:700; color:var(--ink);}
em{font-style:normal; font-weight:700; color:var(--ink);}
:focus-visible{outline:2px solid var(--ink); outline-offset:3px; border-radius:2px;}
section{padding:148px 0; position:relative;}
section > .wrap{position:relative; z-index:1;}
@media(max-width:860px){ html{font-size:100%;} .wrap{padding:0 22px;} section{padding:82px 0;} }
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}

/* =====================================================================
 * 共通コンポーネントシート（要素ベース・全ページ再利用の正）
 * 見出し H1–H6／本文 p／small／罫 hr／figure／定義リスト dl／引用 blockquote／表 table。
 * 「落ち着いた文書スケール」を要素デフォルトに置く＝下層サブページ本文や将来の記事が
 * そのまま整う。トップの巨大ヒーロー・大章見出しはクラス（.h2 / .fv h1 等＝common.css /
 * page_index.css）で別途上書きする（クラス＞要素・後読みで勝つ）。章ラベル等のUIは common.css。
 * リストの装飾マーカー・表のSP折り返しは、グローバルだと chrome（ナビ ul・パンくず ol）を
 * 壊すため、本文コンテナ .sub-doc 側（subpage.css）に集約する。
 * ===================================================================== */

/* 見出し用 Noto Serif JP（見出し字種サブセット600字・可変600-700・自己ホスト＝uiux-audit P2-7・2026-07-18）。
 * 目的＝明朝非搭載端末（Android等）でも見出しserifを成立させる。
 * font-display:optional（2026-07-19 C案・代表決定＝PSI対応）＝読み込みが間に合った時だけ使い、遅れて届いても
 * 描画済みページを描き直さない（swap時代は描き直しがLCPを遅らせモバイル-13点＝decisions 2026-07-19行）。
 * 初回訪問の低速回線では代替スタック表示・キャッシュ済みの再訪から本フォント。デスクトップは header.php の
 * preload（media付き）が先取りするため初回から出やすい。サブセット外の字は従来スタックへ自動フォールバック。
 * 見出し文言を追加・変更したら再生成が必要（生成手順・元データ＝管理repo decisions 2026-07-18行。出典＝Google Fonts・SIL OFL）。 */
@font-face{
  font-family:"Noto Serif JP";
  src:url("../fonts/noto-serif-jp-subset.woff2") format("woff2");
  font-weight:600 700;
  font-style:normal;
  font-display:optional;
}

/* 見出し（明朝・文書スケール：H1≈30 / H2≈23 / H3≈18 / H4≈15.5px）
 * 注：text-wrap:balance はグローバルに付けない（ロック済みトップの .h2/.card h3/.case h3 の
 *     改行に波及するため）。下層文書側（.sub-title/.sub-doc h2 等）の balance/pretty も 2026-07-19 に撤去
 *     （iOS Safari＝word-break:auto-phrase 非対応環境で語中改行・右余白の原因＝代表iPhone実測。subpage.css 参照）。 */
h1,h2,h3,h4{font-family:var(--serif); color:var(--ink); font-feature-settings:"palt";}
h1{font-size:1.8rem; font-weight:600; line-height:1.42; letter-spacing:.02em; margin:0 0 .6em;}
h2{font-size:1.36rem; font-weight:600; line-height:1.5; letter-spacing:.02em; margin:1.7em 0 .7em;}
h3{font-size:1.06rem; font-weight:600; line-height:1.62; letter-spacing:.01em; margin:1.6em 0 .5em;}
h4{font-size:.94rem; font-weight:700; line-height:1.65; margin:1.5em 0 .4em;}
/* H5・H6＝ゴシックの小ラベル（明朝にしない） */
h5,h6{font-family:var(--sans); color:var(--ink-sub); text-transform:uppercase; letter-spacing:.14em; margin:1.4em 0 .5em; font-weight:700;}
h5{font-size:.72rem;}
h6{font-size:.66rem;}

/* 本文・補足 */
p{margin:0 0 1.2em;}
p:last-child{margin-bottom:0;}
small{font-size:.84rem; line-height:1.8; color:var(--ink-sub);}
hr{border:none; border-top:1px solid var(--line); margin:2.4em 0;}
figure{margin:1.6em 0;}
figcaption{font-size:.78rem; color:var(--ink-sub); margin-top:.7em; line-height:1.7;}

/* 定義リスト（用語＋説明） */
dl{margin:0 0 1.3em;}
dt{font-weight:700; color:var(--ink); margin-top:1em;}
dd{margin:0 0 .6em; color:var(--ink-sub);}

/* 引用（左罫の標準引用） */
blockquote{margin:1.6em 0; padding:.15em 0 .15em 1.1em; border-left:3px solid var(--red); color:var(--ink);}
blockquote p:last-child{margin-bottom:0;}

/* 表（上罫2px・行罫・見出しセル。SP折り返しは .sub-doc 文脈＝subpage.css） */
table{width:100%; border-collapse:collapse; margin:0 0 1.4em; font-size:.95rem; line-height:1.8; border-top:2px solid var(--ink);}
th,td{padding:16px 18px; border-bottom:1px solid var(--line); vertical-align:top; text-align:left;}
thead th{font-family:var(--sans); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; font-weight:700; color:var(--ink-sub); background:var(--bg-warm);}
tbody th{font-family:var(--serif); font-weight:600; color:var(--ink);}