/* Arus v2 — palet: anggur (utama), teal (masuk), magenta (keluar). Sengaja berbeda dari palet Flexible Work. */
:root{
  --bg:#F3F0F8; --card:#FFFFFF; --card2:#F7F4FB; --text:#1E1A2B; --muted:#6B6580; --faint:#6F6A7F;
  --line:#E7E2F0; --primary:#7A3FD0; --on-primary:#FFFFFF; --primary-soft:#EEE4FC; --primary-text:#4B2A7A;
  --exp:#B35000;--in:#0D7A32; --in-soft:#E8F7EE; --out:#CC1C66; --out-soft:#FDECF3; --in-v:#14A34B;--exp-v:#E86A00;--out-v:#E8176E;--dayhd:#EEE4FC;
  --radius:18px; --safe-b:env(safe-area-inset-bottom,0px); --safe-t:env(safe-area-inset-top,0px);
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Inter",system-ui,sans-serif;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme=light]){--bg:#14111C;--card:#1F1B2B;--card2:#2A2538;--text:#F2EEFA;--muted:#A9A3BC;--faint:#928DA5;--line:#322C42;
  --primary:#B794FF;--on-primary:#17102A;--primary-soft:#33265A;--primary-text:#DCCBFF;
  --exp:#FFA040;--in:#3FD178;--in-soft:#143A26;--out:#FF6FAE;--out-soft:#3F1A2D;--in-v:#3FD178;--exp-v:#FFA040;--out-v:#FF6FAE;--dayhd:#33265A}
}
:root[data-theme=dark]{--bg:#14111C;--card:#1F1B2B;--card2:#2A2538;--text:#F2EEFA;--muted:#A9A3BC;--faint:#928DA5;--line:#322C42;
  --primary:#B794FF;--on-primary:#17102A;--primary-soft:#33265A;--primary-text:#DCCBFF;
  --exp:#FFA040;--in:#3FD178;--in-soft:#143A26;--out:#FF6FAE;--out-soft:#3F1A2D;--in-v:#3FD178;--exp-v:#FFA040;--out-v:#FF6FAE;--dayhd:#33265A}
:root[data-theme=light]{color-scheme:light}:root[data-theme=dark]{color-scheme:dark}
/* pilihan warna: anggur (bawaan, di atas), samudra, grafit */
:root[data-pal=samudra]{--bg:#EDF2F7;--card:#FFFFFF;--card2:#F3F6FA;--text:#0F1B2A;--muted:#5A6B7E;--faint:#616E7E;--line:#DCE4EC;--primary:#0A60E0;--on-primary:#FFFFFF;--primary-soft:#DCE9FC;--primary-text:#123F6C;--in:#0D7A32;--in-soft:#E8F7EE;--out:#C22F18;--out-soft:#FDECE7;--in-v:#14A34B;--exp-v:#E86A00;--out-v:#E5381D;--dayhd:#DCE9FC}
@media (prefers-color-scheme:dark){:root[data-pal=samudra]:not([data-theme=light]){--bg:#0D141C;--card:#16212D;--card2:#1E2B3A;--text:#EAF1F8;--muted:#9FB0C3;--faint:#8494A5;--line:#263646;--primary:#6EA8FF;--on-primary:#06182B;--primary-soft:#1B3558;--primary-text:#C6DCFF;--in:#3FD178;--in-soft:#143A26;--out:#FF8A66;--out-soft:#3F2219;--in-v:#3FD178;--exp-v:#FFA040;--out-v:#FF8A66;--dayhd:#1B3558}}
:root[data-pal=samudra][data-theme=dark]{--bg:#0D141C;--card:#16212D;--card2:#1E2B3A;--text:#EAF1F8;--muted:#9FB0C3;--faint:#8494A5;--line:#263646;--primary:#6EA8FF;--on-primary:#06182B;--primary-soft:#1B3558;--primary-text:#C6DCFF;--in:#3FD178;--in-soft:#143A26;--out:#FF8A66;--out-soft:#3F2219;--in-v:#3FD178;--exp-v:#FFA040;--out-v:#FF8A66;--dayhd:#1B3558}
:root[data-pal=grafit]{--bg:#F1F1EF;--card:#FFFFFF;--card2:#F6F6F4;--text:#1B1C1E;--muted:#6A6D72;--faint:#6A6D70;--line:#E3E3E0;--primary:#2F3439;--on-primary:#FFFFFF;--primary-soft:#E7E8EA;--primary-text:#2A2E33;--in:#0D7A32;--in-soft:#E8F7EE;--out:#C22F18;--out-soft:#FDECE7;--in-v:#14A34B;--exp-v:#E86A00;--out-v:#E5381D;--dayhd:#E7E8EA}
@media (prefers-color-scheme:dark){:root[data-pal=grafit]:not([data-theme=light]){--bg:#111214;--card:#1B1C1F;--card2:#25272B;--text:#F1F2F3;--muted:#A4A8AE;--faint:#8C9095;--line:#2E3035;--primary:#D4D8DD;--on-primary:#111214;--primary-soft:#2B2E33;--primary-text:#E3E6EA;--in:#3FD178;--in-soft:#143A26;--out:#FF8A66;--out-soft:#3F2219;--in-v:#3FD178;--exp-v:#FFA040;--out-v:#FF8A66;--dayhd:#2B2E33}}
:root[data-pal=grafit][data-theme=dark]{--bg:#111214;--card:#1B1C1F;--card2:#25272B;--text:#F1F2F3;--muted:#A4A8AE;--faint:#8C9095;--line:#2E3035;--primary:#D4D8DD;--on-primary:#111214;--primary-soft:#2B2E33;--primary-text:#E3E6EA;--in:#3FD178;--in-soft:#143A26;--out:#FF8A66;--out-soft:#3F2219;--in-v:#3FD178;--exp-v:#FFA040;--out-v:#FF8A66;--dayhd:#2B2E33}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;background:var(--bg);color:var(--text);font-size:0.875rem;line-height:1.4}
html{font-size:calc(16px * var(--dt,1))}
html,body{height:100%;overflow:hidden;overscroll-behavior:none}
body{position:fixed;inset:0;width:100%}
#main{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;padding-top:var(--safe-t);padding-bottom:calc(76px + var(--safe-b))}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
button:disabled{opacity:.3}
.wrap{max-width:560px;margin:0 auto;padding:6px 16px 28px}
h1{font-size:1.0625rem;font-weight:600;margin:0;text-align:center}
h2{font-size:0.9375rem;font-weight:600;margin:0}
.sub{color:var(--muted);font-size:0.875rem}
.tiny{font-size:0.75rem;color:var(--muted)}
.num{font-variant-numeric:tabular-nums;white-space:nowrap}
.in{color:var(--in)} .out{color:var(--out)} .exp{color:var(--exp)} .num.in,.num.in b{color:var(--in-v)} .num.out,.num.out b{color:var(--out-v)} .num.exp,.num.exp b{color:var(--exp-v)} .muted{color:var(--muted)} .zero{opacity:.45}
.grow{flex:1;min-width:0}
.row{display:flex;align-items:center;gap:10px}
.between{display:flex;align-items:center;justify-content:space-between;gap:10px}
.right{text-align:right}
.card{background:var(--card);border-radius:var(--radius);padding:16px;margin:12px 0}
.card-h{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}
.topbar{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;height:48px}
.iconbtn{border:0;background:transparent;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-size:1.5rem;color:var(--text)}
.iconbtn svg{width:22px;height:22px}
.pnav{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;margin:2px 0 4px}
.plabel{border:0;background:none;font-size:0.9375rem;font-weight:600;text-align:center;padding:8px}
.subtabs{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;border-bottom:1px solid var(--line)}
.subtab{border:0;background:none;padding:11px 4px;font-size:0.875rem;color:var(--faint);font-weight:500;position:relative}
.subtab.on{color:var(--primary)}
.subtab.on:after{content:"";position:absolute;left:12%;right:12%;bottom:-1px;height:3px;border-radius:3px;background:var(--primary)}
.sumrow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;text-align:center;padding:12px 0 14px;position:relative}
.sumrow .l{font-size:0.75rem;color:var(--muted)}
.sumrow .v{font-size:0.9375rem;font-weight:600;font-variant-numeric:tabular-nums}
.fhead{position:sticky;top:0;z-index:6;background:var(--bg);margin:calc(-6px - var(--safe-t)) -16px 0;padding:calc(6px + var(--safe-t)) 16px 0}
.daygrp{margin-top:12px}
.dayhead{position:sticky;top:var(--hh,0px);z-index:4;display:flex;align-items:center;gap:8px;padding:9px 12px;background:var(--dayhd);border-radius:12px}
.dnum{font-size:1.25rem;font-weight:700;line-height:1}
.dow{background:var(--card);color:var(--text);font-size:0.75rem;padding:2px 7px;border-radius:7px;font-weight:600}
.dmy{font-size:0.75rem;color:var(--text);opacity:.7}
.dayhead .num{font-size:0.875rem;font-weight:600;min-width:84px;text-align:right}
.tx{display:grid;grid-template-columns:92px 1fr auto;align-items:center;gap:8px;padding:11px 2px;position:relative;cursor:pointer}
.tx:after{content:"";position:absolute;left:12px;right:12px;bottom:0;height:1px;background:var(--line)}
.tx-c{display:flex;align-items:center;gap:6px;font-size:0.75rem;color:var(--muted);min-width:0}
.tx-c .e{font-size:1.1875rem;flex:none}
.tx-c .l{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.it-t{font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.it-s{font-size:0.75rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tx-a{font-weight:600;font-size:0.875rem}
.item{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}
.item:last-child{border-bottom:0}
.item.tap{cursor:pointer}
.emoji{width:38px;height:38px;border-radius:12px;background:var(--card2);display:grid;place-items:center;font-size:1.25rem;flex:none}
.empty{text-align:center;color:var(--muted);padding:28px 8px}
.seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;background:var(--card2);border:1px solid var(--line);border-radius:12px;padding:3px;gap:3px}
.seg button{border:0;background:transparent;border-radius:9px;padding:8px;font-weight:600;font-size:0.875rem;color:var(--muted)}
.seg button.on{background:var(--card);color:var(--primary);box-shadow:0 1px 2px rgba(30,26,43,.12)}
.btn{border:0;border-radius:14px;padding:13px 16px;font-weight:600;background:var(--primary);color:var(--on-primary);width:100%}
.btn.sec{background:var(--primary-soft);color:var(--primary-text)}
.btn.ghost{background:transparent;color:var(--primary);padding:8px 4px;width:auto}
.btn.danger{background:var(--out-soft);color:var(--out)}
.btn.sm{padding:9px 13px;font-size:0.875rem;width:auto;border-radius:12px}
.btns{display:flex;gap:10px}
.chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.chips::-webkit-scrollbar{display:none}
.chip{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:7px 13px;font-size:0.875rem;white-space:nowrap}
.chip.on{background:var(--primary);color:var(--on-primary);border-color:var(--primary)}
.pill{display:inline-flex;align-items:center;padding:3px 10px;border-radius:999px;font-size:0.75rem;font-weight:600}
.pill.in{background:var(--in-soft);color:var(--in)} .pill.out{background:var(--out-soft);color:var(--out)} .pill.pri{background:var(--primary-soft);color:var(--primary-text)}
.bar{height:9px;border-radius:99px;background:var(--card2);overflow:hidden;position:relative;border:1px solid var(--line)}
.bar>i{position:absolute;inset:0 auto 0 0;background:var(--primary);border-radius:99px}
.bar.over>i{background:var(--out-v)}
.input,select.input{width:100%;border:1px solid var(--line);background:var(--card);border-radius:12px;padding:12px;font-size:1rem;appearance:none;-webkit-appearance:none}
.field{margin:12px 0}
.field label{display:block;font-size:0.75rem;color:var(--muted);margin:0 0 6px 2px}
.big{font-size:1.5rem;font-weight:600;letter-spacing:-.02em}
.mid{font-size:1.125rem;font-weight:600}
.donut{width:100%;max-width:400px;height:auto;display:block;margin:2px auto 6px;touch-action:none;-webkit-tap-highlight-color:transparent;user-select:none}
.donut.nolbl{max-width:150px}
.lblrow{display:flex;justify-content:flex-end;padding:2px 0 0}
.lblsw{display:flex;align-items:center;gap:8px;border:0;background:none;padding:6px 2px;font-size:0.75rem;color:var(--muted)}
.lblsw i{width:36px;height:22px;border-radius:99px;background:var(--line);position:relative;transition:background .18s}
.lblsw i:after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.25);transition:transform .18s}
.lblsw[aria-checked=true] i{background:var(--primary)}
.lblsw[aria-checked=true] i:after{transform:translateX(14px)}
.donut circle,.donut .dl{transition:opacity .12s}
.srow.hl{background:var(--primary-soft);border-radius:10px}
.srow{display:flex;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid var(--line);cursor:pointer}
.srow .pct{min-width:46px;text-align:center;color:#fff;border-radius:8px;padding:4px 0;font-size:0.75rem;font-weight:600}
.srow .e{font-size:1.25rem}
.brow{padding:12px 0;border-bottom:1px solid var(--line)}
.brow .bar{margin:8px 0 6px}
.kv{display:grid;grid-template-columns:1fr auto;gap:6px 12px;font-size:0.875rem}
.kv .k{color:var(--muted)}
.divider{height:1px;background:var(--line);margin:12px 0}
.chart{width:100%;height:auto;display:block;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.chart-read{min-height:20px;line-height:20px;margin-bottom:2px}
/* calendar */
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:0;border-left:1px solid var(--line);border-top:1px solid var(--line);margin-top:8px}
.cal .h{font-size:0.75rem;color:var(--muted);text-align:center;padding:6px 0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--card2)}
.cal button{border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--card);min-height:58px;padding:4px 3px;text-align:left;display:flex;flex-direction:column;gap:1px;font-size:0.6875rem;line-height:1.2;min-width:0;overflow:hidden}
.cal button .d{font-size:0.75rem;font-weight:600;color:var(--text)}
.cal button.off{background:var(--card2);opacity:.5}
.cal button.sel{outline:2px solid var(--primary);outline-offset:-2px}
.cal button.today .d{color:var(--primary)}
/* tabbar + fab */
.tabbar{position:fixed;left:0;right:0;bottom:0;background:color-mix(in srgb,var(--card) 90%,transparent);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-top:1px solid var(--line);padding:6px 4px calc(6px + var(--safe-b));z-index:20}
.tabbar-in{max-width:560px;margin:0 auto;display:grid;grid-template-columns:repeat(5,1fr)}
.tab{border:0;background:none;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:0.6875rem;color:var(--faint);padding:4px 0}
.tab svg{width:24px;height:24px}
.tab.on{color:var(--primary)}
.fab{position:fixed;right:max(16px,calc(50% - 264px));bottom:calc(88px + var(--safe-b));width:58px;height:58px;border-radius:50%;border:0;background:var(--primary);color:var(--on-primary);font-size:2rem;line-height:1;display:grid;place-items:center;box-shadow:0 8px 22px rgba(107,63,160,.4);z-index:19}
.fab[hidden],.tabbar[hidden]{display:none}
/* sheet */
.scrim{position:fixed;inset:0;background:rgba(20,12,35,.4);z-index:40;opacity:0;transition:opacity .2s}
.scrim.show{opacity:1}
.sheet{position:fixed;left:0;right:0;bottom:0;max-height:92vh;max-height:92dvh;display:flex;flex-direction:column;background:var(--bg);border-radius:22px 22px 0 0;z-index:41;transform:translateY(100%);transition:transform .25s ease}
.sheet.tall{height:92vh;height:92dvh}
.sheet.show{transform:none}
.sheet-in{display:flex;flex-direction:column;min-height:0;flex:1;width:100%;max-width:560px;margin:0 auto}
.grab{width:40px;height:5px;border-radius:9px;background:var(--line);margin:8px auto 4px;flex:none}
.sheet-head{display:grid;grid-template-columns:70px 1fr 70px;align-items:center;padding:2px 12px 6px;flex:none}
.sheet-head h2{text-align:center;font-size:0.9375rem}
.sheet-head .btn:last-child{text-align:right}
.sheet-body{overflow-y:auto;flex:1;min-height:0;padding:4px 16px calc(20px + var(--safe-b));-webkit-overflow-scrolling:touch}
.frow{display:grid;grid-template-columns:82px 1fr;align-items:center;gap:8px;border-bottom:1px solid var(--line);padding:10px 2px;min-height:54px}
.frow>label{font-size:0.875rem;color:var(--muted)}
.frow .plain,.frow select.plain{border:0;background:transparent;font-size:1rem;width:100%;outline:none;padding:4px 0;appearance:none;-webkit-appearance:none}
.frow .amt{font-size:1.5rem;font-weight:600;font-variant-numeric:tabular-nums;min-height:34px;line-height:1.2;word-break:break-all}
.frow .amt small{display:block;font-size:0.75rem;font-weight:500;color:var(--muted)}
.frow.activ{border-bottom:2px solid var(--primary)}
.grp-t{font-size:0.75rem;color:var(--muted);margin:14px 2px 8px}
.catgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.cat{border:1px solid var(--line);background:var(--card);border-radius:14px;padding:8px 3px;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:0.6875rem;line-height:1.2;text-align:center;min-height:68px;overflow:hidden}
.cat .e{font-size:1.375rem}
.cat.on{border-color:var(--primary);background:var(--primary-soft);color:var(--primary-text)}
.keypad{flex:none;background:var(--card);border-top:1px solid var(--line);padding:6px 8px calc(8px + var(--safe-b))}
.keypad[hidden]{display:none}
.kgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.kgrid button{border:0;background:var(--card2);border-radius:12px;height:50px;font-size:1.375rem;font-weight:500}
.kgrid button.op{background:var(--primary-soft);color:var(--primary-text)}
.kgrid button.ok{grid-column:1/-1;background:var(--primary);color:var(--on-primary);font-size:1.125rem;font-weight:600;height:48px}
.toast{position:fixed;left:50%;bottom:calc(92px + var(--safe-b));transform:translateX(-50%) translateY(20px);background:var(--text);color:var(--bg);padding:10px 16px;border-radius:12px;font-size:0.875rem;opacity:0;transition:all .25s;z-index:60;pointer-events:none;max-width:90vw}
.toast.show{opacity:1;transform:translateX(-50%)}
.switch{position:relative;width:46px;height:28px;flex:none}
.switch input{opacity:0;width:0;height:0}
.switch span{position:absolute;inset:0;background:var(--line);border-radius:99px;transition:.2s}
.switch span:before{content:"";position:absolute;width:22px;height:22px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s}
.switch input:checked+span{background:var(--primary)}
.switch input:checked+span:before{transform:translateX(18px)}
.recon-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}
.recon-row .input{width:150px;text-align:right;padding:9px 10px}
.recon-row .it-t{white-space:normal;line-height:1.25}
.welcome{text-align:center;padding:40px 12px}
.welcome .logo{width:84px;height:84px;border-radius:22px;margin:0 auto 14px;display:block}
.deltas{font-size:0.75rem}
.deltas.up{color:var(--in)} .deltas.dn{color:var(--out)}
.more-row{display:flex;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid var(--line);cursor:pointer}
.more-row:last-child{border-bottom:0}
.more-row .grow b{font-weight:600}
.chev{color:var(--faint)}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:0.75rem;color:var(--muted);margin-top:6px}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}

/* kunci aplikasi */
.lockscr{position:fixed;inset:0;z-index:100;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:calc(var(--safe-t) + 48px) 24px calc(var(--safe-b) + 24px)}
.lockscr.cover{justify-content:center}
.lk-top{text-align:center}
.lk-logo{width:68px;height:68px;border-radius:16px;display:block;margin:0 auto 18px}
.lk-title{font-size:1.0625rem;font-weight:600}
.lk-msg{min-height:22px;margin-top:6px;font-size:0.875rem;color:var(--out)}
.lk-dots{display:flex;gap:14px;justify-content:center;margin-top:14px}
.lk-dots i{width:14px;height:14px;border-radius:50%;border:2px solid var(--primary);transition:background .1s}
.lk-dots i.on{background:var(--primary)}
.lk-pad{display:grid;grid-template-columns:repeat(3,76px);gap:14px 22px;justify-content:center}
.lk-pad button{width:76px;height:76px;border-radius:50%;border:0;background:var(--card);font-size:1.75rem;font-weight:500;color:var(--text);display:grid;place-items:center;box-shadow:0 1px 0 var(--line);-webkit-user-select:none;user-select:none}
.lk-pad button:active{background:var(--primary-soft)}
.lk-pad button.ghost{background:none;box-shadow:none;font-size:1.625rem;color:var(--muted)}
.lk-pad button svg{width:30px;height:30px}
.lk-pad button[hidden]{display:block;visibility:hidden}
.lk-foot{min-height:30px;display:flex;gap:24px;align-items:center}
.lk-link{border:0;background:none;color:var(--primary);font-size:0.875rem;padding:6px 10px}
.lockscr.shake .lk-dots{animation:lkshake .35s}
@keyframes lkshake{0%,100%{transform:translateX(0)}20%{transform:translateX(-10px)}40%{transform:translateX(10px)}60%{transform:translateX(-7px)}80%{transform:translateX(7px)}}

/* tanpa zoom ganda-ketuk / cubit */
html,body,button,.lockscr,.tabbar,.tab,.card,.item,.more-row{touch-action:manipulation}
.lk-pad button{touch-action:manipulation}

/* geser periode */
.slidehost{position:relative;overflow:hidden}
@supports (overflow:clip){.slidehost{overflow:clip}}

/* pilihan penerapan anggaran */
.opt{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--line);cursor:pointer}
.opt:last-of-type{border-bottom:0}
.opt input{margin-top:3px;width:18px;height:18px;accent-color:var(--primary);flex:none}
.opt.sm{padding:6px 0;border:0;gap:10px;font-size:0.875rem}
.opt.sm input{width:17px;height:17px}
#bPick[hidden]{display:none}
#bPick{padding:2px 0 6px 30px}
.dlg-scrim{position:fixed;inset:0;z-index:70;background:rgba(20,12,35,.45);display:flex;align-items:center;justify-content:center;padding:20px}
.dlg{background:var(--bg);border-radius:20px;padding:18px 18px 14px;width:100%;max-width:420px;max-height:86vh;max-height:86dvh;display:flex;flex-direction:column}
.dlg-body{overflow-y:auto;flex:1;min-height:0;-webkit-overflow-scrolling:touch}
.dlg h3{font-size:0.9375rem;margin-bottom:2px}
.dlg-btns{display:flex;gap:10px;margin-top:12px;flex:none}.dlg-btns .btn{flex:1}

/* panduan pertama kali */
.wz{padding-bottom:calc(24px + var(--safe-b))}
.wz h1{font-size:1.5625rem;margin:6px 0 6px}
.wz-dots{display:flex;gap:6px;justify-content:center;margin:6px 0 14px}
.wz-dots i{width:22px;height:5px;border-radius:3px;background:var(--line)}
.wz-dots i.done{background:var(--primary);opacity:.45}.wz-dots i.on{background:var(--primary)}
.wz-nav{display:flex;gap:10px;justify-content:space-between;position:sticky;bottom:0;padding:12px 0 calc(8px + var(--safe-b));margin-top:14px;background:linear-gradient(to top,var(--bg) 70%,transparent)}
.wz-nav .btn{flex:1}
.wz-chips{display:flex;flex-wrap:wrap;gap:8px}
.wz-add{display:flex;gap:8px;margin-top:12px}.wz-add .input{flex:1;min-width:0}.wz-add .btn{width:auto;padding:0 16px}
.wz-acc{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;margin-bottom:8px;align-items:center}
.wz-acc .input{min-width:0}
.wz-acc:not(:has([data-ad])){grid-template-columns:1fr 1fr}

/* ---------- Rumah ---------- */
.hnote{margin-top:10px;padding:8px 12px;border-radius:10px;background:var(--primary-soft);color:var(--primary-text);font-size:0.75rem}
.hwarn{border:1.5px solid var(--primary)}
.hact{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}
.hact .btn{padding:12px 8px}
.hact .btn:only-child{grid-column:1/-1;padding:13px 16px}
.hact .btn.big{padding:16px 8px;font-size:1.0625rem}
.hsub{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:-2px 0 12px}
.hsub .btn{width:auto;padding:8px 14px;font-size:0.75rem}
.hrow{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:10px;padding:10px 0;position:relative;cursor:pointer}
.hrow+.hrow:before{content:"";position:absolute;top:0;left:12px;right:12px;height:1px;background:var(--line)}
.hum{padding:10px 0;position:relative}
.hum+.hum:before{content:"";position:absolute;top:0;left:12px;right:12px;height:1px;background:var(--line)}
.hbtns{display:flex;gap:8px;margin-top:8px}
.hbtns .btn{width:auto;flex:1;padding:8px 6px;font-size:0.75rem}
.hbtns .btn.ghost{flex:.7}
.chk{display:flex;align-items:center;gap:8px;font-size:0.875rem;margin:6px 2px 10px}
.chk input{width:18px;height:18px;accent-color:var(--primary)}

.recon-wrap{border-bottom:1px solid var(--line);padding-bottom:10px}
.recon-wrap .recon-row{border-bottom:0;padding-bottom:6px}
.locrow{display:flex;align-items:center;gap:8px;padding-left:2px}
.locpin{font-size:0.875rem}
.input.loc{flex:1;width:auto;text-align:left;font-size:0.875rem;padding:8px 10px}
.locnote{margin:3px 0 0 26px;color:var(--faint)}

.remrow{padding:8px 0;border-top:1px solid var(--line)}
.remrow:first-of-type{border-top:0}

.palgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}
.pal{border:2px solid var(--line);background:var(--card2);border-radius:14px;padding:10px 8px 9px;text-align:center}
.pal.on{border-color:var(--primary)}
.pal .sw{height:44px;border-radius:9px;display:flex;align-items:flex-end;justify-content:center;gap:5px;padding-bottom:7px;margin-bottom:7px;border:1px solid rgba(0,0,0,.08)}
.pal .sw i{width:13px;height:13px;border-radius:50%;display:block}
.pal b{display:block;font-size:0.875rem}
.pal span{display:block;font-size:0.6875rem;color:var(--muted);line-height:1.25;margin-top:2px}

.bar.lv1>i{opacity:.28}.bar.lv2>i{opacity:.42}.bar.lv3>i{opacity:.56}.bar.lv4>i{opacity:.7}.bar.lv5>i{opacity:.85}
.rcard .remrow{display:flex;align-items:center;gap:10px;padding:8px 0}
.rc-t{flex:1;min-width:0}.rc-t .it-t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rc-b{display:flex;gap:6px;flex:none}
.remmore{display:block;width:100%;background:none;border:0;border-top:1px solid var(--line);color:var(--primary);font:inherit;font-size:0.75rem;font-weight:600;padding:9px 0 2px;cursor:pointer}
.rc-t .tiny{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.viewseg{width:100%;max-width:250px;margin:0 auto}.viewseg button{padding:7px 4px;font-size:0.75rem}
.plabel:after{content:" ▾";font-size:0.75rem;color:var(--faint)}
.pcard{cursor:pointer;margin:8px 0;padding:14px}.pcard.cur{border:1.5px solid var(--primary)}
.ilm{position:relative;padding:0;overflow:hidden;margin:10px 0;cursor:pointer}
.ilm.past{opacity:.6}
.ilm-img{position:relative;background:var(--card2);aspect-ratio:16/9;overflow:hidden}.ilm-img img{width:100%;height:100%;object-fit:cover;display:block}
.ilm-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:46px;height:46px;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;display:grid;place-items:center;font-size:1.125rem;padding-left:3px}
.ilm-b{padding:12px 48px 14px 16px}
.ilm-meta{display:flex;align-items:center;gap:8px;margin-bottom:6px}.ilm-host{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ilm-t{font-size:1rem;line-height:1.3}.ilm-d{margin-top:4px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ilm-e{position:absolute;right:4px;bottom:4px;color:var(--faint)}
.ilm-meta .pill{padding-left:0;background:none}

.ilsi{display:grid;place-items:center;color:var(--faint)}.ilsi svg{width:18px;height:18px}
.ilflt{pointer-events:auto;border:0;background:var(--card2);color:var(--muted);border-radius:16px;padding:7px 11px;font-size:0.75rem;font-weight:600;white-space:nowrap}
.ilflt.on{background:var(--primary);color:var(--on-primary)}

.wrap.padb,.wrap:has(.viewdock){padding-bottom:132px}
.viewdock{position:fixed;left:max(16px,calc(50% - 280px));right:calc(max(16px,calc(50% - 280px)) + 68px);bottom:calc(84px + var(--safe-b));z-index:5}
.dockbar{display:flex;align-items:center;height:56px;padding:4px;border-radius:28px;background:color-mix(in srgb,var(--card) 94%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--line);box-shadow:0 6px 18px rgba(30,26,43,.2)}
.dockgap{display:none}
.dockbar .seg{flex:1;min-width:0;border:0;background:transparent;padding:0;gap:2px;margin:0;width:auto;max-width:none}
.dockbar .seg button{min-height:44px;padding:0 2px;font-size:0.75rem;border-radius:22px}
.dockbar .seg button.on{background:var(--primary-soft);color:var(--primary-text);box-shadow:none}
.hasdock .fab{width:56px;height:56px;padding:0;box-shadow:0 8px 22px rgba(107,63,160,.4);bottom:calc(84px + var(--safe-b));right:max(16px,calc(50% - 280px));z-index:6}
.hasdock .viewdock .fab{position:fixed}
.ilsrch{flex:1;min-width:0;display:flex;align-items:center;gap:6px;height:44px;padding:0 4px 0 12px}
.ilsrch input{flex:1;min-width:0;border:0;background:transparent;outline:0;font-size:1rem;height:100%}
.ilsrch input::-webkit-search-cancel-button{display:none}
.srow .it-t{white-space:normal;overflow:visible;line-height:1.25;overflow-wrap:anywhere}.srow .num{flex:none}
.freq{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.moreopt{margin-top:14px;border-top:1px solid var(--line);padding-top:10px}.moreopt summary{font-size:0.875rem;color:var(--primary-text);font-weight:600;cursor:pointer;min-height:44px;display:flex;align-items:center}
.toast.act{pointer-events:auto;display:flex;align-items:center;gap:14px;padding:6px 8px 6px 16px}.tundo{border:0;background:color-mix(in srgb,var(--bg) 18%,transparent);color:var(--bg);font-weight:600;border-radius:9px;padding:9px 12px;font-size:0.875rem;min-height:40px}
.tipcard{display:flex;align-items:center;gap:10px;margin:8px 0;padding:10px 12px;border-radius:14px;background:var(--primary-soft);color:var(--primary-text);font-size:0.75rem;line-height:1.35}.tipcard button{flex:none;border:0;background:var(--primary);color:var(--on-primary);border-radius:10px;padding:0 12px;min-height:44px;font-weight:600;font-size:0.75rem}
.freq .cat{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:0;padding:8px 4px}.freq .cat .e{display:block}

.kpace{display:flex;gap:8px;margin:10px 0 4px}.kp{flex:1;background:var(--card2);border-radius:14px;padding:10px 12px}.kp span{display:block;font-size:0.75rem;color:var(--muted)}.kp b{display:block;font-size:1.125rem;font-weight:600;margin-top:2px}.kp.bad{background:var(--out-soft)}.kp.bad b,.kp.bad span{color:var(--out)}
.nobar .dockbar{display:none}
.ilrow{display:flex;gap:6px;align-items:center;margin-bottom:6px}.ilrow .input{flex:1;min-width:0}
.ill{text-decoration:none;color:inherit}.ill-u{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fab svg{width:26px;height:26px;display:block}
.nobar .dockbar{display:none}
.ilrc{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.ilgrip{flex:none;border:0;background:transparent;color:var(--faint);font-size:1.25rem;letter-spacing:-3px;width:30px;height:44px;touch-action:none;cursor:grab}.ilrow.drag{background:var(--primary-soft);border-radius:12px}
.hamt{text-align:right;flex:none}.hdate{white-space:nowrap}
/* kartu pengingat: lebih ringkas secara vertikal */
.card.rcard{padding:8px 14px;margin:8px 0}
.rcard .between{min-height:0}
.rcard .between .it-t{font-size:0.875rem}
.rcard .between .btn.sm{padding:4px 8px;font-size:0.75rem;border-radius:10px}
.rcard .remrow{padding:5px 0;gap:8px}
.rcard .rc-b .btn.sm{padding:6px 12px;font-size:0.75rem;border-radius:10px}
.rcard .rc-t .it-t{line-height:1.25}
.rcard .remmore{padding:6px 0 0;margin-top:2px}
.ill-by,.iltrail{color:var(--faint);margin-top:2px}
.iltrail{margin:0 0 12px;line-height:1.5}
.ilgrip{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
/* kartu pengingat v2: ritme vertikal seragam (judul, baris, tombol, "lainnya") */
.card.rcard{padding:4px 13px;margin:8px 0}
.rcard .between{min-height:38px;align-items:center}
.rcard .between .btn.sm{padding:6px 4px;font-size:0.875rem;min-height:32px}
.rcard .remrow{padding:9px 0;gap:8px;min-height:54px}
.rcard .rc-b .btn.sm{padding:0 14px;min-height:34px;font-size:0.875rem;border-radius:11px;display:inline-flex;align-items:center;justify-content:center}
.rcard .remmore{padding:0;margin:0;min-height:38px;display:flex;align-items:center;justify-content:center}
.rcard .rc-b .btn.ghost{padding:0 10px;margin-right:-10px}
.rhint{margin:-4px 0 10px 44px;padding:8px 10px;background:var(--primary-soft);border-radius:10px;line-height:1.45;color:var(--text)}
.rhint div{margin-top:3px}
#aTx .it-s{white-space:normal}
.vsg{padding:9px 0;border-top:1px solid var(--line)}
.vsl{font-size:0.875rem;line-height:1.3;padding-right:10px}
.vsi{display:flex;justify-content:space-between;gap:10px;font-size:0.75rem;color:var(--muted);padding:3px 0 0 10px}
.vsi.tap{cursor:pointer}
.vsd{margin-top:6px;padding-top:8px;border-top:1px solid var(--line)}
.vsbanner{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;margin:8px 0;padding:10px 14px;border:1px solid var(--out);background:var(--out-soft);color:var(--text);border-radius:14px;font:inherit;font-size:0.875rem;text-align:left;line-height:1.35;cursor:pointer}
.vsbanner .chev{color:var(--out);font-size:1.25rem}

.accsl{margin:0 -16px;padding-bottom:4px}
.acctrack{position:relative;display:flex;gap:8px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;padding:2px 16px 4px;scroll-padding:0 16px;scrollbar-width:none;overscroll-behavior-x:contain}
.acctrack::-webkit-scrollbar{display:none}
.accc{flex:0 0 calc((100% - 8px) / 2);min-width:0;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:9px 12px;cursor:pointer;transition:border-color .15s}
.accc:nth-child(odd){scroll-snap-align:start}
.accc.sel{border-color:var(--primary);box-shadow:inset 0 0 0 .5px var(--primary)}
.accc span{display:block;font-size:0.75rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.accc b{display:block;font-size:0.9375rem;font-weight:600;margin-top:1px;white-space:nowrap;font-variant-numeric:tabular-nums}
.accdots{display:flex;justify-content:center}
.accdots i{display:flex;align-items:center;padding:0 4px;height:18px;cursor:pointer}
.accdots i::after{content:'';width:5px;height:5px;border-radius:3px;background:var(--muted);opacity:.35;transition:width .15s,opacity .15s}
.accdots i.on::after{width:14px;opacity:1;background:var(--text)}
.accdet{margin:4px 16px 4px;padding:2px 14px}
.accdet .between{padding:8px 0 2px}
[data-acc] .it-s{white-space:normal;overflow:visible;line-height:1.3}
.item .num b,.item b.num{font-weight:500}
.sumrow .v{font-size:0.875rem}
.brow .out,.big.out,.deltas.dn{color:var(--out-v)} .deltas.up{color:var(--in-v)}
.fhead.stk{padding-bottom:2px}.fhead.stk .card{margin:10px 0 8px}.fhead.stk .hact{margin:8px 0 4px}.fhead.stk .hsub{margin:0 0 6px}
.fold{overflow:hidden}
#main{overflow-anchor:none}
#main{scroll-padding-bottom:84px}
.fhead .bsum{margin:10px 0 0}.fhead:has(>.bsum){padding-bottom:12px}.fhead:has(>.bsum)+.slidehost #slide>.card:first-child{margin-top:0}

/* kartu insight keuangan (tab Ilmu) */
.inscard{margin:10px 0 4px}
.inscard.card{padding:14px 16px}
.inshead{display:flex;align-items:baseline;justify-content:space-between;margin:0 2px 8px}
.inshead b{font-size:0.9375rem}
.instrack{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px;scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.instrack::-webkit-scrollbar{display:none}
.insslide{flex:0 0 100%;scroll-snap-align:center;scroll-snap-stop:always;box-sizing:border-box;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px 16px;display:flex;flex-direction:column;gap:8px}
.insmeta{display:flex;align-items:center;gap:8px}
.inschip{font-size:0.6875rem;font-weight:700;padding:2px 8px;border-radius:99px;background:var(--primary-soft);color:var(--primary-text)}
.inschip.gl{background:var(--in-soft);color:var(--in)}
.institle{font-weight:700;font-size:1rem;line-height:1.3}
.inssum{font-size:0.8125rem;line-height:1.45;color:var(--muted)}
.insbox{font-size:0.8125rem;line-height:1.45;background:var(--primary-soft);border-radius:12px;padding:9px 11px;color:var(--text)}
.inslink{font-size:0.8125rem;font-weight:700;color:var(--primary-text);text-decoration:none;align-self:flex-start}
.insdots{display:flex;justify-content:center;gap:6px;margin-top:8px}
.insdots i{width:6px;height:6px;border-radius:50%;background:var(--faint);opacity:.5;transition:all .2s}
.insdots i.on{background:var(--primary);opacity:1;width:16px;border-radius:3px}

/* v69 */
.curBtn .curg{font-weight:800;font-size:0.9375rem;letter-spacing:-.02em;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--primary-soft);color:var(--primary-text)}
.ilsec{font-size:0.9375rem;font-weight:700;margin:18px 2px 8px}
.insslide{padding-bottom:14px}.inslink{margin-top:auto;border:0;background:none;padding:0;font:inherit;font-size:0.8125rem;font-weight:700;color:var(--primary-text);cursor:pointer}
.insslide .insbox{margin-bottom:2px}
.insdet p{font-size:0.9063rem;line-height:1.55;margin:10px 0}
.insdet ul{margin:6px 0 10px;padding-left:20px;font-size:0.9063rem;line-height:1.5}.insdet li{margin:4px 0}
.insdt{font-size:1.125rem;line-height:1.3;margin:10px 0 4px}
.insdh{font-weight:700;font-size:0.8125rem;margin-top:12px;color:var(--muted)}
.hsub{gap:10px}.hsub .btn{min-width:150px}
.hcek{text-align:center;margin:-4px 0 10px}.linkbtn{border:0;background:none;color:var(--primary-text);font-weight:600;font-size:0.75rem;padding:4px 8px}
.vsok{display:flex;align-items:flex-start;gap:10px;margin-top:8px;font-weight:600;line-height:1.35}
.vsic{flex:0 0 auto;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:0.875rem;font-weight:800;color:#fff;margin-top:1px}
.vsic.ok{background:var(--in-v)}.vsic.no{background:var(--out-v)}
html.fout body{opacity:0;transition:opacity .25s ease}
html.fin body{opacity:0}
body{transition:opacity .3s ease}

/* v70 */
.sheet.tall.half{height:52vh;height:52dvh}
.insslide{gap:0}
.insslide .insmeta{margin-bottom:8px}
.insslide .fold>.inssum,.insslide .fold>.insbox{margin-top:8px}
.inshead.fold{padding-bottom:8px;margin-bottom:0}
.inscard .inslink{margin-top:auto;padding-top:10px}

.fhead.stk .inscard{margin:6px 0 0}

.inssrcs{display:flex;flex-direction:column;gap:8px;margin:8px 0 4px}
.inssrc{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border:1px solid var(--line);background:var(--card);border-radius:12px;text-decoration:none;color:var(--text);font-size:0.8125rem}
.inssrc b{color:var(--primary-text);font-size:0.8125rem}
.inssrc span{color:var(--muted);line-height:1.35}
.fhead.stk .hsub{margin:0 0 -2px}
/* Dana darurat: kotak berwarna + lencana kelipatan pengeluaran bulanan */
.efund{display:flex;align-items:center;gap:10px;margin:10px 0 0;padding:10px 12px;border-radius:12px;background:var(--card2)}
.efund .grow{min-width:0}.efund b.num{display:block;font-size:1.0625rem}
.efund.ef-r{background:color-mix(in srgb,var(--out-v) 12%,var(--card))}
.efund.ef-o{background:color-mix(in srgb,var(--exp-v) 13%,var(--card))}
.efund.ef-g{background:color-mix(in srgb,var(--in-v) 13%,var(--card))}
.efbadge{flex:none;text-align:center;border-radius:10px;padding:4px 10px;line-height:1.2;border:1px solid currentColor;background:color-mix(in srgb,currentColor 12%,transparent)}
.efbadge b{display:block;font-size:1rem}.efbadge span{display:block;font-size:.6875rem;font-weight:600}
.ef-r .efbadge{color:var(--out)}.ef-o .efbadge{color:var(--exp)}.ef-g .efbadge{color:var(--in)}

/* v72: judul Note menempel di header; ikon link; panah urut; isi Note */
.fhead.stk .ilsec{margin:12px 2px 0;padding-bottom:8px}
.fhead.stk .insdots{padding-top:8px}
.ilic{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:6px;color:#fff;font-size:.6875rem;font-weight:800;margin-right:6px;overflow:hidden;vertical-align:middle;line-height:1;flex:none}
.ilic.em{background:none;width:auto;font-size:1rem;color:inherit}
.ilic.fav{background:var(--card2)}.ilic img{width:100%;height:100%;object-fit:cover;display:block}
.ilm-meta .pill{align-items:center}
.ilmv{flex:none;display:flex;flex-direction:column;gap:4px}
.ilmv button{width:34px;height:34px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--primary-text);font-size:1.0625rem;font-weight:700;line-height:1;display:grid;place-items:center;padding:0}
.ilmv button:disabled{opacity:.3}
.ilrow{align-items:center}
.notetxt{white-space:pre-wrap;margin:0 0 10px}
.inssrc.ilnl{display:flex;align-items:center;gap:10px}.inssrc.ilnl .ilic{width:28px;height:28px;border-radius:8px;font-size:.875rem;margin-right:0}

/* grafik masuk/keluar di pop up periode */
.flowbox{padding:12px 14px 8px;margin-bottom:12px}
.flow-leg{display:flex;gap:14px;margin-bottom:4px}.flow-leg i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.flow-read{min-height:20px}
.fhead.stk:has(#newRec){padding-bottom:0}.fhead.stk:has(#newRec)>.card{margin-bottom:0}
