/* 読者は40〜60代中心。本文18px・行間1.95・高コントラストを基本にする。
   グラフの色は検証済みパレット（CVD分離を満たす並び）から取る。 */
:root{
  color-scheme: light;
  --surface-0:#faf9f6; --surface-1:#ffffff; --surface-2:#f2f0ea;
  --border:#ddd9cf; --grid:#eae7df;
  --ink:#16150f; --ink-2:#4a473d; --ink-3:#77736a;
  --link:#1b5fae; --link-visited:#5a3f96;
  --series-1:#2a78d6; --series-2:#eb6834; --series-3:#1baf7a;
  --warn-bg:#fdf3e3; --warn-bd:#e0a33c;
  --info-bg:#eef4fc; --info-bd:#2a78d6;
}
@media (prefers-color-scheme: dark){
  :root:where(:not([data-theme="light"])){
    color-scheme: dark;
    --surface-0:#15140f; --surface-1:#1d1c17; --surface-2:#262520;
    --border:#39372f; --grid:#2e2c26;
    --ink:#f6f4ec; --ink-2:#c6c2b4; --ink-3:#928d80;
    --link:#7fb2ef; --link-visited:#b6a4ea;
    --series-1:#3987e5; --series-2:#d95926; --series-3:#199e70;
    --warn-bg:#2d2415; --warn-bd:#c08a2d;
    --info-bg:#16233a; --info-bd:#3987e5;
  }
}
:root[data-theme="dark"]{
  color-scheme: dark;
  --surface-0:#15140f; --surface-1:#1d1c17; --surface-2:#262520;
  --border:#39372f; --grid:#2e2c26;
  --ink:#f6f4ec; --ink-2:#c6c2b4; --ink-3:#928d80;
  --link:#7fb2ef; --link-visited:#b6a4ea;
  --series-1:#3987e5; --series-2:#d95926; --series-3:#199e70;
  --warn-bg:#2d2415; --warn-bd:#c08a2d;
  --info-bg:#16233a; --info-bd:#3987e5;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--surface-0);color:var(--ink);
  font:18px/1.95 "Hiragino Kaku Gothic ProN","Yu Gothic Medium","Yu Gothic",Meiryo,sans-serif}
.inner{max-width:760px;margin:0 auto;padding:0 16px}
a{color:var(--link)}a:visited{color:var(--link-visited)}
img,svg{max-width:100%;height:auto}

header.site{background:var(--surface-1);border-bottom:1px solid var(--border);
  padding:18px 0 0;margin-bottom:26px}
.brand{font-size:23px;font-weight:700;color:var(--ink);text-decoration:none;letter-spacing:.02em}
header .tag{margin:4px 0 14px;font-size:14px;color:var(--ink-3);line-height:1.6}
nav.sections{display:flex;gap:2px;flex-wrap:wrap;overflow-x:auto}
nav.sections a{padding:11px 15px;font-size:15px;text-decoration:none;color:var(--ink-2);
  border-bottom:3px solid transparent;white-space:nowrap}
nav.sections a:hover{color:var(--ink);background:var(--surface-2)}
nav.sections a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--series-1);font-weight:600}

.crumb{font-size:14px;color:var(--ink-3);margin-bottom:14px}
h1{font-size:30px;line-height:1.5;letter-spacing:.01em;margin:0 0 12px}
h2{font-size:23px;line-height:1.6;margin:44px 0 14px;padding-bottom:8px;
  border-bottom:2px solid var(--border)}
h3{font-size:19px;margin:30px 0 10px}
p{margin:0 0 1.3em}
.meta{font-size:14px;color:var(--ink-3);margin-bottom:20px}
.meta .sec{margin-left:12px;padding:2px 10px;background:var(--surface-2);border-radius:999px}
.lead{font-size:19px;background:var(--surface-2);padding:18px 20px;border-radius:10px;
  border-left:4px solid var(--series-1)}
ul,ol{padding-left:1.5em;margin:0 0 1.3em}
li{margin-bottom:.5em}

nav.toc{background:var(--surface-1);border:1px solid var(--border);border-radius:10px;
  padding:16px 20px;margin:26px 0}
nav.toc p{font-weight:700;margin:0 0 8px;font-size:16px}
nav.toc ol{margin:0;padding-left:1.4em}
nav.toc li{margin-bottom:.35em}
nav.toc a{font-size:16px}

aside.note{border-radius:10px;padding:14px 18px;margin:24px 0;font-size:17px}
aside.note strong{display:block;margin-bottom:4px;font-size:15px}
aside.note p{margin:0}
aside.note.info{background:var(--info-bg);border-left:4px solid var(--info-bd)}
aside.note.warn{background:var(--warn-bg);border-left:4px solid var(--warn-bd)}

figure{margin:28px 0}
figcaption{font-size:16px;font-weight:700;margin-bottom:10px}
.scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse;font-size:16px;
  font-variant-numeric:tabular-nums;background:var(--surface-1)}
th,td{padding:11px 13px;border:1px solid var(--border);text-align:left;line-height:1.65}
thead th{background:var(--surface-2);font-size:15px;white-space:nowrap}
td.num{text-align:right;white-space:nowrap}
table td:first-child{min-width:15em}
.cap{font-size:14px;color:var(--ink-3);line-height:1.7}
.chart svg{background:var(--surface-1);border:1px solid var(--border);border-radius:10px;padding:8px}
.chart .ax{font-size:12px;fill:var(--ink-3)}
.legend{display:flex;gap:18px;flex-wrap:wrap;font-size:15px;color:var(--ink-2);margin-bottom:8px}
.legend i{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:6px}
details{margin:12px 0}
summary{cursor:pointer;font-size:16px;color:var(--ink-2);padding:8px 0}
.faq details{background:var(--surface-1);border:1px solid var(--border);
  border-radius:10px;padding:4px 18px;margin-bottom:10px}
.faq summary{font-weight:600;color:var(--ink);font-size:17px}
.faq details>div{padding:0 0 12px;color:var(--ink-2)}

aside.promo{margin:36px 0;padding:18px 20px;background:var(--surface-1);
  border:1px solid var(--border);border-radius:10px}
.btn{display:block;text-align:center;padding:15px 20px;margin:8px 0;border-radius:9px;
  background:var(--series-1);color:#fff;text-decoration:none;font-weight:700;font-size:17px}
.btn:visited{color:#fff}
.btn:hover{filter:brightness(1.08)}

.sources{margin-top:44px;padding-top:8px;border-top:1px solid var(--border)}
.sources h2{font-size:19px;border:none;margin-top:18px}
.sources ol{font-size:16px}
.related ul{font-size:17px}

footer.site{margin-top:64px;padding:28px 0 44px;background:var(--surface-1);
  border-top:1px solid var(--border);font-size:15px;color:var(--ink-2)}
footer nav{margin-top:12px;display:flex;gap:18px;flex-wrap:wrap}

.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;
  padding:0;list-style:none;margin:0 0 30px}
.cards li{background:var(--surface-1);border:1px solid var(--border);border-radius:11px;
  padding:17px 19px}
.cards a{font-size:18px;font-weight:600;text-decoration:none;line-height:1.6;display:block}
.cards a:hover{text-decoration:underline}
.cards .cap{margin-top:7px}

@media (max-width:600px){
  body{font-size:17px;line-height:1.9}
  h1{font-size:25px}h2{font-size:21px}
  .lead{font-size:17px;padding:15px 16px}
}