:root {
  --bg:#f7f7f5; --panel:#fff; --text:#1d1d1b; --muted:#6b6b66; --line:#e3e3de; --accent:#c2410c; --accent-soft:#fdeee5;
  --ok:#15803d; --ok-soft:#e8f5ec; --warn:#a16207; --warn-soft:#fdf6e3; --bad:#b91c1c; --bad-soft:#fdecec;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg:#161615; --panel:#20201e; --text:#ecece8; --muted:#a3a39c; --line:#33332f; --accent:#fb923c; --accent-soft:#3a2518;
    --ok:#4ade80; --ok-soft:#173222; --warn:#facc15; --warn-soft:#332b10; --bad:#f87171; --bad-soft:#3a1c1c;
  }
}
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, -apple-system, "Sukhumvit Set", "Noto Sans Thai", sans-serif; background:var(--bg); color:var(--text); font-size:15px; }
a { color:var(--accent); }
header.top { padding:12px 16px; border-bottom:1px solid var(--line); background:var(--panel); display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
header.top h1 { font-size:18px; margin:0; }
header.top .crumbs { color:var(--muted); font-size:14px; }
header.top .crumbs a { color:inherit; text-decoration:none; }
.wrap { max-width:1200px; margin:0 auto; padding:16px; }
.card { background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:16px; margin-bottom:16px; }
.card h2 { font-size:16px; margin:0 0 12px; }
.muted { color:var(--muted); }
.small { font-size:13px; }
.row { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.grid2 { display:grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap:12px; }
label.f { display:flex; flex-direction:column; gap:4px; font-size:13px; color:var(--muted); }
label.f > span b { color:var(--bad); }
input, select, textarea, button { font:inherit; padding:8px 10px; border:1px solid var(--line); border-radius:8px; background:var(--bg); color:var(--text); }
input[type=checkbox], input[type=radio] { padding:0; width:auto; }
textarea { min-height:90px; width:100%; }
button { background:var(--accent); color:#fff; border:none; cursor:pointer; white-space:nowrap; }
button.ghost { background:transparent; color:var(--text); border:1px solid var(--line); }
button.danger { background:transparent; color:var(--bad); border:1px solid var(--line); }
button.link { background:none; border:none; color:var(--accent); padding:0; }
button:disabled { opacity:.5; cursor:default; }
.tabs { display:flex; gap:4px; border-bottom:1px solid var(--line); margin-bottom:16px; overflow-x:auto; }
.tabs a { padding:10px 14px; text-decoration:none; color:var(--muted); border-bottom:2px solid transparent; white-space:nowrap; }
.tabs a.on { color:var(--text); border-bottom-color:var(--accent); font-weight:600; }
table.t { width:100%; border-collapse:collapse; font-size:14px; }
table.t th, table.t td { text-align:left; padding:8px 6px; border-bottom:1px solid var(--line); vertical-align:top; }
table.t th { font-size:12px; color:var(--muted); font-weight:600; position:sticky; top:0; background:var(--panel); }
table.t td.n, table.t th.n { text-align:right; font-variant-numeric: tabular-nums; white-space:nowrap; }
table.t tr.heading td { font-weight:600; background:var(--bg); }
table.t tr.dim td { color:var(--muted); }
.tablewrap { overflow:auto; max-height:70vh; border:1px solid var(--line); border-radius:8px; }
.badge { display:inline-block; font-size:12px; padding:2px 8px; border-radius:999px; white-space:nowrap; }
.b-ok { background:var(--ok-soft); color:var(--ok); }
.b-check { background:var(--warn-soft); color:var(--warn); }
.b-none { background:var(--bad-soft); color:var(--bad); }
.b-plain { background:var(--bg); color:var(--muted); border:1px solid var(--line); }
.stats { display:grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap:12px; }
.stat { border:1px solid var(--line); border-radius:10px; padding:12px; background:var(--panel); }
.stat .k { font-size:12px; color:var(--muted); }
.stat .v { font-size:22px; font-weight:700; font-variant-numeric: tabular-nums; margin-top:4px; }
.stat .s { font-size:12px; color:var(--muted); margin-top:4px; }
.note { padding:10px 12px; border-radius:8px; background:var(--accent-soft); font-size:14px; }
.err { padding:10px 12px; border-radius:8px; background:var(--bad-soft); color:var(--bad); font-size:14px; }
.list-item { display:block; padding:14px 16px; border-bottom:1px solid var(--line); text-decoration:none; color:inherit; }
.list-item:hover { background:var(--bg); }
.list-item .t1 { font-weight:600; }
.mini-map { height:300px; border-radius:8px; border:1px solid var(--line); }
.chip { display:inline-flex; gap:6px; align-items:center; padding:4px 10px; border:1px solid var(--line); border-radius:999px; font-size:13px; background:var(--bg); }
.quote-low { color:var(--ok); font-weight:700; }
details summary { cursor:pointer; }
.hide { display:none !important; }
@media (max-width: 700px) { .wrap { padding:12px; } table.t { font-size:13px; } }
