:root{--bg:#f5f6fb;--card:#fff;--ink:#202235;--muted:#7b7f91;--line:#e8e9f1;--primary:#6d5be7;--primary2:#8a79f5;--green:#1fa971;--red:#e05b64;--orange:#f59f43;--sidebar:#242235}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:'DM Sans',sans-serif;color:var(--ink);background:var(--bg)}a{text-decoration:none;color:inherit}.sidebar{position:fixed;inset:0 auto 0 0;width:248px;background:var(--sidebar);color:#fff;padding:24px 18px;display:flex;flex-direction:column;z-index:5}.brand{display:flex;gap:12px;align-items:center;font-weight:700;font-size:18px;padding:0 8px 24px}.brandmark{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:13px;background:linear-gradient(135deg,var(--primary2),#b19cff);color:#fff;font-weight:800;box-shadow:0 8px 24px #6d5be755}.brand small,.user small{display:block;font-weight:400;color:#aaa9ba;font-size:11px;margin-top:2px}.sidebar nav p{font-size:10px;letter-spacing:1.2px;color:#77758c;margin:22px 12px 8px}.sidebar nav a{display:flex;align-items:center;gap:12px;padding:11px 14px;margin:4px 0;border-radius:10px;color:#bdbbca;font-size:14px}.sidebar nav a:hover,.sidebar nav a.active{background:#37344c;color:#fff}.sidebar nav a.active{box-shadow:inset 3px 0 var(--primary2)}.sidebar-foot{margin-top:auto;background:#302e43;color:#aaa9ba;padding:13px;border-radius:10px;font-size:12px}.sidebar-foot strong{color:#fff;float:right}.main{margin-left:248px;min-height:100vh}.main>header{height:86px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 32px;gap:16px}.main header h1{font-size:21px;margin:2px 0}.main header>div>small{color:var(--muted)}.user{display:flex;align-items:center;gap:10px;margin-left:auto}.user>a{font-size:22px;color:var(--muted);padding-left:12px}.avatar{width:38px;height:38px;display:grid;place-items:center;background:#edeafe;color:var(--primary);border-radius:50%;font-weight:700}.menu-btn{display:none;border:0;background:none;font-size:24px}.content{padding:28px 32px;max-width:1500px;margin:auto}.welcome{background:linear-gradient(120deg,#302d50,#51498b);border-radius:18px;color:#fff;padding:24px 28px;display:flex;justify-content:space-between;align-items:center;margin-bottom:22px;overflow:hidden;position:relative}.welcome:after{content:'M5';position:absolute;right:70px;font-size:130px;font-weight:800;opacity:.05}.welcome h2{margin:4px 0;font-size:26px}.welcome p{margin:0;color:#c9c5e4}.eyebrow{font-size:10px;letter-spacing:1.5px;font-weight:700;color:#a89cf4}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px}.stats article,.balance-grid article{background:#fff;border:1px solid var(--line);border-radius:15px;padding:18px;display:flex;gap:14px;align-items:center}.stats article strong{display:block;font-size:20px;margin:4px 0}.stats article small,.stats article div span,.card p{color:var(--muted);font-size:12px}.icon{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;font-weight:700;flex:none}.icon.purple{background:#eeeafe;color:var(--primary)}.icon.green{background:#e7f8f1;color:var(--green)}.icon.blue{background:#e8f2ff;color:#4b8bdd}.icon.orange{background:#fff0df;color:var(--orange)}.grid-2{display:grid;grid-template-columns:1.25fr 1fr;gap:20px}.card{background:#fff;border:1px solid var(--line);border-radius:15px;padding:20px}.card-head,.toolbar{display:flex;align-items:center;justify-content:space-between;gap:15px}.card h3,.toolbar h2{margin:0 0 4px}.card p,.toolbar p{margin:0;color:var(--muted);font-size:13px}.card-head>a{color:var(--primary);font-size:13px;font-weight:600}.legend{color:var(--muted);font-size:11px}.legend i{width:8px;height:8px;background:var(--primary);display:inline-block;border-radius:2px;margin-left:7px}.legend i:nth-of-type(2){background:#f2b462}.chart{height:230px;margin-top:18px;display:flex;align-items:flex-end;gap:12px;padding:10px 4px 25px;border-bottom:1px solid var(--line)}.chart-group{flex:1;height:100%;display:flex;align-items:flex-end;justify-content:center;gap:4px;position:relative}.chart-bar{width:28%;min-width:8px;border-radius:6px 6px 2px 2px;background:var(--primary)}.chart-bar.out{background:#f2b462}.chart-label{position:absolute;bottom:-22px;font-size:10px;color:var(--muted)}.activity>div{display:flex;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid var(--line)}.activity>div:last-child{border:0}.activity p{flex:1;margin:0}.activity p strong,.activity p small{display:block}.activity p strong{font-size:13px;color:var(--ink)}.activity b{font-size:12px}.masuk{color:var(--green)!important}.keluar{color:var(--red)!important}.quick{margin-top:20px;display:flex;align-items:center;gap:10px}.quick>div{margin-right:auto}.quick>a,.btn{border:1px solid var(--line);background:#fff;padding:10px 14px;border-radius:9px;font:600 13px inherit;cursor:pointer}.btn.primary,.quick>a:first-of-type{background:var(--primary);color:#fff;border-color:var(--primary)}.btn.block{width:100%}.toolbar{margin-bottom:18px}.search,input,select{border:1px solid #dfe0e8;border-radius:9px;padding:10px 12px;background:#fff;font:13px inherit;color:var(--ink);outline:none}.search:focus,input:focus,select:focus{border-color:var(--primary);box-shadow:0 0 0 3px #6d5be718}.table-wrap{padding:0;overflow:auto}table{width:100%;border-collapse:collapse;font-size:13px}th{background:#fafafd;color:#777a8c;text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.4px;padding:13px 16px;border-bottom:1px solid var(--line)}td{padding:14px 16px;border-bottom:1px solid var(--line);white-space:nowrap}tbody tr:hover{background:#fbfaff}.num{text-align:right}.badge{display:inline-block;padding:5px 9px;border-radius:20px;font-size:11px;font-weight:700}.badge.success{background:#e4f7ef;color:#17835b}.badge.warning{background:#fff3d9;color:#a36d13}.badge.danger{background:#fde7e9;color:#ba3d47}.badge.secondary{background:#eeeeF3;color:#6f7180}.badge.info{background:#e7efff;color:#406bb3}code{font:11px monospace;color:#665ac0}.empty{text-align:center;color:var(--muted);padding:42px}.alert{padding:12px 14px;border-radius:9px;margin-bottom:14px;font-size:13px}.alert.success{background:#e5f8ef;color:#197953}.alert.danger{background:#fdebed;color:#b63742}.inline-form{display:flex;align-items:end;gap:8px}.inline-form label{font-size:11px;color:var(--muted)}dialog{border:0;border-radius:16px;padding:0;box-shadow:0 24px 80px #1f1d3444;max-width:600px;width:90%}dialog::backdrop{background:#1d1b2f88}.modal-head,.modal-foot{display:flex;justify-content:space-between;align-items:center;padding:20px 22px;border-bottom:1px solid var(--line)}.modal-head h3{margin:0}.modal-head p{margin:4px 0 0;color:var(--muted);font-size:12px}.modal-head button{border:0;background:none;font-size:28px;color:var(--muted);cursor:pointer}.modal-foot{border:0;border-top:1px solid var(--line);justify-content:flex-end}.form-grid{padding:22px;display:grid;grid-template-columns:1fr 1fr;gap:15px}.form-grid label{font-size:12px;font-weight:600}.form-grid input,.form-grid select{display:block;width:100%;margin-top:6px}.span-2{grid-column:span 2}.balance-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.balance-grid h3{margin:3px 0}.balance-grid strong{font-size:20px}.balance-grid .total{grid-column:1/-1;justify-content:space-between;background:#302d50;color:#fff}.report-title{display:flex;gap:14px;align-items:center;margin:14px 0 20px}.report-title h2,.report-title p{margin:2px}.report-title p{color:var(--muted);font-size:13px}.report-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-bottom:18px}.report-summary>div{background:#fff;border:1px solid var(--line);border-radius:13px;padding:18px}.report-summary small,.report-summary strong{display:block}.report-summary small{color:var(--muted);margin-bottom:8px}.report-summary strong{font-size:20px}.cell-sub{display:block;color:var(--muted);margin-top:2px}.signatures{display:flex;justify-content:space-between;text-align:center;padding:40px 10% 20px;font-size:13px}.login-page{display:grid;grid-template-columns:1.1fr .9fr}.login-visual{min-height:100vh;background:linear-gradient(145deg,#242235,#4e4588);color:#fff;padding:44px 7vw;display:flex;flex-direction:column;justify-content:space-between}.login-brand{font-size:20px;font-weight:700;display:flex;align-items:center;gap:12px}.login-visual h1{font-size:46px;max-width:650px;line-height:1.12;margin:16px 0}.login-visual p{color:#c8c4df;max-width:600px;line-height:1.7}.mini-stats{display:flex;gap:12px;margin-top:32px}.mini-stats div{border:1px solid #ffffff22;background:#ffffff0c;border-radius:13px;padding:14px 18px}.mini-stats strong,.mini-stats span{display:block}.mini-stats span{color:#aaa5c5;font-size:11px;margin-top:4px}.login-form{display:grid;place-items:center;padding:30px;background:#fff}.login-form form{width:min(390px,100%)}.login-form h2{font-size:30px;margin:8px 0}.login-form p{color:var(--muted);margin:0 0 26px}.login-form label{display:block;font-size:12px;font-weight:600;margin:14px 0}.login-form input{display:block;width:100%;margin-top:7px;padding:13px}.hint{display:block;color:var(--muted);text-align:center;margin-top:14px}.mobile-brand{display:none}
@media(max-width:1050px){.stats{grid-template-columns:repeat(2,1fr)}.grid-2{grid-template-columns:1fr}.quick{flex-wrap:wrap}.quick>div{width:100%}.balance-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.sidebar{transform:translateX(-100%);transition:.2s}.sidebar.open{transform:none}.main{margin-left:0}.menu-btn{display:block}.main>header{padding:0 18px}.content{padding:20px 14px}.stats,.report-summary,.balance-grid{grid-template-columns:1fr}.welcome>span{display:none}.toolbar{align-items:flex-start;flex-wrap:wrap}.toolbar .search{width:100%}.quick>a{flex:1;text-align:center}.login-page{display:block}.login-visual{display:none}.login-form{min-height:100vh}.mobile-brand{display:block;color:var(--primary);font-weight:700;margin-bottom:40px}.form-grid{grid-template-columns:1fr}.span-2{grid-column:auto}.user>span:nth-child(2){display:none}}@media print{.sidebar,.main>header,.print-hide{display:none!important}.main{margin:0}.content{padding:0}.card{border:0}.report-summary>div{break-inside:avoid}.signatures{display:flex}.badge{border:1px solid #bbb}body{background:#fff}}
.alert{position:relative;overflow:hidden;transition:opacity .3s ease,transform .3s ease,max-height .3s ease,margin .3s ease,padding .3s ease}.alert.notice-active:after{content:"";position:absolute;left:0;bottom:0;width:100%;height:3px;background:currentColor;opacity:.55;transform-origin:left;animation:notice-countdown 3s linear forwards}.alert.notice-leaving{opacity:0;transform:translateY(-7px);max-height:0!important;margin-top:0;margin-bottom:0;padding-top:0;padding-bottom:0}@keyframes notice-countdown{from{transform:scaleX(1)}to{transform:scaleX(0)}}