/*
  雛形の最小スタイル。デザインが決まったらこのファイルごと差し替える。
  デザイントークンと共通パーツはこの1枚に集約し、ページごとの個別 CSS は作らない。
*/
:root {
  --bg: #fafaf9;
  --fg: #1a1a1e;
  --muted: #6b6b73;
  --line: #e7e7e4;
  --accent: #b4551f;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--fg);
  font-family: system-ui, -apple-system, "Hiragino Sans", "Noto Sans JP", sans-serif;
  line-height: 1.9;
}

.shell { max-width: 720px; margin: 0 auto; padding: 0 20px; }

.hdr { padding: 40px 0 24px; border-bottom: 1px solid var(--line); }
.hdr__title { margin: 0; font-size: clamp(24px, 5vw, 34px); line-height: 1.4; }

.lead { color: var(--muted); }

.prose h2 { margin: 32px 0 8px; font-size: 17px; }
.prose p { margin: 0 0 12px; font-size: 15px; }

a { color: var(--accent); }

.foot {
  margin-top: 56px;
  padding: 24px 0 48px;
  border-top: 1px solid var(--line);
  font-size: 13px;
  color: var(--muted);
}
.foot__links { display: flex; gap: 16px; flex-wrap: wrap; }
.foot__meta { margin-top: 8px; font-size: 12px; color: var(--muted); }

@media (prefers-color-scheme: dark) {
  :root { --bg: #16161a; --fg: #eceae6; --muted: #9a9aa2; --line: #2c2c33; --accent: #e08a4e; }
}