/* ============================================================
   toppage.css — トップページ（台帳型索引）専用スタイル
   出典: toppage_prototype_v2.html から分離。固定ページ（post_id=135）の
   本文に build/gen_front_page.py が生成したHTMLフラグメントを流し込み、
   このCSSをfunctions.php側で is_front_page() 時のみ読み込む。
   デザイン変更はプロトタイプ側から先に行うこと（本ファイルへの直接の
   装飾追加・変更はしない）。

   2026-07: 固定ページ方式への切り替えにともない、左固定サイドバーを廃止。
   フィルタはPC/モバイル共通のチップ方式（.chips）に統一した。
   Cocoonのヘッダー・フッターの内側に流し込まれる前提のスタイル。
   ============================================================ */

:root{
  --paper:#FBFBF9;
  --ink:#1B1F23;
  --ink-2:#63696E;
  --rule:#1B1F23;
  --rule-thin:#D8D8D2;
  --shu:#B3402A; /* 検印の朱 */
}
.toppage-root{
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif;
  background:var(--paper);color:var(--ink);
  font-size:14px;line-height:1.9;
  -webkit-font-smoothing:antialiased;
}
.toppage-root ::selection{background:var(--ink);color:var(--paper)}
.toppage-root a{color:inherit;text-decoration:none}
.toppage-root .mincho{font-family:"Zen Old Mincho","Hiragino Mincho ProN",serif}

/* ===== 全体の幅 ===== */
/* Cocoon側の1カラムコンテンツ幅に収まる値。実測して合わなければここを調整する
   （WP管理画面 > Cocoon設定 > カラム、または実際の表示幅を確認）。 */
.toppage-root .inner{max-width:900px;margin:0 auto;padding:0 0 100px}

/* 冒頭: 白書の表紙のような書き出し */
.toppage-root .masthead{padding:8px 0 0}
.toppage-root .masthead .no{
  font-family:"Zen Old Mincho",serif;font-size:12px;letter-spacing:.2em;color:var(--ink-2);
}
.toppage-root .masthead h2{
  font-family:"Zen Old Mincho",serif;font-weight:700;
  font-size:clamp(24px,3.4vw,36px);line-height:1.7;letter-spacing:.06em;
  margin-top:18px;
}
.toppage-root .masthead h2 .shu{color:var(--shu)}
.toppage-root .masthead .sub{
  margin-top:20px;font-size:13.5px;color:var(--ink-2);max-width:620px;
}
.toppage-root .figures{
  margin-top:36px;display:flex;gap:0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
}
.toppage-root .figures .f{
  flex:1;padding:16px 20px 14px;display:flex;flex-direction:column;
}
.toppage-root .figures .f + .f{border-left:1px solid var(--rule-thin)}
.toppage-root .figures .f .v{
  font-family:"Zen Old Mincho",serif;font-weight:900;font-size:30px;
  letter-spacing:.02em;font-variant-numeric:tabular-nums;line-height:1.3;
}
.toppage-root .figures .f .v small{font-size:14px;font-weight:700}
.toppage-root .figures .f .k{font-size:10.5px;letter-spacing:.22em;color:var(--ink-2);margin-top:2px}

/* ===== チップフィルタ（PC/モバイル共通） ===== */
.toppage-root .chips{
  display:flex;gap:6px;flex-wrap:wrap;margin-top:28px;
}
.toppage-root .chips button{
  all:unset;cursor:pointer;font-size:12px;letter-spacing:.06em;
  padding:6px 14px;border:1px solid var(--rule-thin);
}
.toppage-root .chips button.active{border-color:var(--ink);font-weight:500}

/* ===== 索引（台帳） ===== */
.toppage-root .ledger{margin-top:56px}
.toppage-root .ledger-head{
  display:flex;justify-content:space-between;align-items:baseline;
  border-bottom:3px double var(--rule);padding-bottom:10px;
}
.toppage-root .ledger-head h3{
  font-family:"Zen Old Mincho",serif;font-weight:700;font-size:19px;letter-spacing:.24em;
}

