*{box-sizing:border-box}body{margin:0;font-family:Arial,"Noto Sans Thai",sans-serif;background:#f5f7fa;color:#172033}aside{position:fixed;width:255px;height:100vh;background:#122238;color:white;padding:28px 20px;display:flex;flex-direction:column}aside h2{margin:0 0 4px;font-size:30px}aside>small{opacity:.7}nav{margin-top:32px}nav a{display:block;color:#dce6f3;text-decoration:none;padding:12px;border-radius:8px;margin:4px 0}nav a:hover{background:#213955}.account{margin-top:auto;border-top:1px solid #32445c;padding-top:18px}.account b,.account small{display:block}.account small{opacity:.7;margin:4px 0 10px}.account a{color:#bcd2f0}main{margin-left:255px;padding:38px;max-width:1400px}.authmain{margin:0;max-width:none;min-height:100vh;display:grid;place-items:center;background:#edf2f8}h1{margin:0 0 8px}h2{margin-top:0}.muted{color:#697586}.row{display:flex;justify-content:space-between;align-items:center;gap:20px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:28px 0}.cards.five{grid-template-columns:repeat(5,1fr)}.card,.panel,section,.advanced{background:white;border:1px solid #e1e6ed;border-radius:12px;padding:22px}.card b{display:block;font-size:34px}.card span,.summary span{color:#667085;font-size:14px}section{margin:20px 0}table{width:100%;border-collapse:collapse;background:white}th,td{text-align:left;padding:13px;border-bottom:1px solid #e8ebef;vertical-align:top}th{background:#eef2f7;font-size:13px}.tablewrap{border:1px solid #e1e6ed;border-radius:12px;overflow:hidden}a{color:#175cd3}.button,button{display:inline-block;background:#175cd3;color:white;border:0;border-radius:8px;padding:11px 18px;text-decoration:none;cursor:pointer;font-weight:600}.secondary{display:inline-block;border:1px solid #cbd3dd;border-radius:8px;padding:10px 18px;text-decoration:none;color:#344054;background:white}.search{display:flex;gap:10px;margin:20px 0}.search input{flex:1}.form{max-width:860px;background:white;padding:26px;border:1px solid #e1e6ed;border-radius:12px}.form.plain{border:0;padding:0}.form label,.inlineform label,.advanced label{display:block;font-weight:600}.form input,.form select,.form textarea,.search input,.inlineform input,.inlineform select,.inlineform textarea,.advanced input,.advanced select{width:100%;padding:11px;border:1px solid #cbd3dd;border-radius:7px;margin-top:7px;background:white}.form>label{margin-bottom:18px}.grid2,.advanced{display:grid;grid-template-columns:1fr 1fr;gap:18px}.grid2{margin-bottom:18px}.advanced{margin:22px 0}.advanced .span2{grid-column:span 2}.actions{display:flex;gap:10px;align-items:end}.badge,.count{display:inline-block;background:#eef4ff;color:#344f86;border-radius:999px;padding:5px 10px;font-size:13px}.summary{display:grid;grid-template-columns:repeat(5,1fr);gap:20px;margin:22px 0}.summary b{display:block;margin-top:5px}.bodytext{line-height:1.75;white-space:pre-wrap}.eyebrow{font-size:12px;color:#667085;letter-spacing:1.4px;margin:0 0 5px}.empty{text-align:center;color:#98a2b3;padding:25px}details{margin-top:16px;border-top:1px solid #e8ebef;padding-top:14px}summary{cursor:pointer;color:#175cd3;font-weight:600}.inlineform{margin-top:15px;max-width:760px;display:grid;gap:14px}.inlineform.grid2{grid-template-columns:1fr 1fr}.inlineform button{width:max-content}.timeline{border-left:2px solid #d0d9e7;margin-left:8px;padding-left:25px}.event{position:relative;padding:0 0 24px}.event:before{content:"";position:absolute;width:10px;height:10px;border-radius:50%;background:#175cd3;left:-31px;top:5px}.event time{display:block;color:#667085;font-size:13px}.event b{display:block;margin:5px 0}.event p{margin:5px 0}.event small{color:#667085}.loginbox{width:min(440px,92vw);background:white;border:1px solid #dde4ed;border-radius:16px;padding:34px;box-shadow:0 20px 60px rgba(16,24,40,.08)}.brand{font-weight:800;font-size:24px;color:#12315d;margin-bottom:25px}.brand span{font-size:12px;background:#eef4ff;padding:4px 8px;border-radius:99px}.loginbox .wide{width:100%;margin-top:8px}.demo{margin-top:20px;background:#f4f7fb;border-radius:9px;padding:14px;line-height:1.7;font-size:13px}.warning,.alert{padding:12px;border-radius:8px;font-size:13px}.warning{background:#fff7e8;color:#8a5a00}.alert{background:#fff0f0;color:#a22323}.errorbox{max-width:600px;background:white;padding:35px;border-radius:14px;border:1px solid #e1e6ed}code{background:#f2f4f7;padding:3px 6px;border-radius:5px}@media(max-width:1000px){.cards.five{grid-template-columns:repeat(2,1fr)}.summary{grid-template-columns:repeat(2,1fr)}}@media(max-width:800px){aside{position:static;width:100%;height:auto}nav a{display:inline-block}.account{margin-top:15px}main{margin:0;padding:20px}.cards,.cards.five,.summary,.grid2,.advanced,.inlineform.grid2{grid-template-columns:1fr}.advanced .span2{grid-column:span 1}.row{align-items:flex-start;flex-wrap:wrap}}

.mobilebar,.closemenu,.navbackdrop{display:none}
@media(max-width:800px){body{padding-top:58px}body:has(.authmain){padding-top:0}.mobilebar{position:fixed;display:flex;top:0;left:0;right:0;height:58px;background:#122238;color:white;z-index:40;align-items:center;gap:12px;padding:0 14px;box-shadow:0 2px 12px rgba(0,0,0,.16)}.mobilebar span{margin-left:auto;font-size:12px;opacity:.72}.menubtn,.closemenu{background:transparent;color:white;padding:7px 10px;font-size:24px;line-height:1}.closemenu{display:block}.asidehead{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}aside{position:fixed;display:flex;left:-290px;top:0;width:280px;height:100dvh;z-index:60;transition:left .2s ease;padding:24px 18px;overflow-y:auto}body.navopen aside{left:0}.navbackdrop{position:fixed;inset:0;background:rgba(10,20,35,.48);z-index:50}body.navopen .navbackdrop{display:block}nav{margin-top:22px}nav a{display:block;padding:14px 12px;margin:3px 0}.account{margin-top:auto}main{margin:0;padding:18px 14px;max-width:none}.authmain{padding:18px;min-height:100vh}.row{gap:12px}.row .button,.row .secondary{width:100%;text-align:center}.cards,.cards.five,.summary,.grid2,.advanced,.inlineform.grid2{grid-template-columns:1fr}.card,.panel,section,.advanced{padding:16px}.card b{font-size:28px}.advanced .span2{grid-column:span 1}.search{flex-direction:column}.search .button,.search button{width:100%}.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch}table{min-width:680px}th,td{padding:11px 10px}.form{padding:18px}.actions{flex-wrap:wrap}.actions>*{flex:1;min-width:130px;text-align:center}.loginbox{width:min(440px,100%);padding:24px 20px}.brand{margin-bottom:18px}}