*{box-sizing:border-box}body{margin:0;font-family:ui-sans-serif,system-ui,"Noto Sans Thai",sans-serif;color:#102040;background:#f4f7fb}button,input,select,textarea{font:inherit}button{cursor:pointer}.hidden{display:none!important}.auth{min-height:100vh;display:grid;place-items:center;background:linear-gradient(145deg,#eef4ff,#f9fbff);padding:20px}.auth-card{width:min(420px,100%);background:white;padding:36px;border:1px solid #dce5f2;border-radius:18px;box-shadow:0 20px 60px #173d7b18;text-align:center}.logo{width:38px;height:38px;border-radius:9px;background:#1264e8;color:#fff;display:grid;place-items:center;font-weight:800}.logo.big{width:58px;height:58px;margin:auto;font-size:20px}.auth label,.form-grid label{display:grid;gap:7px;text-align:left;font-size:13px;font-weight:650;margin:15px 0}input,select,textarea{width:100%;padding:10px 12px;border:1px solid #ced9e8;border-radius:8px;background:white;color:#102040}input:focus,select:focus,textarea:focus{outline:2px solid #2d78ee55;border-color:#2d78ee}.primary,.secondary,.danger,.ghost{border:0;border-radius:8px;padding:10px 16px;font-weight:650}.primary{background:#1467ed;color:white}.secondary{background:#eaf1fb;color:#17437b}.danger{background:#fee8e9;color:#c42331}.ghost{background:transparent;color:#58708f}.auth .primary{width:100%;margin-top:8px}.error{color:#c42331;font-size:13px}.shell{min-height:100vh;display:grid;grid-template-columns:245px 1fr}aside{background:#fff;border-right:1px solid #dfe7f1;display:flex;flex-direction:column;position:sticky;height:100vh;top:0}.brand{height:68px;display:flex;align-items:center;gap:12px;padding:15px 20px;border-bottom:1px solid #e8eef6}nav{padding:16px 10px;flex:1}.nav-item{display:flex;gap:12px;width:100%;border:0;background:transparent;color:#526782;padding:11px 14px;border-radius:9px;text-align:left;margin:3px 0}.nav-item.active{background:#e7f0ff;color:#1163e6;font-weight:700}.nav-item:hover{background:#f0f4fa}.account{padding:16px;border-top:1px solid #e8eef6;display:grid}.account small{color:#71839b}.account button{text-align:left;padding-left:0}main{min-width:0}header{height:68px;background:white;border-bottom:1px solid #dfe7f1;display:flex;align-items:center;padding:0 28px;gap:14px;position:sticky;top:0;z-index:4}header small{display:block;color:#8190a3}.spacer{flex:1}.status{font-size:12px;color:#14804a;background:#e7f7ef;padding:6px 10px;border-radius:50px}.icon{display:none;border:0;background:transparent;font-size:22px}#page{padding:28px;max-width:1550px;margin:auto}.page-title{display:flex;align-items:flex-start;gap:15px;margin-bottom:20px}.page-title h1{margin:0 0 4px;font-size:26px}.page-title p{margin:0;color:#6b7d94}.page-title .actions{margin-left:auto;display:flex;gap:8px}.filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}.filters input,.filters select{width:auto}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:18px 0}.card,.panel{background:white;border:1px solid #dfe7f1;border-radius:12px;box-shadow:0 3px 10px #284c7b08}.metric{padding:20px;border-left:4px solid #4285f4}.metric label{color:#667991;font-size:13px}.metric strong{display:block;font-size:25px;margin-top:9px}.metric.orange{border-color:#ed8a22}.metric.green{border-color:#15a36b}.metric.purple{border-color:#7b61e8}.panel{padding:20px;margin-bottom:18px}.panel-head{display:flex;align-items:center;margin-bottom:15px}.panel-head h2{font-size:17px;margin:0}.panel-head>*:last-child:not(:first-child){margin-left:auto}table{width:100%;border-collapse:collapse;font-size:13px}th{text-align:left;color:#536982;background:#f5f8fc;font-weight:650}th,td{padding:11px;border-bottom:1px solid #e6edf5;white-space:nowrap}td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}.positive{color:#07874f}.negative{color:#d12b3b}.dot{width:10px;height:10px;border-radius:50%;display:inline-block;margin-right:8px}.table-wrap{overflow:auto}.entry-input{min-width:120px;text-align:right}.muted{color:#788a9e}.badge{display:inline-block;padding:4px 8px;border-radius:20px;background:#edf3fc;color:#3e5c80;font-size:11px}.badge.green{background:#e5f7ed;color:#16764a}.empty{text-align:center;color:#71839b;padding:45px}.chart{height:220px;display:flex;align-items:end;gap:3px;padding-top:20px;border-bottom:1px solid #ced9e8}.bar{flex:1;min-width:4px;background:#2f78e5;border-radius:3px 3px 0 0;position:relative}.bar:hover:after{content:attr(data-tip);position:absolute;bottom:100%;left:50%;transform:translateX(-50%);background:#142943;color:white;padding:5px;border-radius:5px;white-space:nowrap;font-size:11px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.form-grid .wide{grid-column:1/-1}.form-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:8px;margin-top:15px}.help{padding:10px 12px;background:#eff5ff;color:#395c8b;border-radius:8px;font-size:12px}dialog{border:0;border-radius:14px;width:min(620px,calc(100% - 24px));padding:0;box-shadow:0 30px 90px #13294b44}dialog::backdrop{background:#13294b66}.dialog-x{float:right;border:0;background:transparent;font-size:24px;padding:12px 18px}.dialog-content{padding:25px}.dialog-content h2{margin-top:0}#toast{position:fixed;right:20px;top:82px;z-index:20}.toast{background:#102e58;color:#fff;padding:12px 16px;border-radius:9px;margin-bottom:8px;box-shadow:0 8px 25px #102e5844}.toast.bad{background:#b82735}.audit-json{max-width:280px;overflow:hidden;text-overflow:ellipsis}.mobile-cards{display:none}.warn{color:#9a5b00;background:#fff5d9;padding:10px;border-radius:8px}
@media(max-width:900px){.shell{grid-template-columns:1fr}aside{position:fixed;z-index:10;width:245px;transform:translateX(-100%);transition:.2s}aside.open{transform:none}.icon{display:block}.cards{grid-template-columns:1fr 1fr}.status{display:none}#page{padding:18px}.desktop-table{display:none}.mobile-cards{display:grid;gap:12px}.mobile-card{padding:15px;background:#fff;border:1px solid #dfe7f1;border-radius:10px}.form-grid{grid-template-columns:1fr}.form-grid .wide{grid-column:auto}.page-title{flex-wrap:wrap}.page-title .actions{width:100%;margin:5px 0}.filters>*{flex:1}.filters input,.filters select{width:100%}}
@media(max-width:520px){.cards{grid-template-columns:1fr}.metric{padding:14px}.metric strong{font-size:21px}header{padding:0 15px}}
.reconcile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin-top:16px}.reconcile-item{border:1px solid #dfe7f1;border-radius:9px;padding:12px;display:grid;gap:5px}.reconcile-item span{font-size:12px;color:#687c94}.reconcile-item strong{font-size:15px}
