@import"https://fonts.googleapis.com/css2?family=Sarabun:wght@400;500;600;700&display=swap";:root{--navy:#001D58;--pink:#EC186E;--bg:#F4F4F6;--line:#E5E7EB;--text:#1F2937;--muted:#6B7280;--sidebar:248px;--radius:9px}*{box-sizing:border-box}html,body,button,input,select,textarea,table{font-family:Sarabun,sans-serif;font-size:15px}body{margin:0;background:var(--bg);color:var(--text)}button,a{cursor:pointer}.primary{border:0;background:var(--navy);color:#fff;border-radius:var(--radius);padding:9px 14px;font-weight:600}.loginPage{position:fixed;inset:0;background:var(--navy);display:grid;place-items:center;padding:18px}.loginCard{width:430px;max-width:100%;background:#fff;border-radius:14px;padding:26px;box-shadow:0 22px 60px #0004}.loginBrand{display:flex;align-items:center;gap:11px;margin-bottom:16px}.loginBrand img{width:48px}.loginBrand h1{margin:0;color:var(--navy);font-size:20px}.loginTabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:var(--bg);padding:4px;border-radius:var(--radius);margin-bottom:13px}.loginTabs button{border:0;background:transparent;border-radius:7px;min-height:40px;font-weight:600;color:var(--muted)}.loginTabs button.active{background:var(--navy);color:#fff}.loginPane[hidden]{display:none}.googleBox{display:flex;justify-content:center;min-height:44px}label{display:block;font-size:12px;font-weight:600;margin:9px 0 4px}label b,.required{color:var(--pink)}input,select{width:100%;height:40px;border:1px solid var(--line);border-radius:var(--radius);padding:0 10px;background:#fff}input::placeholder{color:#c4cbd4}.loginPane .primary{width:100%;margin-top:10px}#loginError{color:#b91c1c;font-size:12px;min-height:18px;margin:9px 0 0}aside{position:fixed;inset:0 auto 0 0;width:var(--sidebar);background:var(--navy);padding:10px 8px;display:flex;flex-direction:column;z-index:20;transition:width .2s}.brand{border:0;background:transparent;color:#fff;display:flex;align-items:center;gap:10px;text-align:left;font-weight:700;min-height:58px;padding:5px 8px}.brand img{width:40px;flex:0 0 auto}.brand span{white-space:nowrap}.navList{display:flex;flex-direction:column;gap:2px;overflow:auto;min-height:0}.navItem{display:flex;align-items:center;width:100%;min-height:42px;padding:9px 12px;border-radius:var(--radius);color:#d7e0f0;text-decoration:none;line-height:1.2;white-space:nowrap}.navItem:hover{background:#ffffff12;color:#fff}.navItem.active{background:var(--pink);color:#fff;font-weight:600}.sideBottom{margin-top:auto;display:flex;flex-direction:column;gap:2px}.sideBottom button{border:0;background:transparent;text-align:left}.collapsed{--sidebar:64px}.collapsed .brand span,.collapsed .navItem span{display:none}.collapsed .brand,.collapsed .navItem{justify-content:center;padding-inline:0}main{margin-left:var(--sidebar);min-height:100vh;transition:margin-left .2s}.topbar{height:66px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 20px}.topbar h1{margin:0;color:var(--navy);font-size:21px}.mobileMenu{display:none}.content{padding:16px}.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.card,.panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius)}.card{padding:14px}.card span{color:var(--muted);font-size:12px}.card strong{display:block;color:var(--navy);font-size:25px}.panel{margin-top:12px;overflow:hidden}.panelHead{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line)}.panelHead h2{margin:0;color:var(--navy);font-size:16px}.tableWrap{overflow:auto}table{width:100%;border-collapse:collapse;table-layout:fixed;min-width:720px}th,td{padding:10px;border-top:1px solid #F0F1F3;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th{background:#f8f9fb;color:var(--muted);font-size:12px}.account{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:14px}.avatar{width:52px;height:52px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;overflow:hidden}.avatar img{width:100%;height:100%;object-fit:cover}.account h2{margin:0;color:var(--navy);font-size:17px}.muted{color:var(--muted);font-size:12px}.formCard{padding:14px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px}.full{grid-column:1/-1}.adminTabs{display:flex;gap:7px;flex-wrap:wrap}.adminTabs a{color:var(--navy);background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:9px 12px;text-decoration:none}.backdrop{display:none}@media(max-width:1023px){:root{--sidebar:64px}.brand span,.navItem span{display:none}.brand,.navItem{justify-content:center;padding-inline:0}.kpis{grid-template-columns:1fr 1fr}}@media(max-width:767px){:root{--sidebar:0px}aside{width:270px;transform:translate(-100%);box-shadow:0 0 30px #0005}.menuOpen aside{transform:translate(0)}main{margin-left:0}.mobileMenu{display:grid;place-items:center;width:44px;height:44px;border:0;background:#fff;color:var(--navy);font-size:22px;margin-right:8px}.menuOpen .backdrop{display:block;position:fixed;inset:0;background:#001d5866;z-index:15}.content{padding:10px}.grid2,.kpis{grid-template-columns:1fr}.full{grid-column:auto}}.profilePage{max-width:1180px}.profileTabs{display:flex;gap:4px;margin-top:12px;border-bottom:1px solid var(--line);overflow:auto}.profileTabs button{border:0;background:transparent;color:var(--muted);padding:10px 13px;white-space:nowrap}.profileTabs button.active{color:var(--navy);border-bottom:3px solid var(--pink);font-weight:700}.profileBody{margin-top:0;border-top:0;border-radius:0 0 var(--radius) var(--radius)}.profileActions{display:flex;justify-content:flex-end;margin-top:12px}.secondary{border:1px solid var(--line);background:#fff;color:var(--navy);border-radius:var(--radius);padding:9px 14px}.formMessage{min-height:18px;margin:6px 0 0;color:#15803d;font-size:12px}.errorText{color:#b91c1c}.matrix{display:grid;grid-template-columns:minmax(180px,1fr) repeat(3,100px);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.matrix>div,.matrix>.check{min-height:42px;padding:9px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);margin:0}.matrixHead{background:#f8f9fb;color:var(--muted);font-size:12px;font-weight:700}.check{display:grid;place-items:center}.check input{width:18px;height:18px}.securityList{display:grid;gap:12px}.securityList>div{display:flex;justify-content:space-between;padding-bottom:10px;border-bottom:1px solid var(--line)}.securityList span{color:var(--muted)}input[readonly]{background:#f8f9fb;color:#6b7280}@media(max-width:767px){.profileTabs{scrollbar-width:none}.matrix{grid-template-columns:minmax(145px,1fr) repeat(3,64px);min-width:390px}.profileBody{overflow:auto}.matrix>div,.matrix>.check{padding:8px 5px;font-size:12px}.securityList>div{display:grid;gap:3px}}