.toppage-root .rows{list-style:none}
.toppage-root .row{
  display:grid;
  grid-template-columns:64px 1fr auto;
  gap:0 28px;align-items:baseline;
  border-bottom:1px solid var(--rule-thin);
  position:relative;
}
.toppage-root .row>a{display:contents}
.toppage-root .row .idx{
  font-family:"Zen Old Mincho",serif;font-size:12px;color:var(--ink-2);
  letter-spacing:.08em;font-variant-numeric:tabular-nums;padding:20px 0;
}
.toppage-root .row .ttl{padding:20px 0;min-width:0}
.toppage-root .row .ttl .cat{
  display:inline-block;font-size:10.5px;letter-spacing:.16em;color:var(--ink-2);
  margin-right:12px;vertical-align:1px;
}
.toppage-root .row .ttl .t{
  font-family:"Zen Old Mincho",serif;font-weight:700;font-size:16.5px;
  letter-spacing:.03em;line-height:1.7;
  border-bottom:1px solid transparent;transition:border-color .12s;
}
.toppage-root .row:hover .ttl .t{border-bottom-color:var(--ink)}
.toppage-root .row .fig{
  padding:20px 0;text-align:right;white-space:nowrap;
}
.toppage-root .row .fig .fv{
  font-family:"Zen Old Mincho",serif;font-weight:700;font-size:17px;
  font-variant-numeric:tabular-nums;letter-spacing:.02em;
}
.toppage-root .row .fig .fk{display:block;font-size:10px;color:var(--ink-2);letter-spacing:.12em;margin-top:-2px}
.toppage-root .row .date{
  position:absolute;right:0;bottom:5px;font-size:9.5px;color:var(--ink-2);
  letter-spacing:.08em;font-variant-numeric:tabular-nums;
}
.toppage-root .row.is-hidden{display:none}

/* 節区切り（カテゴリ見出し行） */
.toppage-root .section-row{
  border-bottom:1px solid var(--rule);
  padding:44px 0 8px;display:flex;align-items:baseline;gap:16px;
}
.toppage-root .section-row .sn{
  font-family:"Zen Old Mincho",serif;font-weight:900;font-size:13px;letter-spacing:.1em;color:var(--shu);
}
.toppage-root .section-row h4{
  font-family:"Zen Old Mincho",serif;font-weight:700;font-size:15px;letter-spacing:.28em;
}
.toppage-root .section-row .sd{font-size:11px;color:var(--ink-2);margin-left:auto;letter-spacing:.06em}
.toppage-root .section-row.is-hidden{display:none}

/* ===== 検印 ===== */
.toppage-root .stamp-block{margin-top:56px;display:flex;justify-content:flex-end}
.toppage-root .stamp{
  width:88px;height:88px;border:2px solid var(--shu);border-radius:50%;
  color:var(--shu);display:flex;flex-direction:column;align-items:center;justify-content:center;
  font-family:"Zen Old Mincho",serif;transform:rotate(-6deg);
  gap:1px;opacity:.92;
}
.toppage-root .stamp .s1{font-size:11px;letter-spacing:.28em;font-weight:700;border-bottom:1px solid var(--shu);padding-bottom:2px;margin-bottom:2px}
.toppage-root .stamp .s2{font-size:14px;font-weight:700;letter-spacing:.05em;font-variant-numeric:tabular-nums}
.toppage-root .stamp .s3{font-size:9px;letter-spacing:.14em}

/* 調査方法 */
.toppage-root .method{
  margin-top:56px;border-top:3px double var(--rule);padding-top:26px;
  display:grid;grid-template-columns:auto 1fr auto;gap:28px;align-items:start;
}
.toppage-root .method h3{
  font-family:"Zen Old Mincho",serif;font-weight:700;font-size:15px;letter-spacing:.28em;
  writing-mode:vertical-rl;
}
.toppage-root .method p{font-size:13px;color:var(--ink-2);max-width:560px}
.toppage-root .method a{
  font-family:"Zen Old Mincho",serif;font-size:13px;font-weight:700;letter-spacing:.1em;
  border-bottom:1px solid var(--ink);white-space:nowrap;align-self:end;
}
.toppage-root .method a:hover{color:var(--shu);border-color:var(--shu)}

/* ===== モバイル ===== */
@media(max-width:940px){
  .toppage-root .inner{padding:0 0 70px}
  .toppage-root .masthead{padding:0}
  .toppage-root .figures .f{padding:12px 14px 10px}
  .toppage-root .figures .f .v{font-size:23px}
  .toppage-root .chips{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:2px}
  .toppage-root .row{grid-template-columns:1fr;gap:2px;padding:16px 0}
  .toppage-root .row .idx{display:none}
  .toppage-root .row .ttl{padding:0}
  .toppage-root .row .fig{padding:4px 0 0;text-align:left}
  .toppage-root .row .date{position:static;display:block;margin-top:2px}
  .toppage-root .ledger{margin-top:40px}
  .toppage-root .stamp-block{justify-content:flex-start}
  .toppage-root .method{grid-template-columns:1fr;gap:14px;margin-top:40px}
  .toppage-root .method h3{writing-mode:horizontal-tb}
}
@media(prefers-reduced-motion:reduce){.toppage-root *{transition:none!important}}
.toppage-root button:focus-visible,.toppage-root a:focus-visible{outline:2px solid var(--shu);outline-offset:3px}