:root { --paper:#f7f1e3; --ink:#28352d; --muted:#66716a; --grass:#36543b; --leaf:#c9d9a9; --purple:#6e557b; --border:#d7ccb5; }
* { box-sizing: border-box; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Noto Sans JP",system-ui,sans-serif; line-height:1.8; }
header,main,footer { width:min(760px,calc(100% - 32px)); margin:auto; }
header { padding:48px 0 20px; border-bottom:1px solid var(--border); }
main { padding:32px 0 64px; }
footer { padding:24px 0 48px; color:var(--muted); border-top:1px solid var(--border); font-size:.85rem; }
h1,h2 { line-height:1.4; } h1 { font-size:clamp(2rem,8vw,3.2rem); margin:.2em 0; } h2 { margin-top:2em; }
a { color:var(--purple); text-underline-offset:3px; } nav { display:flex; flex-wrap:wrap; gap:10px 18px; margin-top:18px; }
.eyebrow { color:var(--grass); font-weight:700; letter-spacing:.13em; font-size:.75rem; }
.card { margin:20px 0; padding:18px; background:#fffdf7; border:1px solid var(--border); border-radius:16px; }
.warning { background:#e5dce9; border-color:#c9b8d0; }
.placeholder { color:#9b302c; font-weight:700; }
li { margin:.45em 0; }