:root{--ink:#182334;--muted:#78859a;--line:#e8edf3;--paper:#f5f7fa;--white:#fff;--navy:#101b2c;--navy2:#182941;--blue:#4777f5;--blueLight:#eef3ff;--green:#20a879;--greenLight:#e9f8f2;--amber:#e3a340;--red:#dc6471;--shadow:0 8px 24px #2030460a;--radius:16px}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif;font-size:14px}.app-shell{min-height:100vh;display:grid;grid-template-columns:250px minmax(0,1fr)}.sidebar{background:var(--navy);color:#fff;padding:25px 17px 16px;display:flex;flex-direction:column;min-height:100vh;position:sticky;top:0;height:100vh}.brand{display:flex;gap:11px;align-items:center;text-decoration:none;color:white;margin:0 8px 35px}.brand-mark{width:37px;height:37px;border-radius:12px;background:linear-gradient(140deg,#688df9,#3965e8);display:grid;place-items:center;font:800 25px Manrope,sans-serif;color:white;box-shadow:0 6px 16px #4777f556}.brand b{font:800 19px Manrope,sans-serif;letter-spacing:-.8px;display:block;line-height:19px}.brand small{display:block;font-size:8px;color:#8999b1;letter-spacing:1.1px;margin-top:4px}.workspace-label{font-size:9px;font-weight:700;color:#77869c;letter-spacing:1.5px;padding:0 10px;margin-bottom:11px}.store-select-label{font-size:11px;color:#adbacb;margin:0 10px 7px}.store-select{width:100%;border:1px solid #2b3a50;background:#1a293d;color:#f2f5fa;padding:10px 9px;border-radius:10px;outline:0;font-size:12px}.ghost-button{background:#1d2b40;border:1px solid #2a3c54;color:#d6dfec;border-radius:9px;padding:9px 10px;font-size:11px;cursor:pointer}.ghost-button.full{width:100%;margin-top:9px}.ghost-button:hover{background:#263852}.nav-label{margin-top:34px}.nav-list{display:grid;gap:5px}.nav-item{width:100%;display:flex;align-items:center;gap:12px;text-align:left;padding:11px 12px;background:transparent;color:#aab7c9;border:0;border-radius:9px;font:500 12px 'DM Sans',sans-serif;cursor:pointer}.nav-item span{width:18px;text-align:center;font-size:17px;line-height:12px}.nav-item:hover{color:white;background:#1a293d}.nav-item.active{background:#253a5a;color:#fff;box-shadow:inset 3px 0 0 #6c94ff}.nav-badge{margin-left:auto;width:6px;height:6px;background:#ff9f6d;border-radius:50%;display:none}.sidebar-bottom{margin-top:auto;border-top:1px solid #29364a;padding:15px 8px 0;display:flex;gap:9px;align-items:center;font-size:10px;color:#c1ccdc;line-height:1.55}.sidebar-bottom small{color:#75859c}.privacy-dot,.live-dot{width:7px;height:7px;border-radius:50%;background:#3cc795;box-shadow:0 0 0 3px #3cc79520;flex:none}.main-area{min-width:0;display:flex;flex-direction:column}.topbar{height:64px;background:#ffffffeb;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 35px;position:sticky;top:0;z-index:10;backdrop-filter:blur(14px)}.crumb{display:flex;align-items:center;gap:10px;color:#9aa4b3;font-size:12px}.crumb b{color:#c7ced8;font-weight:400}.crumb strong{color:#344257;font-weight:600}.topbar-right{display:flex;gap:9px;align-items:center;color:#758198;font-size:11px}.icon-button{border:1px solid var(--line);width:30px;height:30px;border-radius:9px;background:#fff;color:#637188;font-size:17px;cursor:pointer}.mobile-menu{display:none}.content{padding:29px 35px 40px;max-width:1510px;width:100%;margin:0 auto;flex:1}.page-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:22px}.eyebrow{font-size:9px;font-weight:700;color:#8390a4;letter-spacing:1.5px;margin:0 0 7px}.page-heading h1{font:800 25px Manrope,sans-serif;letter-spacing:-.8px;margin:0;color:#172336}.page-heading p{color:#8894a5;margin:7px 0 0;font-size:12px}.heading-actions{display:flex;align-items:center;gap:8px}.button{border:1px solid var(--line);border-radius:9px;padding:9px 13px;font:600 11px 'DM Sans';cursor:pointer;background:#fff;color:#49586c}.button.primary{background:var(--blue);border-color:var(--blue);color:#fff;box-shadow:0 4px 10px #4777f525}.button.primary:hover{background:#3564e4}.button.secondary:hover{border-color:#c9d3e3;background:#fbfcfe}.button:disabled{opacity:.5;cursor:not-allowed}.select-input,.text-input{border:1px solid #dfe5ed;border-radius:8px;background:#fff;padding:9px 10px;color:#344257;font:500 11px 'DM Sans';outline:0}.select-input:focus,.text-input:focus{border-color:#88a6ff;box-shadow:0 0 0 3px #4777f516}.filter-select{min-width:145px}.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin-bottom:15px}.kpi-card{background:#fff;border:1px solid #e9edf2;border-radius:var(--radius);padding:16px 18px;box-shadow:var(--shadow);min-width:0}.kpi-top{display:flex;justify-content:space-between;align-items:center;color:#8390a2;font-size:10px;font-weight:600}.kpi-icon{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-size:14px}.kpi-icon.blue{background:#eef3ff;color:#587cf1}.kpi-icon.green{background:#e9f8f2;color:#20a879}.kpi-icon.orange{background:#fff5e7;color:#d89a37}.kpi-icon.purple{background:#f2efff;color:#8871dd}.kpi-value{font:800 21px Manrope,sans-serif;letter-spacing:-.8px;margin:11px 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kpi-note{font-size:10px;color:#99a3b2}.positive{color:#24a779}.negative{color:#d56872}.grid-2{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(280px,1fr);gap:14px;margin-bottom:14px}.grid-equal{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:14px}.panel{background:#fff;border:1px solid #e9edf2;border-radius:var(--radius);padding:17px 18px;box-shadow:var(--shadow);min-width:0;margin-bottom:14px}.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:15px}.panel-title{font:700 13px Manrope,sans-serif;color:#243248;margin:0}.panel-subtitle{font-size:10px;color:#98a2b0;margin-top:5px}.pill{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:20px;font-size:9px;color:#708096;background:#f1f4f8;white-space:nowrap}.pill.blue{color:#5377dc;background:#eef3ff}.pill.green{color:#168e64;background:#e9f8f2}.notice{border:1px solid #f4e4bd;background:#fff9eb;color:#8c702e;border-radius:11px;padding:11px 13px;font-size:11px;line-height:1.6;margin:0 0 14px}.notice.info{border-color:#dce7ff;background:#f4f7ff;color:#506a9e}.notice.error{border-color:#f2d4d7;background:#fff5f5;color:#a0505d}.chart{width:100%;height:240px;position:relative}.chart svg{width:100%;height:100%;overflow:visible}.chart-label{font-size:9px;fill:#98a4b4;font-family:'DM Sans',sans-serif}.chart-grid{stroke:#edf0f5;stroke-width:1}.chart-tooltip{display:none}.legend{display:flex;gap:14px;font-size:10px;color:#8692a2;margin-top:9px}.legend span{display:flex;gap:6px;align-items:center}.legend i{width:7px;height:7px;border-radius:50%;background:#5780f5}.bars{display:grid;gap:12px}.bar-row{display:grid;grid-template-columns:minmax(80px,1fr) minmax(80px,2fr) 55px;align-items:center;gap:10px;font-size:10px}.bar-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#647287}.bar-track{height:7px;border-radius:8px;background:#f0f2f6;overflow:hidden}.bar-fill{height:100%;border-radius:8px;background:linear-gradient(90deg,#7194ff,#4c76f3)}.bar-value{text-align:right;color:#45546a;font-weight:600;font-variant-numeric:tabular-nums}.table-wrap{overflow:auto;max-height:470px;border:1px solid #edf0f4;border-radius:10px}table{border-collapse:collapse;width:100%;font-size:10px;white-space:nowrap}thead{position:sticky;top:0;background:#f7f9fc;z-index:1}th{font-size:9px;letter-spacing:.2px;text-transform:uppercase;color:#8190a3;text-align:left;padding:10px 11px;font-weight:700;border-bottom:1px solid #e8edf3}td{padding:9px 11px;color:#526176;border-bottom:1px solid #f0f2f6;max-width:280px;overflow:hidden;text-overflow:ellipsis}tbody tr:hover{background:#fafbfe}tbody tr:last-child td{border-bottom:0}.table-search{display:flex;gap:8px;align-items:center}.table-search input{width:185px}.table-tools{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px}.empty-state{padding:35px 15px;text-align:center;color:#96a1b0;font-size:11px}.empty-state b{display:block;color:#56667d;font-size:13px;margin-bottom:6px}.tabs{display:flex;gap:5px;border-bottom:1px solid var(--line);margin-bottom:16px;overflow:auto}.tab-button{background:transparent;border:0;border-bottom:2px solid transparent;padding:10px 12px 9px;color:#8b97a8;font:600 10px 'DM Sans';white-space:nowrap;cursor:pointer}.tab-button.active{color:#446ee7;border-bottom-color:#527af2}.tab-content{display:none}.tab-content.active{display:block}.field-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.field label,.field-label{display:block;font-size:10px;color:#69778b;margin:0 0 5px;font-weight:600}.field input,.field select{width:100%}.field-note{font-size:9px;color:#9aa5b4;margin-top:4px}.form-row{display:flex;align-items:flex-end;gap:9px;flex-wrap:wrap}.form-row .field{min-width:150px}.form-row .field.wide{flex:1;min-width:220px}.file-drop{border:1px dashed #cdd6e3;border-radius:12px;background:#fafbfd;padding:22px;text-align:center;cursor:pointer;color:#75839a}.file-drop:hover{background:#f5f8ff;border-color:#9db4f4}.file-drop b{display:block;color:#394960;font-size:12px;margin:6px 0}.file-drop small{font-size:10px}.source-list{display:grid;gap:8px}.source-row{display:grid;grid-template-columns:minmax(0,1fr) 115px 70px;gap:10px;align-items:center;padding:10px 11px;border:1px solid #edf0f4;border-radius:9px}.source-row strong{display:block;font-size:10px;color:#4c5a6d;overflow:hidden;text-overflow:ellipsis}.source-row small{color:#98a3b1;font-size:9px}.quality{font-size:9px;color:#20926b;background:#eaf8f2;padding:5px 8px;border-radius:14px;text-align:center}.muted{color:#929dad;font-size:11px;line-height:1.6}.footer{padding:0 35px 18px;color:#a4adba;font-size:9px}.footer span{padding:0 5px}.loading-card{background:#fff;border:1px solid var(--line);padding:30px;border-radius:14px;color:#8895a7;font-size:12px}.toast{position:fixed;bottom:25px;right:25px;background:#172336;color:#fff;padding:11px 15px;border-radius:10px;box-shadow:0 12px 30px #1420332e;font-size:11px;opacity:0;transform:translateY(8px);transition:.2s;pointer-events:none;z-index:50}.toast.show{opacity:1;transform:translateY(0)}dialog{border:1px solid #e6eaf0;border-radius:16px;width:min(430px,calc(100vw - 30px));padding:22px;box-shadow:0 25px 90px #0d182b30;color:var(--ink)}dialog::backdrop{background:#101b2c80;backdrop-filter:blur(3px)}.dialog-head{display:flex;justify-content:space-between;align-items:flex-start}.dialog-head h2{font:800 20px Manrope;margin:0}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.text-input{width:100%;font-size:12px}.upload-list{display:grid;gap:8px;margin-top:12px}.upload-item{display:flex;justify-content:space-between;align-items:center;padding:10px;border:1px solid var(--line);border-radius:9px;font-size:10px}.upload-item small{color:#9ba6b5}.quality-card{display:flex;gap:11px;align-items:flex-start;padding:13px;border:1px solid #ebeff4;border-radius:11px}.quality-card .q-icon{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:#fff5e4;color:#c58b2e;flex:none}.quality-card b{font-size:10px;color:#45546a}.quality-card p{font-size:10px;color:#8793a4;line-height:1.5;margin:4px 0 0}.metric-line{display:flex;justify-content:space-between;border-bottom:1px solid #f0f2f5;padding:9px 1px;font-size:10px;color:#728096}.metric-line:last-child{border:0}.metric-line strong{color:#354459}.recon-status{border-radius:20px;padding:4px 7px;font-size:9px}.status-cair{color:#208c66;background:#e8f7f1}.status-cek{color:#bd7e24;background:#fff5e5}.status-missing{color:#bc5663;background:#fff0f1}.page-controls{display:flex;justify-content:space-between;align-items:center;color:#8995a5;font-size:10px;padding-top:9px}.page-controls button{border:1px solid var(--line);background:#fff;border-radius:7px;padding:6px 10px;cursor:pointer;color:#54637a}.check-label{display:flex;gap:7px;align-items:center;font-size:10px;color:#768398}.check-label input{accent-color:var(--blue)}
@media(max-width:1050px){.app-shell{grid-template-columns:220px minmax(0,1fr)}.content{padding:25px 23px}.topbar{padding:0 23px}.kpi-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.app-shell{display:block}.sidebar{position:fixed;z-index:20;left:-270px;top:0;width:250px;transition:left .22s;box-shadow:15px 0 40px #0b172d30}.sidebar.open{left:0}.topbar{height:57px;padding:0 15px}.mobile-menu{display:block;border:0;background:transparent;color:#53637a;font-size:18px}.crumb{margin-right:auto;margin-left:10px}.topbar-right{font-size:0;gap:5px}.content{padding:22px 14px 32px}.page-heading{align-items:flex-start;flex-direction:column;margin-bottom:17px}.page-heading h1{font-size:22px}.heading-actions{width:100%;flex-wrap:wrap}.grid-2,.grid-equal{grid-template-columns:1fr;gap:0}.field-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.kpi-card{padding:13px}.kpi-value{font-size:18px}.kpi-top{font-size:9px}.footer{padding:0 15px 15px}.source-row{grid-template-columns:minmax(0,1fr) 80px}.source-row .source-count{display:none}.chart{height:210px}.table-tools{align-items:flex-start;flex-direction:column}.table-search{width:100%}.table-search input{flex:1}.filter-select{min-width:120px}.panel{padding:14px}.topbar-right #dataStatus{display:none}}
.bank-table-tools{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:10px;align-items:end;margin:14px 0}.bank-table-tools .field{min-width:0}.bank-table-tools .field span,.bank-category-row span{display:block;margin-bottom:5px;color:#708097;font-size:10px;font-weight:650}.bank-table-tools .button{min-height:36px}.bank-category-settings{margin:12px 0;padding:14px!important;background:#fbfcfe}.bank-category-settings summary{cursor:pointer;font-weight:700;color:#40516a}.bank-category-settings[open] summary{margin-bottom:10px}.bank-category-row{display:grid;grid-template-columns:minmax(110px,180px) minmax(0,1fr);gap:12px;align-items:center;margin:9px 0}.bank-category-row span{margin:0}.bank-category-settings .notice{margin-top:10px}

.background-progress{position:fixed;left:20px;bottom:20px;width:min(390px,calc(100vw - 40px));z-index:1200;padding:12px 14px;border:1px solid #dfe6f0;border-radius:12px;background:var(--white);box-shadow:0 12px 34px #14203324;color:var(--ink)}.background-progress[hidden],.database-loading-overlay[hidden]{display:none}.background-progress-head{display:flex;justify-content:space-between;gap:12px;font-size:11px;font-weight:700}.background-progress-head span:last-child{color:var(--blue)}.background-progress-track{height:5px;margin:8px 0 5px;background:#e9eef6;border-radius:8px;overflow:hidden}.background-progress-fill{height:100%;background:linear-gradient(90deg,#4777f5,#35bc97);border-radius:8px;transition:width .25s ease}.background-progress.is-working .background-progress-fill{animation:progress-pulse 1.1s ease-in-out infinite alternate}.background-progress small{color:var(--muted);font-size:9px}.database-loading-overlay{position:fixed;inset:0;z-index:1100;display:grid;place-items:center;background:#f3f6fae8;backdrop-filter:blur(3px)}.database-loading-card{width:min(360px,calc(100vw - 34px));padding:28px;text-align:center;border:1px solid var(--line);border-radius:16px;background:var(--white);box-shadow:0 20px 70px #1b2a401c}.database-loading-card h2{font:750 18px Manrope;margin:14px 0 6px}.database-loading-card p{font-size:11px;color:var(--muted);line-height:1.6}.loading-spinner{width:32px;height:32px;margin:auto;border:3px solid #e5ebf4;border-top-color:var(--blue);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@keyframes progress-pulse{from{opacity:.55;filter:saturate(.8)}to{opacity:1;filter:saturate(1.25)}}.guide-intro>p{font-size:12px;color:var(--muted)}.guide-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px}.guide-step{display:grid;grid-template-columns:36px minmax(0,1fr);gap:12px;padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--white)}.guide-number{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--blueLight);color:var(--blue);font:800 12px Manrope}.guide-step h3{margin:2px 0 5px;font:750 13px Manrope}.guide-step p{min-height:44px;margin:0 0 11px;color:var(--muted);font-size:10px;line-height:1.6}.guide-finish{display:flex;justify-content:flex-end;margin-top:18px}.nav-item[data-page="guide"]{margin-top:6px}.background-progress{pointer-events:none}@media(max-width:760px){.guide-steps{grid-template-columns:1fr}.guide-step p{min-height:0}.background-progress{left:12px;bottom:12px;width:calc(100vw - 24px);}.database-loading-card{padding:23px}}
.bank-category-settings hr{border:0;border-top:1px solid var(--line);margin:16px 0}.bank-category-settings h3{font:700 12px Manrope,sans-serif;color:#34445b;margin:8px 0}.bank-rule-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:9px;align-items:end;margin:12px 0}.bank-rule-form .field{min-width:0}.bank-rule-list{display:grid;gap:7px;margin:12px 0}.bank-rule-item{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 11px;border:1px solid var(--line);border-radius:9px}.bank-rule-item b,.bank-rule-item small{display:block}.bank-rule-item b{font-size:10px;color:#46556a}.bank-rule-item small{font-size:9px;color:#8995a5;margin-top:3px;line-height:1.5}

.bank-party-input{min-width:145px}.bank-tax-input{min-width:145px}.bank-category-settings[open] summary{color:#355fd5}.bank-rule-form{padding:12px;border:1px solid #e8edf3;border-radius:10px;background:#fbfcfe}