:root{ --bg:#FBF6EF; --ink:#3B2618; --text:#5A4232; --muted:#8C7564;
       --line:#E8DCCD; --accent:#B0702A; --chip:#F1E4D2; }
@media (prefers-color-scheme: dark){
  :root{ --bg:#1C1612; --ink:#F3E7DA; --text:#D6C5B4; --muted:#A28E7C;
         --line:#3A2E25; --accent:#E7AE6B; --chip:#2E241C; }
}
*{ box-sizing:border-box }
body{ margin:0; background:var(--bg); color:var(--text);
      font:16px/1.75 -apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo",
      "Hiragino Sans","Malgun Gothic",system-ui,sans-serif; }
main{ max-width:42rem; margin:0 auto; padding:2rem 1.25rem 5rem }
nav{ display:flex; flex-wrap:wrap; gap:.4rem; margin-bottom:2.5rem }
nav button{ font:inherit; font-size:.86rem; padding:.32rem .8rem;
  border:1px solid var(--line); background:transparent; color:var(--muted);
  border-radius:999px; cursor:pointer }
nav button:hover{ color:var(--accent) }
nav button[aria-current="true"]{ background:var(--chip); color:var(--ink);
  border-color:transparent; font-weight:600 }
h1{ font-size:1.65rem; color:var(--ink); margin:0 0 .4rem; line-height:1.35 }
h2{ font-size:1.08rem; color:var(--ink); margin:2.4rem 0 .6rem }
h3{ font-size:.98rem; color:var(--ink); margin:1.5rem 0 .4rem }
.meta{ color:var(--muted); font-size:.88rem; margin:0 0 1rem }
strong{ color:var(--ink) }
a{ color:var(--accent) }
ul{ padding-left:1.2rem }
p{ margin:.7rem 0 }
code{ font-size:.86em; background:var(--chip); padding:.1rem .35rem; border-radius:4px;
      word-break:break-all }
footer{ margin-top:3.5rem; padding-top:1.2rem; border-top:1px solid var(--line);
        color:var(--muted); font-size:.86rem }