:root{--bg:#0b0f17;--card:#141a26;--line:#263044;--ink:#e8ecf3;--ink2:#aab3c5;--mut:#8a93a6;--acc:#5b8def;--warn:#f5b301;--bad:#e8748a;--ok:#4fd1a5}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.55 -apple-system,system-ui,"Noto Sans Thai",sans-serif}
a{color:inherit;text-decoration:none}h1{font-size:22px;margin:12px 0 2px;font-weight:600}h2{font-size:15px;margin:0 0 8px;font-weight:600}
.top{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--line)}.brand{font-weight:700;white-space:nowrap}.brand i{color:var(--acc);font-style:normal}.tag{font-size:12px;padding:2px 8px;border:1px solid var(--line);border-radius:99px;color:var(--ink2);white-space:nowrap}.sp{flex:1}.who{display:none;font-size:12px;color:var(--mut)}
.nav{display:flex;gap:4px;padding:8px 12px;overflow-x:auto;border-bottom:1px solid var(--line)}.nav a{padding:8px 12px;border-radius:8px;white-space:nowrap;color:var(--ink2);min-height:40px}.nav a.on{background:var(--card);color:var(--ink)}.dot{display:inline-block;margin-left:5px;padding:0 6px;border-radius:99px;background:var(--bad);color:#14040a;font-size:12px}
.page{max-width:1240px;margin:0 auto;padding:4px 16px 40px}.sub{margin:0 0 12px;color:var(--ink2);font-size:13px}.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;margin:0 0 12px}.ch{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px}.kpi .k{font-size:12.5px;color:var(--ink2)}.kpi .v{font-size:26px;font-weight:600;font-variant-numeric:tabular-nums}.kpi .s{font-size:12px;color:var(--mut)}
.grid{display:grid;gap:12px;grid-template-columns:minmax(0,1fr)}.grid>.card{margin:0}.grid{margin-bottom:12px}
.row{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-top:1px solid var(--line)}.row:first-of-type{border-top:0}.num{font-variant-numeric:tabular-nums;text-align:right}.tiny{font-size:12px;color:var(--mut)}.c{text-align:center}.nw{white-space:nowrap}
.callout{margin-top:10px;padding:9px 11px;border-radius:10px;background:rgba(79,209,165,.1);color:var(--ok);font-size:13px}.callout.y{background:rgba(245,179,1,.12);color:var(--warn)}.callout .row{color:var(--ink);border-color:rgba(245,179,1,.3)}
.chart{display:flex;align-items:flex-end;gap:6px;height:150px;margin-top:8px;padding:6px 2px 0;border-bottom:1px solid var(--line)}.chart .c{flex:1;min-width:0;align-self:stretch;display:flex;flex-direction:column;justify-content:flex-end;gap:1px}.chart i{display:block;border-radius:3px 3px 0 0}.chart .sel i{outline:2px solid var(--warn)}.mlab{display:flex;gap:6px;margin:4px 0 8px;padding:0 2px}.mlab span{flex:1;min-width:0;text-align:center;font-size:10.5px;color:var(--mut);white-space:nowrap}
.f-a{background:#5b8def}.f-b{background:#3a4560}.f-c{background:#a078ff}.f-r{background:#e8748a}.f-o{background:#e8a54f}.split{display:block;width:100%;height:12px;border-radius:6px;margin-bottom:8px}.sw{display:inline-block;width:9px;height:9px;border-radius:2px;margin:0 3px 0 8px}.row .sw{margin:0 7px 0 0}.sw.a{background:#5b8def}.sw.b{background:#3a4560}.sw.c{background:#a078ff}
.pill{display:inline-block;font-size:12px;padding:1px 8px;border-radius:99px;background:#2a3346;color:var(--ink2);white-space:nowrap}.p-y{background:rgba(91,141,239,.2);color:#a9c4ff}.p-m{background:rgba(160,120,255,.2);color:#cdb7ff}.p-x,.p-r{background:rgba(232,116,138,.18);color:#f1a4b3}.p-new{background:rgba(91,141,239,.25);color:#b9d0ff}.p-look{background:rgba(245,179,1,.18);color:#f5cf6a}.p-done{background:rgba(79,209,165,.18);color:#86e2c3}
.li{display:block;padding:10px 0;border-top:1px solid var(--line)}.li:first-child{border-top:0}.li .t{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.li .m{font-size:13px;color:var(--ink2);overflow-wrap:anywhere}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}.chip{padding:6px 12px;border:1px solid var(--line);border-radius:99px;font-size:13px;color:var(--ink2)}.chip.on{background:var(--acc);border-color:var(--acc);color:#07101f}
.search{display:flex;gap:8px}input,textarea{width:100%;background:#0e131d;border:1px solid var(--line);border-radius:10px;color:var(--ink);font:inherit;font-size:16px;padding:10px}textarea{min-height:110px;resize:vertical}label{display:block;font-size:13px;color:var(--ink2);margin-top:12px}
.btn,.btn2{display:inline-flex;justify-content:center;align-items:center;min-height:44px;padding:0 16px;border-radius:10px;border:1px solid var(--acc);background:var(--acc);color:#07101f;font:inherit;font-weight:600;cursor:pointer}.btn2{background:transparent;color:var(--ink);border-color:var(--line);font-weight:500}.wide{width:100%;margin-top:14px}.btns{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 6px}
.link{background:none;border:0;color:var(--acc);font:inherit;cursor:pointer;padding:0}.back{display:inline-block;margin-top:12px;font-size:14px}
.kv{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 14px;font-size:14px;margin-top:6px}.kv .k{color:var(--mut)}.kv span{overflow-wrap:anywhere}
.seg{display:flex;gap:4px}.seg button{flex:1;min-height:44px;background:#0e131d;border:1px solid var(--line);border-radius:10px;color:var(--ink2);font:inherit;cursor:pointer}.seg button.on{background:var(--acc);color:#07101f;border-color:var(--acc)}
.diag{white-space:pre-wrap;overflow-wrap:anywhere;font:12.5px/1.6 ui-monospace,Menlo,monospace;background:#0e131d;border:1px solid var(--line);border-radius:10px;padding:10px;margin:0 0 6px;max-height:420px;overflow:auto;color:var(--ink2)}.msg{margin:0 0 10px;white-space:pre-wrap;overflow-wrap:anywhere}
.login{max-width:380px;margin:0 auto;padding:40px 16px}.brandrow{display:flex;gap:8px;justify-content:center;margin-bottom:16px;align-items:center}.login h1{font-size:18px;margin:0}.err{color:var(--bad);font-size:13px;margin:8px 0 0}
table{width:100%;border-collapse:collapse;font-size:14px}th{text-align:left;color:var(--mut);font-weight:500;font-size:12.5px}th,td{padding:8px 6px;border-top:1px solid var(--line)}tr:first-child th{border-top:0}td a{color:var(--acc)}.wide-only{display:none}
@media(min-width:640px){.who{display:inline}}
@media(min-width:900px){.grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.kpis{grid-template-columns:repeat(4,minmax(0,1fr))}.narrow{display:none}.wide-only{display:block}}
.h1{height:1px}.h2{height:2px}.h3{height:3px}.h4{height:4px}.h5{height:5px}.h6{height:6px}.h7{height:7px}.h8{height:8px}.h9{height:9px}.h10{height:10px}.h11{height:11px}.h12{height:12px}.h13{height:13px}.h14{height:14px}.h15{height:15px}.h16{height:16px}.h17{height:17px}.h18{height:18px}.h19{height:19px}.h20{height:20px}.h21{height:21px}.h22{height:22px}.h23{height:23px}.h24{height:24px}.h25{height:25px}.h26{height:26px}.h27{height:27px}.h28{height:28px}.h29{height:29px}.h30{height:30px}.h31{height:31px}.h32{height:32px}.h33{height:33px}.h34{height:34px}.h35{height:35px}.h36{height:36px}.h37{height:37px}.h38{height:38px}.h39{height:39px}.h40{height:40px}.h41{height:41px}.h42{height:42px}.h43{height:43px}.h44{height:44px}.h45{height:45px}.h46{height:46px}.h47{height:47px}.h48{height:48px}.h49{height:49px}.h50{height:50px}.h51{height:51px}.h52{height:52px}.h53{height:53px}.h54{height:54px}.h55{height:55px}.h56{height:56px}.h57{height:57px}.h58{height:58px}.h59{height:59px}.h60{height:60px}.h61{height:61px}.h62{height:62px}.h63{height:63px}.h64{height:64px}.h65{height:65px}.h66{height:66px}.h67{height:67px}.h68{height:68px}.h69{height:69px}.h70{height:70px}.h71{height:71px}.h72{height:72px}.h73{height:73px}.h74{height:74px}.h75{height:75px}.h76{height:76px}.h77{height:77px}.h78{height:78px}.h79{height:79px}.h80{height:80px}.h81{height:81px}.h82{height:82px}.h83{height:83px}.h84{height:84px}.h85{height:85px}.h86{height:86px}.h87{height:87px}.h88{height:88px}.h89{height:89px}.h90{height:90px}.h91{height:91px}.h92{height:92px}.h93{height:93px}.h94{height:94px}.h95{height:95px}.h96{height:96px}.h97{height:97px}.h98{height:98px}.h99{height:99px}.h100{height:100px}.h101{height:101px}.h102{height:102px}.h103{height:103px}.h104{height:104px}.h105{height:105px}.h106{height:106px}.h107{height:107px}.h108{height:108px}.h109{height:109px}.h110{height:110px}.h111{height:111px}.h112{height:112px}.h113{height:113px}.h114{height:114px}.h115{height:115px}.h116{height:116px}.h117{height:117px}.h118{height:118px}.h119{height:119px}.h120{height:120px}.h121{height:121px}.h122{height:122px}.h123{height:123px}.h124{height:124px}.h125{height:125px}.h126{height:126px}.h127{height:127px}.h128{height:128px}.h129{height:129px}.h130{height:130px}