@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=Inter:wght@400;500;600&family=Plus+Jakarta+Sans:wght@500;700;800&display=swap');
.late-alert{background:#fff0ef!important;border-color:#fecaca!important}.late-alert small{color:#b42318!important}.late-alert strong{color:#b42318!important}
.nav-transaction{position:relative}.nav-transaction i{position:absolute;top:-4px;right:4px;min-width:15px;height:15px;border-radius:50%;background:#b42318;color:#fff;font:700 9px Inter;text-align:center;padding-top:2px;font-style:normal}
.global-pay-card{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:14px;padding:14px;border:1px solid #e7ece9;border-radius:16px;background:#fff}.global-pay-card b,.global-pay-card small{display:block}.global-pay-card small,.global-marketing small{font-size:10px;color:#6b7a75;margin-top:3px}.global-pay-card .primary{padding:9px 12px;font-size:12px}.global-marketing{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;padding:10px 2px;border-bottom:1px solid #e7ece9;font-size:12px}.global-marketing b{font:700 12px 'Plus Jakarta Sans';color:#0a6b47}
.bell{margin-left:auto;position:relative;display:grid;place-items:center;width:36px;height:36px;border:1px solid #e7ece9;border-radius:11px;color:#0a6b47}.bell svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2}.bell i{position:absolute;top:-5px;right:-5px;min-width:15px;height:15px;border-radius:50%;background:#b42318;color:#fff;font:700 9px Inter;text-align:center;padding-top:2px;font-style:normal}.decision{display:flex;gap:8px}.decision>*{flex:1}.reject{border:1px solid #b42318;border-radius:13px;background:#fff;color:#b42318;font-weight:700}.loan-card p{font-size:12px}
:root{--bg:#f4f7f5;--card:#fff;--ink:#101f1a;--muted:#6b7a75;--light:#9aa6a1;--green:#0e8f5f;--dark:#0a6b47;--pale:#e3f5ec;--line:#e7ece9;--red:#b42318}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px Inter,Arial,sans-serif}.phone{max-width:420px;min-height:100vh;margin:auto;padding:20px 18px 96px;background:var(--bg)}header{height:38px;display:flex;align-items:center}.brand{font:800 20px 'Plus Jakarta Sans';color:var(--ink);text-decoration:none}.welcome{margin:18px 0 4px}.welcome small,.section-subtitle{font-size:11px;color:var(--muted)}.welcome h1{font:700 15px 'Plus Jakarta Sans';margin:3px 0}.hero{position:relative;overflow:hidden;margin-top:10px;padding:22px;border-radius:22px;color:#fff;background:linear-gradient(135deg,#0a6b47,#0e8f5f 55%,#2fbe84);box-shadow:0 16px 30px -12px #0a6b4773}.hero>*{position:relative}.hero strong{display:block;font:800 30px 'Plus Jakarta Sans';margin:16px 0 4px}.hero small,.hero-label{font-size:12px;color:#ffffffd9}.hero-actions{display:flex;gap:9px;margin-top:18px}.hero-button{display:flex;justify-content:center;align-items:center;flex:1;background:#fff;color:var(--dark);border-radius:14px;padding:13px;text-decoration:none;font:700 13px 'Plus Jakarta Sans'}.hero-button.ghost{background:#ffffff20;color:#fff;border:1px solid #ffffff55}.hero-link{display:block;color:#fff;margin-top:12px;font-size:12px;font-weight:700;text-decoration:none}.stats,.analytics-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}.stats article,.analytics-cards article,.row,.loan-card,.panel,.chart-card,.financial-summary{border:1px solid var(--line);background:#fff;border-radius:16px}.stats article,.analytics-cards article{padding:14px;text-align:center}.stats small,.loan-card small,.analytics-cards small{display:block;font-size:10px;color:var(--light);margin-top:3px}.stats b,.analytics-cards b{font:700 14px 'Plus Jakarta Sans';display:block;margin-top:4px}.analytics-cards article{min-height:85px;display:flex;flex-direction:column;justify-content:center;text-align:left}.analytics-cards b{font-size:15px}.section-title{display:flex;justify-content:space-between;align-items:center;margin:24px 2px 10px}.section-title h2,h2{font:700 15px 'Plus Jakarta Sans';margin:0}.section-title a,.back{color:var(--green);font-weight:600;text-decoration:none;font-size:12px}.list{display:grid;gap:9px}.row{min-height:64px;display:flex;align-items:center;gap:12px;padding:13px;text-decoration:none;color:var(--ink);transition:transform .18s}.row:active,.loan-card:active{transform:scale(.985)}.row>div{min-width:0;flex:1}.row b,.loan-card b{font:700 13px 'Plus Jakarta Sans'}.row small{display:block;color:var(--light);font:11px 'IBM Plex Mono';margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row i{font-style:normal;color:var(--green);font-size:20px}.avatar,.customer-avatar{display:grid;place-items:center;background:var(--pale);color:var(--dark);font-weight:700}.avatar{width:26px;height:26px;border-radius:7px;font-size:11px}.badge{padding:4px 8px;border-radius:99px;background:#f0f2f1;color:var(--muted);font-size:10px;font-weight:600}.badge.berjalan,.badge.dikonfirmasi,.badge.masuk{background:var(--pale);color:var(--dark)}.badge.pending{background:#fbf0de;color:#b8791a}.badge.lunas{background:#edf2ff;color:#526aa6}.badge.keluar,.badge.dibatalkan{background:#fee2e2;color:var(--red)}.alert-row{background:#fff7e5;border:1px solid #fcd34d;border-radius:16px;padding:13px;display:flex;gap:12px;text-decoration:none;color:var(--ink)}.alert-row div{flex:1}.alert-row small{display:block;color:#976a1c;font:11px 'IBM Plex Mono';margin-top:3px}.loan-card{padding:14px}.loan-card>div{display:flex;justify-content:space-between;align-items:center;gap:8px}.loan-card>strong{display:block;margin:11px 0 0;font:700 18px 'Plus Jakarta Sans'}.loan-card form{margin-top:10px}.loan-card form input{width:100%;height:38px;border:1px solid var(--line);border-radius:9px;padding:8px;margin-bottom:7px}.customer-profile{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:17px}.customer-avatar{height:42px;width:42px;border-radius:12px}.customer-profile h2{font-size:17px;margin:3px 0}.customer-profile p{margin:2px 0;color:var(--muted);font-size:11px}.ktp-link{display:inline-block;margin-top:8px;color:var(--dark);font-size:11px}.customer-tools{display:flex;gap:10px;margin:14px 0 4px}.add-customer,.download-customer{flex:1;border-radius:12px;padding:12px 9px;text-align:center;text-decoration:none;font:700 12px 'Plus Jakarta Sans'}.add-customer{background:var(--green);color:#fff;box-shadow:0 7px 15px #0e8f5f33}.download-customer{background:#fff;color:var(--dark);border:1px solid var(--line)}.action-buttons{display:flex;gap:10px;margin-top:12px}.action-buttons>*{flex:1}.action-buttons button{border:0;border-radius:13px;background:#dc2626;color:#fff;font-weight:700}.primary{border:0;border-radius:13px;background:var(--green);color:#fff;padding:14px;font:700 14px 'Plus Jakarta Sans';cursor:pointer}.action-link{text-align:center;text-decoration:none}.form{display:grid;gap:14px}.panel{padding:16px;margin-top:14px}.form label{display:grid;gap:6px;font-weight:600;font-size:12px}.form input,.form select,.form textarea,.filter-form input,.filter-form select{width:100%;height:44px;border:1px solid var(--line);border-radius:11px;background:#fff;padding:12px;font:14px Inter}.form textarea{height:76px;resize:vertical}.filters{display:flex;gap:7px;overflow:auto;padding-bottom:8px;margin:14px 0 2px}.filters a{white-space:nowrap;text-decoration:none;color:var(--muted);background:#fff;border:1px solid var(--line);font-size:11px;font-weight:600;padding:7px 10px;border-radius:99px}.filters a.active{background:var(--green);border-color:var(--green);color:#fff}.empty{border:1px dashed #cbd7d1;background:#fff;border-radius:14px;padding:24px;text-align:center;color:var(--muted)}.chart-card{padding:15px;margin-top:13px}.chart-heading{display:flex;justify-content:space-between;align-items:center}.chart-heading h3{margin:0;font:700 13px 'Plus Jakarta Sans'}.chart-heading small{color:var(--light);font-size:10px}.income-chart{height:190px;margin-top:12px}.donut-chart{height:220px;margin-top:8px}.financial-summary{padding:8px 15px;margin-top:13px}.financial-item{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line)}.financial-item:last-child{border:0}.financial-item small{color:var(--muted);font-size:11px}.financial-item strong{font:700 13px 'Plus Jakarta Sans'}.marketing-card{display:flex;align-items:center;gap:11px;padding:12px;background:#fff;border:1px solid var(--line);border-radius:13px}.marketing-card div:nth-child(2){flex:1}.marketing-card small{display:block;color:var(--muted);font-size:10px}.marketing-card strong{font:700 12px 'Plus Jakarta Sans';color:var(--dark)}.marketing-avatar{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--pale);color:var(--dark);font-weight:700}.cash-balance{background:linear-gradient(135deg,#0a6b47,#0e8f5f);padding:18px;border-radius:18px;color:#fff}.cash-balance small{color:#d9fff0}.cash-balance strong{display:block;margin-top:5px;font:800 28px 'Plus Jakarta Sans'}.cash-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:12px 0}.cash-actions button{border:0;border-radius:12px;padding:13px;font-weight:700;cursor:pointer}.topup{background:var(--green);color:#fff}.withdraw{background:#eaf1ee;color:var(--dark)}.confirm,.cancel-loan,.logout-button{width:100%;padding:10px;border-radius:10px;font-weight:700;cursor:pointer}.confirm{border:1px solid var(--green);background:#fff;color:var(--dark)}.cancel-loan,.logout-button{border:1px solid #f1b7b2;background:#fff7f6;color:var(--red)}.logout-form{margin-top:16px}.green{color:var(--green)}.red{color:var(--red)}.filter-form{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:15px}.filter-form select,.filter-form button{grid-column:span 2}.modal-overlay{position:fixed;inset:0;background:#0008;display:none;place-items:center;z-index:10}.modal{background:#fff;border-radius:14px;padding:20px;width:85%;max-width:320px}.modal-buttons{display:flex;gap:8px;margin-top:12px}.modal-buttons button{flex:1;padding:10px;border:0;border-radius:10px;font-weight:700}.modal-buttons .confirm{background:var(--green);color:#fff}.countdown{margin-top:12px;padding:9px 10px;border-radius:9px;background:var(--pale);color:var(--dark);font:500 10px 'IBM Plex Mono'}.countdown.late{background:#fbf0de;color:#b8791a}.search{display:flex;gap:7px;margin:14px 0 10px}.search input{flex:1;border:1px solid var(--line);border-radius:13px;padding:12px}.search button{border:0;background:var(--pale);color:var(--dark);border-radius:9px}.nav-icon{font-size:18px}nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:420px;background:#fff;border-top:1px solid var(--line);height:72px;padding:10px 8px 13px;display:flex;justify-content:space-around;z-index:5}nav a{display:grid;place-items:center;text-decoration:none;color:var(--light);min-width:48px}nav a span:last-child{font:600 10px Inter}nav .active{color:var(--green)}@keyframes rise{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}.hero,.stats,.analytics-cards,.chart-card,.list{animation:rise .32s ease both}.stats,.analytics-cards{animation-delay:.06s}.chart-card{animation-delay:.1s}.list{animation-delay:.14s}