:root {
  --bg: 214 62% 11%;
  --card: 210 65% 8%;
  --ink: 0 0% 100%;
  --accent: 187 92% 69%;
  --accent-deep: 192 91% 32%;
  --line: 214 32% 91%;
  --dim: 215 16% 47%;
  --band: 218 85% 45%;
  --paper: 210 20% 98%;
  --paper-ink: 222 47% 11%;
  --font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, var(--font-japanese);
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
  --tracking-heading: -0.02em;
  --tracking-label: 0.04em;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: hsl(var(--bg));
  color: hsl(var(--ink));
  font-family: var(--font-sans);
  font-weight: 400;
  line-height: 1.75;
  letter-spacing: -0.01em;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3 { margin: 0; font-weight: 700; letter-spacing: var(--tracking-heading); text-wrap: balance; }
p { text-wrap: pretty; }
a { color: hsl(var(--accent)); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }
a:focus-visible { outline: 3px solid hsl(var(--accent)); outline-offset: 3px; }

.disclosure-band {
  display: flex; align-items: center; justify-content: center;
  min-height: 1.75rem; padding: 0.25rem 1rem;
  background: hsl(var(--band)); color: #fff;
  font-size: 0.75rem; font-weight: 600; text-align: center;
}
.wrap { max-width: 56rem; margin: 0 auto; padding: 0 1rem; }
@media (min-width: 40rem) { .wrap { padding: 0 2rem; } }

.site-head { border-bottom: 1px solid hsl(var(--line) / 0.25); padding: 1.5rem 0; }
.site-head .brand { font-size: 1.125rem; font-weight: 700; color: hsl(var(--ink)); }
.site-head nav { margin-top: 0.5rem; display: flex; flex-wrap: wrap; gap: 0.25rem 1.25rem; font-size: 0.875rem; }
.site-head nav a { color: hsl(var(--accent)); }

.page-label {
  font-family: var(--font-mono); font-size: 0.75rem; text-transform: uppercase;
  letter-spacing: var(--tracking-label); color: hsl(var(--accent));
}
.page-head { padding: 2.5rem 0 1.5rem; }
.page-head h1 { margin-top: 0.5rem; font-size: 1.75rem; }
@media (min-width: 40rem) { .page-head h1 { font-size: 2.25rem; } }
.page-head .lead { margin: 0.75rem 0 0; color: hsl(var(--ink) / 0.8); }

.day { margin: 0 0 3rem; }
.day > h2 {
  font-family: var(--font-mono); font-size: 1.375rem; font-variant-numeric: tabular-nums;
  padding-bottom: 0.5rem; border-bottom: 1px solid hsl(var(--line) / 0.25);
}
.day > h2 a { color: hsl(var(--ink)); }
.cards { list-style: none; margin: 1.5rem 0 0; padding: 0; display: grid; gap: 1.25rem; }
/* 🔴 `style="…"` を頁に書かない（配信層の CSP が `style-src 'self'` なので、
   インラインの指定は**閲覧者のブラウザに落とされる**＝箇条の点が戻る）。役は印で宣言する。 */
.cards.plain { list-style: none; }
.card { background: hsl(var(--card)); padding: 1.5rem; border: 1px solid hsl(var(--line) / 0.15); }
.card .num { font-family: var(--font-mono); font-size: 0.75rem; color: hsl(var(--accent)); margin: 0; }
.card h3 { margin-top: 0.5rem; font-size: 1.125rem; }
.card h3 a { color: hsl(var(--ink)); }
.card .point { margin: 0.75rem 0 0; color: hsl(var(--ink) / 0.85); }
.card .meta {
  margin: 1rem 0 0; font-size: 0.8125rem; color: hsl(var(--ink) / 0.65);
  display: flex; flex-wrap: wrap; gap: 0.25rem 0.75rem;
}
.card .meta .pub { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }

.detail { background: hsl(var(--card)); padding: 1.5rem; margin: 1.5rem 0 0; border: 1px solid hsl(var(--line) / 0.15); }
@media (min-width: 40rem) { .detail { padding: 2.5rem; } }
.detail h1 { font-size: 1.375rem; }
@media (min-width: 40rem) { .detail h1 { font-size: 1.75rem; } }
.detail .original {
  margin: 0.75rem 0 0; font-size: 0.8125rem; color: hsl(var(--ink) / 0.6);
}
.detail .point { margin: 1.5rem 0 0; font-size: 1.0625rem; }
.facts { margin: 2rem 0 0; display: grid; gap: 1.25rem; }
@media (min-width: 40rem) { .facts { grid-template-columns: 1fr 1fr; gap: 1.5rem; } }
.facts dt { font-size: 0.8125rem; font-weight: 700; color: hsl(var(--ink) / 0.55); }
.facts dd { margin: 0.375rem 0 0; }
.source-box { margin: 2rem 0 0; padding-top: 1.25rem; border-top: 1px solid hsl(var(--line) / 0.2); }
.source-box dt { font-size: 0.8125rem; font-weight: 700; color: hsl(var(--ink) / 0.55); }
.source-box dd { margin: 0.375rem 0 0; }
.source-box .pub { font-family: var(--font-mono); font-variant-numeric: tabular-nums; color: hsl(var(--ink) / 0.65); font-size: 0.875rem; }

.table { width: 100%; border-collapse: collapse; margin: 1.5rem 0 0; font-size: 0.9375rem; }
.table th, .table td { text-align: left; padding: 0.625rem 0.5rem; border-bottom: 1px solid hsl(var(--line) / 0.2); }
.table th { font-size: 0.8125rem; color: hsl(var(--ink) / 0.6); font-weight: 700; }
.table td.n { font-family: var(--font-mono); font-variant-numeric: tabular-nums; text-align: right; width: 5rem; }

.pager { margin: 2.5rem 0 0; display: flex; flex-wrap: wrap; gap: 0.75rem 1.5rem; font-size: 0.9375rem; }
.note { color: hsl(var(--ink) / 0.6); font-size: 0.875rem; }

.site-foot {
  margin-top: 4rem; padding: 2rem 0 3rem;
  background: hsl(var(--card)); border-top: 1px solid hsl(var(--line) / 0.2);
  font-size: 0.875rem; color: hsl(var(--ink) / 0.75);
}
.site-foot nav { display: flex; flex-wrap: wrap; gap: 0.25rem 1.25rem; margin-bottom: 1rem; }
.site-foot p { margin: 0.5rem 0 0; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation-duration: 0.01ms !important; animation-delay: 0ms !important; transition-duration: 0.01ms !important; }
}