:root{--tinta: #14161f;--tinta-2: #444a63;--tinta-3: #7c8199;--kertas: #eeece4;--kartu: #ffffff;--garis: #dbd8cc;--garis-kuat: #c2bdad;--merah: #c3234b;--hijau: #0e7c5a;--biru: #1e5fa8;--ungu: #6b4e9e;--cokelat: #8a5a2b;--kuning: #b8860b;--sorot: #f6efd8;--radius: 10px;--tape: 620px;--display: "Bricolage Grotesque", ui-sans-serif, system-ui, sans-serif;--teks: "Archivo", ui-sans-serif, system-ui, sans-serif;--angka: "JetBrains Mono", ui-monospace, monospace}@media (prefers-color-scheme: dark){:root{--tinta: #eceadf;--tinta-2: #a8adc2;--tinta-3: #797f96;--kertas: #101219;--kartu: #191c26;--garis: #2b2f3d;--garis-kuat: #3d4356;--merah: #f2708f;--hijau: #45c69b;--biru: #79b0ec;--ungu: #ab90dd;--cokelat: #cd9a63;--kuning: #e0b64a;--sorot: #262032}}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--kertas);color:var(--tinta);font-family:var(--teks);font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer;border:none;background:none}:focus-visible{outline:2px solid var(--biru);outline-offset:2px;border-radius:4px}.mono{font-family:var(--angka);font-variant-numeric:tabular-nums}.app{display:grid;grid-template-columns:236px 1fr;height:100%}.rail{background:var(--tinta);color:var(--kertas);padding:26px 18px;display:flex;flex-direction:column;gap:26px}@media (prefers-color-scheme: dark){.rail{background:#0a0c12;color:var(--tinta)}}.merek{font-family:var(--display);font-weight:700;font-size:21px;letter-spacing:-.02em;line-height:1.1}.merek span{display:block;font-family:var(--teks);font-size:11px;font-weight:400;opacity:.55;letter-spacing:.08em;text-transform:uppercase;margin-top:6px}.nav{display:flex;flex-direction:column;gap:2px}.nav button{text-align:left;padding:9px 12px;border-radius:8px;color:inherit;opacity:.62;font-size:14.5px;display:flex;justify-content:space-between;align-items:center;transition:opacity .15s,background .15s}.nav button:hover{opacity:.9}.nav button[aria-current=true]{opacity:1;background:#ffffff17;font-weight:600}.nav button small{font-family:var(--angka);font-size:11px;opacity:.5}.saldo-rail{margin-top:auto}.saldo-rail dt{font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.5}.saldo-rail dd{margin:4px 0 0;font-family:var(--angka);font-weight:500;font-size:25px;letter-spacing:-.03em}.utama{overflow-y:auto;display:flex;flex-direction:column}.kepala{padding:30px 30px 16px;max-width:calc(var(--tape) + 160px);width:100%;margin:0 auto}.kepala h1{font-family:var(--display);font-weight:700;font-size:27px;letter-spacing:-.025em;margin:0}.kepala p{margin:4px 0 0;color:var(--tinta-2);font-size:14px}.pita-bungkus{flex:1;padding:0 30px 150px;max-width:calc(var(--tape) + 160px);width:100%;margin:0 auto}.pita{background:var(--kartu);border-left:1px solid var(--garis);border-right:1px solid var(--garis);position:relative;-webkit-mask-image:radial-gradient(circle at 0 5px,transparent 3.5px,#000 3.6px),radial-gradient(circle at 100% 5px,transparent 3.5px,#000 3.6px);-webkit-mask-size:100% 10px;mask-image:radial-gradient(circle at 0 5px,transparent 3.5px,#000 3.6px),radial-gradient(circle at 100% 5px,transparent 3.5px,#000 3.6px);mask-size:100% 10px}.pita-kosong{padding:54px 26px;text-align:center;color:var(--tinta-2)}.pita-kosong strong{display:block;font-family:var(--display);font-size:17px;color:var(--tinta);margin-bottom:6px}.contoh{display:flex;flex-wrap:wrap;gap:7px;justify-content:center;margin-top:16px}.contoh button{font-family:var(--angka);font-size:12.5px;padding:5px 11px;border:1px dashed var(--garis-kuat);border-radius:100px;color:var(--tinta-2)}.contoh button:hover{border-style:solid;color:var(--tinta)}.hari{display:flex;align-items:center;gap:12px;padding:16px 22px 6px;font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--tinta-3)}.hari:after{content:"";flex:1;height:1px;background:var(--garis)}.baris{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:baseline;padding:11px 22px;border-bottom:1px dotted var(--garis);position:relative}.baris:hover{background:var(--sorot)}.baris:hover .aksi-baris{opacity:1}.baris-baru{animation:cetak .36s cubic-bezier(.2,.7,.3,1)}@keyframes cetak{0%{clip-path:inset(0 0 100% 0);transform:translateY(-5px)}to{clip-path:inset(0 0 0 0);transform:none}}@media (prefers-reduced-motion: reduce){.baris-baru{animation:none}}.baris .label{font-size:14.5px}.baris .meta{display:flex;gap:8px;align-items:center;font-size:11.5px;color:var(--tinta-3);margin-top:2px}.tanda{display:inline-block;width:7px;height:7px;border-radius:2px;flex:none}.nominal{font-family:var(--angka);font-weight:500;font-size:15px;letter-spacing:-.02em;white-space:nowrap}.nominal.keluar{color:var(--merah)}.nominal.masuk{color:var(--hijau)}.aksi-baris{position:absolute;right:22px;bottom:-9px;display:flex;gap:4px;opacity:0;transition:opacity .15s}.aksi-baris button{font-size:11px;padding:2px 8px;border-radius:99px;background:var(--kartu);border:1px solid var(--garis-kuat);color:var(--tinta-2)}.aksi-baris button:hover{color:var(--merah);border-color:var(--merah)}.total-pita{display:flex;justify-content:space-between;padding:15px 22px 20px;border-top:2px solid var(--tinta);margin-top:-1px;font-family:var(--angka);font-size:14px}.total-pita span:first-child{letter-spacing:.1em;text-transform:uppercase;font-size:11px;font-family:var(--teks);color:var(--tinta-3);align-self:center}.balasan{max-width:92%;margin:14px 22px;padding:11px 15px;background:var(--sorot);border-left:3px solid var(--kuning);border-radius:0 8px 8px 0;font-size:14px}.balasan.galat{background:transparent;border-color:var(--merah);color:var(--merah)}.komposer{position:fixed;bottom:0;left:236px;right:0;padding:14px 30px 22px;background:linear-gradient(to top,var(--kertas) 68%,transparent)}.komposer form{max-width:var(--tape);margin:0 auto;display:flex;gap:8px;align-items:flex-end;background:var(--kartu);border:1px solid var(--garis-kuat);border-radius:12px;padding:7px 7px 7px 15px;box-shadow:0 4px 18px #14161f12}.komposer textarea{flex:1;border:none;resize:none;background:none;padding:8px 0;max-height:120px;font-size:15px}.komposer textarea:focus{outline:none}.komposer textarea::placeholder{color:var(--tinta-3)}.ikon{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;color:var(--tinta-2);flex:none}.ikon:hover{background:var(--sorot);color:var(--tinta)}.kirim{background:var(--tinta);color:var(--kertas)}.kirim:hover{background:var(--tinta);opacity:.85;color:var(--kertas)}.kirim:disabled{opacity:.3;cursor:not-allowed}@media (prefers-color-scheme: dark){.kirim{background:var(--hijau);color:#08120e}}.lampiran{max-width:var(--tape);margin:0 auto 8px;display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--tinta-2)}.lampiran img{height:42px;border-radius:6px;border:1px solid var(--garis)}.kartu-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-bottom:22px}.kartu{background:var(--kartu);border:1px solid var(--garis);border-radius:var(--radius);padding:16px 18px}.kartu dt{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--tinta-3)}.kartu dd{margin:6px 0 0;font-family:var(--angka);font-weight:500;font-size:23px;letter-spacing:-.03em}.panel{background:var(--kartu);border:1px solid var(--garis);border-radius:var(--radius);padding:18px 20px;margin-bottom:14px}.panel h2{font-family:var(--display);font-size:16px;font-weight:500;margin:0 0 14px}.bar-baris{display:grid;grid-template-columns:104px 1fr 108px;gap:12px;align-items:center;margin-bottom:9px;font-size:13.5px}.bar-alur{height:9px;background:var(--kertas);border-radius:99px;overflow:hidden}.bar-isi{height:100%;border-radius:99px;transition:width .4s}.bar-nilai{text-align:right;font-family:var(--angka);font-size:13px}.anggaran-baris{margin-bottom:15px}.anggaran-kepala{display:flex;justify-content:space-between;align-items:baseline;font-size:13.5px;margin-bottom:5px}.anggaran-sisa{font-family:var(--angka);font-size:12px;color:var(--tinta-3)}.anggaran-sisa.lewat{color:var(--merah);font-weight:500}.anggaran-baris input{width:108px;border:1px solid var(--garis);background:var(--kertas);border-radius:7px;padding:4px 9px;font-family:var(--angka);font-size:12.5px;text-align:right}.alat{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}.alat input[type=search],.alat select{border:1px solid var(--garis);background:var(--kartu);border-radius:8px;padding:7px 11px;font-size:14px}.alat input[type=search]{flex:1;min-width:160px}.tombol{border:1px solid var(--garis-kuat);border-radius:8px;padding:7px 14px;font-size:14px;background:var(--kartu)}.tombol:hover{background:var(--sorot)}.tombol-utama{background:var(--tinta);color:var(--kertas);border-color:var(--tinta)}.tombol-utama:hover{opacity:.88;background:var(--tinta)}.gerbang{min-height:100%;display:grid;place-items:center;padding:30px 20px}.gerbang-kartu{width:100%;max-width:400px;background:var(--kartu);border:1px solid var(--garis);border-radius:14px;padding:34px 30px}.gerbang-kartu h1{font-family:var(--display);font-weight:700;font-size:25px;letter-spacing:-.025em;margin:0 0 6px}.gerbang-kartu p{margin:0 0 22px;color:var(--tinta-2);font-size:14px}.gerbang-kartu label{display:block;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--tinta-3);margin-bottom:6px}.gerbang-kartu input{width:100%;border:1px solid var(--garis-kuat);border-radius:9px;padding:11px 13px;font-family:var(--angka);font-size:13px;background:var(--kertas);margin-bottom:14px}.gerbang-kartu .tombol-utama{width:100%;padding:11px}.galat-teks{color:var(--merah);font-size:13.5px;margin:0 0 14px}.toast{position:fixed;bottom:96px;left:50%;transform:translate(-50%);background:var(--tinta);color:var(--kertas);padding:9px 16px;border-radius:99px;font-size:13.5px;display:flex;gap:14px;align-items:center;z-index:20}.toast button{color:var(--kuning);font-weight:600;font-size:13px}@media (max-width: 720px){.app{grid-template-columns:1fr;grid-template-rows:1fr auto}.rail{grid-row:2;flex-direction:row;align-items:center;padding:8px 12px;gap:8px;padding-bottom:max(8px,env(safe-area-inset-bottom))}.merek,.saldo-rail{display:none}.nav{flex-direction:row;flex:1}.nav button{flex:1;justify-content:center;font-size:13.5px;padding:9px 6px}.nav button small{display:none}.kepala,.pita-bungkus{padding-left:14px;padding-right:14px}.pita-bungkus{padding-bottom:130px}.komposer{left:0;bottom:62px;padding:10px 14px}.bar-baris{grid-template-columns:84px 1fr 92px}}.periode{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:16px}.periode button{font-size:13px;padding:6px 13px;border-radius:99px;border:1px solid var(--garis);background:var(--kartu);color:var(--tinta-2);transition:background .15s,color .15s}.periode button:hover{border-color:var(--garis-kuat)}.periode button[aria-pressed=true]{background:var(--tinta);border-color:var(--tinta);color:var(--kertas);font-weight:500}@media (prefers-color-scheme: dark){.periode button[aria-pressed=true]{color:#0a0c12}}.delta{font-family:var(--angka);font-size:11.5px;margin-top:5px;letter-spacing:-.01em}.delta.naik{color:var(--merah)}.delta.turun{color:var(--hijau)}.sorotan ul{margin:0;padding-left:18px}.sorotan li{margin-bottom:7px;font-size:14.5px}.sorotan li:last-child{margin-bottom:0}.sorotan li::marker{color:var(--kuning)}.ket{margin:8px 0 0;font-size:12.5px;color:var(--tinta-3)}.proyeksi{margin-bottom:12px}.proyeksi .besar{font-size:27px;font-weight:500;letter-spacing:-.03em;display:block}.proyeksi p{margin:6px 0 0;font-size:13.5px;color:var(--tinta-2);max-width:46ch}.donat-baris{display:flex;gap:22px;align-items:center;flex-wrap:wrap}.donat-daftar{flex:1;min-width:240px}.donat-angka{font-family:var(--angka);font-size:22px;font-weight:500;fill:var(--tinta)}.donat-teks{font-size:10px;fill:var(--tinta-3);letter-spacing:.08em;text-transform:uppercase}.kategori-item{display:grid;grid-template-columns:9px 1fr 40px auto auto;gap:9px;align-items:center;padding:5px 0;border-bottom:1px dotted var(--garis);font-size:13.5px}.kategori-item:last-child{border-bottom:none}.kategori-bagian{color:var(--tinta-3);font-size:12px;text-align:right}.kategori-nilai{font-size:13px}.kategori-item .delta{margin:0;font-size:10.5px;min-width:44px;text-align:right}.sumbu{font-size:10px;fill:var(--tinta-3);font-family:var(--teks)}.sumbu-hari{font-size:11px;color:var(--tinta-3)}.pola{display:flex;gap:6px;align-items:flex-end}.pola-kolom{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px}.pola-alur{width:100%;height:82px;display:flex;align-items:flex-end;background:var(--kertas);border-radius:5px;overflow:hidden}.pola-isi{width:100%;border-radius:5px 5px 0 0;transition:height .4s;min-height:2px}.pola-nilai{font-size:10px;color:var(--tinta-3)}.besar-baris{display:grid;grid-template-columns:22px 1fr auto;gap:11px;align-items:center;padding:9px 0;border-bottom:1px dotted var(--garis)}.besar-baris:last-child{border-bottom:none}.besar-baris .urut{color:var(--tinta-3);font-size:12px}.besar-baris .meta{margin-top:2px}.penanda-laju{position:absolute;top:-3px;width:2px;height:15px;background:var(--tinta);border-radius:1px}.anggaran-baris .bar-alur{position:relative;overflow:visible}.anggaran-baris .bar-isi{border-radius:99px}@media (max-width: 720px){.donat-baris{gap:14px}.kategori-item{grid-template-columns:9px 1fr auto auto;font-size:13px}.kategori-bagian,.pola-nilai{display:none}}