@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--bg:#f5f7fb;--panel:#fff;--ink:#1e293b;--muted:#7c879a;--line:#e9edf4;--green:#168c69;--navy:#18243a;--shadow:0 8px 28px rgba(29,45,74,.045)}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px 'DM Sans',sans-serif}h1,h2,p{margin-top:0}h1,h2,.brand b,.stat-card strong{font-family:Manrope,'DM Sans',sans-serif}h1{font-size:clamp(25px,2.5vw,32px);letter-spacing:-1.2px;margin-bottom:8px}h2{font-size:17px;letter-spacing:-.35px;margin-bottom:7px}a{color:inherit;text-decoration:none}button,input,select{font:inherit}.app-shell{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:246px;background:var(--navy);color:#d5deec;padding:27px 17px 18px;display:flex;flex-direction:column;z-index:5}.brand{display:flex;align-items:center;gap:11px;padding:0 8px 37px;color:#fff}.brand-mark{display:grid;place-items:center;width:39px;height:39px;flex-shrink:0;border-radius:13px;background:linear-gradient(140deg,#34c99a,#168c69);color:#fff;font:800 20px Manrope;box-shadow:0 5px 16px #168c6940}.brand b{display:block;font-size:16px;letter-spacing:-.4px}.brand small{display:block;color:#8190a9;font-size:9px;letter-spacing:1.6px;margin-top:4px}.sidebar nav{display:grid;gap:7px}.sidebar nav a{padding:13px 13px;border-radius:10px;color:#9eacc1;font-weight:500;transition:.2s}.sidebar nav a:hover,.sidebar nav a.active{background:#27364f;color:#fff}.sidebar nav a.active{box-shadow:inset 3px 0 #35c99a}.side-bottom{margin-top:auto;border-top:1px solid #344158;padding:17px 5px 0}.user-mini{display:flex;align-items:center;gap:10px}.avatar{width:35px;height:35px;border-radius:50%;display:grid;place-items:center;background:#344c67;color:#8ee2c3;font-weight:700}.user-mini b{display:block;color:#fff;font-size:12px}.user-mini small{color:#91a0b6;display:block;margin-top:3px}.logout{display:block;color:#aab6c8;font-size:12px;padding:17px 8px 0}.main{margin-left:246px;padding:32px clamp(20px,3vw,48px) 20px;max-width:1750px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:26px}.topbar h1{margin-bottom:7px}.eyebrow{color:#168c69;font-size:10px;letter-spacing:1.65px;font-weight:700;margin-bottom:9px}.muted{color:var(--muted)}.topbar .muted{margin-bottom:0}.top-right{display:flex;align-items:center;gap:20px}.live-clock{text-align:right;min-width:115px;font-weight:700;font-size:14px}.live-clock small{display:block;color:var(--muted);font-size:10px;font-weight:500;margin-top:4px}.live-dot{display:inline-block;width:7px;height:7px;background:#25b98b;border-radius:50%;margin-right:6px;box-shadow:0 0 0 4px #25b98b1c}.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:11px 15px;border-radius:9px;border:1px solid transparent;cursor:pointer;font-weight:600;font-size:12px;transition:transform .2s,box-shadow .2s,background .2s;white-space:nowrap}.btn:hover{transform:translateY(-1px)}.primary{background:#168c69;color:#fff;box-shadow:0 5px 12px #168c6920}.primary:hover{background:#117a5b;box-shadow:0 8px 16px #168c692a}.secondary{background:#fff;border-color:var(--line);color:#46536a}.ghost{background:transparent;border-color:var(--line);color:#64748b}.full{width:100%;margin-top:9px}.quote-banner{display:flex;align-items:center;gap:17px;background:linear-gradient(105deg,#e3f8ef,#eef8f6 58%,#f3f8ff);border:1px solid #dcefe8;padding:18px 23px;border-radius:15px;margin-bottom:22px;position:relative;overflow:hidden}.quote-icon{width:43px;height:43px;border-radius:13px;background:#fff;color:#168c69;display:grid;place-items:center;font-size:25px;box-shadow:0 4px 12px #15865b12;flex-shrink:0}.quote-label{font-size:9px;letter-spacing:1.5px;color:#168c69;font-weight:700}.quote-banner p{font:600 15px Manrope,sans-serif;letter-spacing:-.25px;margin:5px 0 0;color:#244a42}.quote-spark{margin-left:auto;font-size:24px;color:#8bcbb4;align-self:flex-start}.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-bottom:21px}.stat-card,.panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}.stat-card{padding:18px 19px;min-width:0;transition:transform .22s,box-shadow .22s}.stat-card:hover{transform:translateY(-3px);box-shadow:0 13px 30px #1d2d4a0c}.stat-top{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#778397;font-size:11px;font-weight:600;margin-bottom:18px}.stat-icon{width:31px;height:31px;border-radius:10px;display:grid;place-items:center;font-size:17px}.green{background:#e4f8ef;color:#16986d}.red{background:#fff0f0;color:#df5d67}.purple{background:#f1edff;color:#8066d8}.blue{background:#eaf3ff;color:#4b88d7}.stat-card strong{display:block;font-size:clamp(16px,1.55vw,23px);letter-spacing:-.7px;white-space:nowrap}.stat-card>small{display:block;font-size:10px;margin-top:9px}.positive{color:#17986e}.negative{color:#df6971}.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,1fr);gap:18px;margin-bottom:20px}.panel{padding:22px;margin-bottom:20px;min-width:0}.dashboard-grid .panel{margin-bottom:0}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:21px}.panel-head p{font-size:11px;margin-bottom:0}.panel-head h2{margin-bottom:5px}.pill{display:inline-flex;align-items:center;background:#f1f4f8;color:#6b788d;border-radius:7px;padding:6px 9px;font-size:10px;font-weight:600}.chart-wrap{height:230px;position:relative}.text-link{color:#168c69;font-size:11px;font-weight:700}.account-list{display:grid;gap:0}.account-row{display:flex;align-items:center;gap:11px;padding:12px 0;border-bottom:1px solid #f0f2f6;min-width:0}.account-row:last-child{border-bottom:0}.account-symbol{width:39px;height:39px;border-radius:12px;background:#f0f4fb;color:#627a9b;display:grid;place-items:center;font-weight:800;font-size:14px;flex-shrink:0}.account-symbol.wallet{background:#e9f8f1;color:#168c69}.account-symbol.bank{background:#edf3ff;color:#4b7ec4}.account-symbol.cash{background:#fff5e6;color:#b78337}.account-info{min-width:0;flex:1}.account-info b{display:block;font-size:12px}.account-info small{display:block;font-size:10px;color:var(--muted);margin-top:4px}.account-row>strong{font-size:11px;white-space:nowrap}.recent-panel{padding-bottom:8px}.table-scroll{width:100%;overflow-x:auto}table{width:100%;border-collapse:collapse;text-align:left;white-space:nowrap}th{font-size:10px;text-transform:uppercase;letter-spacing:.8px;color:#8994a6;font-weight:700;background:#fafbfd}th,td{padding:14px 12px;border-bottom:1px solid #edf0f5}td{font-size:11px;color:#59667a}td b{color:#27364c;font-size:11px}tbody tr:last-child td{border-bottom:0}tbody tr:hover{background:#fbfcfe}.transaction-name{display:flex;align-items:center;gap:10px}.transaction-name small{display:block;color:#9aa3b2;font-size:10px;margin-top:4px;max-width:210px;overflow:hidden;text-overflow:ellipsis}.tx-symbol{width:31px;height:31px;border-radius:10px;display:grid;place-items:center;font-weight:700;font-size:16px}.tx-symbol.income{background:#e7f8f0;color:#16986d}.tx-symbol.expense{background:#fff0f0;color:#e05f68}.tx-symbol.transfer{background:#eef3ff;color:#6584ce}.align-right{text-align:right}.amount-income{color:#14986b;font-weight:700}.amount-expense{color:#e05f68;font-weight:700}.amount-transfer{color:#6584ce;font-weight:700}.empty{text-align:center;padding:30px;color:#929daf}footer{font-size:10px;color:#9aa4b3;text-align:center;padding:14px 0 5px}footer span{color:#168c69}.form-panel{scroll-margin-top:20px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}.form-grid label,.filters label,.auth-card label{display:grid;gap:7px;color:#59667a;font-size:11px;font-weight:600}input,select{width:100%;min-width:0;padding:11px 12px;border:1px solid #dfe5ed;border-radius:8px;background:#fff;color:#27364c;outline:none;font-size:12px;transition:border-color .2s,box-shadow .2s}input:focus,select:focus{border-color:#48b996;box-shadow:0 0 0 3px #168c6912}.form-actions{display:flex;align-items:end;grid-column:1/-1}.filters{display:flex;align-items:end;gap:12px;flex-wrap:wrap;margin-bottom:22px}.filters label{min-width:145px}.notice,.error{padding:13px 16px;border-radius:9px;font-size:12px;margin-bottom:16px}.notice{background:#e7f8f0;border:1px solid #d0f0e1;color:#167d5b}.error{background:#fff0f0;border:1px solid #f9d5d7;color:#ba3f49}.action-row{display:flex;align-items:center;gap:12px}.action-row form{margin:0}.link-danger{border:0;background:transparent;padding:0;color:#d85e67;font-size:11px;font-weight:600;cursor:pointer}.link-danger:disabled{opacity:.35;cursor:not-allowed}.account-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin-bottom:22px}.account-card{margin:0}.account-card .account-row{padding:0;border:0}.account-card .account-row .pill{margin-left:auto}.account-card>p{margin:18px 0 5px;font-size:12px}.account-card h2{font-size:24px;letter-spacing:-.8px;margin-bottom:7px}.delete-account{margin-top:20px}.inline-form{display:flex;align-items:center;gap:7px}.inline-form select{width:105px;padding:8px}.small-btn{padding:8px 10px}.report-stats{margin-top:20px}.report-chart{margin-top:27px}.report-chart h2{margin-bottom:15px}.report-chart .chart-wrap{height:300px}.small{font-size:10px;line-height:1.6}.auth-bg{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 15% 15%,#dff8ee 0,transparent 30%),radial-gradient(circle at 90% 85%,#e3ebff 0,transparent 32%),#f6f8fc}.auth-card{width:min(100%,420px);padding:38px;background:#fff;border:1px solid #e7edf4;border-radius:20px;box-shadow:0 25px 70px #1d2d4a12;animation:float-in .5s ease-out}.auth-card .brand-mark{margin-bottom:25px}.auth-card h1{font-size:30px}.auth-card .muted{font-size:12px;line-height:1.7}.auth-card form{display:grid;gap:17px;margin-top:25px}.auth-card .small{margin-top:20px}.auth-card a:not(.btn){color:#168c69;font-weight:700}.rise-in{animation:rise .5s both}@keyframes rise{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}@keyframes float-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1180px){.sidebar{width:215px}.main{margin-left:215px;padding:25px 22px}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-grid{grid-template-columns:1fr}.account-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.sidebar{position:static;width:auto;padding:14px 15px 10px}.brand{padding:0 4px 14px}.sidebar nav{display:flex;overflow-x:auto;gap:5px;padding-bottom:3px}.sidebar nav a{white-space:nowrap;padding:10px;font-size:11px}.side-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:9px;padding-top:10px}.logout{padding:8px}.main{margin-left:0;padding:22px 14px}.topbar{align-items:flex-start;flex-direction:column}.top-right{width:100%;justify-content:space-between}.live-clock{text-align:left}.quote-banner{padding:15px;gap:12px}.quote-banner p{font-size:13px}.quote-spark{display:none}.stats-grid{gap:10px}.stat-card{padding:14px}.stat-card strong{font-size:17px}.stat-top{margin-bottom:13px;font-size:10px}.panel{padding:16px}.account-cards{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.form-actions{grid-column:auto}.filters{align-items:stretch}.filters label{flex:1;min-width:120px}.dashboard-grid{gap:14px}.chart-wrap{height:210px}.auth-card{padding:28px 22px}.topbar h1{font-size:27px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}@media print{.sidebar,.topbar .btn,.filters,.logout,footer .text-link{display:none!important}.main{margin:0;padding:0}.panel,.stat-card{box-shadow:none;break-inside:avoid}body{background:#fff}}


/* KPM-TRANSACTION-COLOR-UPDATE-V1 */
/* Money received: blue */
.amount-income { color: #2563eb !important; font-weight: 800; }
.tx-symbol.income { background: #eaf2ff !important; color: #2563eb !important; }
/* Money spent: red */
.amount-expense { color: #dc2626 !important; font-weight: 800; }
.tx-symbol.expense { background: #fff0f0 !important; color: #dc2626 !important; }
/* Keep transfers visually distinct from income and expenses */
.amount-transfer { color: #7c5cc4 !important; font-weight: 800; }
.tx-symbol.transfer { background: #f1edff !important; color: #7c5cc4 !important; }