*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--green: #1a9b6c;--green-light: #e6f7f1;--green-dark: #0d6b4a;--red: #e03e3e;--red-light: #fef0f0;--red-dark: #9b1a1a;--blue: #2563eb;--blue-light: #eff6ff;--amber: #d97706;--amber-light: #fffbeb;--bg: #f0f2f5;--surface: #f7f8fa;--surface-2: #eceef2;--border: #dde0e6;--text: #111827;--muted: #6b7280;--hint: #9ca3af;--radius: 12px;--font: "DM Sans", system-ui, sans-serif;--mono: "DM Sans", system-ui, sans-serif;--mono-nums: tabular-nums;--shadow-sm: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);--shadow-md: 0 4px 12px rgba(0,0,0,.08);--sidebar-w: 220px}[data-theme=dark]{--bg: #0f1117;--surface: #1a1d27;--surface-2: #22263a;--border: #2d3148;--text: #e8eaf0;--muted: #8892a4;--hint: #545d72;--green-light: #0d2e1e;--green-dark: #34d399;--red-light: #2d1010;--red-dark: #f87171;--blue-light: #0e1e3d;--amber-light: #2d1e00;--shadow-sm: 0 1px 3px rgba(0,0,0,.3);--shadow-md: 0 4px 16px rgba(0,0,0,.4)}html{font-size:16px;scroll-behavior:smooth}body{font-family:var(--font);background:var(--bg);color:var(--text);min-height:100vh;-webkit-font-smoothing:antialiased}.sidebar{width:var(--sidebar-w);background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;position:fixed;top:0;left:0;height:100vh;z-index:100;transition:transform .25s ease}.sidebar-brand{display:flex;align-items:center;gap:10px;padding:1.25rem;border-bottom:1px solid var(--border)}.brand-icon{font-size:20px}.brand-name{font-size:15px;font-weight:600;letter-spacing:-.3px}.sidebar-nav{flex:1;padding:1rem .75rem;display:flex;flex-direction:column;gap:2px}.nav-item{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:8px;font-size:13px;font-weight:500;color:var(--muted);cursor:pointer;text-decoration:none;border:none;background:none;width:100%;text-align:left;transition:background .15s,color .15s}.nav-item:hover{background:var(--surface-2);color:var(--text)}.nav-item.active{background:var(--green-light);color:var(--green-dark)}.nav-icon{font-size:15px;width:20px;text-align:center}.sidebar-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000004d;z-index:99}.main-wrap{margin-left:var(--sidebar-w);min-height:100vh;display:flex;flex-direction:column}.topbar{display:flex;align-items:center;gap:12px;padding:10px 1.5rem;border-bottom:1px solid var(--border);background:var(--bg);position:sticky;top:0;z-index:10}.hamburger{display:none;flex-direction:column;gap:4px;background:none;border:none;cursor:pointer;padding:4px;flex-shrink:0}.hamburger span{display:block;width:20px;height:2px;background:var(--text);border-radius:2px}.theme-toggle{background:none;border:1px solid var(--border);border-radius:8px;padding:5px 9px;font-size:16px;cursor:pointer;line-height:1;flex-shrink:0;transition:background .15s}.theme-toggle:hover{background:var(--surface-2)}.month-strip-wrap{flex:1;overflow-x:auto;scrollbar-width:none}.month-strip-wrap::-webkit-scrollbar{display:none}.month-strip{display:flex;gap:5px;padding:2px 0;width:max-content}.month-pill{display:flex;flex-direction:column;align-items:center;padding:5px 11px;border-radius:20px;border:1.5px solid var(--border);background:var(--surface);cursor:pointer;transition:all .15s;line-height:1;gap:2px;font-family:var(--font)}.month-pill:hover{border-color:var(--green);color:var(--green)}.month-pill.active{background:var(--green);border-color:var(--green);color:#fff}.pill-mon{font-size:12px;font-weight:600}.pill-yr{font-size:10px;opacity:.7}.month-pill.active .pill-yr{opacity:.9}.main-content{flex:1;padding:1.5rem;max-width:1080px}.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin-bottom:1.25rem}.kpi{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1rem 1.25rem;box-shadow:var(--shadow-sm)}.kpi-label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.7px;color:var(--muted);margin-bottom:4px}.kpi-val{display:flex;flex-direction:column;gap:1px}.kpi-currency{font-size:11px;font-weight:600;opacity:.6;font-family:var(--mono);font-variant-numeric:var(--mono-nums);line-height:1}.kpi-amount{font-size:22px;font-weight:600;font-family:var(--mono);font-variant-numeric:var(--mono-nums);letter-spacing:-.5px;line-height:1.2}.kpi-sub{font-size:11px;color:var(--muted);margin-top:5px}.kpi.income .kpi-val{color:var(--green)}.kpi.expense .kpi-val{color:var(--red)}.kpi.saving .kpi-val{color:var(--amber)}.kpi.saving.good .kpi-val{color:var(--green)}.kpi.saving.warning .kpi-val{color:var(--amber)}.kpi.saving.bad .kpi-val{color:var(--red)}.kpi.balance .kpi-val{color:var(--blue)}.kpi.balance.negative .kpi-val{color:var(--red)}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.125rem 1.25rem;box-shadow:var(--shadow-sm);margin-bottom:12px}.card-title{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.7px;color:var(--muted);margin-bottom:12px}.type-label-income{color:var(--green-dark)!important}.type-label-expense{color:var(--red-dark)!important}.type-label-saving{color:var(--blue)!important}.input{font-family:var(--font);font-size:13px;padding:7px 10px;border:1px solid var(--border);border-radius:8px;background:var(--surface-2);color:var(--text);width:100%;transition:border-color .15s;-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}.input:focus{outline:none;border-color:var(--blue);background:var(--surface)}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;align-items:end}.form-grid .btn{width:fit-content}.form-bottom{grid-column:1 / -1;display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:4px;border-top:1px solid var(--border);margin-top:2px}.form-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.form-error{color:var(--red);font-size:12px;padding:6px 10px;background:var(--red-light);border-radius:6px;margin-bottom:10px}.input-gs{position:relative;display:flex;align-items:center}.input-gs .input{padding-left:26px}.gs-prefix{position:absolute;left:9px;font-size:13px;color:var(--muted);font-family:var(--mono);pointer-events:none}.select-cat-wrap{position:relative;display:flex;flex-direction:column;gap:4px}.color-row{display:flex;align-items:center;gap:8px}.color-swatch{width:34px;height:34px;border:1px solid var(--border);border-radius:8px;cursor:pointer;padding:2px;background:none;flex-shrink:0}.color-text{flex:1;font-family:var(--mono);font-size:12px}.btn{padding:8px 16px;border-radius:8px;border:none;font-size:13px;font-family:var(--font);cursor:pointer;font-weight:500;transition:all .15s;display:inline-flex;align-items:center;gap:6px}.btn-income{background:var(--green);color:#fff}.btn-income:hover{background:var(--green-dark)}.btn-expense{background:var(--red);color:#fff}.btn-expense:hover{background:var(--red-dark)}.btn-saving{background:var(--blue);color:#fff}.btn-saving:hover{background:#1d4ed8}.btn-ghost{background:none;border:1px solid var(--border);color:var(--muted)}.btn-ghost:hover{background:var(--surface-2);color:var(--text)}.btn-danger{background:none;border:1px solid var(--red);color:var(--red)}.btn-danger:hover{background:var(--red);color:#fff}.btn-sm{padding:5px 12px;font-size:12px}.btn:disabled{opacity:.5;cursor:not-allowed}.tabs{display:flex;gap:4px;flex-wrap:wrap}.tab{font-size:12px;padding:4px 12px;border-radius:20px;border:1px solid var(--border);background:none;cursor:pointer;color:var(--muted);font-family:var(--font);transition:all .15s;font-weight:500}.tab:hover{background:var(--surface-2);color:var(--text)}.tab.active{background:var(--text);color:var(--surface);border-color:var(--text)}.txn-form{margin-bottom:0}.list-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;flex-wrap:wrap;gap:8px}.list-header .card-title{margin-bottom:0}.txn-list{max-height:420px;overflow-y:auto;scrollbar-width:thin}.txn-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--border)}.txn-row:last-child{border-bottom:none}.txn-row:hover{background:var(--surface-2);margin:0 -.75rem;padding:9px .75rem;border-radius:8px}.txn-icon{width:34px;height:34px;border-radius:9px;background:var(--surface-2);display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}.txn-info{flex:1;min-width:0}.txn-desc{font-size:13px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.txn-meta{font-size:11px;color:var(--hint);margin-top:2px;display:flex;gap:6px;align-items:center;flex-wrap:wrap}.txn-notes{color:var(--hint);font-style:italic}.txn-amt{font-size:13px;font-weight:400;font-family:var(--mono);font-variant-numeric:var(--mono-nums);white-space:nowrap}.txn-amt-income{color:var(--green)}.txn-amt-expense{color:var(--red)}.txn-amt-saving{color:var(--blue)}.txn-actions{display:flex;gap:2px}.icon-btn{background:none;border:none;cursor:pointer;color:var(--hint);padding:4px 6px;border-radius:6px;font-size:13px;transition:all .15s;display:inline-flex;align-items:center}.icon-btn:hover{background:var(--surface-2);color:var(--text)}.icon-btn.del:hover{color:var(--red);background:var(--red-light)}.icon-btn.edit:hover{color:var(--blue);background:var(--blue-light)}.badge{display:inline-block;font-size:10px;padding:2px 7px;border-radius:20px;font-weight:600}.badge-income{background:var(--green-light);color:var(--green-dark)}.badge-expense{background:var(--red-light);color:var(--red-dark)}.badge-saving{background:var(--blue-light);color:var(--blue)}.charts-col{display:flex;flex-direction:column;gap:12px}.cat-chart-wrap{display:flex;align-items:flex-start;gap:16px;flex-wrap:wrap}.cat-breakdown{flex:1;min-width:180px}.cat-row{display:flex;align-items:center;gap:8px;margin-bottom:8px}.cat-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.cat-emoji{font-size:13px}.cat-name{font-size:12px;flex:1}.cat-bar-wrap{flex:2;height:5px;background:var(--surface-2);border-radius:3px;overflow:hidden}.cat-bar{height:100%;border-radius:3px;transition:width .4s ease}.cat-pct{font-size:11px;color:var(--muted);min-width:28px;text-align:right}.cat-amt{font-size:11px;font-family:var(--mono);font-variant-numeric:var(--mono-nums);color:var(--muted);min-width:78px;text-align:right}.cat-manager{display:flex;flex-direction:column;gap:0}.cat-mgmt-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--border)}.cat-mgmt-row:last-child{border-bottom:none}.cat-color-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}.cat-mgmt-actions{display:flex;gap:2px;margin-left:auto}.dashboard-grid{display:grid;grid-template-columns:1fr 380px;gap:16px;align-items:start}.dashboard-left{display:flex;flex-direction:column;gap:12px}.dashboard-right{position:sticky;top:70px}.page-movements,.page-categories{display:flex;flex-direction:column;gap:12px}.receipt-label{cursor:pointer}.receipt-btn{display:inline-flex;align-items:center;gap:6px;font-size:13px;padding:8px 12px;border-radius:8px;border:1.5px dashed var(--border);color:var(--muted);background:var(--surface-2);transition:all .15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px}.receipt-btn:hover{border-color:var(--blue);color:var(--blue)}.receipt-btn.has-file{border-color:var(--green);color:var(--green);background:var(--green-light)}.receipt-section{grid-column:1 / -1}.receipt-preview{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.btn-receipt-view{display:inline-flex;align-items:center;gap:6px;font-size:13px;padding:7px 14px;border-radius:8px;border:1.5px solid var(--amber);color:var(--amber);background:var(--amber-light);cursor:pointer;font-family:var(--font);font-weight:500;transition:all .15s}.btn-receipt-view:hover{background:var(--amber);color:#fff}.btn-receipt-row{display:inline-flex;align-items:center;justify-content:center;padding:4px 7px;border-radius:6px;font-size:14px;border:1px solid var(--amber);background:var(--amber-light);cursor:pointer;transition:all .15s;line-height:1}.btn-receipt-row:hover{background:var(--amber)}.receipt-viewer-backdrop{align-items:center;justify-content:center}.receipt-viewer{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow-md);width:90vw;max-width:860px;max-height:90vh;display:flex;flex-direction:column;animation:modal-in .2s ease}.receipt-viewer-header{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--border);flex-shrink:0}.receipt-viewer-title{font-size:14px;font-weight:600}.receipt-viewer-close{background:none;border:none;cursor:pointer;font-size:16px;color:var(--muted);padding:2px 6px;border-radius:6px;line-height:1}.receipt-viewer-close:hover{background:var(--surface-2);color:var(--text)}.receipt-viewer-iframe{flex:1;width:100%;border:none;min-height:70vh}.receipt-viewer-img-wrap{flex:1;overflow:auto;display:flex;align-items:center;justify-content:center;padding:16px}.receipt-viewer-img{max-width:100%;max-height:75vh;border-radius:8px;object-fit:contain}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000059;display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem}.modal{background:var(--surface);border-radius:var(--radius);padding:1.5rem;width:100%;max-width:480px;box-shadow:var(--shadow-md);animation:modal-in .2s ease}.modal-title{font-size:15px;font-weight:600;margin-bottom:1rem}.modal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:4px}@keyframes modal-in{0%{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}.muted{color:var(--muted);font-size:13px}.empty-state{text-align:center;padding:2.5rem 1rem;color:var(--hint);font-size:13px}@media (max-width: 900px){.dashboard-grid{grid-template-columns:1fr}.dashboard-right{position:static}}@media (max-width: 768px){.sidebar{transform:translate(-100%)}.sidebar.open{transform:translate(0)}.main-wrap{margin-left:0}.hamburger{display:flex}.main-content{padding:1rem}.kpi-grid{grid-template-columns:repeat(2,1fr)}}