@font-face{font-family:SarabunPP;src:local("TH SarabunPSK"),local("TH Sarabun New")}*{box-sizing:border-box}:root{--nav:#093f58;--primary:#087da7;--bg:#f3f7fa;--line:#d9e5ec;--text:#173247;--muted:#6a8190;--danger:#c74747;--shadow:0 12px 35px rgba(27,65,87,.08)}body{margin:0;background:var(--bg);color:var(--text);font-family:Tahoma,"Noto Sans Thai",sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}.landing{min-height:100vh;background:linear-gradient(135deg,#073f58,#087da7 60%,#2b9ac1);padding:32px;display:grid;place-items:center}.landing-shell{width:min(1080px,100%)}.landing-brand{color:#fff;margin-bottom:26px}.landing-brand b{font-size:40px;display:block}.landing-brand span{opacity:.8}.choice-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:20px}.choice-card,.login-card{background:#fff;border-radius:24px;padding:32px;box-shadow:0 24px 60px #00283c55}.choice-card.staff{background:linear-gradient(145deg,#fff,#edf8fc)}.choice-icon{width:56px;height:56px;border-radius:17px;background:#dff3fa;color:var(--primary);display:grid;place-items:center;font-size:27px}.choice-card h1{margin:20px 0 8px}.choice-card p{color:var(--muted);min-height:44px}.btn{border:0;border-radius:10px;padding:11px 18px;background:#e8f1f5;color:#24485d;font-weight:bold}.btn.primary{background:var(--primary);color:#fff}.btn.danger{background:#fff0f0;color:var(--danger)}.btn.ghost{background:transparent}.btn:disabled{opacity:.5;cursor:not-allowed}.login-card{max-width:470px;margin:auto}.field{display:flex;flex-direction:column;gap:7px;margin:13px 0}.field span{font-weight:bold;font-size:14px}.field input,.field select,.field textarea,.context-select{border:1px solid #c9d9e2;border-radius:10px;padding:11px;background:#fff;min-width:0}.field textarea{min-height:86px;resize:vertical}.login-actions{display:flex;gap:10px;margin-top:20px}.error{padding:11px;border-radius:9px;background:#fff0f0;color:#a42d2d}.shell{min-height:100vh;display:grid;grid-template-columns:260px 1fr}.sidebar{background:var(--nav);color:#fff;padding:24px 16px;position:sticky;top:0;height:100vh;overflow:auto}.brand{padding:5px 12px 25px}.brand b{font-size:28px;display:block}.brand span{font-size:12px;opacity:.72}.nav{display:flex;flex-direction:column;gap:4px}.nav button{border:0;background:transparent;color:#d7e9f1;text-align:left;padding:12px 14px;border-radius:10px}.nav button:hover,.nav button.active{background:#ffffff18;color:#fff}.nav .section{font-size:11px;text-transform:uppercase;opacity:.55;padding:17px 14px 4px}.online{margin-top:22px;padding:10px 12px;background:#0e8a6726;border-radius:10px;color:#a9f1da;font-size:12px}.main{min-width:0}.topbar{height:76px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:14px;padding:0 28px;position:sticky;top:0;z-index:4}.menu-toggle{display:none}.context-select{max-width:420px}.userbox{margin-left:auto;text-align:right}.userbox b{display:block}.userbox span{font-size:12px;color:var(--muted)}.content{padding:26px 30px 50px;max-width:1540px;margin:auto}.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:20px}.page-head h1{margin:0;font-size:30px}.page-head p{margin:5px 0 0;color:var(--muted)}.card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px;box-shadow:var(--shadow);margin-bottom:18px}.cards{display:grid;grid-template-columns:repeat(4,minmax(140px,1fr));gap:14px}.metric{position:relative;overflow:hidden}.metric b{font-size:31px;color:var(--primary);display:block}.metric span{color:var(--muted)}.metric:after{content:"";position:absolute;width:70px;height:70px;border-radius:50%;background:#0b84ae10;right:-16px;top:-16px}.layout2{display:grid;grid-template-columns:1.35fr 1fr;gap:18px}.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:16px}.toolbar .search{min-width:240px;flex:1;border:1px solid #cbdbe3;border-radius:10px;padding:10px}.table-wrap{overflow:auto}.data-table{width:100%;border-collapse:collapse;white-space:nowrap}.data-table th,.data-table td{padding:11px;border-bottom:1px solid #e4edf2;text-align:left}.data-table th{background:#edf5f8;color:#31556a}.data-table tr:hover td{background:#f8fbfc}.badge{display:inline-flex;border-radius:999px;padding:5px 10px;background:#e3f3fa;color:#07698e;font-size:12px}.badge.ok{background:#e7f7f0;color:#16734f}.badge.warn{background:#fff4da;color:#8b6513}.badge.danger{background:#ffeded;color:#a43a3a}.form-grid{display:grid;grid-template-columns:repeat(3,minmax(180px,1fr));gap:0 16px}.form-grid .wide{grid-column:span 2}.empty{text-align:center;color:var(--muted);padding:42px}.bar-chart{height:250px;display:flex;align-items:flex-end;gap:14px;padding:20px 8px 28px}.bar-group{flex:1;display:flex;justify-content:center;align-items:flex-end;gap:4px;height:100%;position:relative}.bar{min-width:19px;max-width:34px;border-radius:7px 7px 0 0;background:#1687b1;position:relative}.bar.female{background:#ee7f9c}.bar-group label{position:absolute;bottom:-25px;font-size:12px}.bar i{position:absolute;top:-20px;width:100%;text-align:center;font-size:11px;font-style:normal}.report-page{position:relative;background:#fff;width:210mm;min-height:297mm;margin:16px auto;padding:14mm;border:1px solid #ccd8de;box-shadow:0 8px 30px #1c465722;font-family:SarabunPP,"TH Sarabun New",serif;font-size:20px;color:#111}.report-page h1,.report-page h2{text-align:center;margin:7px}.report-page table{width:100%;border-collapse:collapse}.report-page th,.report-page td{border:1px solid #222;padding:4px}.watermark{position:absolute;font-size:90px;color:#d85d5d18;transform:rotate(-35deg);margin:100mm 35mm}.toast{position:fixed;right:24px;bottom:24px;background:#173f54;color:#fff;padding:13px 18px;border-radius:10px;z-index:20;opacity:0;transform:translateY(15px);transition:.2s;pointer-events:none}.toast.show{opacity:1;transform:none}.toast.bad{background:#a73f3f}.mobile-overlay{display:none}@media(max-width:960px){.shell{grid-template-columns:1fr}.sidebar{position:fixed;left:-275px;z-index:10;width:260px;transition:.2s}.sidebar.open{left:0}.menu-toggle{display:block}.content{padding:20px}.cards{grid-template-columns:repeat(2,1fr)}.layout2{grid-template-columns:1fr}.form-grid{grid-template-columns:repeat(2,1fr)}.choice-grid{grid-template-columns:1fr}.mobile-overlay.open{display:block;position:fixed;inset:0;background:#00182288;z-index:9}}@media(max-width:600px){.landing{padding:16px}.landing-brand b{font-size:31px}.choice-card{padding:24px}.topbar{padding:0 14px}.context-select{width:43%;font-size:12px}.userbox b{font-size:12px}.userbox span{display:none}.content{padding:16px 12px}.cards{grid-template-columns:1fr 1fr;gap:9px}.card{padding:15px}.form-grid{grid-template-columns:1fr}.form-grid .wide{grid-column:auto}.page-head{align-items:flex-start;flex-direction:column}.report-page{width:100%;min-height:auto;padding:20px;overflow:auto}.bar-chart{gap:5px}}@page{size:A4 portrait;margin:10mm}@media print{body{background:#fff}.sidebar,.topbar,.page-head,.no-print,.toast{display:none!important}.shell{display:block}.content{padding:0}.card{box-shadow:none;border:0}.report-page{width:190mm;min-height:277mm;margin:0;padding:0;border:0;box-shadow:none;page-break-after:always}.report-page:last-child{page-break-after:auto}}