:root{--bg:#f7f6f3;--fg:#1d2327;--muted:#5f6b73;--line:#dcd9d2;--accent:#0b6e5f;--accent-fg:#fff;--card:#fff;--warn:#8a4b00}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.6 "Sarabun","Noto Sans Thai","Thonburi",system-ui,sans-serif}
main{max-width:960px;margin:0 auto;padding:24px 16px 48px}
a{color:var(--accent)}
nav.top{display:flex;flex-wrap:wrap;gap:16px;align-items:center;padding:12px 16px;background:var(--card);border-bottom:1px solid var(--line)}
nav.top .brand{font-weight:700;text-decoration:none;color:var(--fg)}
nav.top .spacer{flex:1}
nav.top .who{color:var(--muted);font-size:14px}
form.inline{display:inline;margin:0}
button.link{background:none;border:0;color:var(--accent);cursor:pointer;font:inherit;padding:0;text-decoration:underline}
h1{font-size:26px;line-height:1.3;margin:8px 0 16px}
h2{font-size:19px;margin:28px 0 8px;color:var(--muted)}
.search{display:flex;gap:8px;margin:8px 0 24px}
.search input{flex:1;min-width:0;padding:10px 12px;font:inherit;border:1px solid var(--line);border-radius:8px;background:var(--card)}
.btn{display:inline-block;padding:10px 16px;border-radius:8px;background:var(--accent);color:var(--accent-fg);text-decoration:none;border:0;font:inherit;cursor:pointer}
.btn.secondary{background:var(--card);color:var(--accent);border:1px solid var(--accent)}
.actions{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}
ul.docs{list-style:none;padding:0;margin:0}
ul.docs li{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:10px 14px;margin:6px 0}
ul.docs a{text-decoration:none;color:var(--fg);display:block}
ul.docs .code{font-family:ui-monospace,Menlo,monospace;color:var(--accent);margin-right:8px}
ul.docs .meta{display:block;color:var(--muted);font-size:14px}
dl.meta{display:grid;grid-template-columns:max-content 1fr;gap:4px 16px;background:var(--card);border:1px solid var(--line);border-radius:8px;padding:14px}
dl.meta dt{color:var(--muted)}
dl.meta dd{margin:0}
.note{background:#fff8e6;border:1px solid #f0d9a8;color:var(--warn);border-radius:8px;padding:10px 14px;font-size:15px}
.notice{color:var(--muted)}
.error{background:#fdecea;border:1px solid #f5c2bd;border-radius:8px;padding:10px 14px}
.login{max-width:440px;margin:12vh auto;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:32px;text-align:center}
.table-wrap{overflow-x:auto;background:var(--card);border:1px solid var(--line);border-radius:8px}
table{border-collapse:collapse;width:100%;font-size:14px}
th,td{text-align:left;padding:6px 10px;border-bottom:1px solid var(--line);vertical-align:top}
td.mono{font-family:ui-monospace,Menlo,monospace;font-size:13px}
td.nowrap{white-space:nowrap}
form.filters{display:flex;flex-wrap:wrap;gap:8px;align-items:end;margin-bottom:16px}
form.filters label{display:flex;flex-direction:column;font-size:13px;color:var(--muted)}
form.filters input,form.filters select{padding:6px 8px;font:inherit;border:1px solid var(--line);border-radius:6px}
.foot{text-align:center;color:var(--muted);font-size:13px;padding:24px 16px}
@media (prefers-color-scheme:dark){:root{--bg:#15191c;--fg:#e8e6e1;--muted:#9aa5ad;--line:#2c3439;--card:#1d2327;--accent:#4fc1ad;--accent-fg:#0b1714;--warn:#f0c27a}
.note{background:#2a2414;border-color:#5a4a22}.error{background:#2e1b19;border-color:#5d302b}}