:root{--bg:#f5f7fb;--ink:#172033;--muted:#657086;--line:#dfe5ef;--primary:#1d4ed8;--danger:#b91c1c;--card:#fff}
*{box-sizing:border-box}body{margin:0;font-family:Tahoma,"Noto Sans Thai",Arial,sans-serif;background:var(--bg);color:var(--ink)}
a{color:var(--primary);text-decoration:none}.topbar{height:64px;background:#101828;color:#fff;display:flex;align-items:center;padding:0 24px;gap:28px;position:sticky;top:0;z-index:5}.brand{font-weight:800;font-size:20px}.brand span{font-size:12px;font-weight:400;color:#aeb7c8;margin-left:6px}.topbar nav{display:flex;gap:16px;flex:1}.topbar nav a{color:#d8deea;font-size:14px}.topbar nav a:hover{color:#fff}.linkbtn{border:0;background:none;color:#fff;cursor:pointer}
.container{max-width:1280px;margin:26px auto;padding:0 20px}.pagehead{display:flex;justify-content:space-between;align-items:end;margin-bottom:18px}.pagehead h1{margin:0 0 5px}.pagehead p{margin:0;color:var(--muted)}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;margin-bottom:18px;box-shadow:0 4px 14px rgba(16,24,40,.04)}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.kpi span{display:block;color:var(--muted);font-size:14px}.kpi strong{font-size:28px;display:block;margin-top:8px}
button,.primary,.secondary{border-radius:9px;padding:10px 14px;border:0;font-weight:700;cursor:pointer;display:inline-block}.primary{background:var(--primary);color:#fff}.secondary{background:#eef2f7;color:#243047}.danger{background:var(--danger);color:#fff}.danger-lite{background:#fee2e2;color:#991b1b}.wide{width:100%}.actions{display:flex;gap:10px;margin:16px 0}
table{width:100%;border-collapse:collapse;font-size:14px}th,td{padding:10px 9px;border-bottom:1px solid var(--line);vertical-align:top}th{text-align:left;background:#f8fafc}.num{text-align:right;font-variant-numeric:tabular-nums}.total{font-weight:800;background:#f8fafc}
input,select,textarea{width:100%;padding:9px 10px;border:1px solid #cfd7e4;border-radius:8px;background:#fff;font:inherit}textarea{min-height:72px}label{display:block;font-size:13px;font-weight:700;color:#344054}label input,label select,label textarea{margin-top:6px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:14px 0}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:14px 0}.report-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.badge{display:inline-block;padding:4px 8px;border-radius:999px;font-size:12px}.badge.posted{background:#dcfce7;color:#166534}.badge.cancelled{background:#fee2e2;color:#991b1b}.alert{background:#fff1f2;color:#9f1239;border:1px solid #fecdd3;padding:12px;border-radius:9px;margin:12px 0}
.login-shell{min-height:100vh;display:grid;place-items:center}.login-card{width:min(420px,92vw);background:#fff;padding:32px;border-radius:16px;border:1px solid var(--line);box-shadow:0 15px 40px rgba(16,24,40,.12)}.login-card h1{margin:0}.login-card label{margin-top:14px}
footer{text-align:center;color:#98a2b3;font-size:12px;padding:30px}
@media(max-width:850px){.topbar{height:auto;flex-wrap:wrap;padding:14px}.topbar nav{overflow:auto}.cards,.grid3,.grid2,.report-grid{grid-template-columns:1fr}.container{padding:0 10px}.entry{display:block;overflow:auto}}
@media print{.topbar,footer,.actions,button,form{display:none!important}.container{max-width:none;margin:0}.card{box-shadow:none;border:0}.voucher{font-size:14px}}