.adm{display:flex;min-height:100vh}
.side{width:220px;background:var(--navy);border-right:1px solid var(--line);color:#fff;padding:16px 10px;flex:none;position:sticky;top:0;height:100vh}
.side .brand{display:flex;gap:10px;align-items:center;padding:4px 8px 18px;font-weight:700}
.side button{display:flex;width:100%;gap:10px;align-items:center;border:0;background:none;color:#c9d3f0;padding:10px 12px;border-radius:10px;cursor:pointer;text-align:left;margin-bottom:2px}
.side button.on{background:rgba(255,255,255,.12);color:#fff;font-weight:600}
.side .cnt{margin-left:auto;background:var(--brand);color:#fff;border-radius:10px;padding:0 7px;font-size:12px}
.main{flex:1;padding:24px;min-width:0}
.main h1{margin-bottom:16px}
.kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;margin-bottom:16px}
.grid2{display:grid;grid-template-columns:2fr 1fr;gap:12px}
.tbl{width:100%;border-collapse:collapse;font-size:14px;background:var(--card)}
.tbl th{text-align:left;font-weight:600;color:var(--muted);font-size:12.5px;padding:10px;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl td{padding:10px;border-bottom:1px solid var(--line);vertical-align:top}
.tbl tr.click{cursor:pointer}.tbl tr.click:hover td{background:var(--card2)}
.tblwrap{overflow:auto;border-radius:var(--r);box-shadow:var(--shadow);background:var(--card);border:1px solid var(--line)}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px;align-items:center}
.filters .input{width:auto;min-height:40px}
.bars{display:flex;align-items:flex-end;gap:4px;height:150px}
.bars div{flex:1;max-width:26px;background:var(--brand);border-radius:3px 3px 0 0;min-height:2px}
.mtop,.side-bg{display:none}
.hamb{position:relative;border:1px solid var(--line);background:var(--card2);color:var(--ink);width:42px;height:42px;border-radius:12px;font-size:22px;cursor:pointer;flex:none;display:flex;align-items:center;justify-content:center}
@media(max-width:820px){
  .mtop{display:flex;align-items:center;gap:10px;position:sticky;top:0;z-index:150;background:var(--navy);padding:8px 12px;border-bottom:1px solid var(--line);box-shadow:0 1px 0 rgba(var(--brand-rgb),.35)}
  .mtop .brandtext{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .adm{display:block}
  .side{position:fixed;top:0;left:0;bottom:0;width:270px;max-width:82vw;height:100vh;z-index:300;transform:translateX(-105%);transition:transform .22s ease;overflow-y:auto;box-shadow:6px 0 24px rgba(0,0,0,.6);border-right:1px solid var(--line);padding-top:20px}
  .side.open{transform:none}
  .side button{padding:13px 12px;font-size:15px}
  .side-bg{display:block;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:250;opacity:0;pointer-events:none;transition:opacity .2s}
  .side-bg.open{opacity:1;pointer-events:auto}
  .main{padding:14px}
  .main h1{font-size:19px}
  .kpis{grid-template-columns:repeat(2,1fr)}
  .grid2{grid-template-columns:1fr}
  .filters .input{width:100%}
}

/* เอกสารพิมพ์ */
#printOverlay{position:fixed;inset:0;background:#e9edf5;color:#111;z-index:9999;overflow:auto;font-family:inherit}
#printOverlay .pbar{position:sticky;top:0;background:#fff;padding:10px 16px;display:flex;gap:10px;align-items:center;flex-wrap:wrap;border-bottom:1px solid #ccd}
#printOverlay .pdoc{background:#fff;color:#111;max-width:1000px;margin:16px auto;padding:28px 32px;box-shadow:0 2px 12px rgba(0,0,0,.2)}
.phead{border-bottom:3px solid #ffb300;padding-bottom:10px;margin-bottom:14px}
.ptitle{font-size:22px;font-weight:800;color:#0a1a4a}.psub{font-size:12px;color:#555}
.ptbl,.pkv{width:100%;border-collapse:collapse;font-size:12.5px}
.ptbl th,.ptbl td,.pkv th,.pkv td{border:1px solid #bbb;padding:6px 8px;text-align:left;vertical-align:top;color:#111}
.ptbl th,.pkv th{background:#f1f3f9}.pkv th{width:28%;font-size:13px}.pkv td{font-size:14px}
.ptbl .t{font-size:11px;color:#555}
.pphotos{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.pphotos img{height:150px;border:1px solid #bbb;border-radius:6px}
.psign{display:flex;justify-content:space-between;margin-top:40px;font-size:13px}
@media print{
  body>*:not(#printOverlay){display:none!important}
  #printOverlay{position:static;background:#fff;overflow:visible}
  #printOverlay .pdoc{box-shadow:none;margin:0;padding:0;max-width:none}
  .noprint{display:none!important}
  @page{size:A4;margin:12mm}
  .ptbl tr{page-break-inside:avoid}
}
