/* style.css — ระบบงบประมาณ กองสำรวจและแผนที่ · ธีมขาว-ฟ้า กรมเจ้าท่า
   โทเคนสีจากสกิล web-look-and-feel ข้อ 1.0 (วัดผ่าน WCAG AA แล้ว) — ห้ามใช้สีนอกชุดนี้เป็นตัวหนังสือ */
:root{
  --bg0:#ffffff; --bg1:#f2f7fb; --bg-dark:#0f2b46; --brand-bg:#1f4e79;
  --ink:#10243a; --ink2:#35506b; --brand:#1f4e79; --accent-ink:#0b6f8c;
  --ok:#1a6b3c; --warn:#8a5300; --bad:#b3261e;
  --on-dark:#ffffff; --on-dark2:#cfe6f5; --accent:#22c0d4;
  --line:#c9d8e6; --radius:10px;
  --font:"TH Sarabun New","Sarabun","Noto Sans Thai",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{font-size:18px}
body{margin:0;background:var(--bg0);color:var(--ink);font-family:var(--font);line-height:1.45}
a{color:var(--brand)}
.topbar{background:var(--brand-bg);color:var(--on-dark)}
.topbar-in{max-width:1200px;margin:0 auto;padding:10px 16px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:12px;color:var(--on-dark);text-decoration:none;font-size:24px;font-weight:700}
.brand img{width:48px;height:48px;border-radius:50%;background:#fff;object-fit:contain}
.brand small{display:block;font-size:16px;font-weight:400;color:var(--on-dark2)}
.btn{display:inline-block;border:1px solid var(--line);border-radius:var(--radius);padding:8px 16px;background:var(--bg0);color:var(--brand);text-decoration:none;font-size:18px;cursor:pointer;min-height:44px}
.btn.primary{background:var(--brand-bg);color:var(--on-dark);border-color:var(--brand-bg)}
main{max-width:1200px;margin:0 auto;padding:16px}
.hero{background:var(--bg1);border:1px solid var(--line);border-radius:14px;padding:24px;margin:16px 0}
.hero h1{margin:0 0 8px;color:var(--brand);font-size:30px}
.hero p{margin:6px 0;color:var(--ink2);font-size:19px}
.status{font-size:17px;color:var(--ink2)}
.status b.ok{color:var(--ok)}.status b.warn{color:var(--warn)}
.doc{max-width:760px;margin:0 auto;padding:8px 16px 80px}
.doc h1{color:var(--brand);font-size:28px}
.doc h2{margin:26px 0 6px;color:var(--brand);font-size:22px}
.doc li{margin:6px 0}
.asof{font-size:16px;color:var(--ink2)}
footer{max-width:1200px;margin:24px auto;padding:12px 16px;color:var(--ink2);font-size:15px;border-top:1px solid var(--line)}
#gbtn{min-height:44px;margin:12px 0}