:root{
  --primary:#175cd3;
  --primary-2:#0f4fbe;
  --primary-soft:#eaf2ff;
  --bg:#f4f7fb;
  --surface:#ffffff;
  --surface-2:#f8fafc;
  --text:#182230;
  --muted:#667085;
  --line:#e6eaf0;
  --success:#087443;
  --success-soft:#eaf8ef;
  --danger:#b42318;
  --danger-soft:#fff1f1;
  --shadow:0 10px 30px rgba(16,24,40,.06);
  --radius:20px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;min-height:100vh}
button,input{font:inherit}
button{-webkit-tap-highlight-color:transparent}

.container{width:min(1180px,calc(100% - 32px));margin:auto;padding:26px 0 34px}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:20px}
.brand-line{display:flex;align-items:center;gap:9px}.brand-mark{font-size:27px;line-height:1}.topbar h1{font-size:25px;letter-spacing:-.35px;margin:0}.topbar p{margin:5px 0 0;color:var(--muted);font-size:14px}
.user-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.user-actions form{margin:0}.user-chip{display:flex;align-items:center;gap:8px;padding:5px 11px 5px 5px;background:#fff;border:1px solid var(--line);border-radius:999px;box-shadow:0 2px 10px rgba(16,24,40,.03)}

.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}
.stat,.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.stat{padding:17px;display:flex;align-items:center;gap:13px;min-width:0;overflow:hidden}.stat-icon{width:38px;height:38px;flex:0 0 38px;border-radius:13px;display:grid;place-items:center;background:#f1f4f8;color:#667085;font-weight:800}.stat>div:last-child{min-width:0}.stat small{display:block;color:#737c8c;margin-bottom:4px;font-size:12px}.stat strong{display:block;font-size:21px;letter-spacing:-.3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.balance-stat{background:linear-gradient(135deg,#1d63d8,#124eaf);border-color:transparent;color:#fff;box-shadow:0 14px 30px rgba(23,92,211,.20)}.balance-stat small{color:rgba(255,255,255,.76)}.balance-stat .stat-icon{background:rgba(255,255,255,.15);color:#fff}.income-stat .stat-icon{background:#eaf8ef;color:var(--success)}.expense-stat .stat-icon{background:#fff1f1;color:var(--danger)}.initial-stat .stat-icon{background:#f0f3ff;color:#4758c9}

.grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(320px,.8fr);gap:18px}.panel{overflow:hidden}.panel-head{min-height:58px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #edf0f4;background:rgba(255,255,255,.94)}.panel-head b{font-size:15px}.panel-head>div{display:flex;flex-direction:column;gap:2px}.panel-subtitle{font-size:11px;color:#98a2b3}.offline{font-size:12px;color:#16803c;background:var(--success-soft);padding:5px 10px;border-radius:999px}.badge{background:#f0f2f6;border-radius:999px;padding:4px 9px;font-size:12px;color:#475467}

.chat-card{height:70vh;min-height:560px;display:flex;flex-direction:column}.chat-body{flex:1;overflow:auto;padding:18px;background:linear-gradient(180deg,#fbfcfe,#f8fafc);scroll-behavior:smooth;overscroll-behavior:contain}.bubble{max-width:84%;padding:11px 14px;border-radius:18px;margin:9px 0;line-height:1.45;white-space:pre-wrap;font-size:14px;word-break:break-word}.bubble.user{margin-left:auto;background:linear-gradient(135deg,#2166d8,#1758c6);color:#fff;border-bottom-right-radius:6px;box-shadow:0 5px 15px rgba(23,92,211,.15)}.bubble.assistant{background:#eef2f7;border-bottom-left-radius:6px;color:#263243}
.chat-foot{padding:13px 14px 12px;border-top:1px solid #edf0f4;background:#fff}.chat-foot form{display:flex;align-items:center;gap:9px;background:#f6f8fb;border:1px solid #e3e8f0;border-radius:15px;padding:5px 5px 5px 12px;transition:.2s}.chat-foot form:focus-within{background:#fff;border-color:#9fbdf2;box-shadow:0 0 0 4px rgba(23,92,211,.08)}.chat-foot input{width:100%;min-width:0;border:0;background:transparent;padding:8px 2px;font-size:15px;outline:none;color:var(--text)}.chat-foot input::placeholder{color:#98a2b3}.chat-foot small{display:block;color:#7a8494;margin-top:8px;font-size:11px}.send-btn{min-width:76px;height:40px;display:inline-flex;align-items:center;justify-content:center;gap:5px}.send-icon{display:none}

.btn{border:0;border-radius:11px;padding:10px 14px;font-weight:700;cursor:pointer;transition:transform .08s,opacity .15s,box-shadow .15s}.btn:active{transform:scale(.97)}.btn.primary{background:var(--primary);color:#fff;box-shadow:0 5px 12px rgba(23,92,211,.16)}.btn.secondary{background:#fff;color:#273142;border:1px solid #dce1e9}.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}.danger-soft{background:var(--danger-soft)!important;color:var(--danger)!important;border:1px solid #ffd5d5!important;box-shadow:none!important}

.tx-list{max-height:calc(70vh - 58px);overflow:auto;overscroll-behavior:contain}.tx{padding:14px 15px;display:flex;align-items:center;gap:11px;border-bottom:1px solid #edf0f4}.tx:last-child{border-bottom:0}.tx-main{display:flex;align-items:center;gap:11px;min-width:0;flex:1}.tx-icon{width:40px;height:40px;flex:0 0 40px;border-radius:13px;display:grid;place-items:center;background:#f4f6f9;font-size:18px}.tx-info{min-width:0}.tx-info b{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tx p{font-size:11px;color:#8a94a5;margin:3px 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px}.tx-right{text-align:right;white-space:nowrap}.tx-right b{font-size:14px}.tx-right button{display:block;margin:5px 0 0 auto;border:0;background:none;color:#c03345;cursor:pointer;font-size:11px;padding:2px}.expense{color:var(--danger)}.income{color:var(--success)}.empty{text-align:center;color:#98a2b3;padding:52px 12px;font-size:13px}

/* Modal */
dialog{border:0;padding:0;border-radius:20px;width:min(470px,calc(100% - 28px));box-shadow:0 24px 80px rgba(0,0,0,.24);background:#fff}dialog::backdrop{background:rgba(20,28,40,.5);backdrop-filter:blur(2px)}.modal-card{padding:20px}.modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.modal-head h3{margin:0}.icon-btn{border:0;background:#f3f5f8;width:34px;height:34px;border-radius:50%;font-size:24px;line-height:1;cursor:pointer}.modal-card label{display:block;font-size:13px;font-weight:700;margin-bottom:7px}.modal-card input{width:100%;border:1px solid #d9dee8;border-radius:12px;padding:12px 13px;font-size:16px;outline:none}.modal-card input:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(23,92,211,.10)}.muted{font-size:13px;color:#778191}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}

/* Multi-user authentication */
.auth-shell{min-height:100dvh;display:grid;place-items:center;padding:28px;background:radial-gradient(circle at 20% 5%,#e9f1ff 0,transparent 35%),linear-gradient(145deg,#f7f9fc,#eef3fb)}.auth-card{width:min(430px,100%);background:rgba(255,255,255,.96);border:1px solid #e6eaf1;border-radius:26px;padding:34px;box-shadow:0 22px 70px rgba(28,46,80,.12)}.auth-brand{text-align:center;margin-bottom:26px}.auth-logo{font-size:42px}.auth-brand h1{margin:8px 0 6px;letter-spacing:-.4px}.auth-brand p{margin:0;color:#667085}.auth-card h2{margin:8px 0}.auth-form{display:grid;gap:10px}.auth-form label{font-size:13px;font-weight:700;color:#475467;margin-top:5px}.auth-form input{width:100%;border:1px solid #d0d5dd;border-radius:13px;padding:13px 14px;font-size:16px;outline:none;background:#fff}.auth-form input:focus{border-color:#2463d4;box-shadow:0 0 0 3px rgba(36,99,212,.12)}.wide{width:100%;margin-top:8px}.auth-switch{text-align:center;color:#667085;margin:20px 0 0}.auth-switch a,.link-button{color:#1f5fd0;font-weight:700;text-decoration:none}.alert.error{background:#fff1f1;border:1px solid #ffd2d2;color:#b42318;padding:11px 13px;border-radius:11px;margin:14px 0}.center{text-align:center}.avatar{width:58px;height:58px;border-radius:50%;display:inline-grid;place-items:center;background:#e7efff;color:#1f5fd0;font-weight:800;font-size:22px}.avatar.small{width:32px;height:32px;font-size:14px}.pin-input{letter-spacing:8px;font-size:24px!important;font-weight:700}.pin-center{text-align:center}.logout-under{margin-top:17px}.link-button{background:none;border:0;cursor:pointer;font-size:14px}.pin-card{max-width:390px}

/* Mobile app navigation */
.mobile-bottom-nav{display:none}

@media(max-width:900px){
  .stats{grid-template-columns:1fr 1fr}.grid{grid-template-columns:1fr}.chat-card{height:62vh;min-height:500px}.tx-list{max-height:none}
}

@media(max-width:760px){
  body{background:#f3f6fb}
  .container{width:100%;padding:12px 12px calc(92px + env(safe-area-inset-bottom))}
  .topbar{margin:0 2px 13px;align-items:center}.brand-line{gap:7px}.brand-mark{font-size:22px}.topbar h1{font-size:19px}.topbar p{display:none}
  .user-actions{margin-left:auto;gap:7px;flex-wrap:nowrap}.user-chip{padding:4px 8px 4px 4px;font-size:13px}.avatar.small{width:30px;height:30px}.user-actions #openSetting{display:none}.danger-soft{width:38px;height:38px;padding:0!important;font-size:0;border-radius:50%!important}.danger-soft::before{content:'↪';font-size:19px;font-weight:800}

  .stats{display:flex;gap:10px;overflow-x:auto;margin:0 -12px 13px;padding:0 12px 3px;scroll-snap-type:x proximity;scrollbar-width:none}.stats::-webkit-scrollbar{display:none}.stat{scroll-snap-align:start;flex:0 0 154px;padding:14px 13px;border-radius:18px;gap:10px;box-shadow:0 6px 18px rgba(16,24,40,.045)}.balance-stat{flex-basis:240px}.stat-icon{width:34px;height:34px;flex-basis:34px;border-radius:11px}.stat strong{font-size:17px}.balance-stat strong{font-size:20px}.stat small{font-size:11px}

  .grid{display:block}.mobile-view{display:none}.mobile-view.active{display:flex}.transactions-panel.mobile-view.active{display:block}
  .panel{border-radius:22px;box-shadow:0 8px 25px rgba(16,24,40,.055)}.panel-head{min-height:55px;padding:0 15px}.panel-head b{font-size:14px}.offline{font-size:11px;padding:4px 8px}
  .chat-card{height:calc(100dvh - 238px);min-height:430px;max-height:none}.chat-body{padding:14px 12px}.bubble{max-width:88%;padding:10px 13px;font-size:14px;border-radius:18px;margin:8px 0}.bubble.user{border-bottom-right-radius:5px}.bubble.assistant{border-bottom-left-radius:5px}
  .chat-foot{padding:10px 10px calc(9px + env(safe-area-inset-bottom)/5);background:rgba(255,255,255,.97)}.chat-foot form{border-radius:18px;padding:5px 5px 5px 12px}.chat-foot input{font-size:16px;padding:8px 1px}.chat-foot small{display:none}.send-btn{min-width:44px;width:44px;height:44px;border-radius:14px;padding:0}.send-label{display:none}.send-icon{display:block;font-size:16px;transform:translateX(1px)}

  .transactions-panel{height:calc(100dvh - 238px);min-height:430px;overflow:hidden}.transactions-panel .tx-list{height:calc(100% - 55px);max-height:none;overflow:auto;background:#fff}.tx{padding:13px 14px}.tx-icon{width:42px;height:42px;flex-basis:42px;border-radius:14px}.tx-info b{font-size:14px}.tx p{max-width:170px}.tx-right b{font-size:14px}

  .mobile-bottom-nav{display:grid;grid-template-columns:repeat(3,1fr);position:fixed;z-index:50;left:50%;bottom:calc(10px + env(safe-area-inset-bottom));transform:translateX(-50%);width:min(520px,calc(100% - 22px));padding:7px;background:rgba(255,255,255,.92);border:1px solid rgba(222,228,238,.9);border-radius:23px;box-shadow:0 16px 45px rgba(16,24,40,.18);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);transition:.22s ease}.mobile-nav-item{position:relative;border:0;background:transparent;color:#7b8492;border-radius:17px;min-height:54px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:10px;font-weight:700;cursor:pointer}.mobile-nav-item.active{background:#edf4ff;color:var(--primary)}.nav-icon{font-size:18px;line-height:1}.nav-count{position:absolute;top:5px;left:calc(50% + 10px);min-width:16px;height:16px;padding:0 4px;border-radius:999px;background:#e9edf3;color:#4b5563;font-size:9px;display:grid;place-items:center}.mobile-nav-item.active .nav-count{background:#d5e4ff;color:#104cad}.composer-focus .mobile-bottom-nav{transform:translate(-50%,135%);opacity:0;pointer-events:none}

  dialog{width:100%;max-width:none;margin:auto 0 0;border-radius:24px 24px 0 0;position:fixed;inset:auto 0 0;max-height:85dvh}.modal-card{padding:20px 18px calc(20px + env(safe-area-inset-bottom))}.modal-actions .btn{flex:1}
}

@media(max-width:520px){
  .auth-shell{padding:16px}.auth-card{padding:26px 20px;border-radius:24px}.auth-brand{margin-bottom:22px}.auth-brand h1{font-size:24px}.auth-card h2{font-size:20px}.auth-form input{min-height:48px}
  .brand-line h1{max-width:190px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-chip b{max-width:75px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}

@media(max-width:380px){
  .container{padding-left:9px;padding-right:9px}.stats{margin-left:-9px;margin-right:-9px;padding-left:9px;padding-right:9px}.balance-stat{flex-basis:210px}.stat{flex-basis:145px}.topbar h1{font-size:17px}.brand-mark{font-size:20px}.user-chip b{display:none}.user-chip{padding-right:4px}
  .chat-card,.transactions-panel{height:calc(100dvh - 230px);min-height:400px}
}

/* ===== MOBILE UI V2 ===== */
@media (max-width:760px){
  :root{--mobile-nav-h:72px}
  html,body{background:#f4f7fb}
  body{overflow-x:hidden;padding-bottom:calc(var(--mobile-nav-h) + env(safe-area-inset-bottom))}
  .container{width:100%;padding:10px 12px 12px}

  .topbar{height:48px;margin:0 2px 10px;gap:10px;align-items:center}
  .brand-line{gap:7px}.brand-mark{font-size:21px}.topbar h1{font-size:18px;letter-spacing:-.35px}.topbar p{display:none}
  .user-actions{margin-left:auto;gap:6px;flex-wrap:nowrap}
  .user-chip{height:40px;padding:4px 9px 4px 4px;font-size:12px;background:#fff}
  .avatar.small{width:30px;height:30px}
  .user-actions #openSetting{display:none}
  .danger-soft{width:40px!important;height:40px!important;padding:0!important;font-size:0!important;border-radius:14px!important}
  .danger-soft::before{content:'↪';font-size:18px;font-weight:800}

  .stats{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;margin:0 0 10px!important;padding:0!important;overflow:visible!important}
  .stat{min-width:0!important;min-height:65px;flex:none!important;border-radius:17px!important;padding:10px!important;display:block!important;box-shadow:0 5px 16px rgba(31,45,70,.045)!important}
  .stat-icon{display:none!important}
  .stat small{font-size:10px!important;margin:0 0 4px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .stat strong{font-size:13px!important;line-height:1.2;letter-spacing:-.15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .balance-stat{grid-column:1/-1!important;min-height:88px!important;padding:16px 17px!important;display:flex!important;align-items:center!important;background:linear-gradient(135deg,#316fe0 0%,#174fb7 100%)!important;border-radius:21px!important;box-shadow:0 13px 28px rgba(31,92,201,.20)!important}
  .balance-stat small{font-size:11px!important;color:rgba(255,255,255,.76)!important;margin-bottom:6px!important}
  .balance-stat strong{font-size:28px!important;letter-spacing:-.7px!important;color:#fff!important;overflow:visible!important}
  .income-stat,.expense-stat,.initial-stat{background:#fff!important}
  .income-stat strong{color:#11834f!important}.expense-stat strong{color:#c73535!important}

  .grid{display:block!important}
  .mobile-view{display:none!important}
  .mobile-view.active{display:flex!important}
  .transactions-panel.mobile-view.active{display:flex!important;flex-direction:column!important}

  .panel{border-radius:20px!important;border:1px solid #e5eaf1!important;box-shadow:0 7px 22px rgba(31,45,70,.055)!important}
  .panel-head{height:50px!important;min-height:50px!important;padding:0 14px!important;background:#fff!important}
  .panel-head b{font-size:14px!important}.panel-subtitle{display:none!important}.offline{font-size:10px!important;padding:4px 8px!important}

  .chat-card,.transactions-panel{height:calc(100dvh - 292px)!important;min-height:390px!important;max-height:650px!important;overflow:hidden!important}
  .chat-body{padding:12px 11px 16px!important;background:#f8fafc!important;min-height:0!important}
  .bubble{max-width:88%!important;padding:10px 12px!important;border-radius:17px!important;font-size:14px!important;line-height:1.43!important;margin:7px 0!important}
  .bubble.user{border-bottom-right-radius:5px!important;box-shadow:none!important}.bubble.assistant{background:#eef2f7!important;border-bottom-left-radius:5px!important}

  .chat-foot{padding:9px 9px 10px!important;background:#fff!important;border-top:1px solid #e9edf3!important}
  .chat-foot form{height:50px!important;border-radius:16px!important;padding:4px 4px 4px 13px!important;gap:5px!important;background:#f7f9fc!important}
  .chat-foot input{font-size:16px!important;padding:8px 0!important}
  .chat-foot small{display:none!important}
  .send-btn{flex:0 0 42px!important;width:42px!important;min-width:42px!important;height:42px!important;border-radius:13px!important;padding:0!important;box-shadow:none!important}
  .send-label{display:none!important}.send-icon{display:block!important;font-size:16px!important;transform:translateX(1px)}

  .transactions-panel .tx-list{flex:1!important;min-height:0!important;height:auto!important;max-height:none!important;overflow:auto!important;background:#fff!important}
  .tx{padding:13px 14px!important;gap:10px!important}
  .tx-main{gap:10px!important}.tx-icon{width:40px!important;height:40px!important;flex-basis:40px!important;border-radius:12px!important;font-size:17px!important}
  .tx-info b{font-size:13px!important}.tx p{font-size:10px!important;max-width:150px!important}.tx-right b{font-size:13px!important}.tx-right button{font-size:10px!important;margin-top:4px!important}
  .empty{padding:70px 15px!important}

  .mobile-bottom-nav{display:grid!important;grid-template-columns:repeat(3,1fr)!important;position:fixed!important;z-index:1000!important;left:0!important;right:0!important;bottom:0!important;width:100%!important;min-height:var(--mobile-nav-h)!important;padding:6px 8px calc(6px + env(safe-area-inset-bottom))!important;background:rgba(255,255,255,.97)!important;border:0!important;border-top:1px solid #dde3ec!important;border-radius:0!important;box-shadow:0 -10px 30px rgba(31,45,70,.07)!important;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);transform:none!important}
  .mobile-bottom-nav button.mobile-nav-item{appearance:none!important;-webkit-appearance:none!important;border:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;margin:0!important;padding:4px!important;position:relative!important;min-width:0!important;min-height:56px!important;border-radius:14px!important;color:#7c8799!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:3px!important;font-size:10px!important;line-height:1!important;font-weight:700!important;cursor:pointer!important}
  .mobile-bottom-nav button.mobile-nav-item.active{color:#2563d9!important;background:#edf4ff!important}
  .nav-icon{width:22px!important;height:22px!important;display:grid!important;place-items:center!important;font-size:0!important}
  .nav-icon svg{display:block!important;width:21px!important;height:21px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.9!important;stroke-linecap:round!important;stroke-linejoin:round!important}
  .nav-count{position:absolute!important;top:3px!important;left:calc(50% + 8px)!important;min-width:16px!important;height:16px!important;padding:0 4px!important;border-radius:999px!important;background:#e9edf4!important;color:#5c6678!important;font-size:9px!important;display:grid!important;place-items:center!important;border:2px solid #fff!important}
  .mobile-nav-item.active .nav-count{background:#cfe0ff!important;color:#174fb7!important}
  .composer-focus .mobile-bottom-nav{transform:translateY(110%)!important;opacity:0!important;pointer-events:none!important;transition:.18s ease!important}

  dialog{width:100%!important;max-width:none!important;margin:auto 0 0!important;border-radius:24px 24px 0 0!important;position:fixed!important;inset:auto 0 0!important;max-height:85dvh!important}
  .modal-card{padding:20px 18px calc(20px + env(safe-area-inset-bottom))!important}.modal-actions .btn{flex:1!important;min-height:46px!important}
}

@media (max-width:390px){
  .container{padding-left:9px!important;padding-right:9px!important}.topbar{margin-left:1px!important;margin-right:1px!important}.topbar h1{font-size:17px!important}.brand-mark{font-size:20px!important}.user-chip b{display:none!important}.user-chip{padding-right:4px!important}
  .stats{gap:6px!important}.stat{padding:9px 8px!important}.stat strong{font-size:12px!important}.balance-stat{padding:15px!important}.balance-stat strong{font-size:25px!important}
  .chat-card,.transactions-panel{height:calc(100dvh - 282px)!important;min-height:365px!important}
}

@media (max-height:700px) and (max-width:760px){
  .balance-stat{min-height:72px!important;padding:12px 15px!important}.balance-stat strong{font-size:24px!important}.income-stat,.expense-stat,.initial-stat{min-height:58px!important}.stat{padding:8px!important}.topbar{height:43px!important;margin-bottom:7px!important}.stats{margin-bottom:7px!important}.chat-card,.transactions-panel{height:calc(100dvh - 258px)!important;min-height:340px!important}
}

/* ===== Batas & peringatan pengeluaran harian ===== */
.daily-budget-card{margin:0 0 18px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);overflow:hidden;transition:.2s ease}
.daily-budget-card.is-hidden{display:none}
.daily-budget-main{display:flex;align-items:center;gap:13px;padding:14px 16px}
.daily-budget-icon{width:42px;height:42px;flex:0 0 42px;border-radius:14px;display:grid;place-items:center;font-size:19px;font-weight:900;background:#edf8f1;color:#087443}
.daily-budget-copy{flex:1;min-width:0}
.daily-budget-title-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:4px}
.daily-budget-title-row b{font-size:13px}
.daily-budget-status{font-size:10px;font-weight:800;border-radius:999px;padding:3px 7px;background:#edf8f1;color:#087443}
.daily-budget-values{display:flex;align-items:baseline;gap:5px;flex-wrap:wrap;font-size:12px;color:#7a8494}
.daily-budget-values strong{font-size:16px;color:#182230}.daily-budget-remaining{margin-left:auto;font-weight:700;color:#667085}
.daily-budget-progress{height:6px;background:#edf0f4;border-radius:999px;overflow:hidden;margin:8px 0 5px}
.daily-budget-progress span{display:block;width:0;height:100%;border-radius:inherit;background:#18a566;transition:width .3s ease}
.daily-budget-copy>small{display:block;color:#7c8798;font-size:11px}
.budget-edit-btn{border:0;background:#f2f5f9;color:#475467;border-radius:10px;padding:8px 10px;font-weight:800;font-size:11px;cursor:pointer}

.daily-budget-card.status-warning{border-color:#f5d58c;background:#fffdf7}.daily-budget-card.status-warning .daily-budget-icon{background:#fff3cd;color:#9a6700}.daily-budget-card.status-warning .daily-budget-status{background:#fff3cd;color:#8a5b00}.daily-budget-card.status-warning .daily-budget-progress span{background:#e9a400}
.daily-budget-card.status-reached{border-color:#f7b7a7;background:#fff9f7}.daily-budget-card.status-reached .daily-budget-icon{background:#ffebe5;color:#b9381f}.daily-budget-card.status-reached .daily-budget-status{background:#ffebe5;color:#a52b17}.daily-budget-card.status-reached .daily-budget-progress span{background:#e25b3e}
.daily-budget-card.status-exceeded{border-color:#f2aaaa;background:#fff7f7}.daily-budget-card.status-exceeded .daily-budget-icon{background:#ffe4e4;color:#b42318}.daily-budget-card.status-exceeded .daily-budget-status{background:#ffe4e4;color:#b42318}.daily-budget-card.status-exceeded .daily-budget-progress span{background:#d92d20}.daily-budget-card.status-exceeded .daily-budget-remaining{color:#b42318}

#openBudget.budget-warning{border-color:#edca74;background:#fff8df;color:#8a5b00}
#openBudget.budget-reached,#openBudget.budget-exceeded{border-color:#f4b2ad;background:#fff0ef;color:#b42318}

#budgetModal{width:min(650px,calc(100% - 28px))}
.budget-modal-card{max-height:min(86vh,760px);overflow:auto}
.modal-subtitle{margin:4px 0 0;color:#7b8493;font-size:12px}
.budget-toggle-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 14px;border:1px solid #e5e9f0;border-radius:14px;background:#f9fbfd;margin-bottom:12px}
.budget-toggle-row b{display:block;font-size:13px}.budget-toggle-row small{display:block;color:#7d8796;font-size:11px;margin-top:2px}
.switch{position:relative;display:inline-flex;flex:0 0 45px;width:45px;height:26px}.switch input{opacity:0;width:0;height:0}.switch-slider{position:absolute;inset:0;border-radius:999px;background:#cfd5de;cursor:pointer;transition:.2s}.switch-slider:before{content:"";position:absolute;width:20px;height:20px;left:3px;top:3px;background:#fff;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.18);transition:.2s}.switch input:checked+.switch-slider{background:var(--primary)}.switch input:checked+.switch-slider:before{transform:translateX(19px)}
.warning-setting{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px 0}.warning-setting label{margin:0}.warning-percent-input{display:flex;align-items:center;border:1px solid #d9dee8;border-radius:11px;background:#fff;overflow:hidden}.warning-percent-input input{width:72px!important;border:0!important;border-radius:0!important;text-align:right;padding:9px 5px 9px 10px!important;box-shadow:none!important}.warning-percent-input span{padding-right:10px;font-weight:800;color:#596273}
.budget-quick-actions{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0}.chip-btn{border:1px solid #dce2ea;background:#fff;color:#435064;padding:7px 10px;border-radius:999px;font-size:11px;font-weight:800;cursor:pointer}.chip-btn:active{background:#eef4ff;color:#175cd3}
.budget-bulk{display:flex;align-items:end;justify-content:space-between;gap:14px;background:#f7f9fc;border:1px solid #e7ebf1;border-radius:14px;padding:11px 12px;margin:10px 0 12px}.budget-bulk label{margin:0!important}.budget-bulk small{display:block;color:#8b95a5;font-size:10px;margin-top:2px}.budget-bulk-action{display:flex;gap:7px}.budget-bulk-action input{width:130px!important;padding:9px 10px!important;font-size:14px!important}.budget-bulk-action .btn{padding:9px 11px;font-size:11px}
.day-budget-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.day-budget-row{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid #e4e8ef;border-radius:13px;padding:9px 10px;background:#fff;transition:.15s}.day-budget-row.disabled{background:#fafbfc;opacity:.62}.day-check{display:flex!important;align-items:center;gap:7px;margin:0!important;font-size:12px!important;min-width:82px;cursor:pointer}.day-check input{width:17px!important;height:17px!important;padding:0!important;accent-color:var(--primary);box-shadow:none!important}.money-field{display:flex;align-items:center;border:1px solid #dce1e9;border-radius:10px;background:#fff;overflow:hidden;min-width:0}.money-field span{font-size:11px;font-weight:800;color:#6f7888;padding-left:8px}.money-field input{width:105px!important;border:0!important;border-radius:0!important;padding:8px!important;font-size:12px!important;box-shadow:none!important;min-width:0}.money-field input:disabled{background:#f5f6f8;color:#9aa2af}
.budget-legend{display:flex;gap:12px;flex-wrap:wrap;margin:14px 1px 2px;font-size:10px;color:#6f7888}.budget-legend span{display:flex;align-items:center;gap:5px}.legend-dot{width:8px;height:8px;border-radius:50%;background:#18a566}.legend-dot.warning{background:#e9a400}.legend-dot.reached{background:#e25b3e}.legend-dot.exceeded{background:#d92d20}
.budget-nav-alert{position:absolute;top:2px;left:calc(50% + 8px);min-width:17px;height:17px;padding:0 4px;border-radius:999px;background:#e9a400;color:#fff;font-size:9px;display:grid;place-items:center;border:2px solid #fff;font-weight:900}.budget-nav-alert.reached,.budget-nav-alert.exceeded{background:#d92d20}

@media (max-width:760px){
  .user-actions #openBudget,.user-actions #openSetting{display:none!important}
  .daily-budget-card{margin:0 0 9px!important;border-radius:17px!important;box-shadow:0 5px 16px rgba(31,45,70,.045)!important}
  .daily-budget-main{padding:10px 11px!important;gap:9px!important}.daily-budget-icon{width:34px!important;height:34px!important;flex-basis:34px!important;border-radius:11px!important;font-size:15px!important}
  .daily-budget-title-row{margin-bottom:2px!important;gap:6px!important}.daily-budget-title-row b{font-size:11px!important}.daily-budget-status{font-size:9px!important;padding:2px 6px!important}
  .daily-budget-values{font-size:10px!important;gap:4px!important}.daily-budget-values strong{font-size:13px!important}.daily-budget-remaining{font-size:10px!important}
  .daily-budget-progress{height:4px!important;margin:5px 0 0!important}.daily-budget-copy>small{display:none!important}.budget-edit-btn{padding:6px 8px!important;font-size:10px!important;border-radius:9px!important}
  .has-daily-budget .chat-card,.has-daily-budget .transactions-panel{height:calc(100dvh - 365px)!important;min-height:325px!important}
  .mobile-bottom-nav{grid-template-columns:repeat(4,1fr)!important}
  #budgetModal{width:100%!important;max-width:none!important}.budget-modal-card{max-height:88dvh!important;overflow:auto!important}
  .budget-toggle-row{padding:11px 12px!important}.warning-setting{margin:10px 0!important}.budget-bulk{display:block!important;padding:10px!important}.budget-bulk-action{margin-top:8px!important}.budget-bulk-action input{flex:1!important;width:auto!important}.day-budget-list{grid-template-columns:1fr!important;gap:6px!important}.day-budget-row{padding:8px 9px!important}.money-field input{width:120px!important}.budget-legend{gap:8px!important;margin-top:11px!important}
}

@media (max-width:390px){
  .has-daily-budget .chat-card,.has-daily-budget .transactions-panel{height:calc(100dvh - 354px)!important;min-height:305px!important}
  .daily-budget-remaining{display:none!important}
  .money-field input{width:105px!important}
}

@media (max-height:700px) and (max-width:760px){
  .has-daily-budget .chat-card,.has-daily-budget .transactions-panel{height:calc(100dvh - 326px)!important;min-height:285px!important}
}

/* ===== FOTO / OCR NOTA ===== */
.composer-wrap{position:relative}
.chat-foot form{display:flex;align-items:center;gap:8px}
.attach-btn{width:42px;height:42px;flex:0 0 42px;border:0;background:#eef4ff;color:#2563d9;border-radius:13px;display:grid;place-items:center;cursor:pointer;transition:.18s ease}
.attach-btn:hover{background:#dfeaff}.attach-btn:disabled{opacity:.55;cursor:not-allowed}
.attach-btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.photo-source-menu{position:absolute;left:0;bottom:62px;width:260px;background:#fff;border:1px solid #e3e9f2;border-radius:18px;box-shadow:0 18px 45px rgba(31,45,70,.16);padding:8px;z-index:80}
.photo-source-menu[hidden]{display:none!important}
.photo-source-menu button{width:100%;display:grid;grid-template-columns:40px 1fr;grid-template-rows:auto auto;column-gap:10px;text-align:left;border:0;background:transparent;border-radius:13px;padding:10px;cursor:pointer;color:#1b2430}
.photo-source-menu button:hover{background:#f4f7fb}.photo-source-menu button>span{grid-row:1/3;width:38px;height:38px;border-radius:12px;background:#edf4ff;color:#2563d9;display:grid;place-items:center;font-size:18px}.photo-source-menu b{font-size:13px;align-self:end}.photo-source-menu small{font-size:10px;color:#7b8798;margin:2px 0 0!important;display:block!important}
.photo-preview-wrap{display:grid;grid-template-columns:64px 1fr 28px;gap:10px;align-items:center;margin-bottom:9px;padding:9px;background:#f7f9fc;border:1px solid #e1e7ef;border-radius:16px}
.photo-preview-wrap[hidden]{display:none!important}
.photo-preview-thumb{width:64px;height:64px;border-radius:12px;overflow:hidden;background:#e9eef5}.photo-preview-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.photo-preview-info{min-width:0;display:flex;flex-direction:column;gap:3px}.photo-preview-info>b{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.photo-preview-info>span{font-size:10px;color:#6f7c90}.ocr-status.scanning{color:#2563d9!important}.ocr-status.success{color:#15834f!important}.ocr-status.warning{color:#b26a00!important}.ocr-status.muted{color:#8a95a6!important}
.photo-preview-info select{margin-top:4px;width:100%;height:31px;padding:0 28px 0 9px;border:1px solid #dbe2ec;border-radius:9px;background:#fff;color:#384457;font-size:10px;outline:none}
.ocr-result{font-size:10px!important;font-weight:700;padding:4px 7px;border-radius:8px;width:max-content;max-width:100%}.ocr-result.found{background:#eaf8f0;color:#157646}.ocr-result.possible{background:#fff5df;color:#9a6200}.ocr-result.not-found{background:#f1f3f7;color:#6f7a8b}
.remove-photo-btn{align-self:start;width:27px;height:27px;border:0;background:#fff;color:#7d8898;border-radius:9px;font-size:20px;line-height:1;cursor:pointer;box-shadow:0 1px 5px rgba(0,0,0,.07)}

.stored-photo{border:0;padding:0;margin:0 0 8px;background:transparent;display:block;max-width:260px;border-radius:14px;overflow:hidden;cursor:pointer}.stored-photo img{display:block;width:100%;max-height:220px;object-fit:cover;background:#e8edf4}.bubble.user .stored-photo{margin-left:auto}.bubble.has-photo{padding:7px}.bubble.has-photo .bubble-text{padding:3px 5px 4px}.stored-photo.temp{pointer-events:none}
.stored-photo.compact{width:44px;height:44px;flex:0 0 44px;margin:0;border-radius:12px}.stored-photo.compact img{width:44px;height:44px;object-fit:cover}
.scan-badge{display:inline-flex;align-items:center;margin-left:5px;padding:2px 6px;border-radius:999px;background:#eaf2ff;color:#2563d9;font-size:8px;font-weight:800;text-transform:uppercase;letter-spacing:.25px;vertical-align:middle}

.photo-viewer-dialog{border:0;padding:0;background:transparent;max-width:min(94vw,900px);max-height:94vh}.photo-viewer-dialog::backdrop{background:rgba(10,16,26,.82);backdrop-filter:blur(4px)}.photo-viewer-card{position:relative;display:grid;place-items:center}.photo-viewer-card img{display:block;max-width:92vw;max-height:90vh;border-radius:16px;object-fit:contain;background:#111}.photo-viewer-close{position:absolute;right:10px;top:10px;z-index:2;width:38px;height:38px;border:0;border-radius:999px;background:rgba(20,25,32,.75);color:#fff;font-size:25px;cursor:pointer}

@media (max-width:760px){
  .photo-source-menu{position:fixed;left:12px;right:12px;bottom:calc(var(--mobile-nav-h) + 12px);width:auto;border-radius:20px;padding:10px;z-index:1200}.composer-focus .photo-source-menu{bottom:76px}
  .photo-source-menu button{padding:12px}.photo-source-menu button>span{width:42px;height:42px}.photo-source-menu b{font-size:14px}.photo-source-menu small{font-size:11px!important}
  .photo-preview-wrap{grid-template-columns:56px 1fr 26px;margin:0 0 7px;padding:7px;border-radius:14px}.photo-preview-thumb{width:56px;height:56px}.photo-preview-info select{height:29px}
  .chat-foot form{gap:5px!important}.attach-btn{width:42px!important;height:42px!important;flex-basis:42px!important;border-radius:13px!important}
  .stored-photo{max-width:min(72vw,250px)}.stored-photo img{max-height:210px}.stored-photo.compact{width:40px;height:40px;flex-basis:40px}.stored-photo.compact img{width:40px;height:40px}
}

/* ===== COLLAPSIBLE APP SIDEBAR ===== */
.app-main{padding-top:76px}
.sidebar-toggle{position:fixed;z-index:1450;top:18px;left:18px;width:46px;height:46px;border:1px solid #dce3ee;border-radius:15px;background:rgba(255,255,255,.96);color:#1f2937;box-shadow:0 8px 24px rgba(31,45,70,.12);display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);transition:.18s ease}
.sidebar-toggle:hover{background:#fff;box-shadow:0 10px 28px rgba(31,45,70,.16);transform:translateY(-1px)}
.sidebar-toggle:active{transform:scale(.96)}
.sidebar-toggle svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.sidebar-backdrop{position:fixed;inset:0;z-index:1490;background:rgba(15,23,42,.34);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);opacity:0;transition:opacity .22s ease}
.sidebar-backdrop.is-visible{opacity:1}
.app-sidebar{position:fixed;z-index:1500;inset:0 auto 0 0;width:min(340px,88vw);padding:18px;background:#fff;border-right:1px solid #e4e9f1;box-shadow:18px 0 50px rgba(15,23,42,.15);display:flex;flex-direction:column;transform:translateX(-105%);transition:transform .24s cubic-bezier(.2,.8,.2,1);overflow-y:auto;overscroll-behavior:contain}
.app-sidebar.is-open{transform:translateX(0)}
.sidebar-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:3px 2px 17px;border-bottom:1px solid #edf1f6}
.sidebar-brand{display:flex;align-items:center;gap:11px;min-width:0}.sidebar-brand-mark{width:42px;height:42px;display:grid;place-items:center;border-radius:14px;background:#edf4ff;font-size:22px}.sidebar-brand>div{min-width:0}.sidebar-brand b{display:block;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-brand small{display:block;color:#8993a4;font-size:11px;margin-top:2px}
.sidebar-close{width:38px;height:38px;flex:0 0 38px;border:0;border-radius:12px;background:#f4f6f9;color:#566173;font-size:25px;line-height:1;cursor:pointer}
.sidebar-profile{display:flex;align-items:center;gap:11px;margin:17px 0 14px;padding:13px;border:1px solid #e4e9f2;border-radius:16px;background:#f8faff}.sidebar-profile .avatar.small{width:38px;height:38px;font-size:15px}.sidebar-profile small{display:block;color:#8a94a5;font-size:10px;margin-bottom:2px}.sidebar-profile strong{display:block;font-size:14px}
.sidebar-menu{display:grid;gap:7px}.sidebar-menu-item{width:100%;border:0;background:transparent;color:#243044;border-radius:15px;padding:11px 10px;display:grid;grid-template-columns:42px 1fr 18px;align-items:center;gap:10px;text-align:left;cursor:pointer;transition:.16s ease}.sidebar-menu-item:hover{background:#f3f7fd}.sidebar-menu-item:active{transform:scale(.985)}.sidebar-menu-icon{width:42px;height:42px;border-radius:13px;background:#edf4ff;color:#2563d9;display:grid;place-items:center}.sidebar-menu-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.sidebar-menu-item b{display:block;font-size:13px}.sidebar-menu-item small{display:block;color:#8b95a5;font-size:10px;margin-top:2px}.sidebar-arrow{color:#a3acba;font-size:24px;line-height:1}.sidebar-menu-item.budget-warning{background:#fff8e8}.sidebar-menu-item.budget-reached,.sidebar-menu-item.budget-exceeded{background:#fff1f1}
.sidebar-logout-form{margin-top:auto;padding-top:18px}.sidebar-logout{width:100%;border:1px solid #ffd5d1;background:#fff6f5;color:#b42318;border-radius:14px;padding:12px 14px;display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer}.sidebar-logout:active{transform:scale(.985)}
body.sidebar-open{overflow:hidden}

@media (min-width:1280px){
  .sidebar-toggle{left:max(18px,calc((100vw - 1180px)/2 - 62px))}
}

@media (max-width:760px){
  .app-main{padding-top:68px!important}
  .sidebar-toggle{top:calc(10px + env(safe-area-inset-top));left:12px;width:44px;height:44px;border-radius:14px}
  .app-sidebar{width:min(330px,90vw);padding:14px 14px calc(18px + env(safe-area-inset-bottom));padding-top:calc(14px + env(safe-area-inset-top))}
  .sidebar-head{padding-bottom:14px}.sidebar-profile{margin-top:14px}
}

@media (max-width:390px){
  .app-main{padding-top:64px!important}
  .sidebar-toggle{width:42px;height:42px}.sidebar-toggle svg{width:21px;height:21px}
}


/* ===== HAPUS RIWAYAT CHAT ===== */
.chat-panel-head{gap:12px}.chat-head-actions{display:flex!important;flex-direction:row!important;align-items:center;gap:8px;margin-left:auto}.clear-chat-btn{height:32px;border:1px solid #f3d1ce;background:#fff8f7;color:#b42318;border-radius:10px;padding:0 9px;display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:11px;font-weight:700;cursor:pointer;transition:.16s ease}.clear-chat-btn[hidden]{display:none!important}.clear-chat-btn:hover{background:#fff1ef;border-color:#f2bdb8}.clear-chat-btn:active{transform:scale(.97)}.clear-chat-btn svg,.chat-delete-btn svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chat-row{width:100%;display:flex;align-items:flex-end;gap:6px}.chat-row.user{justify-content:flex-end}.chat-row.assistant{justify-content:flex-start}.chat-row .bubble{margin:7px 0}.chat-row.user .chat-delete-btn{order:-1}.chat-delete-btn{width:30px;height:30px;flex:0 0 30px;border:0;border-radius:9px;background:transparent;color:#98a2b3;display:grid;place-items:center;cursor:pointer;opacity:0;transform:scale(.9);transition:opacity .15s ease,background .15s ease,color .15s ease,transform .15s ease;margin-bottom:2px}.chat-row:hover .chat-delete-btn,.chat-delete-btn:focus-visible{opacity:1;transform:scale(1)}.chat-delete-btn:hover{background:#fff0ef;color:#b42318}.system-greeting .bubble{margin:7px 0}
.system-greeting .chat-welcome{max-width:min(92%,760px);padding:16px 18px;background:linear-gradient(145deg,#f3f7fd,#eef3f9);border:1px solid rgba(33,102,216,.08);box-shadow:0 10px 26px rgba(31,55,91,.06)}
.chat-welcome-title{display:block;font-size:16px;line-height:1.35;margin-bottom:6px;color:#182436}
.chat-welcome-copy{display:block;color:#536176;line-height:1.55}
.chat-welcome-suggestions{display:flex;flex-wrap:wrap;gap:7px;margin-top:13px}
.chat-welcome-suggestions button{appearance:none;border:1px solid #d9e3f2;background:#fff;color:#28415f;border-radius:999px;padding:7px 11px;font:inherit;font-size:12px;font-weight:700;line-height:1.2;cursor:pointer;box-shadow:0 2px 7px rgba(31,55,91,.04);transition:transform .15s ease,border-color .15s ease,background .15s ease}
.chat-welcome-suggestions button:hover{border-color:#9ebcf0;background:#f9fbff;transform:translateY(-1px)}
.chat-welcome-suggestions button:active{transform:translateY(0)}
@media(max-width:760px){.system-greeting .chat-welcome{max-width:96%!important;padding:14px 14px!important}.chat-welcome-title{font-size:15px}.chat-welcome-copy{font-size:13px}.chat-welcome-suggestions{display:grid;grid-template-columns:1fr 1fr;gap:7px}.chat-welcome-suggestions button{width:100%;padding:8px 9px;font-size:11px;text-align:center}}

@media (max-width:760px){
  .chat-panel-head>b{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-head-actions{gap:5px}.clear-chat-btn{width:32px;height:32px;padding:0;justify-content:center;border-color:#e7ebf1;background:#f7f8fa;color:#667085}.clear-chat-btn span{display:none}.clear-chat-btn svg{width:16px;height:16px}.offline{white-space:nowrap}
  .chat-row{gap:4px}.chat-row .bubble{max-width:84%!important}.chat-delete-btn{opacity:.62;transform:none;width:28px;height:28px;flex-basis:28px;border-radius:9px;color:#98a2b3}.chat-delete-btn:active{background:#fff0ef;color:#b42318;transform:scale(.93)}
}

/* ===== DESKTOP SIDEBAR V2 ===== */
:root{--desktop-sidebar-w:286px;--desktop-sidebar-gap:28px}

@media (min-width:761px){
  body{background:linear-gradient(180deg,#f5f8fc 0%,#f2f5fa 100%)}
  .sidebar-toggle{display:none!important}
  .sidebar-backdrop{display:none!important}
  .app-sidebar{
    transform:none!important;
    width:var(--desktop-sidebar-w)!important;
    inset:16px auto 16px 16px!important;
    height:auto!important;
    padding:18px 16px!important;
    border:1px solid #e3e9f2!important;
    border-radius:24px!important;
    box-shadow:0 18px 48px rgba(30,47,74,.09)!important;
    background:linear-gradient(180deg,#fff 0%,#fbfcff 100%)!important;
    z-index:100!important;
    overflow:hidden auto!important;
  }
  .app-sidebar[aria-hidden="true"]{visibility:visible!important}
  .sidebar-close{display:none!important}
  .sidebar-head{padding:3px 3px 18px!important;border-bottom:0!important}
  .sidebar-brand{gap:12px!important}
  .sidebar-brand-mark{
    width:46px!important;height:46px!important;border-radius:15px!important;
    background:linear-gradient(145deg,#2e70df,#1653bc)!important;
    box-shadow:0 10px 22px rgba(23,92,211,.22)!important;
    color:#fff!important;font-size:22px!important
  }
  .sidebar-brand b{font-size:15px!important;letter-spacing:-.15px!important}
  .sidebar-brand small{font-size:10px!important;color:#8c97a8!important;margin-top:3px!important}
  .sidebar-profile{
    margin:7px 0 20px!important;padding:13px!important;border:1px solid #e6ecf4!important;
    border-radius:17px!important;background:linear-gradient(135deg,#f7faff,#f1f6ff)!important;
  }
  .sidebar-profile .avatar.small{
    width:42px!important;height:42px!important;font-size:16px!important;
    background:#fff!important;border:1px solid #d8e4f7!important;box-shadow:0 4px 12px rgba(32,73,142,.08)!important
  }
  .sidebar-profile small{font-size:9px!important;text-transform:uppercase;letter-spacing:.55px;color:#8b96a7!important}
  .sidebar-profile strong{font-size:14px!important;line-height:1.2!important}
  .sidebar-section-label{padding:0 9px 8px;color:#9aa4b4;font-size:9px;font-weight:800;letter-spacing:.8px}
  .sidebar-menu{gap:5px!important}
  .sidebar-menu-item{
    grid-template-columns:40px minmax(0,1fr) 16px!important;gap:10px!important;
    min-height:58px!important;padding:8px 9px!important;border-radius:15px!important;
    color:#39465a!important
  }
  .sidebar-menu-item:hover{background:#f2f6fc!important;color:#1f4f9f!important}
  .sidebar-menu-item-active{background:#edf4ff!important;color:#1a58c3!important}
  .sidebar-menu-icon{width:40px!important;height:40px!important;border-radius:12px!important;background:#edf4ff!important;color:#2563d9!important}
  .sidebar-menu-item-active .sidebar-menu-icon{background:#fff!important;box-shadow:0 4px 12px rgba(37,99,217,.10)!important}
  .sidebar-menu-icon svg{width:19px!important;height:19px!important}
  .sidebar-menu-item b{font-size:12px!important}
  .sidebar-menu-item small{font-size:9px!important;color:#8e98a8!important;margin-top:2px!important}
  .sidebar-arrow{font-size:20px!important}
  .sidebar-local-status{
    margin-top:auto;display:flex;align-items:center;gap:10px;padding:12px 11px;border-radius:15px;
    background:#f7faf8;border:1px solid #e3eee7;color:#3f4e46
  }
  .sidebar-local-dot{width:9px;height:9px;border-radius:50%;background:#169b5b;box-shadow:0 0 0 4px rgba(22,155,91,.10)}
  .sidebar-local-status b{display:block;font-size:11px}.sidebar-local-status small{display:block;font-size:9px;color:#849087;margin-top:2px}
  .sidebar-logout-form{margin-top:9px!important;padding-top:0!important}
  .sidebar-logout{min-height:45px!important;border-radius:13px!important;font-size:12px!important;background:#fff9f8!important;border-color:#f4d4d0!important}

  .app-main{
    width:auto!important;
    max-width:1400px!important;
    margin-left:calc(var(--desktop-sidebar-w) + var(--desktop-sidebar-gap) + 16px)!important;
    margin-right:24px!important;
    padding:24px 0 34px!important;
  }
  .stats{gap:14px!important;margin-bottom:16px!important}
  .stat{min-height:94px!important;padding:18px 19px!important;border-radius:19px!important;box-shadow:0 8px 24px rgba(31,45,70,.05)!important}
  .stat-icon{width:44px!important;height:44px!important;flex-basis:44px!important;border-radius:14px!important}
  .stat small{font-size:11px!important;margin-bottom:5px!important}
  .stat strong{font-size:20px!important}
  .balance-stat{box-shadow:0 15px 32px rgba(23,92,211,.18)!important}
  .grid{gap:16px!important;grid-template-columns:minmax(0,1.5fr) minmax(330px,.85fr)!important}
  .panel{border-radius:20px!important;box-shadow:0 9px 28px rgba(31,45,70,.055)!important}
  .panel-head{min-height:60px!important;padding:0 18px!important}
  .chat-card{height:calc(100vh - 164px)!important;min-height:600px!important;max-height:820px!important}
  .tx-list{max-height:calc(min(820px,100vh - 164px) - 60px)!important}
  body.sidebar-open{overflow:auto!important}
}

@media (min-width:761px) and (max-width:1120px){
  :root{--desktop-sidebar-w:246px;--desktop-sidebar-gap:20px}
  .app-sidebar{left:12px!important;top:12px!important;bottom:12px!important;padding:15px 13px!important}
  .sidebar-brand small,.sidebar-menu-item small{display:none!important}
  .sidebar-menu-item{min-height:52px!important}
  .app-main{margin-left:calc(var(--desktop-sidebar-w) + var(--desktop-sidebar-gap) + 12px)!important;margin-right:16px!important}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .grid{grid-template-columns:1fr!important}
  .chat-card{height:66vh!important;min-height:540px!important}.tx-list{max-height:520px!important}
}

/* Mobile: sidebar remains hidden by default and opens only from the menu button */
@media (max-width:760px){
  .sidebar-section-label{padding:0 8px 7px;color:#9aa4b4;font-size:9px;font-weight:800;letter-spacing:.75px}
  .sidebar-local-status{margin-top:auto;display:flex;align-items:center;gap:9px;padding:11px;border-radius:14px;background:#f7faf8;border:1px solid #e3eee7}
  .sidebar-local-dot{width:8px;height:8px;border-radius:50%;background:#169b5b;box-shadow:0 0 0 4px rgba(22,155,91,.10)}
  .sidebar-local-status b{display:block;font-size:11px}.sidebar-local-status small{display:block;font-size:9px;color:#849087;margin-top:2px}
  .sidebar-menu-item-active{background:#edf4ff!important;color:#1a58c3!important}
  .sidebar-toggle{box-shadow:0 7px 20px rgba(31,45,70,.10)!important}
  .app-sidebar{box-shadow:20px 0 55px rgba(15,23,42,.20)!important}
}

/* ===== DESKTOP VIEWPORT FIT V3 =====
   Keep the chat composer visible without scrolling the whole page.
   The chat history and transaction list scroll inside their own cards. */
@media (min-width:1121px){
  html,body{height:100%;min-height:100%;}
  body{overflow:hidden;}

  .app-main{
    height:100dvh!important;
    min-height:0!important;
    padding:18px 0 18px!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
  }

  .stats{
    flex:0 0 auto!important;
    margin-bottom:12px!important;
  }
  .stat{
    min-height:86px!important;
    padding:15px 17px!important;
  }
  .stat-icon{
    width:42px!important;
    height:42px!important;
    flex-basis:42px!important;
  }
  .stat strong{font-size:19px!important;}

  .daily-budget-card{
    flex:0 0 auto!important;
    margin-bottom:12px!important;
  }
  .daily-budget-main{padding:11px 14px!important;}
  .daily-budget-icon{
    width:38px!important;
    height:38px!important;
    flex-basis:38px!important;
    border-radius:12px!important;
  }
  .daily-budget-progress{margin:6px 0 4px!important;}

  .grid{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    overflow:hidden!important;
    align-items:stretch!important;
  }

  .chat-card,
  .transactions-panel{
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
  }

  .chat-card{
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
  }
  .chat-card .panel-head{flex:0 0 auto!important;}
  .chat-body{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow-y:auto!important;
  }
  .chat-foot{
    position:relative!important;
    z-index:3!important;
    flex:0 0 auto!important;
    padding:10px 12px 10px!important;
    box-shadow:0 -8px 22px rgba(31,45,70,.035)!important;
  }
  .chat-foot form{min-height:46px!important;}
  .chat-foot small{margin-top:6px!important;font-size:10px!important;}

  .transactions-panel{
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
  }
  .transactions-panel .panel-head{flex:0 0 auto!important;}
  .transactions-panel .tx-list{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    overflow-y:auto!important;
  }
}

/* Short desktop screens: compact the upper summary so the composer is still visible. */
@media (min-width:1121px) and (max-height:760px){
  .app-main{padding-top:12px!important;padding-bottom:12px!important;}
  .stats{margin-bottom:9px!important;}
  .stat{min-height:72px!important;padding:11px 14px!important;}
  .stat-icon{width:36px!important;height:36px!important;flex-basis:36px!important;border-radius:11px!important;}
  .stat small{font-size:10px!important;margin-bottom:3px!important;}
  .stat strong{font-size:17px!important;}
  .daily-budget-card{margin-bottom:9px!important;}
  .daily-budget-main{padding:8px 11px!important;}
  .daily-budget-icon{width:34px!important;height:34px!important;flex-basis:34px!important;}
  .daily-budget-copy>small{display:none!important;}
  .daily-budget-title-row{margin-bottom:2px!important;}
  .daily-budget-progress{height:4px!important;margin:4px 0 0!important;}
  .panel-head{min-height:52px!important;}
  .chat-foot{padding:8px 10px!important;}
  .chat-foot small{display:none!important;}
}

/* =========================================================
   PEMBELAJARAN ASISTEN LOKAL
   ========================================================= */
.learning-count{min-width:24px;height:24px;padding:0 7px;border-radius:999px;background:#edf4ff;color:#1f5fd4;display:grid;place-items:center;font-size:10px;font-weight:800}
.learning-pending-card{display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:10px;margin:0 0 9px;padding:9px 10px;border:1px solid #cfe0ff;background:linear-gradient(135deg,#f3f7ff,#eef5ff);border-radius:14px;color:#23426f}
.learning-pending-card[hidden]{display:none!important}.learning-pending-icon{width:34px;height:34px;border-radius:11px;background:#dce9ff;color:#175cd3;display:grid;place-items:center;font-weight:900}.learning-pending-copy{min-width:0}.learning-pending-copy b{display:block;font-size:11px;color:#1753b8}.learning-pending-copy span{display:block;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}.learning-pending-card button{border:0;background:#fff;color:#526273;border-radius:10px;padding:7px 9px;font-size:10px;font-weight:800;cursor:pointer;box-shadow:0 1px 2px rgba(16,24,40,.06)}
.learning-active .chat-foot form{border-color:#aac8ff!important;box-shadow:0 0 0 3px rgba(23,92,211,.07)}
.learning-dialog{width:min(720px,calc(100% - 28px))}.learning-modal-card{padding:22px;max-height:min(84vh,780px);overflow:auto}.learning-info-box{display:grid;gap:4px;padding:13px 14px;border-radius:15px;background:#f5f8fd;border:1px solid #e2e9f4;margin-bottom:15px;color:#526273}.learning-info-box b{color:#172235;font-size:12px}.learning-info-box span,.learning-info-box small{font-size:11px;line-height:1.45}.learning-info-box code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:#eaf1ff;color:#1b56bb;padding:2px 5px;border-radius:5px}.learning-form-grid{display:grid;gap:11px;padding:14px;border:1px solid #e5eaf2;border-radius:16px;background:#fff}.learning-form-grid label{margin:0}.learning-form-grid textarea{width:100%;border:1px solid #d9dee8;border-radius:12px;padding:12px 13px;font:inherit;font-size:14px;outline:none;resize:vertical;min-height:76px}.learning-form-grid textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(23,92,211,.10)}.learning-form-grid .btn{justify-self:end}.learning-list-head{display:flex;align-items:center;justify-content:space-between;margin:18px 1px 8px}.learning-list-head b{font-size:13px}.learning-list-head span{font-size:10px;color:#8b95a5}.learning-rule-list{display:grid;gap:8px}.learning-rule{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;padding:11px 12px;border:1px solid #e6eaf1;border-radius:14px;background:#fbfcfe}.learning-rule-main{min-width:0;display:grid;grid-template-columns:minmax(90px,.7fr) 18px minmax(140px,1.3fr);align-items:center;gap:8px}.learning-trigger{font-size:11px;font-weight:800;color:#1f4f9f;background:#edf4ff;border-radius:9px;padding:6px 8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.learning-arrow{color:#9aa4b3;text-align:center}.learning-answer{font-size:11px;color:#3a4657;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.learning-delete{border:0;background:#fff1f1;color:#c3312b;border-radius:9px;padding:7px 9px;font-size:10px;font-weight:800;cursor:pointer}

@media(max-width:760px){
  .learning-count{margin-left:auto}.learning-pending-card{grid-template-columns:30px 1fr auto;padding:8px;border-radius:12px}.learning-pending-icon{width:30px;height:30px;border-radius:9px}.learning-pending-copy span{font-size:10px}.learning-dialog{width:100%!important;max-width:none!important}.learning-modal-card{padding:18px 15px calc(18px + env(safe-area-inset-bottom));max-height:88dvh}.learning-form-grid .btn{width:100%;justify-self:stretch}.learning-rule-main{grid-template-columns:1fr;gap:4px}.learning-arrow{display:none}.learning-trigger,.learning-answer{white-space:normal}.learning-rule{align-items:start}}

/* =========================================================
   MOBILE VIEWPORT FIT V4
   Composer selalu terlihat; hanya riwayat chat yang scroll.
   --app-vh diisi JS dari Visual Viewport agar aman saat keyboard terbuka.
   ========================================================= */
@media (max-width:760px){
  :root{--app-vh:100dvh;--mobile-nav-h:72px}

  html,body{
    height:100%;
    min-height:100%;
    overflow:hidden!important;
    overscroll-behavior:none;
  }

  body{
    padding-bottom:0!important;
    min-height:0!important;
  }

  .app-main{
    width:100%!important;
    height:calc(var(--app-vh,100dvh) - var(--mobile-nav-h))!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:calc(64px + env(safe-area-inset-top)) 10px 8px!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
  }

  .stats{
    flex:0 0 auto!important;
    min-height:0!important;
  }

  .daily-budget-card{
    flex:0 0 auto!important;
  }

  .grid{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    width:100%!important;
    overflow:hidden!important;
  }

  .mobile-view{
    min-height:0!important;
    max-height:none!important;
  }

  .chat-card.mobile-view.active,
  .transactions-panel.mobile-view.active{
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    overflow:hidden!important;
  }

  .chat-card.mobile-view.active{
    display:flex!important;
    flex-direction:column!important;
  }

  .chat-card .panel-head{
    flex:0 0 auto!important;
  }

  .chat-body{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
    padding-bottom:18px!important;
  }

  .chat-foot{
    position:relative!important;
    inset:auto!important;
    z-index:20!important;
    flex:0 0 auto!important;
    margin:0!important;
    background:rgba(255,255,255,.98)!important;
    box-shadow:0 -10px 24px rgba(31,45,70,.045)!important;
  }

  .composer-wrap,
  .chat-foot form{
    flex:0 0 auto!important;
  }

  .transactions-panel.mobile-view.active{
    display:flex!important;
    flex-direction:column!important;
  }

  .transactions-panel .panel-head{
    flex:0 0 auto!important;
  }

  .transactions-panel .tx-list{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
  }

  /* Saat keyboard muncul, navbar bawah disembunyikan dan ruang penuh diberikan ke chat. */
  body.composer-focus .app-main{
    height:var(--app-vh,100dvh)!important;
    padding-top:8px!important;
    padding-bottom:calc(6px + env(safe-area-inset-bottom))!important;
  }

  body.composer-focus .stats,
  body.composer-focus .daily-budget-card{
    display:none!important;
  }

  body.composer-focus .grid{
    flex:1 1 auto!important;
  }

  body.composer-focus .chat-card.mobile-view.active{
    border-radius:18px!important;
  }

  body.composer-focus .mobile-bottom-nav{
    transform:translateY(115%)!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }

  /* Preview foto / mode belajar boleh membesar; body chat otomatis mengecil. */
  .photo-preview-wrap,
  .learning-pending-card{
    flex:0 0 auto!important;
  }
}

@media (max-width:760px) and (max-height:620px){
  .app-main{
    padding-top:58px!important;
  }
  .balance-stat{
    min-height:66px!important;
    padding:10px 14px!important;
  }
  .balance-stat strong{font-size:22px!important}
  .income-stat,.expense-stat,.initial-stat{
    min-height:50px!important;
    padding:7px 8px!important;
  }
  .daily-budget-main{padding:7px 9px!important}
  .daily-budget-icon{width:30px!important;height:30px!important;flex-basis:30px!important}
  body.composer-focus .app-main{padding-top:6px!important}
}

/* =========================================================
   FILTER & SORT TRANSAKSI
   ========================================================= */
.tx-filter-wrap{
  flex:0 0 auto;
  border-bottom:1px solid #edf0f4;
  background:linear-gradient(180deg,#fbfcff 0%,#fff 100%);
}
.tx-filter-toggle{
  width:100%;height:44px;padding:0 14px;border:0;background:transparent;color:#344054;
  display:flex;align-items:center;gap:8px;font:inherit;font-size:11px;font-weight:800;cursor:pointer;text-align:left;
}
.tx-filter-toggle:hover{background:#f6f8fc}
.tx-filter-toggle-icon{width:28px;height:28px;border-radius:9px;background:#edf4ff;color:#175cd3;display:grid;place-items:center;flex:0 0 28px}
.tx-filter-toggle-icon svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tx-filter-chevron{margin-left:auto;color:#98a2b3;font-size:15px;transition:transform .18s ease}
.tx-filter-toggle.is-open .tx-filter-chevron{transform:rotate(180deg)}
.tx-filter-toggle.has-active-filter{color:#175cd3}
.tx-filter-active-count{min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:#175cd3;color:#fff;display:grid;place-items:center;font-size:9px;font-weight:900}
.tx-filter-active-count[hidden]{display:none!important}
.tx-filter-panel{padding:0 13px 12px}
.tx-filter-panel[hidden]{display:none!important}
.tx-filter-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.tx-filter-grid label{display:grid;gap:5px;margin:0;color:#667085;font-size:9px;font-weight:800}
.tx-filter-grid input,.tx-filter-grid select{
  width:100%;height:36px;border:1px solid #dfe5ee;border-radius:10px;background:#fff;color:#172235;
  padding:0 9px;font:inherit;font-size:10px;outline:none;min-width:0;
}
.tx-filter-grid input:focus,.tx-filter-grid select:focus{border-color:#8fb6ff;box-shadow:0 0 0 3px rgba(23,92,211,.08)}
.tx-filter-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:10px}
.tx-filter-reset,.tx-filter-apply{height:34px!important;min-height:34px!important;border-radius:10px!important;padding:0 12px!important;font-size:10px!important;font-weight:800!important}
.tx-filter-reset{border:1px solid #dfe5ee;background:#fff;color:#667085;cursor:pointer}
.tx-filter-summary{min-height:36px;padding:0 14px 9px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:#7b8798;font-size:9px}
.tx-filter-summary>span{padding:5px 7px;border-radius:8px;background:#f6f8fb;white-space:nowrap}
.tx-filter-summary b{color:#344054}.tx-summary-expense b{color:#b42318}.tx-summary-income b{color:#067647}
.tx-empty-filter button{margin-top:10px;border:1px solid #dce5f3;background:#fff;color:#175cd3;border-radius:10px;padding:7px 10px;font:inherit;font-size:10px;font-weight:800;cursor:pointer}

@media (min-width:761px){
  .transactions-panel .tx-list{flex:1 1 auto!important;min-height:0!important;max-height:none!important;overflow-y:auto!important}
}

@media (max-width:760px){
  .transactions-panel.mobile-view.active{display:flex!important;flex-direction:column!important}
  .tx-filter-wrap{flex:0 0 auto}
  .tx-filter-toggle{height:46px;padding:0 13px;font-size:12px}
  .tx-filter-toggle-icon{width:30px;height:30px;flex-basis:30px}
  .tx-filter-panel{padding:2px 12px 12px;background:#f8faff;border-top:1px solid #eef2f7}
  .tx-filter-grid{grid-template-columns:1fr 1fr;gap:8px}
  .tx-filter-grid label{font-size:9px}
  .tx-filter-grid input,.tx-filter-grid select{height:39px;font-size:11px;border-radius:11px}
  .tx-filter-actions{margin-top:9px}
  .tx-filter-reset,.tx-filter-apply{height:38px!important;min-height:38px!important;flex:1}
  .tx-filter-summary{padding:0 12px 8px;gap:5px;font-size:9px;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}
  .tx-filter-summary::-webkit-scrollbar{display:none}
  .transactions-panel .tx-list{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important}
}

@media (max-width:430px){
  .tx-filter-grid{grid-template-columns:1fr}
  .tx-filter-panel{max-height:290px;overflow-y:auto}
}

/* ===== Download laporan transaksi / rekening koran ===== */
.tx-report-download{
  margin-left:auto;
  height:30px;
  padding:0 10px;
  border:1px solid #cfe0ff;
  border-radius:9px;
  background:#edf4ff;
  color:#175cd3;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  font:inherit;
  font-weight:850;
  cursor:pointer;
  white-space:nowrap;
  transition:background .16s ease,border-color .16s ease,transform .16s ease;
}
.tx-report-download:hover{background:#e1ecff;border-color:#aac8ff}
.tx-report-download:active{transform:translateY(1px)}
.tx-report-download svg{
  width:14px;
  height:14px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}

@media (max-width:760px){
  .tx-report-download{
    height:31px;
    padding:0 10px;
    border-radius:9px;
    flex:0 0 auto;
    font-size:9px;
  }
}

/* ===== PAKET FITUR LENGKAP ===== */
.auth-logo{width:72px;height:72px;margin:0 auto 10px;border-radius:22px;overflow:hidden;box-shadow:0 12px 30px rgba(23,92,211,.18);background:#fff}.auth-logo img{width:100%;height:100%;object-fit:cover;display:block}
.sidebar-brand-mark{overflow:hidden;padding:0!important;background:#fff!important}.sidebar-brand-mark img{width:100%;height:100%;object-fit:cover;display:block}
.sidebar-admin-item{margin-top:8px;background:#fff9ea!important}.sidebar-admin-item .sidebar-menu-icon{background:#fff1c2!important;color:#9a6700!important}
.transfer{color:#3b5ccc}.transfer-badge,.scan-badge{display:inline-flex;vertical-align:middle;padding:2px 6px;border-radius:999px;font-size:8px;font-weight:800;background:#eef2ff;color:#4456b8;margin-left:4px}.tx-actions{display:flex;justify-content:flex-end;gap:5px}.tx-right .tx-actions button{display:inline-block;margin:5px 0 0;padding:2px 4px}.tx-right .tx-actions .tx-edit-btn{color:#175cd3}.tx-export-group{display:flex;gap:5px;flex-wrap:wrap}.secondary-export{background:#fff!important;color:#315071!important;border:1px solid #dce4ef!important;box-shadow:none!important}

.tx-filter-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}.tx-filter-grid input[type="search"]{min-width:0}

.finance-center-dialog{width:min(1120px,calc(100% - 34px))!important;max-width:none!important;border-radius:24px!important}.finance-center-card{height:min(88dvh,820px);display:flex;flex-direction:column;background:#f7f9fc}.finance-center-head{padding:20px 22px 14px;margin:0;background:#fff;border-bottom:1px solid #e8edf4}.finance-center-head h3{font-size:20px}.finance-tabs{display:flex;gap:6px;padding:10px 14px;background:#fff;border-bottom:1px solid #e7ebf2;overflow-x:auto;scrollbar-width:none}.finance-tabs::-webkit-scrollbar{display:none}.finance-tabs button{border:0;background:#f3f6fa;color:#526173;border-radius:11px;padding:9px 12px;font-size:11px;font-weight:800;white-space:nowrap;cursor:pointer}.finance-tabs button.active{background:#175cd3;color:#fff}.finance-content{flex:1;min-height:0;overflow:auto;padding:16px 18px 24px}.finance-tab-panel{min-height:100%}.feature-toolbar{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:14px}.feature-toolbar>div b{display:block;font-size:16px}.feature-toolbar>div small{display:block;color:#7d8999;margin-top:3px}.feature-toolbar label{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:800}.feature-toolbar select{border:1px solid #dbe1ea;border-radius:10px;padding:8px;background:#fff}
.feature-card{background:#fff;border:1px solid #e3e8ef;border-radius:17px;padding:15px;box-shadow:0 4px 14px rgba(16,24,40,.035)}.feature-card h4{margin:0 0 12px;font-size:14px}.feature-card p{font-size:12px;line-height:1.55;color:#637083}.feature-card label{display:block;font-size:11px;font-weight:750;color:#526072;margin:9px 0}.feature-card input,.feature-card select,.feature-form-row input,.feature-form-row select,.feature-form-grid input,.feature-form-grid select{width:100%;border:1px solid #dce2eb;border-radius:10px;background:#fff;padding:9px 10px;outline:none;font:inherit;font-size:12px}.feature-card input:focus,.feature-card select:focus,.feature-form-row input:focus,.feature-form-row select:focus,.feature-form-grid input:focus,.feature-form-grid select:focus{border-color:#78a3e9;box-shadow:0 0 0 3px rgba(23,92,211,.08)}.two-col-feature{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}.feature-form-row{display:grid;grid-template-columns:1.3fr .9fr .6fr 1fr 1fr auto;align-items:end;gap:9px;margin-bottom:14px}.feature-form-row>label{margin:0;font-size:10px;font-weight:800;color:#667085}.feature-form-row>.btn{height:38px;margin-bottom:0}.feature-form-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.feature-form-grid label{font-size:11px;font-weight:800;color:#566375}.feature-form-grid .full{grid-column:1/-1}
.feature-list{display:grid;gap:8px}.feature-list-row{display:flex;align-items:center;gap:10px;padding:11px 12px;background:#fff;border:1px solid #e5eaf1;border-radius:14px}.feature-row-icon{width:38px;height:38px;flex:0 0 38px;display:grid;place-items:center;border-radius:12px;background:#f1f5fb;font-size:18px}.feature-row-main{flex:1;min-width:0}.feature-row-main b{display:block;font-size:12px}.feature-row-main small{display:block;color:#8792a3;font-size:10px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.feature-list-row>strong{font-size:12px;white-space:nowrap}.row-actions{display:flex;gap:5px}.row-actions button,.goal-actions button,.admin-user-row button{border:0;background:#eef4ff;color:#1858bf;border-radius:8px;padding:6px 8px;font-size:9px;font-weight:800;cursor:pointer}.row-actions .danger-link,.goal-actions .danger-link{background:#fff1f1;color:#b42318}.row-actions .success-link{background:#eaf8ef;color:#087443}.status-pill{padding:4px 7px;border-radius:999px;font-size:8px;font-weight:850}.status-pill.paid{background:#eaf8ef;color:#087443}.status-pill.overdue{background:#fff1f1;color:#b42318}.status-pill.due_soon{background:#fff7e4;color:#9a6700}.status-pill.upcoming{background:#f1f4f8;color:#667085}.mini-budget{font-size:9px;color:#526072;background:#f2f5f9;padding:5px 7px;border-radius:8px;white-space:nowrap}
.prediction-card{border-radius:18px;padding:17px 18px;margin-bottom:14px;display:flex;justify-content:space-between;align-items:center;gap:14px;background:linear-gradient(135deg,#eaf8ef,#f8fffb);border:1px solid #cfeedd}.prediction-card.tight{background:linear-gradient(135deg,#fff8e9,#fffdf8);border-color:#f3d997}.prediction-card.risk{background:linear-gradient(135deg,#fff0ef,#fffafa);border-color:#fac4bf}.prediction-card small{display:block;color:#697588}.prediction-card strong{display:block;font-size:26px;letter-spacing:-.5px;margin:3px 0}.prediction-card p{margin:0;color:#6c7787;font-size:10px}.prediction-status{font-size:10px;font-weight:850;padding:7px 10px;border-radius:999px;background:#fff;white-space:nowrap}.analytics-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}.analytics-kpis>div{background:#fff;border:1px solid #e4e9f0;border-radius:14px;padding:12px}.analytics-kpis small{display:block;color:#8490a1;font-size:9px}.analytics-kpis b{display:block;font-size:15px;margin-top:4px}.analytics-layout{display:grid;grid-template-columns:1fr 1fr;gap:14px}.analytic-bar-row{margin:11px 0}.analytic-bar-row>div:first-child{display:flex;justify-content:space-between;gap:10px;font-size:10px}.analytic-bar-row>div:first-child b{font-size:10px}.analytic-track{height:7px;background:#eef2f6;border-radius:99px;overflow:hidden;margin:5px 0}.analytic-track span{display:block;height:100%;background:#2c6bd8;border-radius:99px}.analytic-bar-row.warning .analytic-track span{background:#e4a11b}.analytic-bar-row.exceeded .analytic-track span{background:#d92d20}.analytic-bar-row>small{font-size:8px;color:#8c96a5}.empty.compact{padding:20px 8px}
.goal-row{background:#fff;border:1px solid #e4e9f0;border-radius:15px;padding:13px}.goal-top{display:flex;justify-content:space-between;gap:10px}.goal-top b{display:block;font-size:12px}.goal-top small{display:block;font-size:9px;color:#8792a2;margin-top:3px}.goal-progress{height:8px;border-radius:99px;background:#edf1f5;overflow:hidden;margin:9px 0}.goal-progress span{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#175cd3,#4b8cf0)}.goal-actions{display:flex;gap:6px;align-items:center;justify-content:flex-end}.goal-actions>span{margin-right:auto;font-size:9px;color:#7d8898}
.feature-link-btn{display:inline-flex;text-decoration:none;align-items:center;justify-content:center}.restore-label{margin-top:14px!important}.toggle-line{display:flex!important;gap:8px;align-items:center}.toggle-line input{width:auto!important}.feature-card .btn{margin-right:5px;margin-top:5px}
.feature-toast{position:fixed;left:50%;bottom:28px;z-index:4000;transform:translate(-50%,20px);opacity:0;background:#182230;color:#fff;padding:10px 15px;border-radius:12px;font-size:11px;font-weight:700;box-shadow:0 10px 30px rgba(0,0,0,.22);pointer-events:none;transition:.2s}.feature-toast.show{opacity:1;transform:translate(-50%,0)}.feature-toast.is-success{background:#067647}.feature-toast.is-error{background:#b42318}
.transaction-edit-dialog{width:min(620px,calc(100% - 30px))!important;max-width:none!important}.transaction-edit-card{padding:20px}.edit-transfer-field[hidden],.edit-standard-field[hidden]{display:none!important}
.admin-user-row{display:grid;grid-template-columns:1fr 110px 145px auto;gap:8px;align-items:center;background:#fff;border:1px solid #e4e9f0;border-radius:13px;padding:10px}.admin-user-row b{display:block;font-size:11px}.admin-user-row small{display:block;color:#8792a2;font-size:9px;margin-top:2px}.admin-user-row select,.admin-user-row input{border:1px solid #dce2eb;border-radius:8px;padding:7px;font-size:10px}
.sidebar-menu-icon:has(+ span){font-size:17px}

@media(max-width:1100px){.tx-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.feature-form-row{grid-template-columns:repeat(3,1fr)}.feature-form-row>.btn{grid-column:span 1}.admin-user-row{grid-template-columns:1fr 90px 130px auto}}
@media(max-width:760px){
  .finance-center-dialog{width:100%!important;height:100dvh!important;max-height:none!important;border-radius:0!important;margin:0!important}.finance-center-card{height:100dvh!important;max-height:none}.finance-center-head{padding:calc(14px + env(safe-area-inset-top)) 14px 12px}.finance-center-head h3{font-size:18px}.finance-content{padding:12px 12px calc(20px + env(safe-area-inset-bottom))}.finance-tabs{padding:8px 10px}.two-col-feature,.analytics-layout{grid-template-columns:1fr}.feature-form-row{grid-template-columns:1fr 1fr}.feature-form-row>.btn{grid-column:1/-1}.analytics-kpis{grid-template-columns:1fr 1fr}.prediction-card{align-items:flex-start;flex-direction:column}.prediction-card strong{font-size:23px}.feature-list-row{align-items:flex-start;flex-wrap:wrap}.feature-row-main{min-width:150px}.row-actions{width:100%;justify-content:flex-end}.goal-actions{flex-wrap:wrap}.goal-actions>span{width:100%;margin:0 0 3px}.feature-form-grid{grid-template-columns:1fr 1fr}.feature-form-grid .full{grid-column:1/-1}.transaction-edit-dialog{width:100%!important;max-width:none!important;border-radius:20px 20px 0 0!important;margin:auto 0 0!important}.admin-user-row{grid-template-columns:1fr 90px}.admin-user-row input,.admin-user-row button{grid-column:auto}.tx-filter-grid{grid-template-columns:1fr!important}.tx-export-group{width:100%;margin-top:4px}.tx-export-group button{flex:1;justify-content:center}.feature-toast{bottom:calc(76px + env(safe-area-inset-bottom));max-width:calc(100% - 32px);text-align:center}.sidebar-menu{gap:5px}.sidebar-menu-item{min-height:52px}.sidebar-menu-item small{font-size:9px}
}
.account-plan-badge{display:inline-flex;margin-top:5px;padding:2px 6px;border-radius:999px;font-size:8px;font-weight:850;background:#eef2f6;color:#667085}.account-plan-badge.premium{background:#fff3c4;color:#8a5a00}


/* =========================================================
   PASSWORD / PIN VISIBILITY
   ========================================================= */
.secret-field{position:relative;width:100%}
.secret-field>input{padding-right:48px!important}
.secret-toggle{position:absolute;right:7px;top:50%;transform:translateY(-50%);width:36px;height:36px;border:0;border-radius:10px;background:transparent;color:#7b8494;display:grid;place-items:center;cursor:pointer}
.secret-toggle:hover{background:#f0f4fa;color:#175cd3}
.secret-toggle:active{transform:translateY(-50%) scale(.95)}
.secret-toggle svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.secret-toggle.is-visible{color:#175cd3;background:#eef4ff}
.forgot-password-row{display:flex;justify-content:flex-end;margin-top:-2px}
.forgot-password-row a{font-size:12px;font-weight:700;color:#175cd3;text-decoration:none}
.forgot-password-row a:hover{text-decoration:underline}
.alert.success{background:#ecfdf3;border:1px solid #abefc6;color:#067647;padding:11px 13px;border-radius:11px;margin:14px 0}

/* =========================================================
   SALDO PRIVACY
   ========================================================= */
.balance-stat-content{flex:1;min-width:0;display:flex;align-items:center;justify-content:space-between;gap:10px}
.balance-stat-copy{min-width:0}
.balance-visibility-toggle{width:36px;height:36px;flex:0 0 36px;border:0;border-radius:12px;background:rgba(255,255,255,.13);color:#fff;display:grid;place-items:center;cursor:pointer;transition:.16s ease}
.balance-visibility-toggle:hover{background:rgba(255,255,255,.22)}
.balance-visibility-toggle:active{transform:scale(.95)}
.balance-visibility-toggle svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.balance-visibility-toggle.is-hidden-balance{background:rgba(255,255,255,.18)}

/* =========================================================
   DAILY LIMIT CARD: MINIMIZE / CLOSE
   ========================================================= */
.daily-budget-actions{display:flex;align-items:center;gap:6px;flex:0 0 auto}
.budget-card-icon-btn{width:32px;height:32px;border:0;border-radius:10px;background:#f2f5f9;color:#667085;display:grid;place-items:center;cursor:pointer;font-size:20px;line-height:1;transition:.15s ease}
.budget-card-icon-btn:hover{background:#e9eef5;color:#344054}
.budget-card-icon-btn:active{transform:scale(.94)}
.budget-card-icon-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.budget-card-icon-btn.close{font-size:20px;font-weight:400}
.daily-budget-card.is-minimized .daily-budget-main{padding-top:9px;padding-bottom:9px}
.daily-budget-card.is-minimized .daily-budget-icon{width:34px;height:34px;flex-basis:34px;border-radius:11px;font-size:15px}
.daily-budget-card.is-minimized .daily-budget-values,.daily-budget-card.is-minimized .daily-budget-progress,.daily-budget-card.is-minimized .daily-budget-copy>small,.daily-budget-card.is-minimized .budget-edit-btn{display:none!important}
.daily-budget-card.is-minimized .daily-budget-title-row{margin-bottom:0;width:100%}
.daily-budget-card.is-minimized .daily-budget-copy{display:flex;align-items:center}
@media(max-width:760px){
  .secret-toggle{right:6px;width:36px;height:36px}
  .balance-visibility-toggle{width:34px;height:34px;flex-basis:34px;border-radius:11px}
  .daily-budget-actions{gap:3px}
  .budget-card-icon-btn{width:29px;height:29px;border-radius:9px}
  .daily-budget-card.is-minimized .daily-budget-main{padding:7px 9px!important}
  .daily-budget-card.is-minimized .daily-budget-status{margin-left:auto}
}

/* ===== OFFLINE MODE + SYNC ===== */
.sync-banner {
  position: fixed;
  left: calc(var(--sidebar-width, 280px) + 24px);
  right: 24px;
  top: 14px;
  z-index: 1200;
  min-height: 54px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  border-radius: 16px;
  border: 1px solid #f4c96a;
  background: rgba(255, 248, 229, .97);
  box-shadow: 0 10px 30px rgba(15, 23, 42, .12);
  color: #7a4a00;
  backdrop-filter: blur(10px);
}
.sync-banner[hidden] { display: none !important; }
.sync-banner-dot { width: 10px; height: 10px; border-radius: 50%; background: #f59e0b; box-shadow: 0 0 0 5px rgba(245,158,11,.13); flex: 0 0 auto; }
.sync-banner > div { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.sync-banner b { font-size: 13px; }
.sync-banner small { font-size: 11px; line-height: 1.35; color: #8a5a08; }
.sync-banner button { margin-left: auto; border: 0; border-radius: 10px; padding: 8px 11px; font-weight: 700; background: #fff; color: #8a5a08; cursor: pointer; box-shadow: 0 1px 4px rgba(0,0,0,.08); }
.app-syncing .sync-banner-dot { animation: financePulse 1s infinite ease-in-out; }
@keyframes financePulse { 0%,100%{transform:scale(.8);opacity:.55}50%{transform:scale(1.2);opacity:1} }

.sidebar-local-status { position: relative; }
.sidebar-local-status.is-offline .sidebar-local-dot { background: #f59e0b !important; box-shadow: 0 0 0 4px rgba(245,158,11,.12); }
.sidebar-local-status.is-offline b { color: #92400e; }
.sidebar-local-status.is-syncing .sidebar-local-dot { background: #3b82f6 !important; animation: financePulse 1s infinite ease-in-out; }
.sidebar-sync-count { margin-left: auto; min-width: 23px; height: 23px; padding: 0 6px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; background: #fff3cd; color: #8a5a08; font-size: 11px; font-weight: 800; }
#chatConnectionStatus.is-offline { color: #b45309 !important; }

.chat-row.offline-pending .bubble,
.bubble.offline-pending { opacity: .86; border-style: dashed; }
.offline-pending-label { display: block; width: max-content; margin-top: 6px; padding: 3px 7px; border-radius: 999px; background: rgba(245,158,11,.13); color: #92400e; font-size: 9px; font-weight: 700; letter-spacing: .01em; }
.tx.offline-pending { border-style: dashed; background: linear-gradient(90deg, rgba(255,248,229,.65), rgba(255,255,255,.9)); }
.sync-badge { display: inline-flex; align-items: center; margin-left: 5px; padding: 2px 6px; border-radius: 999px; background: #fff3cd; color: #92400e; font-size: 9px; font-weight: 800; vertical-align: middle; }
.pending-sync-text { color: #a16207; font-size: 10px; font-weight: 700; }

@media (max-width: 760px) {
  .sync-banner {
    left: 12px;
    right: 12px;
    top: max(10px, env(safe-area-inset-top));
    min-height: 48px;
    border-radius: 14px;
    padding: 9px 11px;
  }
  .sync-banner small { max-width: 62vw; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .app-offline .app-main, .app-syncing .app-main { padding-top: 64px; }
}
@media (min-width: 761px) {
  body.has-sync-banner .app-main { padding-top: 78px; }
}
.sidebar-menu-item.sidebar-link{text-decoration:none}.sidebar-menu-item.danger-link{color:#a82b24}.sidebar-menu-item.danger-link .sidebar-menu-icon{background:#fff0ef;color:#c43b31}
.auth-legal-links{margin-top:18px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px;color:#9aa4b2}.auth-legal-links a{color:#5c6d86;text-decoration:none;font-weight:700}.auth-legal-links a:hover{color:#175cd3;text-decoration:underline}

/* =========================================================
   PREMIUM / BERLANGGANAN MANUAL
   ========================================================= */
.sidebar-premium-item{
  background:linear-gradient(135deg,#fff8df,#fffdf6)!important;
  border:1px solid #f4dfa0!important;
}
.sidebar-premium-item .sidebar-menu-icon{background:#fff0b8!important;color:#8a5a00!important}
.sidebar-premium-badge{
  margin-left:auto;display:inline-flex;align-items:center;justify-content:center;min-width:56px;height:24px;padding:0 8px;
  border-radius:999px;background:#8a5a00;color:#fff;font-size:8px;font-weight:900;letter-spacing:.04em;
}
.sidebar-premium-badge.active{background:#087443;color:#fff}
.premium-feature-link{position:relative}
.premium-feature-link.premium-locked::after{
  content:"PRO";margin-left:auto;margin-right:3px;padding:3px 6px;border-radius:999px;background:#fff1bd;color:#805400;
  font-size:7px;font-weight:900;letter-spacing:.05em;
}
.premium-feature-link.premium-locked .sidebar-arrow{display:none}
.finance-tabs [data-premium-tab].premium-locked::after{content:" ♛";font-size:9px}

.premium-hero{
  display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:16px;padding:22px 24px;border-radius:22px;
  background:linear-gradient(135deg,#102a56 0%,#175cd3 55%,#3d78df 100%);color:#fff;box-shadow:0 14px 34px rgba(23,92,211,.18);
}
.premium-kicker{display:block;font-size:9px;font-weight:900;letter-spacing:.13em;color:#ffe490;margin-bottom:7px}
.premium-hero h3{margin:0;font-size:23px;letter-spacing:-.3px}.premium-hero p{margin:7px 0 0;max-width:700px;font-size:12px;line-height:1.55;color:#eaf1ff}
.premium-account-status{flex:0 0 auto;padding:9px 13px;border:1px solid rgba(255,255,255,.22);border-radius:999px;background:rgba(255,255,255,.12);font-size:10px;font-weight:900;letter-spacing:.06em}
.premium-account-status.active{background:#eaf8ef;color:#067647;border-color:#b7e5c8}
.premium-checkout-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(330px,.9fr);gap:14px;align-items:start}
.premium-checkout-card,.premium-invoice-card{min-height:100%}
.premium-step-head{display:flex;align-items:center;gap:9px;margin:4px 0 10px}.premium-step-head>span{width:28px;height:28px;flex:0 0 28px;display:grid;place-items:center;border-radius:9px;background:#edf4ff;color:#175cd3;font-size:10px;font-weight:900}.premium-step-head b{display:block;font-size:12px}.premium-step-head small{display:block;margin-top:1px;color:#8792a3;font-size:9px}
.premium-plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-bottom:18px}
.premium-plan-card{position:relative;display:block!important;margin:0!important;padding:13px!important;border:1px solid #e2e7ef;border-radius:14px;background:#fff;cursor:pointer;overflow:hidden;transition:.15s ease}
.premium-plan-card:hover{border-color:#abc7f4;transform:translateY(-1px)}
.premium-plan-card input{position:absolute;opacity:0;pointer-events:none}.premium-plan-check{position:absolute;right:9px;top:9px;width:20px;height:20px;display:grid;place-items:center;border:1px solid #d7dfe9;border-radius:50%;font-size:10px;color:transparent;background:#fff}
.premium-plan-card:has(input:checked){border-color:#175cd3;box-shadow:0 0 0 3px rgba(23,92,211,.08)}.premium-plan-card:has(input:checked) .premium-plan-check{background:#175cd3;border-color:#175cd3;color:#fff}
.premium-plan-card b{display:block;margin:2px 24px 8px 0;font-size:12px;color:#344054}.premium-plan-card strong{font-size:18px;color:#172235}.premium-plan-card>small{display:inline;color:#667085;font-size:9px}.premium-plan-card p{margin:6px 0 0;font-size:9px;line-height:1.4;color:#7e8998}.premium-plan-tag{position:absolute;right:-28px;top:7px;transform:rotate(38deg);width:90px;text-align:center;padding:2px 0;background:#ffcb05;color:#594300;font-size:6px;font-weight:900;letter-spacing:.06em}
.premium-bank-preview{display:grid;gap:3px;margin:-1px 0 17px;padding:10px 11px;border-radius:11px;background:#f7f9fc;border:1px dashed #dce3ed;color:#7a8798;font-size:10px}.premium-bank-preview.configured{background:#f1f7ff;border-style:solid;border-color:#cfe0ff}.premium-bank-preview b{color:#344054;font-size:10px}.premium-bank-preview strong{font-size:16px;color:#175cd3;letter-spacing:.04em}.premium-bank-preview span{font-size:9px}
.premium-invoice-empty{min-height:210px;display:grid;place-items:center;text-align:center;padding:25px;border:1px dashed #dbe2ec;border-radius:14px;color:#8792a3;font-size:11px;background:#fafbfd}
.premium-invoice-box{padding:14px;border:1px solid #dfe5ed;border-radius:15px;background:#fff}.premium-invoice-box.pending{border-color:#f0d18c;background:#fffcf5}.premium-invoice-box.approved{border-color:#bfe5cb;background:#f7fff9}.premium-invoice-box.rejected{border-color:#f2c0bc;background:#fff8f7}
.premium-invoice-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding-bottom:11px;border-bottom:1px solid #edf0f4}.premium-invoice-top small{display:block;color:#98a2b3;font-size:8px;font-weight:900;letter-spacing:.11em}.premium-invoice-top b{display:block;margin-top:2px;font-size:12px;color:#344054}
.premium-order-status{display:inline-flex;padding:5px 8px;border-radius:999px;font-size:8px;font-weight:900;white-space:nowrap}.premium-order-status.waiting{background:#eef2f7;color:#596579}.premium-order-status.pending{background:#fff1c6;color:#8a5a00}.premium-order-status.approved{background:#e7f8ec;color:#087443}.premium-order-status.rejected{background:#fff0ef;color:#b42318}
.premium-invoice-amount{padding:15px 0}.premium-invoice-amount small{display:block;color:#7b8797;font-size:9px}.premium-invoice-amount strong{display:block;margin-top:2px;font-size:28px;letter-spacing:-.6px;color:#15243b}
.premium-invoice-lines{display:grid;gap:7px;padding:11px;border-radius:12px;background:#f7f9fc}.premium-invoice-lines>div{display:flex;justify-content:space-between;gap:12px;font-size:9px}.premium-invoice-lines span{color:#8792a3}.premium-invoice-lines b{color:#344054;text-align:right;word-break:break-all}
.premium-invoice-notice{margin:11px 0;padding:10px;border-radius:10px;font-size:9px;line-height:1.5;background:#f3f5f8;color:#667085}.premium-invoice-notice.pending{background:#fff5d9;color:#805400}.premium-invoice-notice.approved{background:#eaf8ef;color:#067647}.premium-invoice-notice.rejected{background:#fff0ef;color:#a82b24}
.premium-upload-area{margin-top:14px;padding-top:14px;border-top:1px dashed #dfe4ec}.premium-upload-area[hidden]{display:none!important}.premium-proof-picker{display:flex!important;align-items:center;gap:10px;padding:11px!important;border:1px dashed #c8d5e8;border-radius:12px;background:#f8fbff;cursor:pointer;color:#175cd3!important}.premium-proof-picker::before{content:"🧾";font-size:20px}.premium-proof-picker span{font-size:10px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.premium-proof-preview{margin:12px 0 4px!important;max-width:150px!important}.premium-proof-preview img{height:100px!important}
.premium-basic-note{margin-top:14px;padding:12px 14px;border-radius:13px;background:#f6f7fa;border:1px solid #e8ebf0;color:#6d7888;font-size:10px;line-height:1.55}.premium-basic-note b{color:#344054}
.premium-card-title{display:flex;justify-content:space-between;gap:10px;align-items:center}.premium-card-title h4{margin:0}.premium-card-title span{padding:4px 7px;border-radius:999px;background:#fff1bd;color:#805400;font-size:7px;font-weight:900}.premium-backup-card{position:relative}

.admin-premium-section{margin-top:22px;padding-top:18px;border-top:1px solid #e4e9f0}.admin-premium-section:first-of-type{margin-top:14px}
.admin-payment-row{display:grid;grid-template-columns:minmax(0,1fr) 120px 190px;gap:12px;align-items:center;padding:13px;background:#fff;border:1px solid #e3e8ef;border-radius:15px}.admin-payment-row.pending{border-color:#efd28f;background:#fffdf8}.admin-payment-row.approved{border-color:#c4e4cf}.admin-payment-row.rejected{border-color:#f2c4c0}.admin-payment-title{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.admin-payment-title>b{font-size:12px}.admin-payment-main>small{display:block;margin-top:3px;color:#818c9b;font-size:9px}.admin-payment-amount{margin-top:7px;font-size:18px;font-weight:900;color:#172235}.admin-payment-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:5px}.admin-payment-meta span{font-size:8px;color:#687588;padding:4px 6px;background:#f3f6fa;border-radius:7px}.admin-payment-proof{display:flex;justify-content:center}.admin-payment-proof>span{font-size:9px;color:#98a2b3}.admin-payment-proof .stored-photo{margin:0!important;max-width:110px!important}.admin-payment-proof .stored-photo img{height:78px!important;object-fit:cover}.admin-payment-actions{display:grid;gap:6px}.admin-payment-actions button{border:0;border-radius:9px;padding:8px 9px;font-size:9px;font-weight:850;cursor:pointer}.admin-payment-actions .success-link{background:#e9f8ee;color:#067647}.admin-payment-actions .danger-link{background:#fff0ef;color:#b42318}.admin-rejection-reason{margin-top:6px;color:#b42318;font-size:8px}
.admin-bank-row{display:flex;align-items:flex-end;gap:10px;padding:12px;background:#fff;border:1px solid #e3e8ef;border-radius:14px}.admin-bank-fields{flex:1;display:grid;grid-template-columns:1fr 1.2fr 1.2fr 80px 90px;gap:8px;align-items:end}.admin-bank-fields label{margin:0;font-size:9px;font-weight:800;color:#667085}.admin-bank-fields input{width:100%;margin-top:4px;border:1px solid #dce2eb;border-radius:8px;padding:7px 8px;font-size:10px}.admin-bank-enabled{display:flex!important;align-items:center;gap:5px;height:32px}.admin-bank-enabled input{width:auto!important;margin:0!important}.admin-bank-row .row-actions{flex:0 0 auto}.admin-payment-kpis{margin-bottom:12px}

@media(max-width:900px){
  .simulation-summary{grid-template-columns:1fr 1fr}.simulation-grid{grid-template-columns:1fr}.simulation-history-list{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:760px){
  .simulation-toolbar{align-items:flex-start;flex-direction:column}.simulation-toolbar label{width:100%;min-width:0}.simulation-toolbar input{width:100%;margin:5px 0 0}.simulation-alert{align-items:flex-start;flex-direction:column}.simulation-alert span{text-align:left}.simulation-row{grid-template-columns:minmax(0,1fr) 120px 28px}.simulation-actions{align-items:flex-start;flex-direction:column}.simulation-actions .btn{width:100%}.simulation-history-list{grid-template-columns:repeat(2,1fr)}
}

@media(max-width:900px){
  .premium-checkout-grid{grid-template-columns:1fr}.premium-plan-grid{grid-template-columns:repeat(3,1fr)}
  .admin-payment-row{grid-template-columns:1fr 100px}.admin-payment-actions{grid-column:1/-1;grid-template-columns:1fr 1fr}.admin-bank-row{align-items:stretch;flex-direction:column}.admin-bank-fields{grid-template-columns:1fr 1fr}.admin-bank-row .row-actions{justify-content:flex-end}
}
@media(max-width:760px){
  .premium-hero{padding:17px 16px;border-radius:17px;align-items:flex-start}.premium-hero h3{font-size:19px}.premium-account-status{padding:7px 9px;font-size:8px}.premium-plan-grid{grid-template-columns:1fr}.premium-plan-card{padding:12px!important}.premium-checkout-grid{gap:10px}.premium-invoice-amount strong{font-size:24px}.premium-invoice-lines>div{font-size:9px}.premium-basic-note{margin-bottom:10px}.admin-payment-row{grid-template-columns:1fr}.admin-payment-proof{justify-content:flex-start}.admin-payment-actions{grid-column:auto;grid-template-columns:1fr}.admin-bank-fields{grid-template-columns:1fr}.admin-premium-section .feature-toolbar{align-items:flex-start;flex-direction:column}.admin-premium-section .feature-toolbar .btn{width:100%}
}


/* =========================================================
   V82 — SIMULASI KEUANGAN
   ========================================================= */
.simulation-toolbar label{min-width:180px}.simulation-toolbar input{border:1px solid #dbe1ea;border-radius:10px;padding:8px 10px;background:#fff;font:inherit;font-size:11px;margin-left:7px}
.simulation-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:12px}.simulation-summary>div{background:#fff;border:1px solid #e3e8ef;border-radius:15px;padding:12px}.simulation-summary small{display:block;color:#8490a1;font-size:9px}.simulation-summary b{display:block;margin-top:4px;font-size:16px;color:#172235}.simulation-summary b.income{color:#067647}.simulation-summary b.expense{color:#b42318}.simulation-summary b.safe{color:#067647}.simulation-summary b.danger{color:#b42318}
.simulation-alert{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;margin-bottom:12px;font-size:10px}.simulation-alert b{font-size:11px}.simulation-alert span{color:#667085;text-align:right}.simulation-alert strong{color:inherit}.simulation-alert.danger{background:#fff0ef;border:1px solid #fac4bf;color:#b42318}.simulation-alert.warning{background:#fff8e9;border:1px solid #f3d997;color:#8a5a00}.simulation-alert.safe{background:#eaf8ef;border:1px solid #cfeedd;color:#067647}
.simulation-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.simulation-column{min-width:0}.simulation-column-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:10px}.simulation-column-head h4{margin:0 0 3px}.simulation-column-head small{display:block;color:#8792a3;font-size:9px;line-height:1.45}.simulation-column-head .btn{margin:0;white-space:nowrap}.simulation-list{display:grid;gap:7px}.simulation-row{display:grid;grid-template-columns:minmax(0,1fr) 145px 28px;gap:8px;align-items:center;padding:9px;background:#f8fafc;border:1px solid #e6ebf2;border-radius:12px}.simulation-row-main{min-width:0}.simulation-row-main input,.simulation-row-amount input{width:100%;border:1px solid #dbe2eb;border-radius:9px;background:#fff;padding:8px 9px;font:inherit;font-size:11px;outline:none}.simulation-row-main input:focus,.simulation-row-amount input:focus{border-color:#78a3e9;box-shadow:0 0 0 3px rgba(23,92,211,.08)}.simulation-row-main small{display:block;margin-top:4px;color:#8994a4;font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.simulation-row-amount input{text-align:right;font-weight:800}.simulation-remove{width:28px;height:28px;border:0;border-radius:8px;background:#fff0ef;color:#b42318;font-size:18px;line-height:1;cursor:pointer}.simulation-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px 0;font-size:9px;color:#8792a3}.simulation-actions .btn{margin:0}.simulation-info-card{margin-top:0}.simulation-info-head{display:flex;justify-content:space-between;gap:10px;align-items:center}.simulation-info-head b{font-size:12px}.simulation-info-head span{font-size:8px;color:#8a96a7}.simulation-info-card p{margin:8px 0 12px}.simulation-history-list{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px}.simulation-history-list>div{display:grid;gap:3px;padding:8px;border-radius:10px;background:#f7f9fc;border:1px solid #e7ebf1}.simulation-history-list span{font-size:8px;color:#8a95a5}.simulation-history-list b{font-size:9px;color:#067647}.simulation-history-list strong{font-size:9px;color:#b42318}

/* =========================================================
   TRANSAKSI: SEARCH SELALU TAMPIL + MENU UNDUH COMPACT
   ========================================================= */
.tx-search-export-row{
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 12px 8px;
  position:relative;
  z-index:12;
}
.tx-search-box{
  flex:1 1 auto;
  min-width:0;
  height:38px;
  margin:0;
  display:flex;
  align-items:center;
  gap:7px;
  border:1px solid #dfe5ee;
  border-radius:11px;
  background:#fff;
  padding:0 10px;
  transition:border-color .16s ease,box-shadow .16s ease;
}
.tx-search-box:focus-within{
  border-color:#8fb6ff;
  box-shadow:0 0 0 3px rgba(23,92,211,.08);
}
.tx-search-icon{
  width:18px;
  height:18px;
  flex:0 0 18px;
  color:#98a2b3;
  display:grid;
  place-items:center;
}
.tx-search-icon svg{
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.tx-search-box input{
  width:100%;
  min-width:0;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  background:transparent!important;
  color:#172235;
  font:inherit;
  font-size:11px;
  padding:0!important;
  height:100%;
}
.tx-search-box input::-webkit-search-cancel-button{cursor:pointer}

.tx-export-menu-wrap{
  position:relative;
  flex:0 0 auto;
}
.tx-export-toggle{
  height:38px;
  min-width:78px;
  border:1px solid #cfe0ff;
  border-radius:11px;
  background:#edf4ff;
  color:#175cd3;
  padding:0 11px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  font:inherit;
  font-size:10px;
  font-weight:850;
  cursor:pointer;
}
.tx-export-toggle:hover,.tx-export-toggle.is-open{
  background:#e1ecff;
  border-color:#aac8ff;
}
.tx-export-chevron{
  font-size:13px;
  line-height:1;
  transition:transform .16s ease;
}
.tx-export-toggle.is-open .tx-export-chevron{transform:rotate(180deg)}
.tx-export-menu{
  position:absolute;
  top:calc(100% + 6px);
  right:0;
  width:190px;
  padding:6px;
  border:1px solid #dfe5ee;
  border-radius:13px;
  background:#fff;
  box-shadow:0 14px 34px rgba(16,24,40,.16);
  z-index:50;
}
.tx-export-menu[hidden]{display:none!important}
.tx-export-menu button{
  width:100%;
  border:0;
  background:transparent;
  color:#344054;
  border-radius:9px;
  padding:8px 9px;
  display:grid;
  gap:2px;
  text-align:left;
  cursor:pointer;
  font:inherit;
}
.tx-export-menu button:hover{background:#f4f7fb}
.tx-export-menu button b{font-size:10px;color:#175cd3}
.tx-export-menu button small{font-size:8px;color:#8a95a5}

/* Search sudah berada di luar panel filter. */
.tx-filter-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}

/* Tombol edit dibuat lebih jelas dan tetap mudah ditekan. */
.tx-right .tx-actions .tx-edit-btn{
  min-width:36px;
  border:0;
  background:#edf4ff;
  color:#175cd3;
  border-radius:7px;
  padding:4px 7px;
  font-size:9px;
  font-weight:800;
  cursor:pointer;
}
.tx-right .tx-actions button[data-delete-id]{
  border:0;
  background:#fff1f1;
  color:#b42318;
  border-radius:7px;
  padding:4px 7px;
  font-size:9px;
  font-weight:800;
  cursor:pointer;
}
#saveTransactionEdit:disabled{opacity:.65;cursor:wait}

@media(max-width:760px){
  .tx-search-export-row{padding:8px 10px 7px;gap:7px}
  .tx-search-box{height:40px;border-radius:12px}
  .tx-search-box input{font-size:11px}
  .tx-export-toggle{height:40px;min-width:74px;border-radius:12px}
  .tx-export-menu{width:176px}
  .tx-filter-summary{padding-top:2px}
}
@media(max-width:390px){
  .tx-search-export-row{padding-left:9px;padding-right:9px}
  .tx-export-toggle{min-width:68px;padding:0 9px}
}


/* ===== v10: rincian saldo per dompet ===== */
.balance-stat { cursor: pointer; }
.balance-stat:focus-visible { outline: 3px solid rgba(23, 92, 211, .22); outline-offset: 3px; }
.balance-detail-hint { display: block; margin-top: 3px; font-size: 10px; font-weight: 600; opacity: .72; }
.wallet-balance-dialog { border: 0; padding: 0; background: transparent; width: min(92vw, 460px); }
.wallet-balance-dialog::backdrop { background: rgba(15, 23, 42, .48); backdrop-filter: blur(3px); }
.wallet-balance-card { width: 100%; max-width: none; margin: 0; }
.wallet-balance-total { margin: 4px 0 14px; padding: 14px 16px; border-radius: 16px; background: linear-gradient(135deg, rgba(23,92,211,.12), rgba(23,92,211,.04)); border: 1px solid rgba(23,92,211,.14); }
.wallet-balance-total small { display: block; margin-bottom: 4px; color: var(--muted, #64748b); }
.wallet-balance-total strong { display: block; font-size: 24px; line-height: 1.15; }
.wallet-balance-list { display: grid; gap: 9px; max-height: min(55vh, 420px); overflow: auto; }
.wallet-balance-row { display: grid; grid-template-columns: 42px minmax(0,1fr) auto; align-items: center; gap: 11px; padding: 11px 12px; border: 1px solid rgba(127,127,127,.15); border-radius: 14px; background: var(--card, #fff); }
.wallet-balance-icon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; background: rgba(23,92,211,.08); font-size: 19px; }
.wallet-balance-name { min-width: 0; }
.wallet-balance-name b, .wallet-balance-name small { display: block; }
.wallet-balance-name b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wallet-balance-name small { margin-top: 2px; color: var(--muted, #64748b); font-size: 11px; }
.wallet-balance-row > strong { white-space: nowrap; font-size: 14px; }
@media (max-width: 600px) {
  .balance-detail-hint { font-size: 9px; }
  .wallet-balance-dialog { width: calc(100vw - 24px); }
  .wallet-balance-card { padding: 16px; border-radius: 20px; }
  .wallet-balance-total strong { font-size: 22px; }
  .wallet-balance-row { grid-template-columns: 36px minmax(0,1fr) auto; gap: 9px; padding: 10px; }
  .wallet-balance-icon { width: 34px; height: 34px; border-radius: 10px; font-size: 17px; }
  .wallet-balance-row > strong { font-size: 13px; }
}

/* ===== v12 - Email pemulihan, verifikasi, dan reset password/PIN ===== */
.registration-email-note,.recovery-note{display:block;margin:-2px 0 4px;color:#7b8493;font-size:11px;line-height:1.45}
.recovery-divider{display:flex;align-items:center;gap:10px;margin:7px 0 1px;color:#98a2b3;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.recovery-divider::before,.recovery-divider::after{content:"";height:1px;flex:1;background:#e5e9f0}
.recovery-token-input{letter-spacing:7px;text-align:center;font-weight:800;font-size:21px!important}
.recovery-resend-form{margin-top:12px}
.app-flash-message{margin:0 0 12px;padding:11px 13px;border-radius:13px;font-size:12px;font-weight:700;line-height:1.45}
.app-flash-message.success{background:#ecfdf3;border:1px solid #abefc6;color:#067647}
.app-flash-message.error{background:#fff1f1;border:1px solid #ffd2d2;color:#b42318}
.email-security-banner{display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:11px;margin:0 0 14px;padding:12px 13px;border:1px solid #f2d28d;border-radius:16px;background:linear-gradient(135deg,#fff9e9,#fffdf7);box-shadow:0 4px 14px rgba(146,91,0,.06)}
.email-security-banner-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:#fff0be;color:#9a6700}
.email-security-banner-icon svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.email-security-banner-copy{min-width:0;display:grid;gap:2px}
.email-security-banner-copy b{font-size:12px;color:#5f4300}
.email-security-banner-copy span{font-size:10px;line-height:1.4;color:#8a6a1e}
.email-security-banner>button{border:0;border-radius:10px;padding:8px 10px;background:#9a6700;color:#fff;font-size:10px;font-weight:850;cursor:pointer}
.email-menu-state{margin-left:auto;min-width:20px;height:20px;padding:0 6px;display:grid;place-items:center;border-radius:999px;font-size:9px;font-weight:900;background:#fff2c5;color:#9a6700}
.email-menu-state.ok{background:#dcfae6;color:#067647}
.email-security-dialog{width:min(520px,calc(100% - 28px))}
.email-security-card{max-height:min(86dvh,760px);overflow:auto}
.email-security-head{align-items:flex-start}
.email-status-card{display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:10px;padding:12px;border-radius:15px;border:1px solid #e4e7ec;background:#f8fafc;margin-bottom:15px}
.email-status-card.verified{border-color:#b7e5c8;background:#f0fbf4}
.email-status-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:#edf4ff;color:#175cd3;font-size:16px;font-weight:900}
.email-status-card.verified .email-status-icon{background:#dcfae6;color:#067647}
.email-status-card>div{min-width:0;display:grid;gap:3px}
.email-status-card b{font-size:12px;color:#172235}
.email-status-card small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#667085;font-size:10px}
.email-verified-badge{padding:4px 7px;border-radius:999px;background:#dcfae6;color:#067647;font-size:8px;font-weight:900;letter-spacing:.05em}
.email-security-form{display:grid;gap:8px;padding:14px;border:1px solid #e4e7ec;border-radius:16px;background:#fff}
.email-security-form label{margin:0;font-size:12px;font-weight:800;color:#344054}
.email-security-form input,.email-token-form input{width:100%;border:1px solid #d0d5dd;border-radius:12px;padding:12px 13px;font-size:15px;outline:none;background:#fff}
.email-security-form input:focus,.email-token-form input:focus{border-color:#2463d4;box-shadow:0 0 0 3px rgba(36,99,212,.10)}
.email-security-form small{font-size:10px;line-height:1.45;color:#7b8493}
.email-token-section{margin-top:13px;padding:14px;border:1px solid #dbe5f5;border-radius:16px;background:#f8fbff}
.email-token-copy{display:grid;gap:3px;margin-bottom:10px}
.email-token-copy b{font-size:12px;color:#172235}
.email-token-copy small{font-size:10px;line-height:1.45;color:#667085}
.email-token-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}
.email-token-form input{text-align:center;letter-spacing:6px;font-weight:800;font-size:18px}
.email-resend-form{text-align:center;margin-top:10px}
.email-security-info{display:grid;gap:4px;margin-top:13px;padding:13px 14px;border-radius:15px;background:#f0fbf4;border:1px solid #c7ecd4}
.email-security-info b{font-size:12px;color:#067647}
.email-security-info span{font-size:10px;line-height:1.5;color:#39734f}
@media(max-width:760px){
  .email-security-banner{grid-template-columns:34px minmax(0,1fr);padding:10px 11px;border-radius:14px}
  .email-security-banner-icon{width:34px;height:34px;border-radius:11px}
  .email-security-banner>button{grid-column:1/-1;width:100%;padding:9px}
  .email-security-dialog{width:100%!important;max-width:none!important}
  .email-security-card{max-height:88dvh}
  .email-token-form{grid-template-columns:1fr}
  .email-token-form .btn{width:100%}
}


/* ===== v14 - Email & Keamanan: ubah password dan PIN ===== */
.account-security-section{display:grid;gap:11px;margin-top:14px;padding-top:14px;border-top:1px solid #eaecf0}
.account-security-title{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.account-security-title>div{display:grid;gap:3px;min-width:0}
.account-security-title b{font-size:13px;color:#172235}
.account-security-title small{font-size:10px;line-height:1.45;color:#667085}
.account-security-badge{flex:0 0 auto;padding:5px 8px;border-radius:999px;background:#eff8ff;color:#175cd3;font-size:8px;font-weight:900;letter-spacing:.07em}
.account-username-row{display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:10px;padding:12px;border:1px solid #e4e7ec;border-radius:15px;background:#f8fafc}
.account-username-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:#eef4ff;color:#175cd3;font-size:18px;font-weight:900}
.account-username-copy{display:grid;gap:1px;min-width:0}
.account-username-copy small{font-size:9px;color:#98a2b3;text-transform:uppercase;font-weight:800;letter-spacing:.06em}
.account-username-copy strong{font-size:13px;color:#172235;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.account-username-copy span{font-size:9px;color:#667085}
.account-locked-chip{padding:5px 7px;border-radius:999px;background:#f2f4f7;color:#667085;font-size:8px;font-weight:900;letter-spacing:.05em}
.security-change-card{border:1px solid #e4e7ec;border-radius:16px;background:#fff;overflow:hidden}
.security-change-card[open]{border-color:#cad9f2;box-shadow:0 5px 18px rgba(16,24,40,.05)}
.security-change-card>summary{list-style:none;display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:10px;padding:12px;cursor:pointer;user-select:none}
.security-change-card>summary::-webkit-details-marker{display:none}
.security-change-card>summary>span:nth-child(2){display:grid;gap:2px;min-width:0}
.security-change-card>summary b{font-size:12px;color:#172235}
.security-change-card>summary small{font-size:9.5px;line-height:1.4;color:#667085}
.security-change-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:#eef4ff;color:#175cd3;font-size:12px;font-weight:900}
.security-change-icon.pin{background:#f4ebff;color:#7f56d9;font-size:16px}
.security-chevron{color:#98a2b3;font-size:16px;transition:transform .18s ease}
.security-change-card[open] .security-chevron{transform:rotate(180deg)}
.security-change-form{display:grid;gap:8px;padding:13px 14px 14px;border-top:1px solid #eef1f5;background:#fbfcfe}
.security-change-form label{margin:0;font-size:11px;font-weight:800;color:#344054}
.security-change-form .secret-field{margin:0}
.security-change-form .secret-field>input{width:100%;min-height:44px;border:1px solid #d0d5dd;border-radius:12px;padding:11px 42px 11px 12px;font-size:14px;background:#fff;outline:none}
.security-change-form .secret-field>input:focus{border-color:#2463d4;box-shadow:0 0 0 3px rgba(36,99,212,.10)}
.security-form-note{padding:9px 10px;border-radius:11px;background:#f2f6fc;color:#667085;font-size:9.5px;line-height:1.45}
@media(max-width:640px){
  .account-security-title{align-items:center}
  .account-security-title small{font-size:9.5px}
  .account-username-row{grid-template-columns:34px minmax(0,1fr) auto;padding:10px}
  .account-username-icon,.security-change-icon{width:34px;height:34px;border-radius:10px}
  .security-change-card>summary{grid-template-columns:34px minmax(0,1fr) auto;padding:10px}
  .security-change-form{padding:12px}
}

/* ===== v15 - Daftar perangkat login ===== */
.device-security-block{display:grid;gap:11px;margin-top:14px;padding-top:14px;border-top:1px solid #eaecf0}
.device-security-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.device-security-head>div{display:grid;gap:3px;min-width:0}
.device-security-head b{font-size:13px;color:#172235}
.device-security-head small{font-size:10px;line-height:1.5;color:#667085}
.device-count-badge{flex:0 0 auto;padding:5px 8px;border-radius:999px;background:#f2f4f7;color:#475467;font-size:8px;font-weight:900;letter-spacing:.06em}
.device-list{display:grid;gap:8px}
.device-card{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:10px;padding:11px 12px;border:1px solid #e4e7ec;border-radius:15px;background:#fff;box-shadow:0 3px 10px rgba(16,24,40,.03)}
.device-card.current{border-color:#b7d5ff;background:linear-gradient(135deg,#f7fbff,#fff)}
.device-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:#eef4ff;color:#175cd3;font-size:20px;font-weight:900}
.device-card.current .device-icon{background:#e4f1ff;color:#0b5bd3}
.device-card-copy{display:grid;gap:2px;min-width:0}
.device-card-title{display:flex;align-items:center;gap:6px;min-width:0;flex-wrap:wrap}
.device-card-title strong{font-size:12px;color:#172235;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.device-current-chip{padding:3px 6px;border-radius:999px;background:#dcfce7;color:#087443;font-size:7.5px;font-weight:900;letter-spacing:.05em}
.device-card-copy>span{font-size:9.5px;color:#475467}
.device-card-copy>small{font-size:8.8px;line-height:1.4;color:#98a2b3}
.device-card-action{display:flex;align-items:center;justify-content:flex-end}
.device-card-action form{margin:0}
.device-revoke-btn{border:1px solid #fecdca;border-radius:10px;padding:7px 9px;background:#fff5f4;color:#b42318;font-size:9px;font-weight:850;cursor:pointer}
.device-revoke-btn:hover{background:#fee4e2}
.device-safe-label{padding:6px 8px;border-radius:10px;background:#ecfdf3;color:#067647;font-size:8.5px;font-weight:850;white-space:nowrap}
.device-revoke-all-form{margin:0}
.device-revoke-all-btn{border-color:#fecdca!important;background:#fff!important;color:#b42318!important}
.device-security-note{padding:10px 11px;border-radius:12px;background:#fffaeb;border:1px solid #fedf89;color:#8a6100;font-size:9.5px;line-height:1.5}
.device-empty-state{padding:16px;border:1px dashed #d0d5dd;border-radius:14px;text-align:center;color:#667085;font-size:10px;background:#fafafa}

@media(max-width:600px){
  .device-security-head{align-items:center}
  .device-card{grid-template-columns:36px minmax(0,1fr);padding:10px;gap:9px}
  .device-icon{width:36px;height:36px;border-radius:11px;font-size:17px}
  .device-card-action{grid-column:2;justify-content:flex-start;margin-top:3px}
  .device-revoke-btn{padding:7px 10px}
  .device-safe-label{padding:5px 8px}
}


/* ===== v16 - Daftar perangkat realtime ===== */
.device-live-status{display:flex!important;align-items:center;gap:5px;color:#98a2b3!important}
.device-live-status>i,.device-safe-label>i{width:6px;height:6px;border-radius:50%;background:#98a2b3;display:inline-block;flex:0 0 auto}
.device-live-status.online{color:#067647!important;font-weight:750}
.device-live-status.online>i,.device-safe-label>i{background:#12b76a;box-shadow:0 0 0 3px rgba(18,183,106,.10)}
.device-safe-label{display:inline-flex;align-items:center;gap:5px}
.device-card{transition:border-color .18s ease,background .18s ease,opacity .18s ease}
.device-card [data-realtime-revoke]:disabled{opacity:.55;cursor:wait}

/* ===== v17 PREMIUM COUPON ===== */
.premium-coupon-box{margin:-1px 0 17px;padding:11px;border:1px solid #dfe6ef;border-radius:12px;background:#fafcff}
.premium-coupon-input-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}
.premium-coupon-input-row input{margin:0!important;text-transform:uppercase;font-weight:800;letter-spacing:.04em}
.premium-coupon-input-row .btn{margin:0!important;white-space:nowrap;min-height:38px}
.premium-coupon-status{margin-top:8px;padding:8px 9px;border-radius:9px;background:#f3f5f8;color:#667085;font-size:9px;line-height:1.45}
.premium-coupon-status b,.premium-coupon-status span{display:block}.premium-coupon-status span{margin-top:2px;font-size:8px}
.premium-coupon-status.checking{background:#f1f6ff;color:#175cd3}
.premium-coupon-status.success{background:#eaf8ef;color:#067647;border:1px solid #c9ead5}
.premium-coupon-status.error{background:#fff0ef;color:#b42318;border:1px solid #f4c9c6}
.premium-original-amount{display:block;margin-bottom:2px;color:#98a2b3;font-size:11px;text-decoration:line-through}
.premium-invoice-lines .coupon-discount{color:#067647}
.admin-payment-price{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin-top:6px;font-size:8px;color:#667085}
.admin-payment-price del{color:#98a2b3}.admin-payment-price span{padding:3px 6px;border-radius:7px;background:#eaf8ef;color:#067647;font-weight:800}
.admin-coupon-row{display:grid;grid-template-columns:minmax(0,1fr) 130px auto;gap:10px;align-items:end;padding:12px;background:#fff;border:1px solid #e3e8ef;border-radius:14px}
.admin-coupon-row.expired{background:#fff9f8;border-color:#f0d0cc}
.admin-coupon-fields{display:grid;grid-template-columns:1.1fr 1fr .8fr 1fr 80px;gap:8px;align-items:end}
.admin-coupon-fields label{margin:0;font-size:9px;font-weight:800;color:#667085}
.admin-coupon-fields input,.admin-coupon-fields select{width:100%;margin-top:4px;border:1px solid #dce2eb;border-radius:8px;padding:7px 8px;font-size:10px;background:#fff}
.admin-coupon-info{align-self:center;display:grid;gap:2px;padding:8px 9px;border-radius:10px;background:#f6f8fb}
.admin-coupon-info span{font-size:13px;font-weight:900;color:#175cd3}.admin-coupon-info small{font-size:8px;color:#7a8798}
.admin-coupon-row.expired .admin-coupon-info span{color:#b42318}
@media(max-width:900px){.admin-coupon-row{grid-template-columns:1fr}.admin-coupon-fields{grid-template-columns:1fr 1fr}.admin-coupon-info{justify-self:start}.admin-coupon-row .row-actions{justify-content:flex-end}}
@media(max-width:600px){.premium-coupon-input-row{grid-template-columns:1fr}.premium-coupon-input-row .btn{width:100%}.admin-coupon-fields{grid-template-columns:1fr}.admin-coupon-row .row-actions{display:grid;grid-template-columns:1fr 1fr}.admin-coupon-row .row-actions button{width:100%}}


/* === v18: Notifikasi Super Admin untuk pembelian Premium === */
.admin-notification-badge,.admin-tab-notification-badge{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:#d92d20;color:#fff;font-size:10px;font-weight:800;line-height:1;box-shadow:0 2px 7px rgba(217,45,32,.24)}
.admin-notification-badge[hidden],.admin-tab-notification-badge[hidden]{display:none!important}
.admin-tab-notification-badge{min-width:18px;height:18px;font-size:9px;margin-left:4px;vertical-align:middle}
.admin-notification-list{display:grid;gap:10px}
.admin-notification-row{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:11px;align-items:center;padding:12px 13px;border:1px solid #e4e7ec;border-radius:14px;background:#fff;transition:.18s ease}
.admin-notification-row.unread{background:#f5f9ff;border-color:#b2ccff;box-shadow:0 4px 14px rgba(23,92,211,.06)}
.admin-notification-icon{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:#edf4ff;color:#175cd3;font-weight:900;font-size:18px}
.admin-notification-row.unread .admin-notification-icon{background:#175cd3;color:#fff}
.admin-notification-copy{min-width:0}.admin-notification-title{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.admin-notification-title b{font-size:13px;color:#101828}.admin-notification-title span{font-size:8px;font-weight:900;letter-spacing:.08em;padding:3px 6px;border-radius:999px;background:#d92d20;color:#fff}
.admin-notification-copy p{margin:4px 0 3px;color:#475467;font-size:12px;line-height:1.45}.admin-notification-copy small{display:block;color:#98a2b3;font-size:10px}
.admin-notification-open{border:0;border-radius:10px;padding:8px 10px;background:#edf4ff;color:#175cd3;font-size:11px;font-weight:800;cursor:pointer}
.admin-payment-highlight{outline:3px solid rgba(23,92,211,.18);box-shadow:0 0 0 7px rgba(23,92,211,.06)!important}
@media(max-width:640px){.admin-notification-row{grid-template-columns:36px minmax(0,1fr);padding:11px}.admin-notification-icon{width:36px;height:36px}.admin-notification-open{grid-column:2;justify-self:start;padding:7px 10px}.admin-notification-section .feature-toolbar{align-items:flex-start;gap:10px}.admin-notification-section .feature-toolbar .btn{font-size:10px;padding:7px 9px;white-space:nowrap}}

/* Mobile navigation: Lainnya opens a right-side account drawer. */
@media (max-width:760px){
  .sidebar-toggle{display:none!important}
  .app-main{padding-top:calc(12px + env(safe-area-inset-top))!important}
  body.has-sync-banner .app-main{padding-top:calc(74px + env(safe-area-inset-top))!important}
  .sidebar-backdrop{background:rgba(15,23,42,.46);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
  .app-sidebar{
    inset:0 0 0 auto;width:min(380px,92vw);box-sizing:border-box;
    padding:calc(18px + env(safe-area-inset-top)) 16px calc(20px + env(safe-area-inset-bottom));
    border:0;border-left:1px solid #e1e9f5;border-radius:28px 0 0 28px;
    background:linear-gradient(155deg,#edf4ff 0,#f8faff 230px,#f8faff 100%);
    box-shadow:-18px 0 60px rgba(15,23,42,.22)!important;
    transform:translateX(105%);visibility:hidden;
    transition:transform .24s cubic-bezier(.2,.8,.2,1),visibility .24s;
  }
  .app-sidebar.is-open{transform:translateX(0);visibility:visible}
  .sidebar-head{flex-shrink:0;padding:2px 0 16px;border-bottom:0;gap:8px}
  .sidebar-brand{gap:9px}.sidebar-brand-mark{flex:0 0 40px;width:40px;height:40px;border-radius:13px;box-shadow:0 5px 15px #dbe5f4}
  .sidebar-brand b{font-size:14px;color:#152b4e}.sidebar-brand small{font-size:10px;color:#61718b}
  .sidebar-close{width:40px;height:40px;flex-basis:40px;border:1px solid #dce5f2;background:#fff;color:#445775;border-radius:14px}
  .sidebar-profile{flex-shrink:0;margin:0 0 22px;padding:18px 16px;gap:13px;border:0;border-radius:22px;background:linear-gradient(120deg,#194b9c,#3278df);color:#fff;box-shadow:0 10px 24px rgba(37,99,217,.18)}
  .sidebar-profile>div{min-width:0}.sidebar-profile strong{overflow-wrap:anywhere;font-size:16px}
  .sidebar-profile small{color:#e0ebff;font-size:11px;margin-bottom:4px}
  .sidebar-profile .avatar.small{width:48px;height:48px;flex:0 0 48px;border-radius:16px;background:rgba(255,255,255,.18);color:#fff;border:1px solid rgba(255,255,255,.3);font-size:20px}
  .sidebar-profile .account-plan-badge{margin-top:7px}
  .sidebar-section-label{padding:0 5px 10px;font-size:10px;letter-spacing:1.2px;color:#627693}
  .sidebar-menu{gap:8px;padding-bottom:18px}
  .sidebar-menu-item{grid-template-columns:42px minmax(0,1fr) auto;gap:11px;min-height:68px;padding:11px;background:#fff;border:1px solid #e5ecf6;border-radius:18px;box-shadow:0 2px 5px rgba(32,57,92,.025)}
  .sidebar-menu-item b{font-size:13px;color:inherit}.sidebar-menu-item small{font-size:11px;line-height:1.45;color:#64748b}
  .sidebar-menu-icon{background:#edf3ff;border-radius:14px;color:#2861bb}
  .sidebar-menu-item-active{border-color:#c5d9fa}
  .sidebar-menu-item-active .sidebar-menu-icon{background:#fff}
  .sidebar-arrow{font-size:22px;color:#8396b1}
  .sidebar-local-status{flex-shrink:0;margin-top:auto;padding:13px;border-radius:16px;background:#edf8f2}
  .sidebar-logout-form{flex-shrink:0;margin-top:0;padding-top:12px}
  .sidebar-logout{min-height:46px;border-radius:16px;font-weight:700}
  body.sidebar-open .mobile-nav-item[data-view].active{background:transparent!important;color:#7c8799!important}
  .app-sidebar :focus-visible{outline:2px solid #2563d9;outline-offset:2px}
  .mobile-bottom-nav #mobileOpenMore:focus-visible{outline:2px solid #2563d9!important;outline-offset:-2px}
}
@media (max-width:760px) and (prefers-reduced-motion:reduce){
  .app-sidebar,.sidebar-backdrop{transition:none}
}

/* Transaction detail — invoice preview */
.tx-right .tx-actions{flex-wrap:wrap}
.tx-right .tx-actions .tx-detail-btn{color:#175cd3;background:#eef4ff;border:1px solid #d8e5fc;border-radius:8px;padding:5px 8px;min-height:30px;font-weight:700}
dialog.tx-detail-dialog{width:min(600px,calc(100% - 24px));max-height:calc(100dvh - 32px);max-width:600px;border-radius:22px;padding:0;background:#fff;overflow:auto;overscroll-behavior:contain;color:#172b49}
.tx-detail-toolbar{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;background:#f5f8fc;border-bottom:1px solid #e5ebf4;padding:12px 20px;font-size:12px;font-weight:700;color:#61738c}
.tx-detail-close{width:40px;height:40px;border:1px solid #dde5f0;border-radius:12px;background:#fff;font-size:25px;color:#405675;cursor:pointer}
.tx-detail-close:focus-visible,.tx-detail-btn:focus-visible{outline:2px solid #2563eb;outline-offset:2px}
.tx-invoice{padding:28px 30px}
.tx-invoice-brand{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.tx-invoice-eyebrow{font-size:10px;font-weight:800;letter-spacing:1.6px;color:#2465c8}
.tx-invoice-brand h2{margin:6px 0 0;font-size:25px;letter-spacing:-.6px}
.tx-invoice-status{display:inline-block;flex-shrink:0;padding:6px 9px;border-radius:20px;background:#e9f8f0;color:#16724c;font-size:10px;font-weight:800}
.tx-invoice-status.pending{background:#fff3d7;color:#88601b}
.tx-invoice-reference{display:flex;justify-content:space-between;gap:16px;margin:18px 0;color:#67768a;font-size:12px;overflow-wrap:anywhere}
.tx-invoice-amount{padding:22px;border:1px solid #dce8fb;border-radius:18px;background:#f0f5ff;display:flex;flex-direction:column;gap:6px;color:#1e57a9}
.tx-invoice-amount.expense{background:#fff4f0;border-color:#f7dfd3;color:#a44922}
.tx-invoice-amount.income{background:#edf9f3;border-color:#d5edde;color:#16734e}
.tx-invoice-amount>span{font-size:12px;font-weight:700}.tx-invoice-amount strong{font-size:32px;line-height:1.25;overflow-wrap:anywhere}.tx-invoice-amount small{font-size:11px}
.tx-invoice-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 18px;margin:25px 0;padding:0}
.tx-invoice-meta dt{font-size:11px;color:#718197;margin-bottom:6px}.tx-invoice-meta dd{margin:0;font-size:13px;font-weight:650;overflow-wrap:anywhere}
.tx-invoice-note{border-top:1px dashed #dce4ef;padding-top:18px}.tx-invoice-note h3{font-size:11px;color:#718197;margin:0 0 8px}.tx-invoice-note p{font-size:13px;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere;margin:0}
.tx-invoice-total{display:flex;justify-content:space-between;gap:16px;margin-top:22px;padding:18px 0;border-top:2px solid #183d71;border-bottom:1px solid #dce4ef;font-size:13px}.tx-invoice-total strong{font-size:18px;overflow-wrap:anywhere;text-align:right}
.tx-invoice-proof{margin-top:18px;border:1px solid #e2e9f3;border-radius:12px;padding:12px}.tx-invoice-proof summary{cursor:pointer;color:#175cd3;font-size:12px;font-weight:700}.tx-invoice-proof img{display:block;max-width:100%;height:auto;margin:14px auto 0;border-radius:8px}.tx-invoice-proof img[hidden]{display:none}.tx-proof-error{font-size:12px;color:#8c6330}
.tx-invoice-foot{margin-top:24px;text-align:center;color:#7b899d;font-size:10px;line-height:1.8}
@media(max-width:760px){
  dialog.tx-detail-dialog{max-height:calc(100dvh - 24px);border-radius:20px;width:calc(100% - 20px)}
  .tx-invoice{padding:22px 18px}.tx-detail-toolbar{padding:10px 16px}
  .tx-invoice-brand{flex-wrap:wrap}.tx-invoice-brand h2{font-size:23px}.tx-invoice-amount strong{font-size:28px}
  .tx-invoice-meta{gap:18px 12px}.tx-right .tx-actions .tx-detail-btn{min-height:34px;padding:5px 8px}
}

/* Summary actions: privacy and reload stay side by side. */
.balance-stat-actions{display:flex;align-items:center;gap:6px;flex-shrink:0}
.balance-stat-actions button:focus-visible{outline:2px solid #fff;outline-offset:2px}
@media(max-width:390px){
  .balance-stat-content{gap:6px}
  .balance-stat-actions{gap:4px}
  .balance-stat-actions .balance-visibility-toggle{width:32px;height:34px;flex-basis:32px}
}

.initial-wallet-dialog{width:min(580px,calc(100% - 24px));max-height:calc(100dvh - 32px);overflow:auto}
.initial-wallet-add{margin:4px 0 16px}
.initial-wallet-row{padding:16px;border:1px solid #e1e8f2;border-radius:15px;background:#f8faff;margin-bottom:12px}
.initial-wallet-heading{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;overflow-wrap:anywhere}.initial-wallet-heading b{font-size:15px;color:#1e3d6b}.initial-wallet-heading span{font-size:12px;color:#667891}
.initial-wallet-row input:disabled{background:#eaf0f7;color:#7b8899}

/* Asisten Keuangan transaction confirmation */
.chat-confirm-wrap{max-width:100%;width:100%}
.chat-confirm-card{width:min(720px,100%);background:#fff;border:1px solid #dce7f5;border-radius:18px;padding:14px;box-shadow:0 10px 28px rgba(22,55,102,.08)}
.chat-confirm-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}.chat-confirm-head b{display:block;font-size:13px;color:#173c70}.chat-confirm-head small{display:block;margin-top:3px;color:#728198;font-size:10px}.chat-confirm-head>span{font-size:9px;font-weight:800;background:#edf4ff;color:#245cae;padding:5px 8px;border-radius:999px;white-space:nowrap}
.chat-confirm-warning{font-size:10px;line-height:1.5;background:#fff7e4;border:1px solid #f6dfaa;color:#8b6413;border-radius:10px;padding:8px 10px;margin-bottom:10px}
.chat-confirm-list{display:grid;gap:10px}.chat-confirm-row{border:1px solid #e6ebf2;border-radius:14px;padding:10px;background:#f9fbfe}.chat-confirm-number{font-size:9px;font-weight:900;color:#59708f;margin-bottom:7px}.chat-confirm-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.chat-confirm-fields label{display:grid;gap:4px;font-size:9px;font-weight:800;color:#5f7088}.chat-confirm-fields input,.chat-confirm-fields select{width:100%;min-width:0;border:1px solid #d7e0ec;border-radius:9px;background:#fff;padding:8px 9px;font-size:11px;color:#243b5a}.chat-confirm-note{display:block;color:#75859a;font-size:9px;margin-top:7px;line-height:1.45}.chat-confirm-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}.chat-confirm-actions button{border-radius:10px;padding:9px 12px;font-size:10px;font-weight:800;cursor:pointer}.chat-confirm-actions .secondary-btn{border:1px solid #d8e1ed;background:#fff;color:#52657d}.chat-confirm-actions .primary-btn{border:1px solid #195bbf;background:#195bbf;color:#fff}

.initial-wallet-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.initial-wallet-fields label{display:grid;gap:6px;font-size:11px;font-weight:700;color:#53657d}.initial-wallet-row>small{display:block;margin-top:9px;color:#7c8a9d;font-size:10px;line-height:1.5}.money-caption{display:block;font-size:8px;color:#75869c;text-align:right;font-weight:700}.history-row.is-undone{opacity:.65}.status-pill.queued{background:#edf4ff;color:#245cae}.status-pill.failed{background:#fff1f1;color:#b42318}.status-pill.conflict{background:#fff0db;color:#9a5700}.sync-queue-row.conflict{border-color:#f0c779;background:#fffaf1}.sync-queue-row.failed{border-color:#f1c8c8;background:#fffafa}

@media(max-width:600px){.chat-confirm-fields,.initial-wallet-fields{grid-template-columns:1fr}.chat-confirm-actions button{flex:1}.chat-confirm-card{padding:11px}.chat-confirm-head{flex-direction:column}.chat-confirm-head>span{align-self:flex-start}}


/* ===== Bantuan & FAQ v3 ===== */
.help-faq-dialog{width:min(760px,calc(100% - 28px));max-width:760px;border-radius:24px;overflow:hidden}
.help-faq-card{padding:0;height:min(88dvh,840px);max-height:min(88dvh,840px);display:flex;flex-direction:column;overflow:hidden;background:#f7f9fc}
.help-faq-head{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 22px 14px;background:#fff;border-bottom:1px solid #e8edf4}
.help-faq-title-wrap{display:flex;align-items:center;gap:12px;min-width:0}.help-faq-title-icon{width:42px;height:42px;display:grid;place-items:center;flex:0 0 42px;border-radius:14px;background:#eaf2ff;color:#175cd3;font-size:22px;font-weight:900}.help-faq-title-wrap h3{margin:0;color:#172235;font-size:20px}.help-faq-title-wrap p{margin:3px 0 0;color:#7b8797;font-size:11px;line-height:1.45}
.help-faq-search-wrap{position:relative;flex:0 0 auto;margin:14px 18px 10px}.help-faq-search-wrap>svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);width:18px;height:18px;fill:none;stroke:#8995a5;stroke-width:2;stroke-linecap:round}.help-faq-search-wrap input{width:100%;height:45px;padding:0 42px;border:1px solid #dce3ed;border-radius:14px;background:#fff;font-size:13px;outline:none;box-shadow:0 4px 14px rgba(24,39,75,.03)}.help-faq-search-wrap input:focus{border-color:#175cd3;box-shadow:0 0 0 3px rgba(23,92,211,.1)}.help-faq-search-wrap>button{position:absolute;right:9px;top:50%;transform:translateY(-50%);width:28px;height:28px;border:0;border-radius:9px;background:#f0f3f7;color:#687587;font-size:18px;cursor:pointer}
.help-faq-categories{flex:0 0 auto;display:flex;flex-wrap:wrap;gap:7px;padding:0 18px 12px;overflow:visible}.help-faq-categories button{border:1px solid #dfe6ef;background:#fff;color:#596779;border-radius:999px;padding:8px 12px;font-size:10px;font-weight:800;line-height:1;white-space:nowrap;cursor:pointer;transition:.15s ease}.help-faq-categories button:hover{border-color:#bfd0e8;color:#175cd3}.help-faq-categories button.active{background:#175cd3;border-color:#175cd3;color:#fff;box-shadow:0 4px 10px rgba(23,92,211,.16)}
.help-faq-body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:0 18px 16px;scrollbar-width:thin;scrollbar-color:#ccd5e1 transparent}
.help-faq-results-line{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:2px 2px 10px}.help-faq-results-line b{font-size:11px;color:#354154}.help-faq-results-line span{font-size:9.5px;color:#919baa;text-align:right}
.help-faq-list{display:block;overflow:visible;padding:0}.help-faq-item{display:block;width:100%;min-height:0;margin:0 0 8px;border:1px solid #e1e7ef;border-radius:14px;background:#fff;overflow:hidden;box-shadow:0 2px 10px rgba(24,39,75,.025)}.help-faq-item[hidden]{display:none!important}.help-faq-item summary{list-style:none;display:flex;min-height:48px;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;cursor:pointer;font-size:11px;font-weight:800;line-height:1.4;color:#253246;user-select:none}.help-faq-item summary::-webkit-details-marker{display:none}.help-faq-item summary>span{display:block;min-width:0;flex:1}.help-faq-item summary i{display:grid;place-items:center;flex:0 0 24px;width:24px;height:24px;border-radius:8px;background:#eff4fb;color:#175cd3;font-style:normal;font-size:16px;line-height:1;transition:.18s}.help-faq-item[open]{border-color:#cddbf0;box-shadow:0 6px 16px rgba(24,39,75,.045)}.help-faq-item[open] summary{color:#175cd3}.help-faq-item[open] summary i{transform:rotate(45deg);background:#175cd3;color:#fff}.help-faq-answer{padding:11px 14px 13px;color:#5b6879;font-size:10.5px;line-height:1.65;border-top:1px solid #eef1f5}.help-faq-answer b{color:#2b394d}
.help-faq-group-title{display:flex;align-items:center;gap:9px;margin:15px 2px 7px;padding:0;color:#344258}.help-faq-group-title:first-child{margin-top:2px}.help-faq-group-title[hidden]{display:none!important}.help-faq-group-title>span{width:29px;height:29px;display:grid;place-items:center;flex:0 0 29px;border-radius:9px;background:#eaf2ff;color:#175cd3}.help-faq-group-title>span svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.help-faq-group-title>div{display:grid;gap:1px}.help-faq-group-title b{font-size:11px;line-height:1.2}.help-faq-group-title small{font-size:8.5px;line-height:1.35;color:#929cab;font-weight:600}
.help-faq-empty{text-align:center;padding:32px 18px;color:#7d8998}.help-faq-empty[hidden]{display:none!important}.help-faq-empty>span{margin:0 auto 8px;width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:#edf3fb;color:#175cd3;font-weight:900}.help-faq-empty b{display:block;color:#344156;font-size:13px}.help-faq-empty p{margin:5px 0 0;font-size:11px}
.help-faq-footer{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px calc(12px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid #e4e9f0}.help-faq-footer>div{display:grid;gap:2px}.help-faq-footer>div b{font-size:11px;color:#2b384b}.help-faq-footer>div span{font-size:9.5px;color:#8b95a4}.help-faq-footer .btn{white-space:nowrap}
@media(max-width:760px){.help-faq-dialog{width:100%!important;max-width:none!important;max-height:none!important;height:92dvh!important;margin:auto 0 0!important;border-radius:24px 24px 0 0!important}.help-faq-card{height:92dvh;max-height:92dvh}.help-faq-head{padding:15px 15px 12px}.help-faq-title-icon{width:36px;height:36px;flex-basis:36px;border-radius:12px;font-size:19px}.help-faq-title-wrap h3{font-size:17px}.help-faq-title-wrap p{font-size:9.5px}.help-faq-search-wrap{margin:11px 12px 8px}.help-faq-categories{flex-wrap:nowrap;gap:6px;padding:0 12px 10px;overflow-x:auto;scrollbar-width:none}.help-faq-categories::-webkit-scrollbar{display:none}.help-faq-categories button{padding:8px 11px}.help-faq-body{padding:0 12px 12px}.help-faq-results-line{padding:2px 2px 8px}.help-faq-results-line span{display:none}.help-faq-item summary{min-height:46px;padding:11px 12px;font-size:10.5px}.help-faq-answer{padding:10px 12px 12px;font-size:10.5px}.help-faq-group-title{margin-top:13px}.help-faq-group-title small{display:none}.help-faq-footer{padding:10px 12px calc(10px + env(safe-area-inset-bottom))}.help-faq-footer>div span{display:none}.help-faq-footer .btn{padding:10px 12px;font-size:11px}}



/* ===== Biometric security (Android native bridge) ===== */
.biometric-security-card{
  display:grid;
  grid-template-columns:44px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  margin:14px 0;
  padding:14px;
  border:1px solid #dbe4f0;
  border-radius:16px;
  background:linear-gradient(180deg,#fff,#f8fbff);
}
.biometric-security-icon{
  width:44px;height:44px;border-radius:14px;
  display:grid;place-items:center;
  background:#eaf2ff;color:#175cd3;
  font-size:24px;font-weight:800;
}
.biometric-security-copy{min-width:0;display:grid;gap:4px}
.biometric-security-title-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.biometric-security-title-row b{font-size:14px;color:#162033}
.biometric-security-copy small{display:block;color:#526173;line-height:1.45}
.biometric-security-note{display:block;color:#7b8796;font-size:11px;line-height:1.4}
.biometric-security-state{
  display:inline-flex;align-items:center;min-height:22px;padding:3px 8px;border-radius:999px;
  font-size:9px;font-weight:800;letter-spacing:.05em;
}
.biometric-security-state.enabled{background:#e8f8ef;color:#087443}
.biometric-security-state.available{background:#eaf2ff;color:#175cd3}
.biometric-security-state.unavailable{background:#f1f3f6;color:#687386}
.biometric-security-toggle{min-width:104px;white-space:nowrap}
@media(max-width:620px){
  .biometric-security-card{grid-template-columns:42px minmax(0,1fr);align-items:start}
  .biometric-security-icon{width:42px;height:42px}
  .biometric-security-toggle{grid-column:1/-1;width:100%}
}

/* =========================================================
   ADMIN: BROADCAST EMAIL PENGGUNA
   ========================================================= */
.admin-email-broadcast-section{position:relative}
.admin-broadcast-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}
.admin-broadcast-form label{display:grid;gap:5px;margin:0;font-size:9px;font-weight:850;color:#667085}
.admin-broadcast-form input,.admin-broadcast-form select,.admin-broadcast-form textarea{width:100%;box-sizing:border-box;border:1px solid #dce3ed;border-radius:10px;background:#fff;color:#172235;padding:9px 10px;font:inherit;font-size:10px;outline:none;transition:.15s ease}
.admin-broadcast-form textarea{min-height:105px;resize:vertical;line-height:1.55}
.admin-broadcast-form input:focus,.admin-broadcast-form select:focus,.admin-broadcast-form textarea:focus{border-color:#8fb6ff;box-shadow:0 0 0 3px rgba(23,92,211,.08)}
.admin-broadcast-wide{grid-column:1/-1}
.admin-broadcast-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:11px}
.admin-broadcast-progress{min-width:0;color:#667085;font-size:9px;line-height:1.45}
.admin-broadcast-history{margin-top:12px}
.admin-broadcast-row{display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:10px;align-items:center;padding:11px 12px;border:1px solid #e3e8ef;border-radius:13px;background:#fff}
.admin-broadcast-icon{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:#edf4ff;color:#175cd3;font-size:17px}
.admin-broadcast-main{min-width:0}.admin-broadcast-main>b{display:block;font-size:11px;color:#26354a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.admin-broadcast-main>small{display:block;margin-top:3px;color:#8792a3;font-size:8px}
.admin-broadcast-meter{height:5px;margin-top:7px;border-radius:999px;overflow:hidden;background:#eef2f6}.admin-broadcast-meter span{display:block;height:100%;border-radius:inherit;background:#175cd3}
.admin-broadcast-retry{white-space:nowrap!important;width:auto!important}
@media(max-width:760px){.admin-broadcast-form{grid-template-columns:1fr}.admin-broadcast-wide{grid-column:auto}.admin-broadcast-actions{align-items:stretch;flex-direction:column}.admin-broadcast-actions .btn{width:100%}.admin-broadcast-row{grid-template-columns:34px minmax(0,1fr)}.admin-broadcast-icon{width:34px;height:34px}.admin-broadcast-retry{grid-column:2;width:max-content!important}}
.admin-broadcast-form label>small{font-size:8px;font-weight:600;line-height:1.45;color:#8a95a6}
.admin-broadcast-action-buttons{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.admin-broadcast-card{display:grid;gap:8px}
.admin-broadcast-diagnostics{margin:0 2px 10px;padding:9px 11px;border:1px solid #e7ebf1;border-radius:11px;background:#fbfcfe}
.admin-broadcast-diagnostics summary{cursor:pointer;font-size:9px;font-weight:800;color:#52657d}
.admin-broadcast-diagnostic-list{display:grid;gap:6px;margin-top:8px}
.admin-broadcast-diagnostic-item{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:10px;align-items:start;padding:7px 8px;border-radius:9px;background:#fff;border:1px solid #edf0f4}
.admin-broadcast-diagnostic-item>span{min-width:0}.admin-broadcast-diagnostic-item b{display:block;font-size:9px;color:#2a3950}.admin-broadcast-diagnostic-item small{display:block;font-size:8px;color:#8490a1;line-height:1.4;word-break:break-word}
.admin-broadcast-delivery-note{display:block;margin-top:8px;color:#98a2b3;font-size:8px;line-height:1.45}
@media(max-width:760px){.admin-broadcast-action-buttons{width:100%;display:grid;grid-template-columns:1fr 1fr}.admin-broadcast-action-buttons .btn{width:100%}.admin-broadcast-diagnostic-item{grid-template-columns:1fr}}

.admin-broadcast-safe-mode{padding:10px 12px;border:1px solid #dfe7f2;border-radius:12px;background:#f8fbff}.admin-broadcast-safe-row{display:flex!important;align-items:center;gap:8px;font-size:9px!important;color:#344054!important;font-weight:750!important}.admin-broadcast-safe-row input{width:16px!important;height:16px!important;margin:0!important;box-shadow:none!important}.admin-broadcast-safe-mode>small{font-size:8px!important;color:#7c8a9d!important;line-height:1.45!important}

/* v7.6 - Saldo minimum dompet */
.danger-text{color:#b42318;font-weight:700}

/* =========================================================
   v7.7 - PERIODE DATA TRANSAKSI
   Default: bulan berjalan. Saldo tetap akumulatif seluruh riwayat.
   ========================================================= */
.tx-period-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px 2px;
}
.tx-period-copy{
  min-width:0;
  display:grid;
  gap:2px;
}
.tx-period-copy b{
  color:#344054;
  font-size:10px;
  font-weight:850;
}
.tx-period-copy small{
  color:#98a2b3;
  font-size:8.5px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.tx-period-switch{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:3px;
  padding:3px;
  border:1px solid #dfe5ee;
  border-radius:11px;
  background:#f4f6f9;
}
.tx-period-switch button{
  min-height:30px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#667085;
  padding:0 10px;
  font:inherit;
  font-size:9px;
  font-weight:850;
  cursor:pointer;
  white-space:nowrap;
  transition:background .15s ease,color .15s ease,box-shadow .15s ease;
}
.tx-period-switch button:hover{color:#175cd3}
.tx-period-switch button.active{
  background:#fff;
  color:#175cd3;
  box-shadow:0 1px 4px rgba(16,24,40,.10);
}

@media(max-width:760px){
  .tx-period-bar{padding:8px 10px 2px;gap:7px}
  .tx-period-copy b{font-size:9.5px}
  .tx-period-copy small{font-size:8px;max-width:150px}
  .tx-period-switch button{min-height:31px;padding:0 9px;font-size:8.5px}
}
@media(max-width:390px){
  .tx-period-copy small{max-width:115px}
  .tx-period-switch button{padding:0 7px;font-size:8px}
}

/* =========================================================
   v7.10 - TRANSAKSI MOBILE CARD UI
   Fokus: data utuh, hierarchy jelas, tidak terpotong di layar kecil.
   ========================================================= */
.tx.tx-card{display:block}
.tx-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%}
.tx-card-head .tx-main{flex:1 1 auto}
.tx-card-head .tx-right{flex:0 0 auto}
.tx-card .tx-title-row{display:flex;align-items:flex-start;gap:7px;flex-wrap:wrap;min-width:0}
.tx-card .tx-title{min-width:0;overflow-wrap:anywhere}
.tx-card .tx-badges{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.tx-kind-badge,.tx-pattern-badge{
  display:inline-flex;align-items:center;min-height:20px;padding:2px 7px;border-radius:999px;
  font-size:8px;font-weight:850;line-height:1.2;white-space:nowrap
}
.tx-kind-badge.expense{background:#fff0ee;color:#b42318}
.tx-kind-badge.income{background:#ecfdf3;color:#067647}
.tx-kind-badge.transfer{background:#eef2ff;color:#4058ba}
.tx-pattern-badge{background:#f3f5f8;color:#667085}
.tx-card .scan-badge,.tx-card .sync-badge,.tx-card .transfer-badge{margin-left:0}
.tx-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:6px;min-width:0}
.tx-meta-item{
  display:inline-flex;align-items:center;gap:4px;max-width:100%;min-height:24px;padding:4px 7px;
  border-radius:8px;background:#f6f8fb;color:#697586;font-size:9px;font-weight:700;
  white-space:normal;overflow-wrap:anywhere;word-break:break-word
}
.tx-meta-item>span{flex:0 0 auto;color:#91a0b4;font-size:10px}
.tx-note{margin:10px 0 0;padding:9px 10px;border:1px solid #edf0f4;border-radius:11px;background:#fafbfc}
.tx-note-label{display:block;margin-bottom:3px;color:#98a2b3;font-size:8px;font-weight:850;text-transform:uppercase;letter-spacing:.35px}
.tx-note p{max-width:none!important;margin:0!important;color:#475467!important;font-size:10px!important;line-height:1.5!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;overflow-wrap:anywhere;word-break:break-word}
.tx-note.is-empty p{color:#a0a9b6!important;font-style:italic}
.tx-card-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:9px;padding-top:9px;border-top:1px solid #eef1f5}
.tx-card-id{color:#a0a9b6;font-size:8px;font-weight:750;white-space:nowrap}
.tx-card .tx-amount-label{display:block;margin-bottom:3px;color:#98a2b3;font-size:8px;font-weight:800}

@media(max-width:760px){
  .transactions-panel.mobile-view.active{
    background:#f5f7fb!important;
    border-radius:18px!important;
  }
  .transactions-panel .panel-head{
    padding:12px 13px!important;
    background:#fff!important;
    border-bottom:1px solid #edf0f4!important;
  }
  .transactions-panel .panel-head>div{min-width:0}
  .transactions-panel .panel-head b{font-size:15px!important}
  .transactions-panel .panel-subtitle{display:block;margin-top:2px;white-space:normal!important;line-height:1.35!important}
  .tx-filter-wrap{background:#fff!important}
  .transactions-panel .tx-list{
    display:grid!important;
    align-content:start!important;
    gap:10px!important;
    padding:10px!important;
    background:#f5f7fb!important;
  }
  .transactions-panel .tx{
    display:block!important;
    margin:0!important;
    padding:12px!important;
    border:1px solid #e7ebf1!important;
    border-radius:16px!important;
    background:#fff!important;
    box-shadow:0 3px 12px rgba(16,24,40,.045)!important;
    overflow:visible!important;
  }
  .transactions-panel .tx.offline-pending{
    border-style:dashed!important;
    border-color:#e8cc78!important;
    background:#fffdf7!important;
  }
  .tx-card-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:start!important;
    gap:10px!important;
  }
  .transactions-panel .tx-main{
    min-width:0!important;
    display:flex!important;
    align-items:flex-start!important;
    gap:10px!important;
  }
  .transactions-panel .tx-icon{
    width:44px!important;height:44px!important;flex:0 0 44px!important;
    border-radius:13px!important;background:#f3f6fa!important;font-size:19px!important;
  }
  .transactions-panel .tx-main>.stored-photo{
    width:44px!important;max-width:44px!important;flex:0 0 44px!important;margin:0!important
  }
  .transactions-panel .tx-main>.stored-photo img{
    width:44px!important;height:44px!important;object-fit:cover!important;border-radius:13px!important
  }
  .transactions-panel .tx-info{min-width:0!important;flex:1 1 auto!important}
  .transactions-panel .tx-info b,
  .transactions-panel .tx-title{
    display:block!important;
    max-width:none!important;
    color:#172235!important;
    font-size:13px!important;
    line-height:1.3!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:anywhere!important;
  }
  .transactions-panel .tx-right{
    min-width:92px!important;
    max-width:42%!important;
    text-align:right!important;
    white-space:normal!important;
  }
  .transactions-panel .tx-right>b{
    display:block!important;
    max-width:100%!important;
    margin:0!important;
    font-size:14px!important;
    line-height:1.25!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }
  .tx-meta{margin-top:7px!important;gap:5px!important}
  .tx-meta-item{font-size:9px!important;line-height:1.35!important}
  .tx-meta-wallet{max-width:100%!important}
  .tx-note{margin-top:10px!important;padding:9px 10px!important}
  .tx-note p{font-size:10.5px!important;line-height:1.55!important}
  .tx-card-footer{align-items:center!important}
  .transactions-panel .tx-actions{
    display:flex!important;align-items:center!important;justify-content:flex-end!important;
    gap:6px!important;flex-wrap:wrap!important;margin-left:auto!important
  }
  .transactions-panel .tx-right .tx-actions{display:none!important}
  .transactions-panel .tx-actions button{
    display:inline-flex!important;align-items:center!important;justify-content:center!important;
    min-height:34px!important;margin:0!important;padding:6px 10px!important;
    border-radius:9px!important;font-size:9px!important;font-weight:850!important;line-height:1!important
  }
  .transactions-panel .tx-actions .tx-detail-btn{
    min-width:58px!important;border:1px solid #cfe0ff!important;background:#edf4ff!important;color:#175cd3!important
  }
  .transactions-panel .tx-actions .tx-edit-btn{
    min-width:48px!important;border:1px solid #dce6f4!important;background:#f7f9fc!important;color:#3b587a!important
  }
  .transactions-panel .tx-actions button[data-delete-id]{
    min-width:50px!important;border:1px solid #ffd8d3!important;background:#fff3f2!important;color:#b42318!important
  }
  .transactions-panel .pending-sync-text{
    display:inline-flex;align-items:center;min-height:32px;padding:0 8px;border-radius:8px;
    background:#fff5d8;color:#8b6513;font-size:8.5px!important;white-space:normal
  }
  .tx-filter-summary{
    padding-bottom:9px!important;
  }
  .tx-filter-summary>span{
    min-height:26px;display:inline-flex;align-items:center
  }
}

@media(max-width:390px){
  .transactions-panel .tx-list{padding:8px!important;gap:8px!important}
  .transactions-panel .tx{padding:10px!important;border-radius:14px!important}
  .tx-card-head{grid-template-columns:minmax(0,1fr) minmax(82px,36%)!important;gap:8px!important}
  .transactions-panel .tx-icon{width:40px!important;height:40px!important;flex-basis:40px!important}
  .transactions-panel .tx-main>.stored-photo,
  .transactions-panel .tx-main>.stored-photo img{width:40px!important;height:40px!important;max-width:40px!important;flex-basis:40px!important}
  .transactions-panel .tx-right{min-width:0!important;max-width:none!important}
  .transactions-panel .tx-right>b{font-size:13px!important}
  .tx-kind-badge,.tx-pattern-badge{font-size:7.5px!important;padding:2px 6px!important}
  .tx-card-footer{align-items:flex-start!important;flex-direction:column!important}
  .transactions-panel .tx-actions{width:100%!important;justify-content:stretch!important}
  .transactions-panel .tx-actions button{flex:1 1 0!important}
  .transactions-panel .pending-sync-text{width:100%;justify-content:center}
}

/* =========================================================
   v7.10.1 - MOBILE TRANSACTION FILTER COMPACT
   Memaksimalkan area daftar transaksi tanpa mengurangi fungsi filter.
   ========================================================= */
@media (max-width:760px){
  /* Periode dibuat seperti toolbar tipis. */
  .tx-period-bar{
    min-height:30px!important;
    padding:3px 8px 2px!important;
    gap:5px!important;
  }
  .tx-period-copy{gap:0!important;min-width:0!important}
  .tx-period-copy b{
    font-size:8.5px!important;
    line-height:1.05!important;
    white-space:nowrap!important;
  }
  .tx-period-copy small{display:none!important}
  .tx-period-switch{
    gap:2px!important;
    padding:2px!important;
    border-radius:9px!important;
  }
  .tx-period-switch button{
    min-height:25px!important;
    height:25px!important;
    padding:0 8px!important;
    border-radius:7px!important;
    font-size:8px!important;
    line-height:1!important;
  }

  /* Tombol pembuka filter cukup satu baris kecil. */
  .tx-filter-toggle{
    height:31px!important;
    min-height:31px!important;
    padding:0 9px!important;
    gap:5px!important;
    font-size:9.5px!important;
    line-height:1!important;
  }
  .tx-filter-toggle-icon{
    width:22px!important;
    height:22px!important;
    flex:0 0 22px!important;
    border-radius:7px!important;
  }
  .tx-filter-toggle-icon svg{width:12px!important;height:12px!important}
  .tx-filter-chevron{font-size:12px!important}
  .tx-filter-active-count{
    min-width:17px!important;
    height:17px!important;
    padding:0 5px!important;
    font-size:8px!important;
  }

  /* Ringkasan jumlah/pemasukan/pengeluaran tidak perlu memakan ruang di mobile.
     Nilai utama sudah tersedia di kartu ringkasan dashboard. */
  .tx-filter-summary{display:none!important}

  /* Saat filter dibuka, tetap padat tetapi mudah disentuh. */
  .tx-filter-panel{
    padding:6px 8px 8px!important;
    max-height:min(42dvh,250px)!important;
    overflow-y:auto!important;
    background:#f8faff!important;
  }
  .tx-filter-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:5px 6px!important;
  }
  .tx-filter-grid label{
    gap:3px!important;
    font-size:7.8px!important;
    line-height:1.05!important;
  }
  .tx-filter-grid input,
  .tx-filter-grid select{
    height:31px!important;
    min-height:31px!important;
    padding:0 7px!important;
    border-radius:8px!important;
    font-size:9.5px!important;
  }
  .tx-filter-actions{
    gap:6px!important;
    margin-top:6px!important;
  }
  .tx-filter-reset,
  .tx-filter-apply{
    height:31px!important;
    min-height:31px!important;
    padding:0 9px!important;
    border-radius:8px!important;
    font-size:9px!important;
  }

  /* Sedikit rapatkan jarak awal list setelah toolbar filter. */
  .transactions-panel .tx-list{scroll-padding-top:6px!important}
}

@media (max-width:370px){
  .tx-period-bar{padding-left:6px!important;padding-right:6px!important}
  .tx-period-copy b{font-size:8px!important}
  .tx-period-switch button{padding:0 6px!important;font-size:7.7px!important}
  .tx-filter-panel{padding-left:6px!important;padding-right:6px!important}
  .tx-filter-grid{gap:5px!important}
  .tx-filter-grid input,.tx-filter-grid select{font-size:9px!important;padding:0 5px!important}
}

/* =========================================================
   v7.10.3 - MOBILE TRANSACTION VIEW ULTRA COMPACT
   Tujuan: ruang daftar transaksi lebih besar tanpa memotong data kartu.
   Perubahan hanya CSS; tidak menyentuh renderer/logic transaksi.
   ========================================================= */
@media (max-width:760px){
  /* Kompres area atas khusus saat halaman Transaksi aktif. */
  body:has(#txPanel.mobile-view.active) .stats{
    gap:5px!important;
    margin-bottom:5px!important;
  }
  body:has(#txPanel.mobile-view.active) .balance-stat{
    min-height:64px!important;
    padding:9px 12px!important;
    border-radius:17px!important;
  }
  body:has(#txPanel.mobile-view.active) .balance-stat small{
    margin-bottom:2px!important;
    font-size:9px!important;
    line-height:1.15!important;
  }
  body:has(#txPanel.mobile-view.active) .balance-stat strong{
    font-size:22px!important;
    line-height:1.08!important;
  }
  body:has(#txPanel.mobile-view.active) .balance-detail-hint{
    margin-top:1px!important;
    font-size:8px!important;
    line-height:1.15!important;
  }
  body:has(#txPanel.mobile-view.active) .balance-stat-actions{
    gap:3px!important;
  }
  body:has(#txPanel.mobile-view.active) .balance-stat-actions .balance-visibility-toggle,
  body:has(#txPanel.mobile-view.active) #balanceRefresh{
    width:30px!important;
    height:30px!important;
    flex-basis:30px!important;
    border-radius:9px!important;
  }
  body:has(#txPanel.mobile-view.active) .balance-stat-actions svg{
    width:16px!important;
    height:16px!important;
  }

  body:has(#txPanel.mobile-view.active) .income-stat,
  body:has(#txPanel.mobile-view.active) .expense-stat,
  body:has(#txPanel.mobile-view.active) .initial-stat{
    min-height:45px!important;
    padding:6px 7px!important;
    border-radius:14px!important;
  }
  body:has(#txPanel.mobile-view.active) .income-stat small,
  body:has(#txPanel.mobile-view.active) .expense-stat small,
  body:has(#txPanel.mobile-view.active) .initial-stat small{
    margin-bottom:2px!important;
    font-size:8px!important;
    line-height:1.05!important;
  }
  body:has(#txPanel.mobile-view.active) .income-stat strong,
  body:has(#txPanel.mobile-view.active) .expense-stat strong,
  body:has(#txPanel.mobile-view.active) .initial-stat strong{
    font-size:11px!important;
    line-height:1.1!important;
  }

  /* Batas harian tetap terlihat tetapi menjadi satu baris informasi. */
  body:has(#txPanel.mobile-view.active) .daily-budget-card{
    margin-bottom:5px!important;
    border-radius:14px!important;
  }
  body:has(#txPanel.mobile-view.active) .daily-budget-main{
    min-height:44px!important;
    padding:5px 7px!important;
    gap:7px!important;
  }
  body:has(#txPanel.mobile-view.active) .daily-budget-icon{
    width:28px!important;
    height:28px!important;
    flex-basis:28px!important;
    border-radius:9px!important;
    font-size:13px!important;
  }
  body:has(#txPanel.mobile-view.active) .daily-budget-copy{
    min-width:0!important;
    display:flex!important;
    align-items:center!important;
  }
  body:has(#txPanel.mobile-view.active) .daily-budget-title-row{
    width:100%!important;
    margin:0!important;
    gap:5px!important;
    flex-wrap:nowrap!important;
  }
  body:has(#txPanel.mobile-view.active) .daily-budget-title-row b{
    min-width:0!important;
    font-size:9.5px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  body:has(#txPanel.mobile-view.active) .daily-budget-status{
    flex:0 0 auto!important;
    margin-left:auto!important;
    padding:2px 5px!important;
    font-size:7.5px!important;
  }
  body:has(#txPanel.mobile-view.active) .daily-budget-values,
  body:has(#txPanel.mobile-view.active) .daily-budget-progress,
  body:has(#txPanel.mobile-view.active) .daily-budget-copy>small,
  body:has(#txPanel.mobile-view.active) .budget-edit-btn{
    display:none!important;
  }
  body:has(#txPanel.mobile-view.active) .daily-budget-actions{
    gap:2px!important;
  }
  body:has(#txPanel.mobile-view.active) .budget-card-icon-btn{
    width:26px!important;
    height:26px!important;
    border-radius:8px!important;
  }
  body:has(#txPanel.mobile-view.active) .budget-card-icon-btn svg{
    width:13px!important;
    height:13px!important;
  }

  /* Header transaksi dibuat tipis. */
  #txPanel.mobile-view.active{
    border-radius:16px!important;
  }
  #txPanel.mobile-view.active .panel-head{
    height:40px!important;
    min-height:40px!important;
    padding:0 10px!important;
  }
  #txPanel.mobile-view.active .panel-head b{
    font-size:13px!important;
  }
  #txPanel.mobile-view.active #txCount{
    min-width:28px!important;
    height:25px!important;
    padding:0 7px!important;
    font-size:9px!important;
  }

  /* Periode cukup toggle saja. Caption panjang dihilangkan di mobile. */
  #txPanel.mobile-view.active .tx-period-bar{
    min-height:30px!important;
    padding:3px 7px!important;
    gap:0!important;
  }
  #txPanel.mobile-view.active .tx-period-copy{
    display:none!important;
  }
  #txPanel.mobile-view.active .tx-period-switch{
    width:100%!important;
    padding:2px!important;
    gap:2px!important;
    border-radius:9px!important;
  }
  #txPanel.mobile-view.active .tx-period-switch button{
    flex:1 1 0!important;
    min-height:25px!important;
    height:25px!important;
    padding:0 6px!important;
    font-size:8px!important;
    border-radius:7px!important;
  }

  /* Search + Unduh satu baris dengan tinggi minimum. */
  #txPanel.mobile-view.active .tx-search-export-row{
    padding:4px 7px!important;
    gap:5px!important;
  }
  #txPanel.mobile-view.active .tx-search-box{
    height:34px!important;
    min-height:34px!important;
    padding:0 8px!important;
    gap:5px!important;
    border-radius:10px!important;
  }
  #txPanel.mobile-view.active .tx-search-icon{
    width:15px!important;
    height:15px!important;
    flex-basis:15px!important;
  }
  #txPanel.mobile-view.active .tx-search-icon svg{
    width:14px!important;
    height:14px!important;
  }
  #txPanel.mobile-view.active .tx-search-box input{
    font-size:10px!important;
  }
  #txPanel.mobile-view.active .tx-export-toggle{
    height:34px!important;
    min-height:34px!important;
    min-width:58px!important;
    padding:0 8px!important;
    gap:4px!important;
    border-radius:10px!important;
    font-size:8.5px!important;
  }
  #txPanel.mobile-view.active .tx-export-chevron{
    font-size:10px!important;
  }

  /* Filter tertutup hanya 29px. Ringkasan chips dihilangkan. */
  #txPanel.mobile-view.active .tx-filter-toggle{
    height:29px!important;
    min-height:29px!important;
    padding:0 7px!important;
    gap:5px!important;
    font-size:9px!important;
  }
  #txPanel.mobile-view.active .tx-filter-toggle-icon{
    width:20px!important;
    height:20px!important;
    flex-basis:20px!important;
    border-radius:6px!important;
  }
  #txPanel.mobile-view.active .tx-filter-toggle-icon svg{
    width:11px!important;
    height:11px!important;
  }
  #txPanel.mobile-view.active .tx-filter-chevron{
    font-size:10px!important;
  }
  #txPanel.mobile-view.active .tx-filter-summary{
    display:none!important;
  }

  /* Panel filter saat dibuka tetap dua kolom dan tidak terlalu tinggi. */
  #txPanel.mobile-view.active .tx-filter-panel{
    padding:5px 7px 7px!important;
    max-height:min(38dvh,220px)!important;
  }
  #txPanel.mobile-view.active .tx-filter-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:5px!important;
  }
  #txPanel.mobile-view.active .tx-filter-grid label{
    gap:2px!important;
    font-size:7.5px!important;
  }
  #txPanel.mobile-view.active .tx-filter-grid input,
  #txPanel.mobile-view.active .tx-filter-grid select{
    height:30px!important;
    min-height:30px!important;
    padding:0 6px!important;
    font-size:9px!important;
    border-radius:8px!important;
  }
  #txPanel.mobile-view.active .tx-filter-actions{
    margin-top:5px!important;
    gap:5px!important;
  }
  #txPanel.mobile-view.active .tx-filter-reset,
  #txPanel.mobile-view.active .tx-filter-apply{
    height:30px!important;
    min-height:30px!important;
    padding:0 8px!important;
    font-size:8.5px!important;
  }

  /* Daftar dimulai segera setelah toolbar. Kartu tetap tidak memotong data. */
  #txPanel.mobile-view.active .tx-list{
    padding:6px!important;
    gap:7px!important;
  }
  #txPanel.mobile-view.active .tx{
    padding:9px!important;
    border-radius:13px!important;
  }
  #txPanel.mobile-view.active .tx-note{
    margin-top:7px!important;
    padding:7px 8px!important;
  }
  #txPanel.mobile-view.active .tx-card-footer{
    margin-top:7px!important;
    padding-top:7px!important;
  }
}

@media (max-width:390px){
  body:has(#txPanel.mobile-view.active) .balance-stat{
    min-height:60px!important;
    padding:8px 11px!important;
  }
  body:has(#txPanel.mobile-view.active) .balance-stat strong{font-size:20px!important}
  body:has(#txPanel.mobile-view.active) .income-stat,
  body:has(#txPanel.mobile-view.active) .expense-stat,
  body:has(#txPanel.mobile-view.active) .initial-stat{
    min-height:42px!important;
    padding:5px 6px!important;
  }
  #txPanel.mobile-view.active .tx-export-toggle{min-width:52px!important;padding:0 6px!important}
}

/* =========================================================
   v7.10.4 - Extra compact transaction header on mobile
   Fokus: periode + pencarian/export saja. Tidak mengubah render/list.
   ========================================================= */
@media (max-width:768px){
  /* Hilangkan ruang vertikal berlebih di toolbar transaksi */
  #txPanel.mobile-view.active .tx-toolbar,
  #txPanel.mobile-view.active .tx-toolbar-wrap,
  #txPanel.mobile-view.active .tx-header-tools{
    gap:2px!important;
    margin:0!important;
    padding-top:0!important;
    padding-bottom:0!important;
  }

  /* Periode: satu strip sangat tipis */
  #txPanel.mobile-view.active .tx-period-bar{
    min-height:24px!important;
    height:24px!important;
    padding:1px 5px!important;
    margin:0!important;
    border-radius:0!important;
  }
  #txPanel.mobile-view.active .tx-period-copy{
    display:none!important;
  }
  #txPanel.mobile-view.active .tx-period-switch{
    width:100%!important;
    height:22px!important;
    min-height:22px!important;
    padding:1px!important;
    gap:1px!important;
    border-radius:7px!important;
  }
  #txPanel.mobile-view.active .tx-period-switch button{
    min-height:20px!important;
    height:20px!important;
    padding:0 5px!important;
    font-size:7.5px!important;
    line-height:20px!important;
    border-radius:6px!important;
  }

  /* Search + unduh dibuat serendah mungkin, tetap mudah ditekan */
  #txPanel.mobile-view.active .tx-search-export-row{
    padding:2px 5px!important;
    margin:0!important;
    gap:4px!important;
    min-height:32px!important;
  }
  #txPanel.mobile-view.active .tx-search-box{
    height:30px!important;
    min-height:30px!important;
    padding:0 7px!important;
    gap:4px!important;
    border-radius:9px!important;
  }
  #txPanel.mobile-view.active .tx-search-icon{
    width:13px!important;
    height:13px!important;
    flex:0 0 13px!important;
  }
  #txPanel.mobile-view.active .tx-search-icon svg{
    width:12px!important;
    height:12px!important;
  }
  #txPanel.mobile-view.active .tx-search-box input{
    height:28px!important;
    min-height:28px!important;
    padding:0!important;
    font-size:9px!important;
    line-height:28px!important;
  }
  #txPanel.mobile-view.active .tx-search-box input::placeholder{
    font-size:9px!important;
  }
  #txPanel.mobile-view.active .tx-export-toggle{
    height:30px!important;
    min-height:30px!important;
    min-width:52px!important;
    padding:0 7px!important;
    gap:3px!important;
    border-radius:9px!important;
    font-size:8px!important;
  }
  #txPanel.mobile-view.active .tx-export-chevron{
    font-size:9px!important;
  }
}

@media (max-width:390px){
  #txPanel.mobile-view.active .tx-period-bar{
    height:23px!important;
    min-height:23px!important;
    padding-left:4px!important;
    padding-right:4px!important;
  }
  #txPanel.mobile-view.active .tx-period-switch{
    height:21px!important;
    min-height:21px!important;
  }
  #txPanel.mobile-view.active .tx-period-switch button{
    height:19px!important;
    min-height:19px!important;
    line-height:19px!important;
    font-size:7px!important;
  }
  #txPanel.mobile-view.active .tx-search-export-row{
    padding-left:4px!important;
    padding-right:4px!important;
    gap:3px!important;
  }
  #txPanel.mobile-view.active .tx-search-box,
  #txPanel.mobile-view.active .tx-export-toggle{
    height:29px!important;
    min-height:29px!important;
  }
  #txPanel.mobile-view.active .tx-export-toggle{
    min-width:48px!important;
    padding:0 5px!important;
  }
}

/* =========================================================
   v7.10.9 — Compact Transaction Panel + Modern Actions
   Search + download remain visible. Everything else is inside
   Filter & Urutkan to maximize visible transaction rows.
   ========================================================= */
#txPanel.tx-layout-v7109 .panel-head{
  min-height:52px!important;
  padding:11px 14px!important;
}
#txPanel.tx-layout-v7109 .panel-head>div{min-width:0}
#txPanel.tx-layout-v7109 .panel-head>div>b{font-size:16px!important;line-height:1.1!important}
#txPanel.tx-layout-v7109 .panel-head .panel-subtitle{font-size:9.5px!important;margin-top:2px!important}
#txPanel.tx-layout-v7109 .panel-head .badge{min-width:32px!important;height:28px!important;padding:0 9px!important;font-size:10px!important}

#txPanel.tx-layout-v7109 .tx-filter-wrap{
  padding:7px 10px 8px!important;
  background:#fff!important;
  border-bottom:1px solid #edf1f6!important;
}
#txPanel.tx-layout-v7109 .tx-search-export-row{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:7px!important;
  padding:0!important;
  margin:0 0 7px!important;
}
#txPanel.tx-layout-v7109 .tx-search-box{
  min-height:38px!important;
  height:38px!important;
  border-radius:12px!important;
  padding:0 10px!important;
}
#txPanel.tx-layout-v7109 .tx-search-box input{
  font-size:10.5px!important;
  min-width:0!important;
}
#txPanel.tx-layout-v7109 .tx-search-icon{width:16px!important;height:16px!important;flex-basis:16px!important}
#txPanel.tx-layout-v7109 .tx-export-toggle{
  min-height:38px!important;
  height:38px!important;
  padding:0 11px!important;
  border-radius:12px!important;
  font-size:10px!important;
  gap:5px!important;
}

#txPanel.tx-layout-v7109 #txFilterToggle{
  width:100%!important;
  min-height:36px!important;
  height:36px!important;
  margin:0!important;
  padding:4px 8px!important;
  border-radius:11px!important;
  gap:7px!important;
}
#txPanel.tx-layout-v7109 #txFilterToggle .tx-filter-toggle-icon{
  width:27px!important;
  height:27px!important;
  min-width:27px!important;
  border-radius:8px!important;
}
#txPanel.tx-layout-v7109 #txFilterToggle .tx-filter-toggle-icon svg{width:14px!important;height:14px!important}
#txPanel.tx-layout-v7109 .tx-filter-drawer-label,
#txPanel.tx-layout-v7109 .tx-filter-runtime-label{
  flex:1!important;
  min-width:0!important;
  text-align:left!important;
}
#txPanel.tx-layout-v7109 .tx-filter-drawer-label b,
#txPanel.tx-layout-v7109 .tx-filter-runtime-label{
  font-size:10.5px!important;
  line-height:1.1!important;
  font-weight:800!important;
}
#txPanel.tx-layout-v7109 .tx-filter-drawer-label small{
  display:block!important;
  margin-top:1px!important;
  font-size:7.5px!important;
  line-height:1.1!important;
  color:#98a2b3!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
#txPanel.tx-layout-v7109 .tx-filter-chevron{font-size:11px!important}

#txPanel.tx-layout-v7109 #txFilterPanel[hidden]{display:none!important}
#txPanel.tx-layout-v7109 #txFilterPanel:not([hidden]){
  display:block!important;
  margin:7px 0 0!important;
  padding:8px 0 1px!important;
  border-top:1px solid #edf1f6!important;
}
#txPanel.tx-layout-v7109 #txFilterPanel .tx-period-bar{
  min-height:36px!important;
  padding:0!important;
  margin:0 0 8px!important;
  gap:7px!important;
}
#txPanel.tx-layout-v7109 #txFilterPanel .tx-period-copy b{font-size:9px!important}
#txPanel.tx-layout-v7109 #txFilterPanel .tx-period-copy small{font-size:7.5px!important;max-width:150px!important}
#txPanel.tx-layout-v7109 #txFilterPanel .tx-period-switch{
  min-height:33px!important;
  padding:2px!important;
  border-radius:10px!important;
}
#txPanel.tx-layout-v7109 #txFilterPanel .tx-period-switch button{
  min-height:29px!important;
  padding:0 8px!important;
  border-radius:8px!important;
  font-size:8px!important;
}
#txPanel.tx-layout-v7109 #txFilterPanel .tx-filter-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:7px!important;
  margin:0!important;
}
#txPanel.tx-layout-v7109 #txFilterPanel .tx-filter-grid label{
  gap:3px!important;
  font-size:8px!important;
  line-height:1.1!important;
}
#txPanel.tx-layout-v7109 #txFilterPanel .tx-filter-grid input,
#txPanel.tx-layout-v7109 #txFilterPanel .tx-filter-grid select{
  min-height:34px!important;
  height:34px!important;
  padding:0 8px!important;
  border-radius:9px!important;
  font-size:9px!important;
}
#txPanel.tx-layout-v7109 #txFilterPanel .tx-filter-actions{
  margin-top:7px!important;
  gap:6px!important;
}
#txPanel.tx-layout-v7109 #txFilterPanel .tx-filter-reset,
#txPanel.tx-layout-v7109 #txFilterPanel .tx-filter-apply{
  min-height:32px!important;
  height:32px!important;
  padding:0 10px!important;
  border-radius:9px!important;
  font-size:8.5px!important;
}
#txPanel.tx-layout-v7109 #txFilterPanel .tx-filter-summary{
  display:flex!important;
  min-height:0!important;
  padding:7px 0 0!important;
  margin:7px 0 0!important;
  gap:5px!important;
  border-top:1px solid #edf1f6!important;
  flex-wrap:wrap!important;
}
#txPanel.tx-layout-v7109 #txFilterPanel .tx-filter-summary>span{
  padding:4px 6px!important;
  border-radius:7px!important;
  font-size:8px!important;
}

/* Transaction list/card density: compact without clipping text. */
#txPanel.tx-layout-v7109 .tx-list{padding:5px 8px 12px!important;gap:7px!important}
#txPanel.tx-layout-v7109 .tx-card{
  padding:10px!important;
  border-radius:14px!important;
}
#txPanel.tx-layout-v7109 .tx-card-head{gap:8px!important}
#txPanel.tx-layout-v7109 .tx-main{gap:8px!important;min-width:0!important}
#txPanel.tx-layout-v7109 .tx-icon{width:35px!important;height:35px!important;min-width:35px!important;border-radius:11px!important;font-size:16px!important}
#txPanel.tx-layout-v7109 .tx-title-row{gap:5px!important}
#txPanel.tx-layout-v7109 .tx-title{font-size:11.5px!important;line-height:1.2!important}
#txPanel.tx-layout-v7109 .tx-badges{gap:3px!important}
#txPanel.tx-layout-v7109 .tx-kind-badge,
#txPanel.tx-layout-v7109 .tx-pattern-badge,
#txPanel.tx-layout-v7109 .scan-badge,
#txPanel.tx-layout-v7109 .sync-badge{
  padding:3px 5px!important;
  font-size:6.8px!important;
  line-height:1!important;
}
#txPanel.tx-layout-v7109 .tx-meta{margin-top:5px!important;gap:4px!important}
#txPanel.tx-layout-v7109 .tx-meta-item{padding:4px 6px!important;font-size:7.5px!important;border-radius:7px!important;white-space:normal!important}
#txPanel.tx-layout-v7109 .tx-right{min-width:82px!important}
#txPanel.tx-layout-v7109 .tx-right small{font-size:7px!important}
#txPanel.tx-layout-v7109 .tx-right>b{font-size:12.5px!important;line-height:1.2!important}
#txPanel.tx-layout-v7109 .tx-note{
  margin-top:7px!important;
  padding:7px 8px!important;
  border-radius:10px!important;
}
#txPanel.tx-layout-v7109 .tx-note-label{font-size:6.8px!important;margin-bottom:2px!important}
#txPanel.tx-layout-v7109 .tx-note p{
  margin:0!important;
  font-size:9px!important;
  line-height:1.35!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}
#txPanel.tx-layout-v7109 .tx-card-footer{
  margin-top:7px!important;
  padding-top:7px!important;
  gap:8px!important;
}
#txPanel.tx-layout-v7109 .tx-card-id{font-size:7px!important;color:#98a2b3!important}

/* Modern action buttons: no browser-default square buttons. */
#txPanel.tx-layout-v7109 .tx-card-footer .tx-actions{
  display:flex!important;
  justify-content:flex-end!important;
  align-items:center!important;
  gap:5px!important;
  flex-wrap:nowrap!important;
}
#txPanel.tx-layout-v7109 .tx-card-footer .tx-actions button{
  appearance:none!important;
  -webkit-appearance:none!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:29px!important;
  height:29px!important;
  min-width:0!important;
  margin:0!important;
  padding:0 9px!important;
  border-radius:9px!important;
  border:1px solid transparent!important;
  box-shadow:none!important;
  font-family:inherit!important;
  font-size:8.5px!important;
  line-height:1!important;
  font-weight:800!important;
  cursor:pointer!important;
  transition:transform .15s ease,background .15s ease,border-color .15s ease!important;
}
#txPanel.tx-layout-v7109 .tx-card-footer .tx-actions button:active{transform:scale(.97)!important}
#txPanel.tx-layout-v7109 .tx-card-footer .tx-actions .tx-detail-btn{
  color:#175cd3!important;
  background:#eef4ff!important;
  border-color:#d7e4fb!important;
}
#txPanel.tx-layout-v7109 .tx-card-footer .tx-actions .tx-detail-btn:hover{background:#e4edff!important;border-color:#bdd2f7!important}
#txPanel.tx-layout-v7109 .tx-card-footer .tx-actions .tx-edit-btn{
  color:#344054!important;
  background:#f7f8fa!important;
  border-color:#e2e7ee!important;
}
#txPanel.tx-layout-v7109 .tx-card-footer .tx-actions .tx-edit-btn:hover{background:#eef1f5!important;border-color:#d2d8e1!important}
#txPanel.tx-layout-v7109 .tx-card-footer .tx-actions button[data-delete-id]{
  color:#b42318!important;
  background:#fff2f0!important;
  border-color:#ffd5cf!important;
}
#txPanel.tx-layout-v7109 .tx-card-footer .tx-actions button[data-delete-id]:hover{background:#ffe8e4!important;border-color:#ffbbb1!important}

/* New History shortcut injected into the sidebar. */
#appSidebar .sidebar-history-icon svg{
  width:20px!important;
  height:20px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}

@media(max-width:760px){
  #txPanel.tx-layout-v7109 .panel-head{min-height:46px!important;padding:10px 13px!important}
  #txPanel.tx-layout-v7109 .panel-head>div>b{font-size:15px!important}
  #txPanel.tx-layout-v7109 .panel-head .panel-subtitle{display:none!important}
  #txPanel.tx-layout-v7109 .tx-filter-wrap{padding:6px 9px 7px!important}
  #txPanel.tx-layout-v7109 .tx-search-export-row{gap:6px!important;margin-bottom:6px!important}
  #txPanel.tx-layout-v7109 .tx-search-box,
  #txPanel.tx-layout-v7109 .tx-export-toggle{height:36px!important;min-height:36px!important}
  #txPanel.tx-layout-v7109 #txFilterToggle{height:34px!important;min-height:34px!important}
  #txPanel.tx-layout-v7109 .tx-filter-drawer-label small{display:none!important}
  #txPanel.tx-layout-v7109 #txFilterPanel .tx-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important}
  #txPanel.tx-layout-v7109 #txFilterPanel .tx-filter-grid input,
  #txPanel.tx-layout-v7109 #txFilterPanel .tx-filter-grid select{height:33px!important;min-height:33px!important}
  #txPanel.tx-layout-v7109 .tx-list{padding:4px 8px 12px!important;gap:7px!important}
  #txPanel.tx-layout-v7109 .tx-card{padding:10px!important}
  #txPanel.tx-layout-v7109 .tx-card-footer .tx-actions{width:auto!important;justify-content:flex-end!important}
  #txPanel.tx-layout-v7109 .tx-card-footer .tx-actions button{flex:0 0 auto!important;min-width:58px!important;height:30px!important}
}
@media(max-width:390px){
  #txPanel.tx-layout-v7109 #txFilterPanel .tx-filter-grid{grid-template-columns:1fr 1fr!important}
  #txPanel.tx-layout-v7109 #txFilterPanel .tx-period-copy small{display:none!important}
  #txPanel.tx-layout-v7109 .tx-right{min-width:76px!important}
  #txPanel.tx-layout-v7109 .tx-card-footer{align-items:center!important}
  #txPanel.tx-layout-v7109 .tx-card-footer .tx-actions{gap:4px!important}
  #txPanel.tx-layout-v7109 .tx-card-footer .tx-actions button{min-width:54px!important;padding:0 7px!important;font-size:8px!important}
}

/* ===== v8 clean line icons ===== */
.sidebar-menu-icon, .stat-icon, .daily-budget-icon, .learning-pending-icon, .feature-row-icon, .wallet-balance-icon, .email-status-icon, .security-change-icon, .device-icon, .account-username-icon, .biometric-security-icon, .admin-notification-icon, .sidebar-logout-icon, .send-icon, .photo-source-menu button>span, .premium-tab-icon{font-size:0!important;line-height:1}
.sidebar-menu-icon svg, .stat-icon svg, .daily-budget-icon svg, .learning-pending-icon svg, .feature-row-icon svg, .wallet-balance-icon svg, .email-status-icon svg, .security-change-icon svg, .device-icon svg, .account-username-icon svg, .biometric-security-icon svg, .admin-notification-icon svg, .sidebar-logout-icon svg, .send-icon svg, .photo-source-menu button>span svg, .premium-tab-icon svg{display:block;width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.stat-icon svg{width:18px;height:18px}
.daily-budget-icon svg, .learning-pending-icon svg, .feature-row-icon svg, .wallet-balance-icon svg, .email-status-icon svg, .security-change-icon svg, .device-icon svg, .account-username-icon svg, .biometric-security-icon svg, .admin-notification-icon svg{width:18px;height:18px}
.sidebar-logout{gap:8px}
.sidebar-logout-icon{width:18px;height:18px;display:grid;place-items:center;color:currentColor}
.photo-source-menu button>span{width:18px;height:18px;display:grid;place-items:center;color:#175cd3}
.send-icon{display:grid!important;place-items:center}
.premium-tab-icon{display:inline-grid;place-items:center;width:16px;height:16px;margin-right:6px;vertical-align:-2px;color:currentColor}
.email-status-card.verified .email-status-icon svg{stroke-width:2.05}
.account-username-icon svg,.biometric-security-icon svg{width:20px;height:20px}

/* ===== V14 - Super Admin menus terpisah ===== */
.sidebar-super-admin-label{margin-top:14px;padding-top:14px!important;border-top:1px solid #e8edf4;color:#8a6200!important}
.sidebar-super-admin-menu{padding-bottom:8px!important}
.sidebar-super-admin-menu .sidebar-admin-item{margin-top:0!important;background:#fffdf7!important;border-color:#eee5c8!important}
.sidebar-super-admin-menu .sidebar-admin-item:hover{background:#fff8e8!important;color:#735000!important}
.sidebar-super-admin-menu .sidebar-admin-item .sidebar-menu-icon{background:#fff2c9!important;color:#986800!important}
.sidebar-super-admin-menu .sidebar-admin-item:focus-visible{outline-color:#a36d00!important}
.admin-standalone-panel>.admin-premium-section{margin-top:0!important}
.admin-menu-panel-head{margin-bottom:14px}
@media(max-width:700px){.sidebar-super-admin-label{margin-top:10px}.sidebar-super-admin-menu .sidebar-menu-item{min-height:58px}}

/* ===== v15 editable transaction type on chat confirmation ===== */
.chat-confirm-fields [data-confirm-group][hidden]{display:none!important}
.chat-confirm-type-field select{font-weight:800;color:#173c70;background:#f5f9ff}
@media(min-width:601px){.chat-confirm-type-field{grid-column:1/-1}}


/* ===== V17 - global data loading state ===== */
.app-data-loader[hidden]{display:none!important}
.app-data-loader{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:24px;background:rgba(245,248,252,.82);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:1;transition:opacity .18s ease}
.app-data-loader-card{width:min(390px,calc(100vw - 32px));padding:27px 25px 23px;border:1px solid rgba(218,226,238,.92);border-radius:24px;background:rgba(255,255,255,.98);box-shadow:0 24px 70px rgba(24,39,75,.16);text-align:center}
.app-data-loader-visual{position:relative;width:62px;height:62px;margin:0 auto 17px;display:grid;place-items:center}
.app-data-spinner{position:relative;z-index:2;width:42px;height:42px;border-radius:50%;border:3px solid #dce8fb;border-top-color:#175cd3;animation:appDataSpin .78s linear infinite}
.app-data-loader-pulse{position:absolute;inset:5px;border:1px solid rgba(23,92,211,.17);border-radius:50%;animation:appDataPulse 1.65s ease-out infinite}
.app-data-loader-pulse.pulse-two{animation-delay:.72s}
.app-data-loader-copy b{display:block;color:#172033;font-size:18px;letter-spacing:-.25px}
.app-data-loader-copy small{display:block;max-width:310px;margin:7px auto 0;color:#7b8798;font-size:12px;line-height:1.55}
.app-data-loader-progress{height:4px;margin-top:18px;overflow:hidden;border-radius:999px;background:#edf2f8}
.app-data-loader-progress span{display:block;width:42%;height:100%;border-radius:inherit;background:#2167dc;animation:appDataProgress 1.15s ease-in-out infinite}
.app-data-loader-retry{margin:18px auto 0;min-width:126px}
.app-data-loader.is-error .app-data-spinner{animation:none;border-color:#fee4e2;border-top-color:#d92d20}
.app-data-loader.is-error .app-data-loader-pulse{display:none}
.app-data-loader.is-error .app-data-loader-progress{display:none}
.app-data-loader.is-error .app-data-loader-copy b{color:#b42318}
body.app-data-loading{overflow:hidden}
body.app-data-loading .app-main,body.app-data-loading .app-sidebar,body.app-data-loading .desktop-sidebar{pointer-events:none;user-select:none}
@keyframes appDataSpin{to{transform:rotate(360deg)}}
@keyframes appDataPulse{0%{transform:scale(.75);opacity:.8}100%{transform:scale(1.35);opacity:0}}
@keyframes appDataProgress{0%{transform:translateX(-120%)}50%{transform:translateX(90%)}100%{transform:translateX(260%)}}
@media(max-width:640px){.app-data-loader{padding:18px}.app-data-loader-card{padding:24px 20px 21px;border-radius:22px}.app-data-loader-visual{width:56px;height:56px}.app-data-spinner{width:38px;height:38px}.app-data-loader-copy b{font-size:17px}.app-data-loader-copy small{font-size:11px}}
@media(prefers-reduced-motion:reduce){.app-data-spinner,.app-data-loader-pulse,.app-data-loader-progress span{animation-duration:2.5s}}

/* ===== V18 - Free Trial Premium 7 hari ===== */
.premium-trial-card{display:grid;grid-template-columns:46px minmax(0,1fr) auto;align-items:center;gap:13px;margin:0 0 14px;padding:14px 15px;border:1px solid #b9d3ff;border-radius:17px;background:linear-gradient(135deg,#f6f9ff,#eef5ff);box-shadow:0 8px 24px rgba(23,92,211,.06)}
.premium-trial-card[hidden]{display:none!important}.premium-trial-icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:#dce9ff;color:#175cd3}.premium-trial-icon svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.premium-trial-copy{min-width:0}.premium-trial-kicker{display:block;margin-bottom:3px;color:#175cd3;font-size:8px;font-weight:900;letter-spacing:.09em}.premium-trial-copy b{display:block;color:#172235;font-size:13px}.premium-trial-copy p{margin:4px 0 3px;color:#5f6f82;font-size:10px;line-height:1.45}.premium-trial-copy small{display:block;color:#8b95a5;font-size:9px}.premium-trial-action{min-width:155px;white-space:nowrap}.premium-trial-card.is-active{border-color:#98dfb2;background:linear-gradient(135deg,#f4fff8,#eafaf0)}.premium-trial-card.is-active .premium-trial-icon{background:#dcfae6;color:#087443}.premium-trial-card.is-active .premium-trial-kicker{color:#087443}.premium-trial-card.is-expired{border-color:#e4e7ec;background:#f8fafc;box-shadow:none}.premium-trial-card.is-expired .premium-trial-icon{background:#eef1f5;color:#667085}.premium-trial-card.is-expired .premium-trial-kicker{color:#667085}.premium-trial-card.is-expired .premium-trial-action{display:none}
@media(max-width:640px){.premium-trial-card{grid-template-columns:40px minmax(0,1fr);padding:12px}.premium-trial-icon{width:40px;height:40px;border-radius:12px}.premium-trial-action{grid-column:1/-1;width:100%;min-width:0}.premium-trial-copy b{font-size:12px}.premium-trial-copy p{font-size:9px}}
.sidebar-premium-badge.trial{background:#175cd3!important;color:#fff!important}.premium-account-status.trial{background:#dce9ff!important;color:#175cd3!important;border-color:#b9d3ff!important}

/* V23 — tambah transaksi manual */
.transactions-panel .panel-head .tx-head-actions{
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
  min-width:auto!important;
}
.transactions-panel .panel-head #txCount{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  line-height:1!important;
  padding:0!important;
  width:34px!important;
  min-width:34px!important;
  height:34px!important;
  border-radius:999px!important;
  flex:0 0 34px!important;
}
.tx-add-button{
  min-height:34px;
  padding:0 12px;
  border:1px solid rgba(37,99,235,.18);
  border-radius:11px;
  background:#edf4ff;
  color:#175cd3;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  font:inherit;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
  transition:background .16s ease,border-color .16s ease,transform .16s ease;
}
.tx-add-button:hover{background:#e3eeff;border-color:rgba(37,99,235,.3)}
.tx-add-button:active{transform:translateY(1px)}
.tx-add-icon{font-size:20px;line-height:1;font-weight:500;margin-top:-1px}
.transaction-create-dialog{width:min(620px,calc(100% - 30px))!important;max-width:none!important}
.create-transfer-field[hidden],.create-standard-field[hidden],.create-expense-field[hidden]{display:none!important}
.manual-tx-hint{margin-top:12px;padding:10px 12px;border-radius:12px;background:#f7f9fc;border:1px solid #e6ebf2;color:#667085;font-size:11px;line-height:1.5}

@media(max-width:720px){
  .tx-add-button{width:34px;height:34px;min-height:34px;padding:0;border-radius:10px}
  .tx-add-label{display:none}
  .tx-add-icon{font-size:22px}
  .transaction-create-dialog{width:100%!important;max-width:none!important;border-radius:20px 20px 0 0!important;margin:auto 0 0!important}
}

/* ===== V25 - Super Admin: Paket Langganan ===== */
.admin-plan-note{margin:0 0 12px;padding:10px 12px;border:1px solid #dbe7fb;border-radius:12px;background:#f6f9ff;color:#516078;font-size:10px;line-height:1.55}
.admin-plan-row{display:grid;gap:12px;padding:14px;background:#fff;border:1px solid #e3e8ef;border-radius:15px}
.admin-plan-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:10px;border-bottom:1px solid #edf1f5}
.admin-plan-head>div{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:3px 8px;min-width:0}
.admin-plan-head b{font-size:14px;color:#172033}.admin-plan-head small{grid-column:2;font-size:9px;color:#8a96a8}.admin-plan-head strong{font-size:16px;color:#175cd3;white-space:nowrap}
.admin-plan-key{grid-row:1/3;display:inline-flex;align-items:center;padding:5px 7px;border-radius:8px;background:#eef4ff;color:#175cd3;font-size:8px;font-weight:900;text-transform:uppercase;letter-spacing:.04em}
.admin-plan-fields{display:grid;grid-template-columns:.8fr 1fr 1fr 1fr .75fr .85fr;gap:8px;align-items:end}
.admin-plan-fields label{margin:0;font-size:9px;font-weight:800;color:#667085}
.admin-plan-fields input{width:100%;margin-top:4px;border:1px solid #dce2eb;border-radius:8px;padding:8px;font-size:10px;background:#fff;outline:none}
.admin-plan-fields input:focus{border-color:#78a3e9;box-shadow:0 0 0 3px rgba(23,92,211,.08)}
.admin-plan-fields input[readonly]{background:#f5f7fa;color:#7a8798}
.admin-plan-permanent{display:flex!important;align-items:center;gap:6px;min-height:34px;padding:0 4px}.admin-plan-permanent input{width:auto!important;margin:0!important}
.admin-plan-description{grid-column:1/-1}.admin-plan-row .row-actions{justify-content:flex-end}
@media(max-width:1000px){.admin-plan-fields{grid-template-columns:1fr 1fr 1fr}.admin-plan-description{grid-column:1/-1}}
@media(max-width:650px){.admin-plan-head{align-items:flex-start;flex-direction:column}.admin-plan-fields{grid-template-columns:1fr}.admin-plan-description{grid-column:auto}.admin-plan-row .row-actions{width:100%}.admin-plan-row .row-actions button{width:100%}}

/* ===== V29 - Smart Transaction Assistant ===== */
.reconciliation-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;margin:0 0 14px;padding:13px 15px;border:1px solid #dbe7fb;border-radius:17px;background:linear-gradient(135deg,#f7faff 0%,#fff 72%);box-shadow:0 5px 18px rgba(30,64,175,.05)}
.reconciliation-card[hidden]{display:none!important}.reconciliation-icon{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:#eaf2ff;color:#175cd3}.reconciliation-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.reconciliation-copy{min-width:0}.reconciliation-title-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.reconciliation-title-row b{font-size:13px;color:#182230}.reconciliation-title-row span{padding:3px 7px;border-radius:999px;background:#fff1d6;color:#8a5700;font-size:9px;font-weight:900}.reconciliation-copy p{margin:3px 0 1px;font-size:11px;color:#465366;font-weight:650}.reconciliation-copy small{font-size:10px;color:#8490a2}.reconciliation-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}.reconciliation-actions .btn{min-height:34px;padding:7px 10px;font-size:10px}

.tx-inbox-button{position:relative;min-height:34px;padding:0 10px;border:1px solid #e1e7ef;border-radius:11px;background:#fff;color:#526072;display:inline-flex;align-items:center;justify-content:center;gap:6px;font:inherit;font-size:11px;font-weight:800;cursor:pointer}.tx-inbox-button:hover{background:#f7f9fc}.tx-inbox-button.has-items{border-color:#f1cf83;background:#fffaf0;color:#875600}.tx-inbox-button b{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:#f79009;color:#fff;font-size:9px;line-height:1}.tx-inbox-button b[hidden]{display:none!important}

.quick-capture-fab{position:fixed;right:20px;bottom:24px;z-index:1150;min-height:48px;padding:0 16px 0 12px;border:0;border-radius:16px;background:#175cd3;color:#fff;box-shadow:0 12px 32px rgba(23,92,211,.28);display:inline-flex;align-items:center;gap:8px;font:inherit;font-weight:850;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease}.quick-capture-fab:hover{transform:translateY(-2px);box-shadow:0 15px 36px rgba(23,92,211,.34)}.quick-capture-fab:active{transform:translateY(0)}.quick-capture-plus{width:25px;height:25px;border-radius:9px;background:rgba(255,255,255,.16);display:grid;place-items:center;font-size:22px;line-height:1;font-weight:500}.quick-capture-label{font-size:11px}.quick-capture-count{position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;padding:0 5px;border:2px solid #fff;border-radius:999px;background:#f79009;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:9px;line-height:1}.quick-capture-count[hidden]{display:none!important}

.quick-capture-dialog{width:min(520px,calc(100% - 30px))!important}.quick-capture-card{padding:20px}.quick-type-switch{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:5px;border-radius:13px;background:#f3f6fa;margin-bottom:14px}.quick-type-switch button{border:0;border-radius:9px;background:transparent;color:#6b7789;padding:9px 7px;font:inherit;font-size:10px;font-weight:850;cursor:pointer}.quick-type-switch button.active{background:#fff;color:#175cd3;box-shadow:0 2px 8px rgba(16,24,40,.08)}.quick-capture-form{display:grid;gap:10px}.quick-capture-form label{margin:0!important;font-size:11px!important;color:#566375}.quick-money-input{display:flex;align-items:center;border:1px solid #d9dee8;border-radius:12px;background:#fff;overflow:hidden}.quick-money-input:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px rgba(23,92,211,.10)}.quick-money-input span{padding:0 0 0 12px;font-size:12px;font-weight:800;color:#667085}.quick-money-input input{border:0!important;box-shadow:none!important}.quick-capture-info{display:grid;grid-template-columns:32px minmax(0,1fr);gap:10px;align-items:start;margin-top:12px;padding:11px 12px;border-radius:13px;background:#fff8e8;border:1px solid #f5d58a;color:#7a5b16;font-size:10px;line-height:1.5}.quick-capture-info-icon{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:#ffedbd;color:#8a5a00;font-weight:900;font-size:13px}.quick-capture-info b{display:block;margin:1px 0 2px;color:#714c00;font-size:10.5px}.quick-capture-info span{display:block;color:#7d6940}

.transaction-inbox-dialog{width:min(650px,calc(100% - 30px))!important;max-width:none!important}.transaction-inbox-card{padding:20px;max-height:min(84vh,760px);overflow:auto}.transaction-inbox-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;margin-bottom:12px;border-radius:13px;background:#f7f9fc;border:1px solid #e7ebf1}.transaction-inbox-summary>div{display:flex;align-items:baseline;gap:8px}.transaction-inbox-summary small{font-size:10px;color:#7d8999}.transaction-inbox-summary strong{font-size:20px;color:#182230}.transaction-inbox-summary .btn{min-height:34px;font-size:10px}.transaction-inbox-list{display:grid;gap:9px}.transaction-inbox-item{display:grid;gap:6px;padding:12px;border:1px solid #e3e8ef;border-radius:14px;background:#fff}.inbox-item-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.inbox-item-top strong{font-size:15px;color:#172033}.inbox-type{display:inline-flex;align-items:center;width:max-content;padding:4px 7px;border-radius:999px;background:#fff1f0;color:#b42318;font-size:8px;font-weight:900;text-transform:uppercase;letter-spacing:.03em}.inbox-type.income{background:#ecfdf3;color:#067647}.inbox-type.transfer{background:#eef4ff;color:#175cd3}.inbox-note{font-size:11px;color:#344054}.transaction-inbox-item>small{font-size:9px;color:#8a96a8}.inbox-item-actions{display:flex;justify-content:flex-end;gap:6px;flex-wrap:wrap;margin-top:2px}.inbox-item-actions button{border:1px solid #dfe5ed;border-radius:9px;background:#fff;padding:6px 8px;font:inherit;font-size:9px;font-weight:800;color:#526072;cursor:pointer}.inbox-item-actions button:hover{background:#f7f9fc}.inbox-item-actions .inbox-confirm{border-color:#c8daf8;background:#eef4ff;color:#175cd3}.inbox-item-actions .danger-link{color:#b42318;background:#fff7f6;border-color:#f4d3cf}.inbox-item-actions button:disabled{opacity:.45;cursor:not-allowed}.inbox-warning{margin:0;padding:7px 8px;border-radius:9px;background:#fff8e8;color:#8a5700;font-size:9px}.transaction-inbox-empty{display:grid;place-items:center;text-align:center;gap:4px;padding:30px 15px;color:#7a8797}.transaction-inbox-empty>div{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#ecfdf3;color:#067647;font-size:18px}.transaction-inbox-empty b{color:#344054;font-size:12px}.transaction-inbox-empty span{font-size:10px}

@media(max-width:720px){
  .reconciliation-card{grid-template-columns:auto 1fr;margin-bottom:9px;padding:10px 11px;gap:9px;border-radius:15px}.reconciliation-icon{width:34px;height:34px;border-radius:11px}.reconciliation-actions{grid-column:1/-1;width:100%;display:grid;grid-template-columns:1fr 1fr}.reconciliation-actions .btn:last-child{grid-column:1/-1}.reconciliation-copy small{display:none}.reconciliation-copy p{font-size:10px}.reconciliation-title-row b{font-size:11px}
  .tx-inbox-button{width:34px;height:34px;min-height:34px;padding:0;border-radius:10px}.tx-inbox-button>span{display:none}.tx-inbox-button b{position:absolute;top:-6px;right:-6px;border:2px solid #fff}
  .quick-capture-fab{right:14px;bottom:calc(78px + env(safe-area-inset-bottom));width:auto;min-width:124px;height:48px;min-height:48px;padding:0 14px 0 11px;border-radius:15px;justify-content:center;gap:8px}.quick-capture-label{display:inline!important;font-size:10px;white-space:nowrap}.quick-capture-plus{background:rgba(255,255,255,.16);width:25px;height:25px;font-size:22px}.quick-capture-dialog,.transaction-inbox-dialog{width:100%!important;max-width:none!important;border-radius:20px 20px 0 0!important;margin:auto 0 0!important}.transaction-inbox-card{max-height:86dvh;padding:18px 15px calc(18px + env(safe-area-inset-bottom))}.quick-capture-card{padding:18px 15px calc(18px + env(safe-area-inset-bottom))}.transaction-inbox-summary{position:sticky;top:-18px;z-index:2;background:#f7f9fc}.inbox-item-actions{display:grid;grid-template-columns:1fr 1fr}.inbox-item-actions .danger-link{grid-column:1/-1}.inbox-item-actions button{min-height:34px}
}


/* ===== V30 - Catat Cepat lewat Foto + Inbox mobile ===== */
.tx-inbox-button .tx-inbox-icon{width:16px;height:16px;display:inline-grid;place-items:center;flex:0 0 16px}
.tx-inbox-button .tx-inbox-icon svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tx-inbox-button .tx-inbox-label{display:inline-block;line-height:1}
.quick-photo-field{display:grid;gap:8px;padding:10px;border:1px solid #e1e7ef;border-radius:13px;background:#fbfcfe}
.quick-photo-label-row{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#566375;font-size:10px;font-weight:850}
.quick-photo-label-row small{color:#98a2b3;font-size:9px;font-weight:650}.quick-photo-label-row>span:last-child{font-size:9px;color:#8490a2;font-weight:700}
.quick-photo-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}.quick-photo-source{min-height:38px;border:1px solid #dbe3ee;border-radius:11px;background:#fff;color:#344054;display:flex;align-items:center;justify-content:center;gap:7px;font:inherit;font-size:10px;font-weight:850;cursor:pointer}.quick-photo-source:hover{background:#f5f8fd;border-color:#bfd3f6;color:#175cd3}.quick-photo-source svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.quick-photo-preview{position:relative;display:grid;grid-template-columns:54px minmax(0,1fr) 26px;align-items:center;gap:9px;padding:8px;border:1px solid #dbe6f7;border-radius:11px;background:#f7faff}.quick-photo-preview[hidden]{display:none!important}.quick-photo-thumb{width:54px;height:54px;padding:0;border:0;border-radius:9px;overflow:hidden;background:#eaf0f7;cursor:pointer}.quick-photo-thumb img{width:100%;height:100%;display:block;object-fit:cover}.quick-photo-preview>div{min-width:0;display:grid;gap:2px}.quick-photo-preview b{font-size:10px;color:#283548;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.quick-photo-preview small{font-size:8.5px;color:#8a96a8}.quick-photo-preview span{font-size:9px;color:#175cd3;font-weight:800}.quick-photo-remove{width:26px;height:26px;padding:0;border:1px solid #efd5d1;border-radius:8px;background:#fff7f6;color:#b42318;font-size:17px;line-height:1;cursor:pointer}
.transaction-inbox-item.has-photo{grid-template-columns:62px minmax(0,1fr);align-items:start}.inbox-photo-thumb{width:62px;height:62px;padding:0;border:0;border-radius:11px;overflow:hidden;background:#eef2f7;cursor:pointer}.inbox-photo-thumb img{width:100%;height:100%;object-fit:cover;display:block}.inbox-item-content{min-width:0;display:grid;gap:6px}
@media(max-width:900px){
  .transactions-panel .panel-head .tx-head-actions{gap:6px!important}
  .tx-inbox-button{width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;padding:0!important;border-radius:11px!important;gap:0!important}
  .tx-inbox-button .tx-inbox-label{display:none!important}.tx-inbox-button .tx-inbox-icon{width:18px;height:18px;flex-basis:18px}.tx-inbox-button .tx-inbox-icon svg{width:18px;height:18px}
  .tx-inbox-button b{position:absolute!important;top:-6px!important;right:-6px!important;min-width:18px!important;height:18px!important;padding:0 4px!important;border:2px solid #fff!important;font-size:8px!important}
  .tx-add-button{width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;padding:0!important;border-radius:11px!important}.tx-add-label{display:none!important}.tx-add-icon{font-size:24px!important;line-height:1!important}
  .transactions-panel .panel-head #txCount{width:38px!important;min-width:38px!important;height:38px!important;flex:0 0 38px!important}
}
@media(max-width:520px){
  .transactions-panel .panel-head{padding-left:12px!important;padding-right:12px!important}.transactions-panel .panel-head .tx-head-actions{gap:5px!important}
  .tx-inbox-button,.tx-add-button,.transactions-panel .panel-head #txCount{width:36px!important;min-width:36px!important;height:36px!important;min-height:36px!important;flex-basis:36px!important}
  .quick-photo-actions{grid-template-columns:1fr 1fr}.quick-photo-source{min-height:40px;font-size:9.5px}.quick-photo-preview{grid-template-columns:50px minmax(0,1fr) 26px}.quick-photo-thumb{width:50px;height:50px}
  .transaction-inbox-item.has-photo{grid-template-columns:54px minmax(0,1fr)}.inbox-photo-thumb{width:54px;height:54px}
}


/* ===== V31 - Inbox photo fix, bulk confirm, draggable quick capture ===== */
.transaction-inbox-summary-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}
.transaction-inbox-summary-actions .btn{white-space:nowrap}
.quick-capture-fab{touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab;will-change:left,top}
.quick-capture-fab.is-dragging{cursor:grabbing!important;transition:none!important;transform:none!important;box-shadow:0 18px 40px rgba(23,92,211,.38)}
.inbox-photo-thumb img{background:#eef2f7}
@media(max-width:720px){
  .transaction-inbox-summary{align-items:center;gap:8px}
  .transaction-inbox-summary-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px}
  .transaction-inbox-summary-actions .btn{min-height:36px;padding:7px 9px;font-size:9px}
}
@media(max-width:430px){
  .transaction-inbox-summary{align-items:stretch;flex-direction:column}
  .transaction-inbox-summary>div:first-child{justify-content:space-between}
  .transaction-inbox-summary-actions{width:100%}
}


/* ===== V34 - Toast visible above mobile dialogs ===== */
.feature-toast.in-dialog{
  position:absolute!important;
  left:50%!important;
  top:14px!important;
  bottom:auto!important;
  z-index:2147483647!important;
  width:max-content;
  max-width:calc(100% - 32px)!important;
  transform:translate(-50%,-10px)!important;
  text-align:center;
  pointer-events:none;
}
.feature-toast.in-dialog.show{transform:translate(-50%,0)!important}
@media(max-width:720px){
  .feature-toast.in-dialog{
    position:fixed!important;
    top:calc(12px + env(safe-area-inset-top))!important;
    bottom:auto!important;
    left:50%!important;
    width:calc(100% - 28px)!important;
    max-width:440px!important;
    padding:12px 14px!important;
    border-radius:13px!important;
    font-size:11px!important;
    line-height:1.4!important;
    box-shadow:0 12px 32px rgba(0,0,0,.28)!important;
  }
}

/* V35 - Infinite scroll transaksi & chat */
.infinite-loader{
  width:100%;
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  padding:11px 14px;
  color:#7b8798;
  font-size:12px;
  text-align:center;
  box-sizing:border-box;
  user-select:none;
}
.infinite-loader.is-error{color:#b42318;cursor:pointer}
.infinite-spinner{
  width:16px;
  height:16px;
  flex:0 0 16px;
  border:2px solid rgba(5,43,93,.14);
  border-top-color:#052b5d;
  border-radius:50%;
  animation:financeInfiniteSpin .75s linear infinite;
}
@keyframes financeInfiniteSpin{to{transform:rotate(360deg)}}
.tx-infinite-loader{
  border-top:1px solid #eef1f5;
  background:linear-gradient(180deg,#fff,#fbfcfe);
  cursor:pointer;
}
.chat-history-loader{
  min-height:36px;
  padding:7px 12px 10px;
  color:#8a94a5;
  cursor:pointer;
}
@media (max-width:760px){
  .infinite-loader{font-size:11.5px;padding:10px 12px}
  .tx-infinite-loader{min-height:46px}
  .chat-history-loader{min-height:34px;padding-top:5px}
}
@media (prefers-reduced-motion:reduce){.infinite-spinner{animation:none}}

/* ===== V36 - Global floating notifications always top-most ===== */
.feature-toast,
.feature-toast.in-dialog{
  position:fixed!important;
  top:calc(14px + env(safe-area-inset-top))!important;
  right:auto!important;
  bottom:auto!important;
  left:50%!important;
  z-index:2147483647!important;
  width:max-content;
  max-width:min(520px,calc(100vw - 32px))!important;
  margin:0!important;
  padding:11px 16px!important;
  border:1px solid rgba(255,255,255,.16)!important;
  border-radius:13px!important;
  transform:translate(-50%,-14px)!important;
  opacity:0;
  text-align:center!important;
  font-size:11px!important;
  font-weight:800!important;
  line-height:1.45!important;
  color:#fff!important;
  box-shadow:0 14px 38px rgba(16,24,40,.30)!important;
  pointer-events:none!important;
  transition:opacity .18s ease,transform .18s ease!important;
  -webkit-font-smoothing:antialiased;
}
.feature-toast.show,
.feature-toast.in-dialog.show{
  opacity:1!important;
  transform:translate(-50%,0)!important;
}
.feature-toast.is-success{background:#067647!important}
.feature-toast.is-error{background:#b42318!important}
.feature-toast.is-warning{background:#b54708!important}
.feature-toast.is-info{background:#175cd3!important}

/* Bila toast berada di dalam dialog top-layer, tetap tempel di viewport atas. */
dialog[open]>.feature-toast.in-dialog{
  position:fixed!important;
  top:calc(14px + env(safe-area-inset-top))!important;
  z-index:2147483647!important;
}

@media(max-width:720px){
  .feature-toast,
  .feature-toast.in-dialog{
    top:calc(10px + env(safe-area-inset-top))!important;
    width:calc(100vw - 24px)!important;
    max-width:460px!important;
    padding:12px 14px!important;
    border-radius:14px!important;
    font-size:11px!important;
    box-shadow:0 12px 32px rgba(16,24,40,.34)!important;
  }
}

/* ===== V37 - Mobile edge dock for Catat Cepat ===== */
@media(max-width:720px){
  .quick-capture-fab.is-edge-docked{
    min-width:124px;
    transition:left .18s ease,right .18s ease,transform .16s ease,box-shadow .16s ease,opacity .16s ease!important;
    box-shadow:0 8px 24px rgba(23,92,211,.25);
  }
  .quick-capture-fab.is-edge-docked-left{
    border-radius:0 15px 15px 0;
    justify-content:flex-end;
    padding-left:10px;
    padding-right:8px;
  }
  .quick-capture-fab.is-edge-docked-right{
    border-radius:15px 0 0 15px;
    justify-content:flex-start;
    padding-left:8px;
    padding-right:10px;
  }
  .quick-capture-fab.is-edge-docked .quick-capture-label{
    opacity:0;
    pointer-events:none;
  }
  .quick-capture-fab.is-edge-docked .quick-capture-count{
    display:none!important;
  }
  .quick-capture-fab.is-edge-docked-left .quick-capture-plus,
  .quick-capture-fab.is-edge-docked-right .quick-capture-plus{
    flex:0 0 25px;
  }
  .quick-capture-fab.is-edge-docked:not(.is-dragging){opacity:.92}
}
@media(min-width:721px){
  .quick-capture-fab.is-edge-docked,
  .quick-capture-fab.is-edge-docked-left,
  .quick-capture-fab.is-edge-docked-right{
    border-radius:16px;
  }
  .quick-capture-fab.is-edge-docked .quick-capture-label{opacity:1}
}

/* ===== V39 - Pusat Pemberitahuan pengguna ===== */
.user-notification-badge{
  display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;
  border-radius:999px;background:#d92d20;color:#fff;font-size:10px;font-weight:850;line-height:1;
  box-shadow:0 3px 8px rgba(217,45,32,.22)
}
.user-notification-badge[hidden]{display:none!important}
.user-notification-badge.mobile{position:absolute;top:3px;left:calc(50% + 8px);min-width:17px;height:17px;padding:0 4px;border:2px solid #fff;font-size:8px;z-index:2}

.notification-center-dialog{width:min(720px,calc(100% - 34px));max-width:none;border:0;padding:0;border-radius:24px;background:transparent;box-shadow:none}
.notification-center-dialog::backdrop{background:rgba(16,24,40,.42);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.notification-center-card{background:#f7f9fc;border-radius:24px;overflow:hidden;max-height:min(86dvh,780px);display:flex;flex-direction:column;box-shadow:0 28px 80px rgba(16,24,40,.28)}
.notification-center-head{padding:20px 22px 15px;background:#fff;border-bottom:1px solid #e8edf4;margin:0}
.notification-center-head h3{font-size:20px;margin:0}.notification-center-head .modal-subtitle{margin-top:4px}
.notification-center-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 14px;background:#fff;border-bottom:1px solid #e9edf3}
.notification-center-toolbar>div{display:flex;align-items:center;gap:8px;min-width:0}.notification-center-toolbar b{font-size:11px;color:#526173}
.notification-unread-dot{width:8px;height:8px;flex:0 0 8px;border-radius:50%;background:#175cd3;box-shadow:0 0 0 4px #eaf2ff}
.notification-center-toolbar .btn{padding:7px 10px;font-size:10px;white-space:nowrap}
.user-notification-list{overflow:auto;padding:12px;display:grid;gap:9px;min-height:200px;overscroll-behavior:contain}
.user-notification-item{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:start;gap:11px;padding:13px;background:#fff;border:1px solid #e4e9f0;border-radius:16px;transition:.16s ease}
.user-notification-item.unread{background:#f6f9ff;border-color:#b9d1fb;box-shadow:0 4px 16px rgba(23,92,211,.06)}
.user-notification-icon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:#eef3f8;color:#526173}
.user-notification-icon svg{display:block;width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.user-notification-item.security .user-notification-icon{background:#eaf2ff;color:#175cd3}
.user-notification-item.broadcast .user-notification-icon{background:#f0ecff;color:#6941c6}
.user-notification-item.warning .user-notification-icon{background:#fff4e5;color:#b54708}
.user-notification-item.premium .user-notification-icon{background:#fff5cc;color:#8a5a00}
.user-notification-item.info .user-notification-icon{background:#eaf7f2;color:#087443}
.user-notification-copy{min-width:0}.user-notification-title{display:flex;align-items:center;gap:7px;margin-bottom:4px;flex-wrap:wrap}
.user-notification-title span{font-size:9px;font-weight:850;letter-spacing:.04em;text-transform:uppercase;color:#667085}
.user-notification-title i{font-style:normal;font-size:8px;font-weight:900;letter-spacing:.06em;padding:2px 6px;border-radius:999px;background:#d92d20;color:#fff}
.user-notification-copy>b{display:block;font-size:13px;color:#101828;line-height:1.35}.user-notification-copy>p{margin:5px 0 5px;color:#475467;font-size:11.5px;line-height:1.55;white-space:pre-line}
.user-notification-copy>small{display:block;color:#98a2b3;font-size:9.5px;margin-top:5px}
.user-notification-details{display:grid;grid-template-columns:1fr 1fr;gap:5px 8px;margin:9px 0;padding:9px 10px;border:1px solid #edf0f4;border-radius:11px;background:#fbfcfe}
.user-notification-details>div{min-width:0}.user-notification-details span{display:block;color:#98a2b3;font-size:8.5px}.user-notification-details b{display:block;color:#344054;font-size:10px;line-height:1.4;word-break:break-word;margin-top:1px}
.user-notification-action{display:inline-flex;margin-top:9px;padding:7px 10px;border-radius:9px;background:#edf4ff;color:#175cd3;text-decoration:none;font-size:10px;font-weight:800}
.notification-read-btn{align-self:start;border:0;border-radius:9px;padding:7px 8px;background:#edf4ff;color:#175cd3;font-size:9px;font-weight:800;cursor:pointer;white-space:nowrap}
.notification-empty{display:flex!important;flex-direction:column;align-items:center;justify-content:center;min-height:280px!important;text-align:center!important;padding:35px 18px!important}
.notification-empty-icon{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#eaf8ef;color:#087443;font-size:18px;font-weight:900;margin-bottom:9px}.notification-empty b{font-size:13px}.notification-empty small{max-width:360px;margin-top:4px;color:#8a94a5;line-height:1.5}

@media(max-width:760px){
  #mobileOpenNotifications>span:nth-child(2){font-size:9px}
  .notification-center-dialog{width:100%!important;max-width:none!important;margin:auto 0 0!important;border-radius:22px 22px 0 0!important;inset:auto 0 0!important;max-height:92dvh!important}
  .notification-center-card{max-height:92dvh;border-radius:22px 22px 0 0;min-height:min(72dvh,620px)}
  .notification-center-head{padding:calc(14px + env(safe-area-inset-top)/3) 14px 12px}.notification-center-head h3{font-size:18px}
  .notification-center-toolbar{padding:9px 10px}.notification-center-toolbar b{font-size:10px}.notification-center-toolbar .btn{padding:7px 8px;font-size:9px}
  .user-notification-list{padding:9px 9px calc(16px + env(safe-area-inset-bottom));gap:8px}
  .user-notification-item{grid-template-columns:38px minmax(0,1fr);gap:9px;padding:11px;border-radius:14px}
  .user-notification-icon{width:38px;height:38px;border-radius:12px}.user-notification-icon svg{width:19px;height:19px}
  .notification-read-btn{grid-column:2;justify-self:start;padding:6px 8px}
  .user-notification-details{grid-template-columns:1fr;padding:8px 9px}
  .user-notification-copy>b{font-size:12px}.user-notification-copy>p{font-size:11px}
}

/* V43 Maintenance Mode */
.maintenance-admin-card{display:grid;gap:18px}.maintenance-master-toggle,.maintenance-access-grid label,.maintenance-user-item{display:flex;align-items:center;gap:12px;border:1px solid var(--border,#e5e7eb);background:var(--card,#fff);border-radius:16px;padding:14px 16px}.maintenance-master-toggle{justify-content:space-between}.maintenance-master-toggle>span,.maintenance-access-grid label>span,.maintenance-user-item>span{display:grid;gap:3px;min-width:0;flex:1}.maintenance-master-toggle small,.maintenance-access-grid small,.maintenance-user-item small,.maintenance-user-head small{color:var(--muted,#667085);font-size:12px}.maintenance-master-toggle input,.maintenance-access-grid input,.maintenance-user-item input{width:19px;height:19px;accent-color:#315ecf}.maintenance-access-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.maintenance-copy-grid{display:grid;gap:12px}.maintenance-copy-grid label{display:grid;gap:7px;font-size:13px;font-weight:700}.maintenance-copy-grid input,.maintenance-copy-grid textarea,.maintenance-user-head input{width:100%;border:1px solid var(--border,#d0d5dd);border-radius:12px;padding:11px 12px;background:var(--card,#fff);color:inherit;font:inherit}.maintenance-copy-grid textarea{resize:vertical;min-height:100px}.maintenance-user-head{display:flex;gap:16px;justify-content:space-between;align-items:end}.maintenance-user-head>div{display:grid;gap:3px}.maintenance-user-head input{max-width:280px}.maintenance-user-list{display:grid;gap:8px;max-height:340px;overflow:auto;padding-right:3px}.maintenance-user-item{cursor:pointer}.maintenance-user-item em{font-size:11px;font-style:normal;font-weight:800;padding:5px 8px;border-radius:999px;background:#eef2ff;color:#4758b8}.maintenance-save-row{display:flex;gap:14px;align-items:center;justify-content:space-between;border-top:1px solid var(--border,#e5e7eb);padding-top:16px}.maintenance-save-row span{font-size:12px;color:var(--muted,#667085)}@media(max-width:680px){.maintenance-access-grid{grid-template-columns:1fr}.maintenance-user-head,.maintenance-save-row{align-items:stretch;flex-direction:column}.maintenance-user-head input{max-width:none}.maintenance-save-row .btn{width:100%}}


/* V45 - Backup & Restore pada Maintenance */
.maintenance-backup-zone{display:grid;gap:14px;border-top:1px solid var(--border,#e5e7eb);padding-top:18px}.maintenance-backup-head>div{display:grid;gap:4px}.maintenance-backup-head small,.maintenance-backup-card small,.maintenance-backup-note{color:var(--muted,#667085);font-size:12px;line-height:1.55}.maintenance-backup-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.maintenance-backup-card{display:grid;gap:12px;border:1px solid var(--border,#e5e7eb);background:var(--card,#fff);border-radius:16px;padding:16px}.maintenance-backup-card>div{display:grid;gap:4px}.maintenance-backup-card form{display:grid;gap:9px}.maintenance-backup-card input[type=file]{width:100%;border:1px dashed var(--border,#d0d5dd);border-radius:12px;padding:10px;background:var(--bg-soft,#f8fafc);color:inherit}.maintenance-backup-card .btn{text-align:center;justify-content:center}.danger-outline{border:1px solid #e5484d!important;background:transparent!important;color:#c9343a!important}.danger-outline:hover{background:rgba(229,72,77,.08)!important}.maintenance-backup-note{padding:11px 13px;border-radius:12px;background:rgba(245,158,11,.08);border:1px solid rgba(245,158,11,.22)}@media(max-width:780px){.maintenance-backup-grid{grid-template-columns:1fr}}


/* V53 - Bills grouped by payment status: unpaid first, paid collapsed */
.bill-section{display:grid;gap:8px;margin-top:10px}.bill-section:first-child{margin-top:0}
.bill-section-head,.bill-section-paid>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid #e5eaf1;border-radius:12px;background:#f8fafc;list-style:none;cursor:default}.bill-section-paid>summary{cursor:pointer}.bill-section-head>div,.bill-section-paid>summary>span:first-child{display:grid;gap:2px;min-width:0}.bill-section-head b,.bill-section-paid>summary b{font-size:11px}.bill-section-head small,.bill-section-paid>summary small{font-size:9px;color:#8792a3}.bill-section-count{display:inline-flex;align-items:center;justify-content:center;min-width:26px;height:24px;padding:0 8px;border-radius:999px;background:#eaf1ff;color:#1858bf;font-size:10px;font-weight:850;flex:0 0 auto}.bill-section-unpaid .bill-section-head{border-color:#f1d7b0;background:#fffaf2}.bill-section-unpaid .bill-section-count{background:#fff0d6;color:#9a6700}.bill-section-paid>summary .bill-section-count{background:#eaf8ef;color:#087443}.bill-section-paid>summary::-webkit-details-marker{display:none}.bill-section-paid>summary:after{content:'⌄';font-size:13px;color:#667085;margin-left:auto;transform:rotate(0deg);transition:transform .15s ease}.bill-section-paid[open]>summary:after{transform:rotate(180deg)}.bill-section-list{display:grid;gap:8px}

/* =========================================================
   V51 - MOBILE BILL / CREDIT CARD BILL LAYOUT
   ========================================================= */
.bill-row-summary{display:flex;align-items:center;justify-content:flex-end;gap:9px;flex:0 0 auto}
.bill-row-amount{font-size:12px;white-space:nowrap;text-align:right}
.bill-row-amount .money-caption{margin-top:2px}
.bill-row-actions{align-items:center;flex-wrap:nowrap}
.bill-pay-wallet{min-width:180px;max-width:240px;height:36px;border:1px solid #d7dee8;border-radius:9px;background:#fff;padding:0 30px 0 10px;font:inherit;font-size:11px;color:#27364a;outline:none}
.bill-pay-wallet:focus{border-color:#78a3e9;box-shadow:0 0 0 3px rgba(23,92,211,.08)}

@media(max-width:760px){
  .feature-list-row.bill-row{
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    gap:10px 12px;
    align-items:start;
    padding:14px;
  }
  .bill-row .bill-row-icon{
    grid-column:1;
    grid-row:1;
    width:48px;
    height:48px;
    flex-basis:48px;
    border-radius:14px;
  }
  .bill-row .bill-row-main{
    grid-column:2;
    grid-row:1;
    min-width:0;
    padding-top:1px;
  }
  .bill-row .bill-row-main b{
    font-size:14px;
    line-height:1.35;
  }
  .bill-row .bill-row-main small{
    margin-top:4px;
    font-size:10px;
    line-height:1.45;
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
    overflow-wrap:anywhere;
  }
  .bill-row-summary{
    grid-column:1/-1;
    width:100%;
    min-width:0;
    justify-content:space-between;
    gap:10px;
    padding-top:2px;
  }
  .bill-row-amount{
    font-size:17px;
    line-height:1.25;
    text-align:left;
    min-width:0;
  }
  .bill-row-amount .money-caption{
    font-size:8px;
    text-align:left;
    white-space:normal;
  }
  .bill-row-status{
    flex:0 0 auto;
    padding:5px 9px;
    font-size:9px;
  }
  .feature-list-row.bill-row .bill-row-actions{
    grid-column:1/-1;
    width:100%;
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(92px,1fr));
    gap:8px;
    justify-content:stretch;
  }
  .bill-row-actions .bill-pay-wallet{
    grid-column:1/-1;
    width:100%;
    min-width:0;
    max-width:none;
    height:42px;
    font-size:12px;
    border-radius:11px;
  }
  .bill-row-actions button{
    width:100%;
    min-height:40px;
    padding:9px 10px;
    border-radius:10px;
    font-size:10px;
  }
  .credit-card-bill-row .bill-pay-button{
    grid-column:1/-1;
  }
}

@media(max-width:380px){
  .feature-list-row.bill-row{grid-template-columns:42px minmax(0,1fr);gap:9px 10px;padding:12px}
  .bill-row .bill-row-icon{width:42px;height:42px;flex-basis:42px;border-radius:12px}
  .bill-row .bill-row-main b{font-size:13px}
  .bill-row .bill-row-main small{font-size:9px}
  .bill-row-amount{font-size:16px}
}



/* ===== V52 - resizable mobile sheets + drag order dompet ===== */
.wallet-sort-handle{
  width:24px;height:36px;min-width:24px;padding:7px 5px;border:0;border-radius:9px;background:transparent;color:#98a2b3;
  display:grid;grid-template-columns:repeat(2,3px);grid-template-rows:repeat(3,3px);gap:3px;place-content:center;cursor:grab;touch-action:none;
}
.wallet-sort-handle:hover{background:#f2f5f9;color:#667085}.wallet-sort-handle:active{cursor:grabbing;background:#eaf1fb}
.wallet-sort-handle span{display:block;width:3px;height:3px;border-radius:50%;background:currentColor}
[data-wallet-sort-row]{transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease,background .12s ease}
[data-wallet-sort-row].is-wallet-dragging{z-index:5;border-color:#9fc0f4!important;background:#f7faff!important;box-shadow:0 10px 26px rgba(23,92,211,.14)!important}
.is-wallet-sorting [data-wallet-sort-row]{user-select:none;-webkit-user-select:none}
.wallet-manage-row{grid-template-columns:auto auto minmax(0,1fr) auto auto!important;display:grid!important}.wallet-manage-row .feature-row-main{min-width:0}.wallet-manage-row .wallet-sort-handle{align-self:center}

@media(max-width:760px){
  dialog.ck-resizable-sheet{width:100%!important;max-width:none!important;margin:auto 0 0!important;inset:auto 0 0!important;border-radius:24px 24px 0 0!important;overflow:hidden!important;transition:height .18s ease}
  dialog.ck-resizable-sheet.is-sheet-dragging{transition:none!important}
  dialog.ck-resizable-sheet.sheet-user-sized{height:var(--ck-sheet-height)!important;max-height:100dvh!important}
  dialog.ck-resizable-sheet.sheet-user-sized>:first-child{height:100%!important;max-height:none!important;overflow:auto!important;border-radius:24px 24px 0 0!important}
  .ck-sheet-drag-handle{display:block!important;position:relative;z-index:20;width:100%;height:20px;min-height:20px;margin:0!important;padding:0!important;background:transparent!important;border:0!important;cursor:ns-resize;touch-action:none;flex:0 0 20px}
  .ck-sheet-drag-handle::after{content:"";position:absolute;left:50%;top:7px;width:42px;height:4px;transform:translateX(-50%);border-radius:999px;background:#d2d8e1}
  .ck-sheet-drag-handle:focus-visible{outline:2px solid rgba(23,92,211,.32);outline-offset:-2px}
  .wallet-balance-dialog{width:calc(100vw - 18px);max-width:none}
  .wallet-balance-card{padding:16px 14px calc(16px + env(safe-area-inset-bottom))}
  .wallet-balance-list{gap:10px;max-height:none}
  .wallet-balance-row{
    grid-template-columns:24px 38px minmax(0,1fr)!important;
    grid-template-areas:
      "sort icon name"
      "sort icon amount";
    align-items:center;
    gap:8px 10px;
    padding:12px 10px;
  }
  .wallet-balance-row>.wallet-sort-handle{grid-area:sort;align-self:center;justify-self:center}
  .wallet-balance-row>.wallet-balance-icon{grid-area:icon}
  .wallet-balance-row>.wallet-balance-name{grid-area:name;align-self:end}
  .wallet-balance-row>.wallet-balance-name b{font-size:14px;line-height:1.3}
  .wallet-balance-row>.wallet-balance-name small{margin-top:3px;font-size:10px;line-height:1.45;white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere}
  .wallet-balance-row>strong{grid-area:amount;justify-self:end;align-self:start;text-align:right;font-size:15px;line-height:1.15;display:block}
  .wallet-balance-row>strong .money-caption{margin-top:3px}
  .wallet-manage-row{grid-template-columns:24px 36px minmax(0,1fr) auto!important;gap:8px!important}
  .wallet-manage-row>strong{grid-column:3/5;justify-self:end;margin-top:-2px}.wallet-manage-row .row-actions{grid-column:3/5;justify-content:flex-end}
  .wallet-sort-handle{width:22px;min-width:22px;height:38px;padding:8px 4px}
}


/* ===== V55 - Rincian Saldo layout stabilization =====
   V52 menambahkan handle urutan sehingga baris sekarang memiliki 4 anak:
   handle, ikon, info, nominal. Layout ini sengaja dibuat 1 baris stabil
   pada desktop maupun mobile agar nominal tidak jatuh ke baris kiri. */
.wallet-balance-row{
  display:grid!important;
  grid-template-columns:24px 40px minmax(0,1fr) auto!important;
  grid-template-areas:none!important;
  align-items:center!important;
  gap:10px!important;
  min-width:0;
}
.wallet-balance-row>.wallet-sort-handle{
  grid-area:auto!important;
  grid-column:auto!important;
  grid-row:auto!important;
  justify-self:center;
  align-self:center;
}
.wallet-balance-row>.wallet-balance-icon{
  grid-area:auto!important;
  grid-column:auto!important;
  grid-row:auto!important;
  justify-self:center;
}
.wallet-balance-row>.wallet-balance-name{
  grid-area:auto!important;
  grid-column:auto!important;
  grid-row:auto!important;
  min-width:0;
  text-align:left!important;
  align-self:center!important;
}
.wallet-balance-row>.wallet-balance-name b{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.wallet-balance-row>.wallet-balance-name small{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.wallet-balance-row>strong{
  grid-area:auto!important;
  grid-column:auto!important;
  grid-row:auto!important;
  justify-self:end!important;
  align-self:center!important;
  min-width:max-content;
  max-width:none;
  margin:0!important;
  text-align:right!important;
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
.wallet-balance-row>strong .money-caption{
  display:block;
  margin-top:2px;
  text-align:right;
  white-space:nowrap;
}

@media(max-width:760px){
  .wallet-balance-dialog{
    width:calc(100vw - 18px)!important;
  }
  .wallet-balance-card{
    padding:15px 13px calc(15px + env(safe-area-inset-bottom))!important;
  }
  .wallet-balance-row{
    grid-template-columns:22px 36px minmax(0,1fr) auto!important;
    gap:8px!important;
    padding:11px 10px!important;
    border-radius:14px;
  }
  .wallet-balance-row>.wallet-balance-icon{
    width:34px!important;
    height:34px!important;
    border-radius:10px!important;
  }
  .wallet-balance-row>.wallet-balance-name b{
    font-size:12px!important;
    line-height:1.25!important;
  }
  .wallet-balance-row>.wallet-balance-name small{
    margin-top:2px!important;
    font-size:9px!important;
    line-height:1.3!important;
  }
  .wallet-balance-row>strong{
    font-size:12px!important;
    line-height:1.2!important;
  }
  .wallet-balance-row>strong .money-caption{
    font-size:7px!important;
  }
  .wallet-balance-row>.wallet-sort-handle{
    width:20px!important;
    min-width:20px!important;
    height:34px!important;
    padding:7px 3px!important;
  }
}

@media(max-width:390px){
  .wallet-balance-row{
    grid-template-columns:20px 32px minmax(0,1fr) auto!important;
    gap:7px!important;
    padding:10px 8px!important;
  }
  .wallet-balance-row>.wallet-balance-icon{
    width:32px!important;
    height:32px!important;
  }
  .wallet-balance-row>.wallet-balance-name b{font-size:11.5px!important}
  .wallet-balance-row>.wallet-balance-name small{font-size:8.5px!important}
  .wallet-balance-row>strong{font-size:11px!important}
}

/* ===== V58 - Android App Release Manager ===== */
.android-update-banner{
  display:grid;grid-template-columns:46px minmax(0,1fr) auto;align-items:center;gap:12px;
  margin:0 0 14px;padding:13px 14px;border:1px solid #b9d2fb;border-radius:17px;
  background:linear-gradient(135deg,#f3f7ff,#fff);box-shadow:0 6px 20px rgba(23,92,211,.07)
}
.android-update-banner[hidden]{display:none!important}
.android-update-icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:#e8f1ff;color:#175cd3}
.android-update-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.android-update-copy{min-width:0}.android-update-copy>b{display:block;color:#14213d;font-size:13px}.android-update-copy>p{margin:3px 0 4px;color:#667085;font-size:11px;line-height:1.45;white-space:pre-line;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.android-update-copy>small{color:#8290a5;font-size:9px}.android-update-actions{display:flex;align-items:center;gap:7px}.android-update-actions .btn{white-space:nowrap;padding:9px 11px;font-size:10px}
.android-release-user-card{margin:0 0 12px;padding:12px 13px;border-radius:14px;background:#f7f9fc;border:1px solid #e5eaf1}.android-release-user-card>div{display:grid;gap:2px}.android-release-user-card b{font-size:12px}.android-release-user-card small{font-size:9px;color:#7b8798}.android-release-user-card p{margin:9px 0 0;font-size:10px;line-height:1.55;color:#667085;white-space:pre-line}
.android-release-admin-section{display:grid;gap:15px}.android-release-current{display:grid;grid-template-columns:48px minmax(0,1fr);align-items:center;gap:12px;padding:14px;border:1px solid #c9dcfb;border-radius:16px;background:#f6f9ff}.android-release-current-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:#e8f1ff;color:#175cd3}.android-release-current-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.android-release-current>div:last-child{display:grid;gap:2px}.android-release-current small{font-size:9px;color:#75849a;text-transform:uppercase;letter-spacing:.05em;font-weight:800}.android-release-current b{font-size:15px}.android-release-current span{font-size:10px;color:#667085}
.android-release-form{display:grid;gap:13px;padding:16px;border:1px solid #e3e8ef;border-radius:17px;background:#fff}.android-release-form>label,.android-release-version-grid label{display:grid;gap:6px;font-size:11px;font-weight:800;color:#475467}.android-release-form input,.android-release-form textarea{width:100%;border:1px solid #d0d7e2;border-radius:11px;padding:10px 11px;background:#fff;color:#172235;font:inherit}.android-release-form input[type=file]{padding:9px;background:#f8fafc}.android-release-form textarea{resize:vertical;min-height:130px;line-height:1.55}.android-release-form label small{font-weight:500;color:#8a96a8;font-size:9px;line-height:1.45}.android-release-version-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.android-release-publish-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-top:3px}.android-release-publish-row>div{display:grid;gap:2px}.android-release-publish-row b{font-size:11px}.android-release-publish-row small{font-size:9px;color:#7b8798}.android-release-history{display:grid;gap:8px}.android-release-history-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;border:1px solid #e5eaf1;border-radius:13px;background:#fff}.android-release-history-row>div{display:grid;gap:2px;min-width:0}.android-release-history-row b{font-size:11px}.android-release-history-row small{font-size:9px;color:#7b8798}.android-release-history-row>span{max-width:45%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:9px;color:#98a2b3}
@media(max-width:760px){.android-update-banner{grid-template-columns:40px minmax(0,1fr);padding:11px}.android-update-icon{width:40px;height:40px;border-radius:12px}.android-update-actions{grid-column:1/-1;display:grid;grid-template-columns:1fr auto}.android-update-actions .btn{text-align:center}.android-release-version-grid{grid-template-columns:1fr}.android-release-publish-row{align-items:stretch;flex-direction:column}.android-release-publish-row .btn{width:100%}.android-release-history-row{align-items:flex-start;flex-direction:column}.android-release-history-row>span{max-width:100%}}

/* ===== V60 - safe top limit Pemberitahuan ===== */
@media(max-width:760px){
  #notificationCenterModal.ck-resizable-sheet.sheet-user-sized{
    max-height:calc(100dvh - max(52px, env(safe-area-inset-top)))!important;
  }
}

/* ===== V61 - Saldo tersedia + limit kartu kredit terpisah ===== */
.balance-credit-summary{
  display:flex;align-items:center;gap:14px;margin-top:9px;padding-top:8px;border-top:1px solid rgba(255,255,255,.18)
}
.balance-credit-summary[hidden]{display:none!important}
.balance-credit-summary>span{display:grid;gap:1px;min-width:0}
.balance-credit-summary em{font-style:normal;font-size:8px;font-weight:700;color:rgba(255,255,255,.66);white-space:nowrap}
.balance-credit-summary b{font-size:11px;line-height:1.25;color:#fff;white-space:nowrap}

.wallet-credit-total{position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px;padding-top:11px;border-top:1px solid rgba(255,255,255,.20)}
.wallet-credit-total[hidden]{display:none!important}
.wallet-credit-total>span{display:grid;gap:2px;min-width:0}
.wallet-credit-total small{margin:0!important;color:rgba(255,255,255,.66)!important;font-size:8px!important;font-weight:700!important;line-height:1.25!important}
.wallet-credit-total b{font-size:13px;line-height:1.25;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

@media(max-width:760px){
  .balance-stat.has-credit-card{min-height:106px!important}
  .balance-credit-summary{gap:12px;margin-top:7px;padding-top:7px}
  .balance-credit-summary em{font-size:7.5px}
  .balance-credit-summary b{font-size:10px}
  .wallet-credit-total{margin-top:10px;padding-top:9px;gap:10px}
  .wallet-credit-total b{font-size:12px}
}
@media(max-width:390px){
  .balance-stat.has-credit-card{min-height:102px!important}
  .balance-credit-summary{gap:9px}
  .balance-credit-summary em{font-size:7px}
  .balance-credit-summary b{font-size:9px}
}


/* ===== V62 - desktop balance credit summary layout ===== */
.balance-stat-content{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  grid-template-areas:
    "copy actions"
    "credit credit";
  align-items:center!important;
  column-gap:10px!important;
  row-gap:0!important;
}
.balance-stat-copy{grid-area:copy;min-width:0}
.balance-stat-actions{grid-area:actions}
.balance-credit-summary{
  grid-area:credit;
  width:100%;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin-top:9px;
  padding-top:8px;
  border-top:1px solid rgba(255,255,255,.18);
}
.balance-credit-summary[hidden]{display:none!important}
.balance-credit-summary>span{
  min-width:0;
  display:grid;
  gap:2px;
  padding:6px 8px;
  border-radius:9px;
  background:rgba(255,255,255,.08);
}
.balance-credit-summary em{
  display:block;
  min-width:0;
  font-style:normal;
  font-size:8px;
  line-height:1.2;
  font-weight:700;
  color:rgba(255,255,255,.68);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.balance-credit-summary b{
  display:block;
  min-width:0;
  font-size:11px;
  line-height:1.25;
  color:#fff;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

@media(min-width:1121px){
  .balance-stat.has-credit-card{min-height:118px!important}
  .balance-credit-summary{gap:9px}
  .balance-credit-summary>span{padding:6px 9px}
  .balance-credit-summary b{font-size:11.5px}
}

@media(max-width:760px){
  .balance-stat.has-credit-card{min-height:118px!important}
  .balance-credit-summary{
    gap:6px;
    margin-top:7px;
    padding-top:7px;
  }
  .balance-credit-summary>span{padding:5px 6px;border-radius:8px}
  .balance-credit-summary em{font-size:7px}
  .balance-credit-summary b{font-size:9.5px}
}

/* ===== V63 - Login loading + anti double submit ===== */
.login-submit-button{position:relative;display:flex!important;align-items:center;justify-content:center;min-height:44px;overflow:hidden}
.login-submit-label,.login-submit-loading{transition:opacity .14s ease,transform .14s ease}
.login-submit-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:9px;opacity:0;transform:translateY(4px);pointer-events:none}
.login-submit-spinner{width:17px;height:17px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:login-submit-spin .72s linear infinite;flex:0 0 17px}
.login-submit-button.is-loading .login-submit-label{opacity:0;transform:translateY(-4px)}
.login-submit-button.is-loading .login-submit-loading{opacity:1;transform:translateY(0)}
.login-submit-button:disabled{cursor:wait!important;opacity:1!important;filter:none!important}
.auth-form.is-login-submitting input:not([type=hidden]){cursor:wait;background:#f8fafc;color:#667085}
.auth-form.is-login-submitting .secret-toggle{pointer-events:none;opacity:.48}
.auth-form.is-login-submitting .forgot-password-row{pointer-events:none;opacity:.6}
@keyframes login-submit-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.login-submit-spinner{animation-duration:1.35s}.login-submit-label,.login-submit-loading{transition:none}}


/* ===== V66 - Pengaturan Notifikasi per User ===== */
.notification-settings-shortcut{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--surface-2)}
.notification-settings-shortcut>div{min-width:0}.notification-settings-shortcut b{display:block;font-size:14px}.notification-settings-shortcut small{display:block;margin-top:3px;color:var(--muted);line-height:1.45}
.notification-settings-dialog{width:min(560px,calc(100% - 28px));max-width:560px}
.notification-settings-card{padding:20px}
.notification-settings-card .modal-subtitle{margin:5px 0 0;color:var(--muted);font-size:12px}
.notification-master-row,.notification-device-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px;border:1px solid var(--line);border-radius:16px;background:#fff}
.notification-master-row>div,.notification-device-row>div{min-width:0}.notification-master-row b,.notification-device-row b{display:block;font-size:14px}.notification-master-row small,.notification-device-row small{display:block;margin-top:3px;color:var(--muted);font-size:11px;line-height:1.45}
.switch-control{position:relative!important;display:inline-flex!important;flex:0 0 auto;margin:0!important}.switch-control input{position:absolute;opacity:0;pointer-events:none}.switch-control span{display:block;width:46px;height:26px;border-radius:999px;background:#d0d5dd;position:relative;transition:.18s ease;cursor:pointer}.switch-control span::after{content:"";position:absolute;width:20px;height:20px;left:3px;top:3px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(16,24,40,.2);transition:.18s ease}.switch-control input:checked+span{background:var(--primary)}.switch-control input:checked+span::after{transform:translateX(20px)}
.notification-settings-section{display:grid;gap:13px;margin-top:14px;transition:.16s ease}.notification-settings-section.is-disabled{opacity:.52}.notification-settings-section label{margin:0}.notification-settings-section select,.notification-settings-section input[type=number]{width:100%;border:1px solid #d9dee8;border-radius:12px;padding:11px 12px;background:#fff;color:var(--text);font:inherit;outline:none}.notification-settings-section select:focus,.notification-settings-section input[type=number]:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(23,92,211,.10)}
.notification-email-hint{display:block;color:var(--muted);font-size:11px;line-height:1.5;margin-top:-6px}.notification-channel-note{padding:12px 13px;border-radius:14px;background:var(--primary-soft);border:1px solid #cfe0ff}.notification-channel-note b{display:block;font-size:12px;color:#174ea6}.notification-channel-note small{display:block;margin-top:4px;font-size:11px;line-height:1.5;color:#475467}
.notification-type-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.notification-type-grid .toggle-line{display:flex;align-items:center;gap:8px;padding:10px 11px;border:1px solid var(--line);border-radius:12px;background:#fff;font-size:12px;font-weight:700;margin:0}.notification-type-grid .toggle-line input{width:16px;height:16px;flex:0 0 16px;margin:0}
.notification-device-row .btn{flex:0 0 auto;white-space:nowrap}
@media(max-width:760px){
  .notification-settings-dialog{width:100%;max-width:none;max-height:calc(100dvh - max(52px,calc(env(safe-area-inset-top) + 18px)));border-radius:24px 24px 0 0}
  .notification-settings-card{max-height:inherit;overflow-y:auto;padding:18px 16px calc(18px + env(safe-area-inset-bottom))}
  .notification-settings-shortcut{align-items:flex-start;flex-direction:column}.notification-settings-shortcut .btn{width:100%}
  .notification-type-grid{grid-template-columns:1fr}
  .notification-device-row{align-items:flex-start;flex-direction:column}.notification-device-row .btn{width:100%}
}

/* ===== V67 - Piutang / Memberi Hutang ===== */
.receivable-panel{display:grid;gap:14px}
.receivable-hero{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 20px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(135deg,var(--surface),var(--surface-2))}
.receivable-hero>div{min-width:0}.receivable-hero h3{margin:4px 0 6px;font-size:20px;letter-spacing:-.3px}.receivable-hero p{margin:0;color:var(--muted);font-size:12px;line-height:1.55;max-width:720px}.receivable-kicker{display:block;font-size:10px;font-weight:800;letter-spacing:.12em;color:var(--primary)}
.receivable-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.receivable-summary-card{padding:14px 15px;border:1px solid var(--line);border-radius:16px;background:#fff;min-width:0}.receivable-summary-card span{display:block;color:var(--muted);font-size:11px;margin-bottom:5px}.receivable-summary-card b{display:block;font-size:18px;letter-spacing:-.25px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.receivable-summary-card.emphasis{background:var(--primary-soft);border-color:#cfe0ff}.receivable-summary-card.emphasis b{color:var(--primary)}
.receivable-form-grid{align-items:start}.receivable-form-card{display:grid;gap:10px}.receivable-form-card .feature-toolbar{margin-bottom:0}.receivable-form-card label{display:grid;gap:6px;font-size:12px;font-weight:700;color:#475467}.receivable-form-card label>small{font-weight:500;color:var(--muted)}.receivable-form-card input,.receivable-form-card select,.receivable-form-card textarea,.receivable-status-filter select,.receivable-history-filter select{width:100%;border:1px solid #d9dee8;border-radius:12px;padding:10px 11px;background:#fff;color:var(--text);font:inherit;outline:none}.receivable-form-card textarea{resize:vertical;min-height:72px}.receivable-form-card input:focus,.receivable-form-card select:focus,.receivable-form-card textarea:focus,.receivable-status-filter select:focus,.receivable-history-filter select:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(23,92,211,.10)}
.receivable-date-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.receivable-photo-field input{padding:8px;background:var(--surface-2)}.receivable-outstanding-hint{padding:10px 12px;border-radius:12px;background:var(--surface-2);border:1px dashed #d0d5dd;color:var(--muted);font-size:11px;line-height:1.45}.receivable-outstanding-hint strong{color:var(--text)}
.receivable-recap-card,.receivable-history-card{padding:16px}.receivable-list-toolbar{align-items:end;gap:14px}.receivable-status-filter,.receivable-history-filter{display:grid;gap:5px;min-width:160px;font-size:11px;color:var(--muted)}
.receivable-people-list,.receivable-history-list{display:grid;gap:9px;margin-top:12px}.receivable-person{border:1px solid var(--line);border-radius:15px;background:#fff;overflow:hidden}.receivable-person[open]{box-shadow:0 8px 24px rgba(16,24,40,.05)}.receivable-person>summary{list-style:none;cursor:pointer;padding:13px 14px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px}.receivable-person>summary::-webkit-details-marker{display:none}.receivable-person-main{min-width:0;display:flex;align-items:center;gap:10px}.receivable-person-avatar{width:38px;height:38px;flex:0 0 38px;border-radius:12px;background:var(--primary-soft);display:grid;place-items:center;color:var(--primary);font-weight:800}.receivable-person-copy{min-width:0}.receivable-person-copy b{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.receivable-person-copy small{display:block;color:var(--muted);font-size:10px;margin-top:3px}.receivable-person-amount{text-align:right}.receivable-person-amount span{display:block;color:var(--muted);font-size:9px}.receivable-person-amount b{display:block;font-size:14px;margin-top:2px}.receivable-person.is-paid .receivable-person-avatar{background:var(--success-soft);color:var(--success)}.receivable-person.is-overdue .receivable-person-avatar{background:var(--danger-soft);color:var(--danger)}
.receivable-person-body{border-top:1px solid var(--line);padding:12px 14px;background:var(--surface-2)}.receivable-person-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.receivable-person-kpis div{padding:9px;border:1px solid var(--line);border-radius:11px;background:#fff}.receivable-person-kpis span{display:block;font-size:9px;color:var(--muted)}.receivable-person-kpis b{display:block;font-size:12px;margin-top:2px}.receivable-person-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:10px}.receivable-person-actions .btn{padding:8px 10px;font-size:11px}
.receivable-entry{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:10px;padding:11px 12px;border:1px solid var(--line);border-radius:13px;background:#fff}.receivable-entry-icon{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-weight:900;font-size:16px}.receivable-entry.lend .receivable-entry-icon{background:var(--danger-soft);color:var(--danger)}.receivable-entry.repayment .receivable-entry-icon{background:var(--success-soft);color:var(--success)}.receivable-entry-copy{min-width:0}.receivable-entry-copy b{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.receivable-entry-copy small{display:block;color:var(--muted);font-size:10px;line-height:1.45;margin-top:2px}.receivable-entry-note{white-space:normal!important}.receivable-entry-side{text-align:right;white-space:nowrap}.receivable-entry-side b{display:block;font-size:12px}.receivable-entry-side .lend{color:var(--danger)}.receivable-entry-side .repayment{color:var(--success)}.receivable-entry-side button{margin-top:5px;border:0;background:none;color:var(--danger);font-size:10px;cursor:pointer;padding:2px}.receivable-proof-link{display:inline-flex;margin-top:4px;font-size:10px;font-weight:700;color:var(--primary);text-decoration:none}
.receivable-history-list .empty,.receivable-people-list .empty{padding:26px 12px}

@media(max-width:900px){
  .receivable-summary-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .receivable-panel{gap:11px}.receivable-hero{align-items:flex-start;flex-direction:column;padding:15px}.receivable-hero .btn{width:100%}.receivable-summary-grid{gap:7px}.receivable-summary-card{padding:11px 12px}.receivable-summary-card b{font-size:14px}.receivable-date-grid{grid-template-columns:1fr}.receivable-recap-card,.receivable-history-card{padding:13px}.receivable-list-toolbar{align-items:stretch;flex-direction:column}.receivable-status-filter,.receivable-history-filter{min-width:0;width:100%}.receivable-person>summary{padding:11px}.receivable-person-kpis{grid-template-columns:1fr}.receivable-person-actions{display:grid;grid-template-columns:1fr}.receivable-person-actions .btn{width:100%}.receivable-entry{grid-template-columns:36px minmax(0,1fr);align-items:start}.receivable-entry-icon{width:36px;height:36px}.receivable-entry-side{grid-column:2;text-align:left;display:flex;align-items:center;justify-content:space-between;gap:8px}.receivable-entry-side button{margin-top:0}
}

/* ===== V68 - Piutang PDF Filter, Mobile UX & Chat ===== */
.receivable-hero-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.receivable-mobile-mode{display:none}
.receivable-filter-card{padding:16px;display:grid;gap:12px}
.receivable-filter-card .feature-toolbar{margin:0;align-items:center}
.receivable-filter-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.receivable-filter-grid label{display:grid;gap:5px;font-size:11px;font-weight:700;color:#475467;min-width:0}
.receivable-filter-grid input,.receivable-filter-grid select{width:100%;min-width:0;border:1px solid #d9dee8;border-radius:12px;padding:10px 11px;background:#fff;color:var(--text);font:inherit;outline:none}
.receivable-filter-grid input:focus,.receivable-filter-grid select:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(23,92,211,.10)}
.receivable-filter-status{padding:9px 11px;border-radius:11px;background:var(--surface-2);border:1px solid var(--line);font-size:10px;color:var(--muted);line-height:1.45}
.receivable-loan-list{display:grid;gap:7px;margin-top:10px;padding-top:10px;border-top:1px dashed #d0d5dd}
.receivable-loan-list>b{font-size:10px;color:#667085;text-transform:uppercase;letter-spacing:.04em}
.receivable-loan-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 10px;border:1px solid var(--line);border-radius:11px;background:#fff}
.receivable-loan-item>div{min-width:0}.receivable-loan-item strong{display:block;font-size:12px}.receivable-loan-item small{display:block;margin-top:2px;color:var(--muted);font-size:9px;line-height:1.4}.receivable-loan-item button{flex:0 0 auto;padding:7px 9px;font-size:10px}
.receivable-entry-allocation{display:block!important;color:#315c9b!important;font-weight:700;margin-top:3px}
.receivable-confirm-badge{grid-column:2;justify-self:start;display:inline-flex;align-items:center;padding:5px 8px;border-radius:999px;font-size:10px;font-weight:800;margin-bottom:6px}
.receivable-confirm-badge.lend{background:var(--danger-soft);color:var(--danger)}.receivable-confirm-badge.repayment{background:var(--success-soft);color:var(--success)}
.receivable-confirm-fields{grid-column:2}.receivable-confirm-allocation,.receivable-confirm-note{grid-column:1/-1!important}.receivable-confirm-allocation small{display:block;margin-top:4px;color:var(--muted);font-size:9px;line-height:1.4}
.receivable-form-card select,.receivable-form-card input,.receivable-form-card textarea{min-height:43px}
.receivable-form-card .btn.wide{min-height:44px;font-weight:800}

@media(max-width:900px){.receivable-filter-grid{grid-template-columns:1fr 1fr}}
@media(max-width:760px){
  .receivable-hero-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}.receivable-hero-actions .btn{width:100%!important}
  .receivable-mobile-mode{display:grid;grid-template-columns:1fr 1fr;padding:4px;border:1px solid var(--line);border-radius:14px;background:var(--surface-2);position:sticky;top:0;z-index:4}
  .receivable-mobile-mode button{border:0;background:transparent;border-radius:10px;padding:10px 8px;font:inherit;font-size:12px;font-weight:800;color:var(--muted)}
  .receivable-mobile-mode button.is-active{background:#fff;color:var(--primary);box-shadow:0 2px 8px rgba(16,24,40,.08)}
  .receivable-form-grid{display:block!important}.receivable-form-card{padding:14px!important;border-radius:16px!important}.receivable-form-card.mobile-form-hidden{display:none!important}
  .receivable-form-card input,.receivable-form-card select,.receivable-form-card textarea{font-size:16px;min-height:48px;border-radius:13px}.receivable-form-card textarea{min-height:78px}
  .receivable-form-card .btn.wide{position:sticky;bottom:max(8px,env(safe-area-inset-bottom));z-index:3;min-height:50px;border-radius:14px;box-shadow:0 8px 24px rgba(16,24,40,.14)}
  .receivable-filter-card{padding:13px}.receivable-filter-grid{grid-template-columns:1fr}.receivable-filter-card .feature-toolbar{align-items:flex-start;gap:8px}.receivable-filter-card .feature-toolbar .secondary-btn{width:auto}
  .receivable-loan-item{align-items:flex-start;flex-direction:column}.receivable-loan-item button{width:100%}
  .receivable-confirm-fields{grid-template-columns:1fr!important}.receivable-confirm-badge{grid-column:1/-1}.receivable-confirm-fields{grid-column:1/-1}
}

/* ===== V70 - Master Data Peminjam ===== */
#receivableLendBorrowerSelect{font-weight:700}
#receivableLendNewBorrowerWrap[hidden]{display:none!important}
#receivableLendNewBorrowerWrap{padding:11px 12px;border:1px dashed #cfd8e6;border-radius:14px;background:var(--surface-2)}
@media(max-width:760px){
  #receivableLendBorrowerSelect{min-height:52px!important}
  #receivableLendNewBorrowerWrap{padding:12px;border-radius:15px}
}


/* ===== V71 - PDF Piutang download feedback ===== */
.btn-inline-spinner{
  display:inline-block;
  width:14px;
  height:14px;
  margin-right:7px;
  vertical-align:-2px;
  border:2px solid currentColor;
  border-right-color:transparent;
  border-radius:50%;
  animation:ck-btn-spin .7s linear infinite;
}
@keyframes ck-btn-spin{to{transform:rotate(360deg)}}

/* V72 - Local conversational engine indicator */
.chat-panel-head{align-items:center}
.chat-title-wrap{display:flex;align-items:center;min-width:0;gap:7px}
.chat-title-wrap>b{min-width:0}
@media(max-width:760px){.chat-title-wrap{gap:5px}.chat-title-wrap>b{font-size:14px}}

/* ===== V76 - Pusat Keuangan tab visibility fix ===== */
/*
 * Some feature panels (notably Piutang) define their own display mode such as
 * display:grid. That author CSS can override the browser's default [hidden]
 * behavior, causing a hidden panel to remain visible after switching tabs.
 * Make hidden state authoritative for every Finance Center panel.
 */
#financeCenter [data-finance-panel][hidden]{
  display:none!important;
}

/* ===== V78 - Bunga Piutang Manual ===== */
.receivable-summary-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
.receivable-summary-card.interest{background:#fff8e8;border-color:#f4dda7}
.receivable-summary-card.interest b{color:#a15c00}
.receivable-interest-card{grid-column:1/-1}
.receivable-interest-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.receivable-interest-grid label{min-width:0}
#receivableInterestAmountWrap[hidden],#receivableInterestPercentWrap[hidden]{display:none!important}
.receivable-entry.interest .receivable-entry-icon{background:#fff4d6;color:#9a5d00}
.receivable-entry-side .interest{color:#a15c00}
.receivable-person-kpis{grid-template-columns:repeat(4,1fr)}
.receivable-loan-interest{color:#9a5d00!important;font-weight:700}
.receivable-interest-note{display:block!important;color:#9a5d00!important;font-weight:700;margin-top:3px}
@media(max-width:1100px){.receivable-summary-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){.receivable-interest-grid{grid-template-columns:1fr 1fr}.receivable-summary-grid{grid-template-columns:1fr 1fr}}
@media(max-width:760px){
  .receivable-mobile-mode{grid-template-columns:repeat(3,1fr)}
  .receivable-mobile-mode button{font-size:11px;padding:10px 5px}
  .receivable-interest-grid{grid-template-columns:1fr}
  .receivable-person-kpis{grid-template-columns:1fr 1fr}
}
.receivable-loan-item-actions{display:flex;gap:6px;flex:0 0 auto}
.receivable-loan-item-actions button{white-space:nowrap}
@media(max-width:760px){.receivable-loan-item-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.receivable-loan-item-actions button{width:100%}}



/* ===== V86 - Piutang Mobile UX & Compact Filters ===== */
.receivable-filter-card,
.receivable-history-card{
  padding:0;
  overflow:hidden;
}
.receivable-filter-summary,
.receivable-history-summary{
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-width:0;
  padding:13px 16px;
  cursor:pointer;
}
.receivable-filter-summary::-webkit-details-marker,
.receivable-history-summary::-webkit-details-marker{
  display:none;
}
.receivable-filter-summary>div,
.receivable-history-summary>div{
  min-width:0;
}
.receivable-filter-summary b,
.receivable-history-summary b{
  display:block;
  font-size:13px;
  color:var(--text);
}
.receivable-filter-summary small,
.receivable-history-summary small{
  display:block;
  margin-top:3px;
  color:var(--muted);
  font-size:10px;
  line-height:1.4;
}
.receivable-filter-summary::after,
.receivable-history-summary::after{
  content:"⌄";
  flex:0 0 auto;
  color:#667085;
  font-size:15px;
  line-height:1;
  transition:transform .18s ease;
}
.receivable-filter-card[open]>.receivable-filter-summary::after,
.receivable-history-card[open]>.receivable-history-summary::after{
  transform:rotate(180deg);
}
.receivable-filter-summary-meta{
  margin-left:auto;
  flex:0 0 auto;
  padding:5px 8px;
  border-radius:999px;
  background:#f2f5fa;
  color:#667085;
  font-size:9px;
  font-weight:800;
  white-space:nowrap;
}
.receivable-filter-body{
  display:grid;
  gap:10px;
  padding:0 16px 16px;
}
.receivable-filter-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.receivable-filter-toolbar>span{
  min-width:0;
  color:var(--muted);
  font-size:10px;
  line-height:1.4;
}
.receivable-filter-toolbar .secondary-btn{
  flex:0 0 auto;
  padding:7px 9px;
  font-size:10px;
}
.receivable-history-summary>span{
  flex:0 0 auto;
  font-size:0;
  color:#667085;
}
.receivable-history-summary>span::after{
  content:"Buka";
  display:inline-block;
  padding:5px 8px;
  border-radius:999px;
  background:#f2f5fa;
  color:#667085;
  font-size:9px;
  font-weight:800;
}
.receivable-history-card[open]>.receivable-history-summary>span::after{
  content:"Tutup";
}
.receivable-history-body{
  padding:0 16px 16px;
}
.receivable-history-body .receivable-history-list{
  margin-top:0;
}
.receivable-mobile-mode{
  box-shadow:0 5px 16px rgba(16,24,40,.08);
}
.receivable-person-actions{
  flex-wrap:wrap;
}
@media(max-width:760px){
  .receivable-panel{gap:9px}
  .receivable-hero{padding:12px;border-radius:15px;gap:10px}
  .receivable-hero h3{font-size:18px}
  .receivable-hero p{font-size:10px;line-height:1.4}
  .receivable-hero-actions{gap:6px}
  .receivable-hero-actions .btn{min-height:40px;padding:8px 10px;font-size:10px}
  .receivable-summary-grid{grid-template-columns:1fr 1fr;gap:6px}
  .receivable-summary-card{padding:9px 10px;border-radius:13px}
  .receivable-summary-card span{font-size:9px;margin-bottom:3px}
  .receivable-summary-card b{font-size:12px}
  .receivable-summary-card.emphasis{
    grid-column:1/-1;
    order:-1;
    padding:11px 12px;
  }
  .receivable-summary-card.emphasis b{font-size:17px}
  .receivable-summary-card:last-child{grid-column:1/-1}
  .receivable-mobile-mode{
    position:sticky;
    top:0;
    z-index:12;
    padding:3px;
    border-radius:12px;
    background:rgba(247,249,252,.94);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
  }
  .receivable-mobile-mode button{
    min-height:38px;
    padding:8px 5px;
    font-size:10px;
    border-radius:9px;
  }
  .receivable-form-card{
    padding:12px!important;
    border-radius:14px!important;
    gap:8px;
  }
  .receivable-form-card .feature-toolbar{
    padding-bottom:2px;
  }
  .receivable-form-card .feature-toolbar>div b{
    font-size:14px;
  }
  .receivable-form-card .feature-toolbar>div small{
    font-size:9px;
  }
  .receivable-filter-summary,
  .receivable-history-summary{
    padding:11px 12px;
  }
  .receivable-filter-summary b,
  .receivable-history-summary b{
    font-size:12px;
  }
  .receivable-filter-summary small,
  .receivable-history-summary small{
    font-size:9px;
  }
  .receivable-filter-summary-meta{
    padding:4px 7px;
    font-size:8px;
  }
  .receivable-filter-body{
    gap:9px;
    padding:0 12px 12px;
  }
  .receivable-filter-toolbar{
    align-items:flex-start;
  }
  .receivable-filter-toolbar>span{
    font-size:9px;
  }
  .receivable-filter-grid{
    gap:8px;
  }
  .receivable-filter-grid label{
    gap:4px;
    font-size:10px;
  }
  .receivable-filter-grid input,
  .receivable-filter-grid select{
    min-height:42px;
    padding:9px 10px;
    border-radius:11px;
    font-size:13px;
  }
  .receivable-history-body{
    padding:0 12px 12px;
  }
  .receivable-person-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:6px;
  }
  .receivable-person-actions .btn{
    width:100%;
    margin:0;
  }
  .receivable-person-actions .btn.primary{
    grid-column:1/-1;
  }
  .receivable-history-card .receivable-entry{
    border-radius:11px;
    padding:9px 10px;
  }
}

/* QRIS Premium checkout — Midtrans dynamic QR */
.premium-payment-methods{display:grid;grid-template-columns:1fr;gap:8px;margin:10px 0 14px}
.premium-payment-method{display:grid;grid-template-columns:38px minmax(0,1fr) 20px;align-items:center;gap:10px;padding:12px;border:1px solid var(--line,#e5e7eb);border-radius:13px;background:#fff;cursor:pointer;transition:border-color .16s ease,background .16s ease,box-shadow .16s ease}
.premium-payment-method[hidden]{display:none!important}
.premium-payment-method.is-selected{border-color:#175cd3;background:#f4f8ff;box-shadow:0 0 0 2px rgba(23,92,211,.08)}
.premium-payment-method>input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.premium-payment-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:#eef4ff;color:#175cd3;font-size:22px;font-weight:800}
.premium-payment-method:nth-child(2) .premium-payment-icon{background:#f2f4f7;color:#475467}
.premium-payment-copy{min-width:0}
.premium-payment-copy b{display:block;font-size:12px;color:#101828}
.premium-payment-copy small{display:block;margin-top:4px;color:#667085;font-size:10px;line-height:1.45;font-weight:400}
.premium-payment-check{display:grid;place-items:center;width:20px;height:20px;border:1px solid #d0d5dd;border-radius:50%;font-size:0;color:#fff}
.premium-payment-method.is-selected .premium-payment-check{background:#175cd3;border-color:#175cd3;font-size:12px}
#premiumBankFields[hidden]{display:none!important}
.premium-qris-card{display:grid;justify-items:center;gap:8px;margin:16px 0;padding:16px 12px;border:1px solid #b9d3ff;border-radius:16px;background:linear-gradient(180deg,#f8fbff,#fff)}
.premium-qris-image-wrap{display:grid;place-items:center;min-height:220px;width:min(100%,290px);padding:8px;background:#fff;border:1px solid #e4eaf3;border-radius:12px}
.premium-qris-image{display:block;max-width:100%;width:260px;height:auto;object-fit:contain}
.premium-qris-image-wrap img{display:block;max-width:100%;max-height:290px;width:260px;height:auto;object-fit:contain}
.premium-qris-card>b{color:#101828;font-size:14px;text-align:center}
.premium-qris-card>small{max-width:320px;color:#667085;font-size:10px;line-height:1.5;text-align:center}
.premium-qris-image-error{padding:12px;color:#b42318;font-size:11px;line-height:1.5;text-align:center}
.premium-qris-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.premium-order-status.expired,.premium-invoice-box.expired .premium-invoice-notice{color:#92400e;background:#fffaeb}
.premium-order-status.failed,.premium-invoice-box.failed .premium-invoice-notice{color:#b42318;background:#fff1f0}
@media(max-width:520px){.premium-qris-card{padding:12px 8px}.premium-qris-image-wrap{min-height:190px}.premium-qris-image-wrap img{width:220px;max-height:240px}.premium-qris-actions{grid-template-columns:1fr}.premium-qris-actions .btn{width:100%}}


/* V256 — Finance Center dialog sizing and manual-payment scroll containment */
/* Keep the dialog itself fixed in the viewport. Only .finance-content may scroll,
   so expanding the manual bank form never scrolls the header out of view or leaves
   a blank strip underneath the content card. */
#financeCenter.finance-center-dialog{
  height:min(92vh,940px)!important;
  height:min(92dvh,940px)!important;
  max-height:calc(100vh - 24px)!important;
  max-height:calc(100dvh - 24px)!important;
  padding:0!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
  overscroll-behavior:contain;
}
#financeCenter .finance-center-card{
  display:flex!important;
  flex-direction:column!important;
  width:100%!important;
  height:100%!important;
  max-height:100%!important;
  min-height:0!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}
#financeCenter .finance-center-head,
#financeCenter .finance-tabs{
  flex:0 0 auto!important;
}
#financeCenter .finance-content{
  flex:1 1 auto!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-gutter:stable;
  scroll-padding-bottom:28px;
}
#financeCenter #premiumBankFields:not([hidden]){
  display:block!important;
  height:auto!important;
  min-height:0!important;
  overflow:visible!important;
}
#financeCenter .premium-checkout-card,
#financeCenter .premium-invoice-card{
  min-width:0;
}
@media(max-width:760px){
  #financeCenter.finance-center-dialog{
    inset:0!important;
    margin:0!important;
    width:100%!important;
    height:var(--app-vh,100vh)!important;
    height:var(--app-vh,100dvh)!important;
    max-height:var(--app-vh,100vh)!important;
    max-height:var(--app-vh,100dvh)!important;
    border-radius:0!important;
  }
  #financeCenter .finance-center-card{
    height:100%!important;
    max-height:100%!important;
  }
  #financeCenter .finance-center-head{
    padding-top:calc(14px + env(safe-area-inset-top));
  }
  #financeCenter .finance-content{
    padding-bottom:calc(28px + env(safe-area-inset-bottom))!important;
  }
}