:root {
  --bg: #E9E9E2; --surface: #F8F8F4; --ink: #262620; --ink-soft: #726F63;
  --line: #D9D7CA; --accent: #C1442A; --wash: #F6EEE8;
  color-scheme: light dark;
}
@media (prefers-color-scheme: dark) {
  :root { --bg: #171713; --surface: #211F1A; --ink: #EFEBE0; --ink-soft: #A6A192;
          --line: #383527; --accent: #E2643F; --wash: #2C2117; }
}
* { box-sizing: border-box; }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font-family: -apple-system, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  line-height: 1.8; -webkit-text-size-adjust: 100%;
}
main { max-width: 720px; margin: 0 auto; padding: 40px 16px 64px; }
header { display: flex; align-items: center; gap: 14px; margin-bottom: 28px; }
.stamp {
  flex: none; width: 48px; height: 48px; border-radius: 50%; background: var(--accent); color: #FFFDFA;
  display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 20px;
  transform: rotate(-8deg);
}
h1 { font-size: 24px; margin: 0; line-height: 1.3; }
.sub { color: var(--ink-soft); font-size: 13px; margin: 2px 0 0; }
.card { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 8px 22px 18px; }
h2 { font-size: 16px; margin: 26px 0 6px; padding-top: 4px; }
h2:first-child { margin-top: 14px; }
p, li { font-size: 15px; }
ul { padding-left: 1.3em; margin: 6px 0; }
a { color: var(--accent); }
.note { background: var(--wash); border-radius: 8px; padding: 10px 14px; font-size: 14px; }
footer { color: var(--ink-soft); font-size: 12px; margin-top: 22px; text-align: center; }
.card p { margin: 10px 0; }
footer a { color: var(--ink-soft); }