:root { --bg:#f5f7f4; --card:#fff; --ink:#1d2a1f; --muted:#5d6b60; --accent:#2e7d32; --line:#e2e8e2; }
@media (prefers-color-scheme: dark) { :root { --bg:#121714; --card:#1b221d; --ink:#e7efe8; --muted:#a3b1a6; --accent:#66bb6a; --line:#2a332c; } }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font:16px/1.7 "Sarabun","Noto Sans Thai",-apple-system,system-ui,sans-serif; }
main { max-width:760px; margin:0 auto; padding:32px 16px 64px; }
header { display:flex; align-items:center; gap:14px; margin-bottom:24px; }
header img { width:56px; height:56px; border-radius:14px; }
header a { color:inherit; text-decoration:none; }
h1 { font-size:1.6rem; margin:0; line-height:1.3; }
h2 { font-size:1.15rem; margin:28px 0 8px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:20px 22px; margin:16px 0; }
.muted { color:var(--muted); font-size:.92rem; }
a { color:var(--accent); }
nav { display:flex; flex-wrap:wrap; gap:10px; margin:18px 0; }
nav a { background:var(--card); border:1px solid var(--line); border-radius:999px; padding:6px 14px; text-decoration:none; }
ol li, ul li { margin:4px 0; }
.lang { font-size:.9rem; margin-left:auto; }