:root { --bg:#fafaf7; --card:#fff; --ink:#1d1d1b; --muted:#66655f; --line:#dedcd3; --accent:#d9480f; --good:#2b8a3e; --bad:#c92a2a; }
@media (prefers-color-scheme: dark) { :root { --bg:#161614; --card:#1f1f1c; --ink:#ecebe6; --muted:#a3a29b; --line:#3a3934; --accent:#ff8a4c; --good:#69db7c; --bad:#ff8787; } }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font:17px/1.75 system-ui, "Noto Sans Thai", sans-serif; }
main { max-width:720px; margin:0 auto; padding:24px 16px 48px; }
a { color:var(--accent); }
.crumb { font-size:.85rem; color:var(--muted); margin:0 0 12px; }
h1 { font-size:1.6rem; line-height:1.35; margin:0 0 8px; }
h2 { font-size:1.2rem; line-height:1.4; margin:32px 0 8px; }
.meta { color:var(--muted); font-size:.85rem; margin:0 0 24px; }
.lead { font-size:1.05rem; }
.table-wrap { overflow-x:auto; margin:12px 0; }
table { border-collapse:collapse; width:100%; font-size:.95rem; }
th, td { padding:8px 10px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
td.num, th.num { text-align:right; white-space:nowrap; }
tr.total td { font-weight:600; }
.box { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:16px 20px; margin:16px 0; }
.cta { display:block; text-align:center; background:var(--accent); color:#fff; text-decoration:none; padding:14px; border-radius:10px; font-weight:600; margin:24px 0; }
.fine { color:var(--muted); font-size:.85rem; }
.list { list-style:none; padding:0; margin:0; }
.list li { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:16px 20px; margin-bottom:12px; }
.list li a { font-weight:600; text-decoration:none; }
.list li p { margin:4px 0 0; color:var(--muted); font-size:.95rem; }
@media (max-width:480px) { table { font-size:.88rem; } th, td { padding:8px 6px; } }