
:root {
  --paper: #fffdf9;
  --surface: #ffffff;
  --sunken: #f3efe9;
  --ink: #1f1d22;
  --ink-soft: #3b3841;
  --muted: #595561;
  --line: #d9d3ca;
  --line-strong: #8d877f;
  --accent: #1d5a8c;
  --on-accent: #ffffff;
  --signal: #9c3d1e;
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 48px; --space-8: 64px;
  --radius: 10px;
  --measure: 38em;
}
@media (prefers-color-scheme: dark) {
  :root {
    --paper: #17161a; --surface: #1f1e23; --sunken: #26252b;
    --ink: #f1eee9; --ink-soft: #d8d4cd; --muted: #b0aab4;
    --line: #3a3840; --line-strong: #7a7683;
    --accent: #8fc1ee; --on-accent: #0f1d2a; --signal: #f0a283;
  }
}
* { box-sizing: border-box; }
html {
  scrollbar-gutter: stable;
  touch-action: manipulation;
  -webkit-text-size-adjust: 100%;
}
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: "Zen Kaku Gothic New", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic Medium", "Yu Gothic", Meiryo, sans-serif;
  font-size: 16px;
  line-height: 1.9;
}
a { color: var(--accent); text-underline-offset: 0.2em; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; border-radius: 4px; }
.page { max-width: 960px; margin-inline: auto; padding-inline: var(--space-4); }
.site-header { border-bottom: 1px solid var(--line); background: var(--surface); }
.site-header .page { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-5); padding-block: var(--space-3); }
.site-name { font-weight: 600; font-size: 1.125rem; color: var(--ink); text-decoration: none; }
.site-nav { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-4); margin: 0; padding: 0; list-style: none; }
.site-nav a { display: inline-block; padding: var(--space-1) 0; color: var(--ink-soft); text-decoration: none; border-bottom: 2px solid transparent; }
.site-nav a:hover { border-bottom-color: var(--line-strong); }
.site-nav a[aria-current="page"] { color: var(--ink); font-weight: 600; border-bottom-color: var(--accent); }
main { padding-block: var(--space-6) var(--space-8); }
h1 { font-size: 1.625rem; line-height: 1.5; margin: 0 0 var(--space-4); font-weight: 600; }
h2 { font-size: 1.25rem; line-height: 1.6; margin: var(--space-7) 0 var(--space-3); padding-bottom: var(--space-2); border-bottom: 2px solid var(--line-strong); font-weight: 600; }
p { margin: 0 0 var(--space-4); max-width: var(--measure); }
.lead { font-size: 1.0625rem; color: var(--ink-soft); }
.breadcrumb { margin: 0 0 var(--space-5); padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-2); font-size: 0.875rem; color: var(--muted); }
.breadcrumb li + li::before { content: "›"; margin-right: var(--space-2); color: var(--muted); }
.note { background: var(--sunken); border: 1px solid var(--line); border-radius: var(--radius); padding: var(--space-4); margin: 0 0 var(--space-5); max-width: none; font-size: 0.9375rem; color: var(--ink-soft); }
.small { font-size: 0.875rem; color: var(--muted); }
.table-scroll { overflow-x: auto; margin: 0 0 var(--space-4); border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
table { border-collapse: collapse; width: 100%; font-size: 0.9375rem; line-height: 1.6; }
caption { text-align: left; padding: var(--space-3) var(--space-4) 0; color: var(--muted); font-size: 0.875rem; }
th, td { padding: var(--space-2) var(--space-3); text-align: left; border-bottom: 1px solid var(--line); vertical-align: top; }
thead th { border-bottom: 2px solid var(--line-strong); background: var(--sunken); font-weight: 600; white-space: nowrap; }
tbody tr:last-child td, tbody tr:last-child th { border-bottom: 0; }
td.n, th.n { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
tbody th { font-weight: 500; }
.high { color: var(--signal); font-weight: 600; }
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(16rem, 100%), 1fr)); gap: var(--space-4); margin: 0 0 var(--space-5); padding: 0; list-style: none; }
.cards li { border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); padding: var(--space-4); min-width: 0; }
.link-list { margin: 0 0 var(--space-5); padding-left: 1.2em; }
.link-list li { margin-bottom: var(--space-2); }
.site-footer { border-top: 1px solid var(--line); background: var(--sunken); padding-block: var(--space-6); font-size: 0.875rem; color: var(--ink-soft); }
.site-footer ul { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); margin: 0 0 var(--space-3); padding: 0; list-style: none; }
.site-footer p { margin: 0; max-width: none; }
@media print { .site-header, .site-footer { display: none; } }
