:root{--base:#f7f1ef;--card:#fff;--text:#3a2f2c;--sub:#7a6a65;--accent:#c97b6d;--accent-bg:#f0dcd6}
*{box-sizing:border-box}
body{margin:0;background:var(--base);color:var(--text);font-family:"Hiragino Maru Gothic ProN","Hiragino Sans","Yu Gothic",sans-serif;line-height:1.9;-webkit-text-size-adjust:100%}
main{max-width:720px;margin:0 auto;padding:32px 20px 64px}
h1{font-size:1.6rem;line-height:1.4;margin:0 0 8px}
h2{font-size:1.15rem;margin:36px 0 8px;padding-left:12px;border-left:5px solid var(--accent)}
p,li{font-size:1rem}
ul{padding-left:1.4em}
.meta{color:var(--sub);font-size:.9rem;margin:0 0 24px}
.card{background:var(--card);border-radius:16px;padding:16px 20px;margin:16px 0}
.pill{display:inline-block;background:var(--accent-bg);color:var(--accent);border-radius:999px;padding:2px 12px;font-size:.85rem}
a{color:var(--accent)}
nav ul{list-style:none;padding:0;display:flex;gap:16px;flex-wrap:wrap}
footer{color:var(--sub);font-size:.85rem;margin-top:48px}
@media (prefers-color-scheme:dark){:root{--base:#221c1a;--card:#2c2422;--text:#f2e8e4;--sub:#c7b3ac;--accent:#d98f7f;--accent-bg:#4a332e}}