/* FactSort Lab. 共通のスタイル（2026-09-29）
   すべての公開ページ（トップ・研究報告・読み物・道具）がこれを読む。
   ページ固有の指定は、そのページの <style> に最小限だけ書く。
   文面と設計の基準は docs/site_style.md。 */

:root{
  --ink:#14213d;          /* 見出し・ヘッダーの文字、フッターの地 */
  --text:#2d3748;         /* 本文 */
  --light:#5a6472;        /* 補足・日付 */
  --accent:#2c5282;       /* リンク */
  --figure:#b4532a;       /* 測定値の数字だけに使う */
  --bg:#f7f7f5;           /* ページの地 */
  --surface:#fff;         /* カード・本文の面 */
  --tint:#eef1f5;         /* 表の見出し・引用・注記の面 */
  --border:#e2e5ea;
  --sans:"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP",sans-serif;
  --serif:"Hiragino Mincho ProN","Yu Mincho","Noto Serif JP",Georgia,"Times New Roman",serif;
  --wide:1120px;          /* 一覧のページ */
  --read:720px;           /* 読む文章のページ */
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--sans);background:var(--bg);color:var(--text);font-size:16px;line-height:1.9}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}

/* ヘッダー：全ページで同じ。塗りのボタンは置かない */
.lab-top{background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:10}
.lab-top .in{max-width:var(--wide);margin:0 auto;padding:0 16px;min-height:58px;display:flex;align-items:center;justify-content:space-between;gap:10px 20px;flex-wrap:wrap}
.lab-logo{font-weight:800;color:var(--ink);font-size:18px;letter-spacing:.01em;white-space:nowrap}
.lab-logo span{color:var(--accent)}
.lab-logo:hover{text-decoration:none}
.lab-nav{display:flex;align-items:center;gap:6px 18px;font-size:14px;flex-wrap:wrap}
.lab-nav a{color:var(--ink);padding:4px 0;border-bottom:2px solid transparent}
.lab-nav a:hover{text-decoration:none;border-bottom-color:var(--border)}
.lab-nav a[aria-current="page"]{border-bottom-color:var(--accent)}
.lab-nav .lang{color:var(--light);border-left:1px solid var(--border);padding-left:14px}

/* 本文の器 */
.in{max-width:var(--wide);margin:0 auto;padding:0 16px}
.read-wrap{max-width:var(--read);margin:0 auto;padding:28px 16px 56px}
.crumb{font-size:13px;color:var(--light);margin-bottom:20px}
.crumb a{color:var(--light)}
.crumb span{margin:0 6px}

/* 見出し：題は明朝、節は本文と同じ書体 */
.kicker{font-size:12px;letter-spacing:.14em;color:var(--light);font-weight:700;text-transform:uppercase;margin-bottom:6px}
h1.title{font-family:var(--serif);font-weight:700;font-size:clamp(24px,3.6vw,32px);line-height:1.5;color:var(--ink);margin:0 0 10px}
.subtitle{font-size:16px;color:var(--light);margin:-4px 0 12px}
.meta{font-size:13px;color:var(--light);margin-bottom:24px}
.meta span+span::before{content:"／";margin:0 6px;color:var(--border)}
.body h2{font-size:20px;line-height:1.5;color:var(--ink);margin:40px 0 12px;padding-bottom:6px;border-bottom:1px solid var(--border)}
.body h3{font-size:16px;color:var(--ink);margin:26px 0 8px}
.body p{margin:0 0 16px}
.body ul,.body ol{margin:0 0 16px 1.4em}
.body li{margin:4px 0}
.body blockquote{border-left:3px solid #c8d0db;background:var(--tint);padding:10px 16px;margin:0 0 16px;color:#3a4453}
.body blockquote p{margin:0 0 4px}

/* 目次 */
.toc{background:var(--surface);border:1px solid var(--border);padding:14px 18px;margin:0 0 28px;font-size:14px}
.toc b{display:block;font-size:12px;letter-spacing:.1em;color:var(--light);margin-bottom:4px}
.toc ol{margin:0 0 0 1.3em}.toc li{margin:2px 0}

/* 表 */
.tbl{overflow-x:auto;margin:0 0 20px;-webkit-overflow-scrolling:touch}
.tbl table,.body table{border-collapse:collapse;font-size:14px;width:100%;background:var(--surface)}
.body th,.body td{border:1px solid var(--border);padding:8px 10px;text-align:left;vertical-align:top;line-height:1.7}
.body th{background:var(--tint);color:var(--ink);font-weight:700}

/* 注記・例示 */
.note{background:var(--tint);border-left:3px solid #c8d0db;padding:12px 16px;margin:0 0 18px;font-size:14px;color:#3a4453}
.sample{background:var(--surface);border:1px solid var(--border);margin:0 0 20px;font-size:14px}
.sample .hd{background:var(--tint);padding:8px 14px;font-size:13px;color:var(--light);border-bottom:1px solid var(--border)}
.sample .bd{padding:14px 16px}
.disclaimer{font-size:13px;color:var(--light);border-top:1px solid var(--border);padding-top:14px;margin-top:36px}

/* 関連：記事末尾の控えめな案内。1ページに1つだけ */
.related{border-top:1px solid var(--border);margin-top:36px;padding-top:18px;font-size:14px}
.related h2{font-size:13px;letter-spacing:.1em;color:var(--light);margin:0 0 8px;border:none;padding:0}
.related ul{list-style:none;margin:0}
.related li{margin:4px 0}

/* カード・一覧 */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.card{display:block;color:var(--text);background:var(--surface);border:1px solid var(--border);border-top:3px solid var(--accent);padding:18px 20px}
.card:hover{text-decoration:none;border-color:#b8c4d4;border-top-color:var(--accent)}
.card h3{font-size:16px;color:var(--ink);line-height:1.6;margin:8px 0 6px}
.card p{font-size:14px;line-height:1.8}
.tag{display:inline-block;font-size:12px;color:var(--accent);background:#eef3fa;padding:1px 8px;margin-right:6px}
.date{font-size:12px;color:var(--light)}
.rows{list-style:none;background:var(--surface);border:1px solid var(--border);margin:0}
.rows li{padding:12px 16px;border-top:1px solid var(--border);display:flex;gap:6px 14px;align-items:baseline;flex-wrap:wrap}
.rows li:first-child{border-top:none}
.rows .n{font-size:12px;color:var(--light);min-width:64px}

/* ボタン：ページの主な行き先に1つ。塗りは濃紺だけ */
.btn{display:inline-block;padding:10px 20px;font-weight:700;font-size:15px;border:1px solid var(--ink);color:var(--ink);background:var(--surface)}
.btn:hover{text-decoration:none;background:var(--tint)}
.btn.solid{background:var(--ink);color:#fff}
.btn.solid:hover{background:#22335a}

/* フッター：全ページで同じ */
.lab-foot{margin-top:64px;background:var(--ink);color:#c9d4e1;padding:36px 0 44px;font-size:14px}
.lab-foot .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:18px}
.lab-foot h4{color:#fff;font-size:12px;letter-spacing:.12em;margin-bottom:8px}
.lab-foot a{color:#c9d4e1;display:block;margin:3px 0}
.lab-foot .fine{margin-top:26px;font-size:12px;color:#8fa2b8;line-height:1.8}

@media (max-width:600px){
  body{font-size:15.5px}
  .lab-nav{gap:4px 14px;font-size:13px}
  .lab-nav .lang{padding-left:10px}
  .body h2{font-size:18px}
}