*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--green-50:#f0fdf4;--green-100:#dcfce7;--green-200:#bbf7d0;--green-300:#86efac;--green-400:#4ade80;--green-500:#22c55e;--green-600:#16a34a;--green-700:#15803d;--green-800:#166534;--green-900:#14532d;--red-500:#ef4444;--red-100:#fee2e2;--amber-500:#f59e0b;--amber-100:#fef3c7;--blue-500:#3b82f6;--blue-100:#dbeafe;--gray-50:#f8fafc;--gray-100:#f1f5f9;--gray-200:#e2e8f0;--gray-300:#cbd5e1;--gray-400:#94a3b8;--gray-500:#64748b;--gray-600:#475569;--gray-700:#334155;--gray-800:#1e293b;--gray-900:#0f172a;--white:#fff;--sidebar-width:260px;--sidebar-collapsed:0px;--header-height:60px;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:20px;--shadow-sm:0 1px 3px #0000000f, 0 1px 2px #0000000a;--shadow-md:0 4px 16px #00000014, 0 2px 4px #0000000a;--shadow-lg:0 8px 32px #0000001a, 0 2px 8px #0000000f;--shadow-green:0 4px 20px #16a34a33}html,body{height:100%}body{background:var(--gray-50);color:var(--gray-900);-webkit-font-smoothing:antialiased;font-family:Inter,sans-serif;overflow-x:hidden}#root{height:100%;display:flex}h1,h2,h3,h4,h5,h6,.num{font-family:Outfit,sans-serif}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--gray-400)}.appLayout{width:100%;min-height:100vh;display:flex}.mainContent{margin-left:var(--sidebar-width);flex-direction:column;flex:1;min-height:100vh;transition:margin-left .3s;display:flex}.page{flex:1;width:100%;max-width:1400px;padding:32px}.sidebar{width:var(--sidebar-width);background:var(--gray-900);z-index:100;flex-direction:column;height:100vh;transition:transform .3s;display:flex;position:fixed;top:0;left:0;overflow:hidden}.sidebarLogo{border-bottom:1px solid #ffffff14;align-items:center;gap:12px;padding:20px 20px 16px;display:flex}.sidebarLogo img{border-radius:8px;width:36px;height:36px}.sidebarLogo span{color:var(--white);letter-spacing:-.3px;font-family:Outfit,sans-serif;font-size:20px;font-weight:700}.sidebarNav{flex:1;padding:12px 0;overflow-y:auto}.navItem{color:var(--gray-400);cursor:pointer;background:0 0;border:none;border-radius:0;align-items:center;gap:12px;width:100%;padding:11px 20px;font-size:14px;font-weight:500;text-decoration:none;transition:all .15s;display:flex;position:relative}.navItem:hover{color:var(--white);background:#ffffff0f}.navItem.active{color:var(--white);background:#16a34a2e}.navItem.active:before{content:"";background:var(--green-500);border-radius:0 2px 2px 0;width:3px;position:absolute;top:4px;bottom:4px;left:0}.navItem svg{flex-shrink:0}.sidebarFooter{color:var(--gray-600);text-align:center;border-top:1px solid #ffffff14;padding:16px 20px;font-size:12px}.sidebarOverlay{z-index:99;background:#00000080;display:none;position:fixed;inset:0}.pageHeader{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:28px;display:flex}.pageTitle{color:var(--gray-900);letter-spacing:-.5px;font-size:26px;font-weight:700}.pageSubtitle{color:var(--gray-500);margin-top:2px;font-size:14px}.topbar{height:var(--header-height);background:var(--white);border-bottom:1px solid var(--gray-200);z-index:50;justify-content:space-between;align-items:center;padding:0 20px;display:none;position:sticky;top:0}.topbarLogo{color:var(--gray-900);align-items:center;gap:10px;font-family:Outfit,sans-serif;font-size:18px;font-weight:700;display:flex}.topbarLogo img{border-radius:6px;width:28px;height:28px}.card{background:var(--white);border-radius:var(--radius-lg);border:1px solid var(--gray-200);box-shadow:var(--shadow-sm);padding:20px}.cardHeader{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.cardTitle{color:var(--gray-600);text-transform:uppercase;letter-spacing:.5px;font-size:14px;font-weight:600}.statCards{gap:16px;margin-bottom:24px;display:grid}.statCards4{grid-template-columns:repeat(4,1fr)}.statCards3{grid-template-columns:repeat(3,1fr)}.statCards2{grid-template-columns:repeat(2,1fr)}.statCards6{grid-template-columns:repeat(3,1fr)}.statCard{background:var(--white);border:1px solid var(--gray-200);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:20px}.statCard.green{background:linear-gradient(135deg, var(--green-600) 0%, var(--green-700) 100%);border-color:var(--green-700);color:var(--white)}.statCard.green-light{background:var(--green-50);border-color:var(--green-200)}.statLabel{color:var(--gray-500);text-transform:uppercase;letter-spacing:.4px;margin-bottom:8px;font-size:12px;font-weight:500}.statCard.green .statLabel{color:#ffffffbf}.statCard.green-light .statLabel{color:var(--green-700)}.statValue{color:var(--gray-900);letter-spacing:-.5px;font-family:Outfit,sans-serif;font-size:26px;font-weight:700;line-height:1}.statCard.green .statValue{color:var(--white)}.statCard.green-light .statValue{color:var(--green-800)}.statIcon{border-radius:var(--radius-sm);justify-content:center;align-items:center;width:40px;height:40px;margin-bottom:12px;display:flex}.btn{border-radius:var(--radius-sm);cursor:pointer;white-space:nowrap;border:none;align-items:center;gap:8px;padding:10px 18px;font-family:DM Sans,sans-serif;font-size:14px;font-weight:500;transition:all .15s;display:inline-flex}.btnPrimary{background:var(--green-600);color:var(--white);box-shadow:var(--shadow-green)}.btnPrimary:hover{background:var(--green-700);transform:translateY(-1px)}.btnSecondary{background:var(--gray-100);color:var(--gray-700);border:1px solid var(--gray-200)}.btnSecondary:hover{background:var(--gray-200)}.btnDanger{background:var(--red-100);color:var(--red-500);border:1px solid #0000}.btnDanger:hover{background:#fecaca}.btnGhost{color:var(--gray-600);background:0 0;padding:8px}.btnGhost:hover{background:var(--gray-100);color:var(--gray-900)}.btnSm{padding:7px 14px;font-size:13px}.btnIcon{border-radius:var(--radius-sm);padding:8px}.sectionHeader{justify-content:space-between;align-items:center;margin-top:28px;margin-bottom:14px;display:flex}.sectionTitle{letter-spacing:1.2px;color:var(--gray-500);text-transform:uppercase;font-size:11px;font-weight:700}.itemCard{background:var(--white);border:1px solid var(--gray-200);border-radius:var(--radius-md);margin-bottom:10px;transition:box-shadow .15s;overflow:hidden}.itemCard:hover{box-shadow:var(--shadow-md)}.itemCardHeader{cursor:pointer;align-items:center;gap:12px;padding:16px 20px;display:flex}.itemCardIcon{background:var(--green-50);width:40px;height:40px;color:var(--green-600);border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.itemCardInfo{flex:1;min-width:0}.itemCardName{color:var(--gray-900);align-items:center;gap:8px;font-size:15px;font-weight:600;display:flex}.itemCardMeta{color:var(--gray-500);margin-top:2px;font-size:12px}.itemCardValue{text-align:right;flex-shrink:0}.itemCardAmount{color:var(--gray-900);font-family:Outfit,sans-serif;font-size:18px;font-weight:700}.itemCardAmount.positive{color:var(--green-600)}.itemCardAmount.negative{color:var(--red-500)}.itemCardActions{gap:4px;margin-left:8px;display:flex}.itemCardDropdown{border-top:1px solid var(--gray-100);background:var(--gray-50);padding:12px 20px}.badge{letter-spacing:.3px;border-radius:20px;align-items:center;padding:2px 8px;font-size:11px;font-weight:600;display:inline-flex}.badgeGreen{background:var(--green-100);color:var(--green-700)}.badgeBlue{background:var(--blue-100);color:var(--blue-500)}.badgeAmber{background:var(--amber-100);color:var(--amber-500)}.badgeRed{background:var(--red-100);color:var(--red-500)}.badgeGray{background:var(--gray-100);color:var(--gray-600)}.modalBackdrop{z-index:200;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#00000073;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.modal{background:var(--white);border-radius:var(--radius-xl);width:100%;max-width:520px;max-height:90vh;box-shadow:var(--shadow-lg);animation:.2s modalIn;overflow-y:auto}@keyframes modalIn{0%{opacity:0;transform:scale(.97)translateY(8px)}to{opacity:1;transform:scale(1)translateY(0)}}.modalHeader{border-bottom:1px solid var(--gray-200);justify-content:space-between;align-items:center;padding:20px 24px 16px;display:flex}.modalTitle{color:var(--gray-900);font-size:17px;font-weight:700}.modalBody{padding:20px 24px}.modalFooter{border-top:1px solid var(--gray-100);justify-content:flex-end;gap:10px;padding:16px 24px 20px;display:flex}.formGroup{margin-bottom:16px}.formRow{grid-template-columns:1fr 1fr;gap:12px;display:grid}.formRow3{grid-template-columns:1fr 1fr 1fr;gap:12px;display:grid}label{color:var(--gray-700);margin-bottom:6px;font-size:13px;font-weight:500;display:block}input,select,textarea{border:1.5px solid var(--gray-200);border-radius:var(--radius-sm);width:100%;color:var(--gray-900);background:var(--white);outline:none;padding:10px 14px;font-family:DM Sans,sans-serif;font-size:14px;transition:border-color .15s}input:focus,select:focus,textarea:focus{border-color:var(--green-500);box-shadow:0 0 0 3px #22c55e1f}input[type=number]{-moz-appearance:textfield}input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none}textarea{resize:vertical;min-height:80px}.tabs{background:var(--gray-100);border-radius:var(--radius-md);gap:4px;width:fit-content;margin-bottom:20px;padding:4px;display:flex}.tab{border-radius:var(--radius-sm);color:var(--gray-600);cursor:pointer;background:0 0;border:none;padding:8px 20px;font-size:13px;font-weight:500;transition:all .15s}.tab.active{background:var(--white);color:var(--green-700);box-shadow:var(--shadow-sm);font-weight:600}.grid2{grid-template-columns:1fr 1fr;gap:20px;display:grid}.grid3{grid-template-columns:1fr 1fr 1fr;gap:20px;display:grid}.chartContainer{background:var(--white);border:1px solid var(--gray-200);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:20px}.txRow{border-bottom:1px solid var(--gray-100);align-items:center;gap:12px;padding:12px 0;display:flex}.txRow:last-child{border-bottom:none}.txIcon{border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;display:flex}.txInfo{flex:1;min-width:0}.txName{color:var(--gray-900);font-size:14px;font-weight:500}.txMeta{color:var(--gray-500);margin-top:1px;font-size:12px}.txAmount{font-family:Outfit,sans-serif;font-size:15px;font-weight:700}.calGrid{background:var(--gray-200);border:1px solid var(--gray-200);border-radius:var(--radius-lg);grid-template-columns:repeat(7,1fr);gap:1px;display:grid;overflow:hidden}.calHeaderCell{background:var(--green-600);color:var(--white);text-align:center;letter-spacing:.5px;padding:10px 4px;font-size:12px;font-weight:600}.calCell{background:var(--white);min-height:100px;padding:8px;position:relative}.calCell.otherMonth{background:var(--gray-50)}.calCell.today{background:var(--green-50)}.calDay{color:var(--gray-600);margin-bottom:4px;font-size:13px;font-weight:600}.calCell.today .calDay{background:var(--green-600);color:var(--white);border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;display:flex}.calEvent{white-space:nowrap;text-overflow:ellipsis;border-radius:4px;margin-bottom:2px;padding:2px 6px;font-size:11px;font-weight:500;overflow:hidden}.calEvent.income{background:var(--green-100);color:var(--green-800)}.calEvent.expense{background:var(--red-100);color:var(--red-500)}.calEvent.payment{background:var(--amber-100);color:var(--amber-500)}.calEvent.transfer{background:var(--blue-100);color:var(--blue-500)}.emptyState{text-align:center;color:var(--gray-400);padding:48px 20px}.emptyState svg{opacity:.4;margin:0 auto 16px}.emptyState h3{color:var(--gray-500);margin-bottom:6px;font-size:16px;font-weight:600}.emptyState p{font-size:14px}.progressBar{background:var(--gray-100);border-radius:4px;height:8px;margin-top:8px;overflow:hidden}.progressFill{border-radius:4px;height:100%;transition:width .3s}.alertIcon{color:var(--red-500);flex-shrink:0}.divider{background:var(--gray-100);height:1px;margin:20px 0}.filterBar{flex-wrap:wrap;gap:10px;margin-bottom:20px;display:flex}.filterBar input,.filterBar select{flex:1;width:auto;min-width:140px}.customTooltip{background:var(--gray-900);border-radius:var(--radius-sm);color:var(--white);box-shadow:var(--shadow-md);padding:10px 14px;font-size:13px}@media (width<=1100px){.statCards4,.statCards6{grid-template-columns:repeat(2,1fr)}.grid2{grid-template-columns:1fr}.grid3{grid-template-columns:1fr 1fr}}@media (width<=768px){.sidebar{transform:translate(-100%)}.sidebar.open{transform:translate(0)}.sidebarOverlay{display:block}.mainContent{margin-left:0}.topbar{display:flex}.page{padding:20px 16px}.statCards4,.statCards3,.statCards6{grid-template-columns:repeat(2,1fr)}.grid3,.formRow,.formRow3{grid-template-columns:1fr}.calEvent{display:none}.calCell{min-height:50px}.pageTitle{font-size:22px}}@media (width<=480px){.statCards4,.statCards3,.statCards6,.statCards2{grid-template-columns:1fr}}input.inputError,select.inputError{border-color:var(--red-500)!important;box-shadow:0 0 0 3px #ef44441f!important}.errorText{color:var(--red-500);margin-top:4px;font-size:11px;font-weight:500;display:block}.txTypeToggle{background:var(--gray-100);border-radius:var(--radius-sm);gap:2px;margin-bottom:16px;padding:3px;display:flex}.txTypeBtn{cursor:pointer;color:var(--gray-500);background:0 0;border:none;border-radius:6px;flex:1;padding:9px 16px;font-size:14px;font-weight:500;transition:all .15s}.txTypeBtn.activeIncome{background:var(--white);color:var(--green-700);box-shadow:var(--shadow-sm);font-weight:600}.txTypeBtn.activeExpense{background:var(--white);color:var(--red-500);box-shadow:var(--shadow-sm);font-weight:600}.amountInputWrap{align-items:center;display:flex;position:relative}.signBadge{pointer-events:none;z-index:1;font-size:16px;font-weight:700;position:absolute;left:12px}.signPositive{color:var(--green-600)}.signNegative{color:var(--red-500)}.amountInputField{padding-left:28px!important}.txPreview{border-radius:8px;margin-top:8px;padding:10px 14px;font-size:13px;font-weight:500}.previewIncome{background:var(--green-50);color:var(--green-700)}.previewExpense{background:var(--red-100);color:var(--red-500)}.dragHandle{color:var(--gray-300);cursor:grab;border-radius:4px;flex-shrink:0;align-items:center;margin-right:2px;padding:2px 4px;transition:color .1s;display:flex}.dragHandle:hover{color:var(--gray-500);background:var(--gray-100)}.saveloadBtns{gap:6px;margin-bottom:8px;display:flex}.saveloadBtns .btn{flex:1;justify-content:center}.catchupNotice{background:var(--green-50);border:1px solid var(--green-200);color:var(--green-800);border-radius:8px;margin-bottom:14px;padding:10px 14px;font-size:13px}.catchupSectionLabel{text-transform:uppercase;letter-spacing:.5px;color:var(--gray-500);margin-bottom:8px;font-size:11px;font-weight:700}.catchupRow{cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:8px;align-items:center;gap:10px;margin-bottom:4px;padding:8px 10px;transition:background .1s;display:flex}.catchupRow:hover{background:var(--gray-50)}.catchupLabel{color:var(--gray-700);flex:1;font-size:13px}.devPanel{border-radius:var(--radius-sm);background:#1e1b4b;border:1px solid #4c1d95;margin-top:8px;font-size:12px;overflow:hidden}.devHeader{color:#c4b5fd;cursor:pointer;letter-spacing:.5px;align-items:center;gap:6px;padding:8px 12px;font-weight:600;display:flex}.devHeader:hover{background:#8b5cf633}.devOffsetBadge{color:#fff;background:#7c3aed;border-radius:10px;padding:1px 6px;font-size:10px;font-weight:700}.devBody{padding:8px 12px 12px}.devNow{color:#a5b4fc;align-items:center;gap:5px;margin-bottom:8px;font-size:11px;display:flex}.devRow{align-items:center;gap:6px;display:flex}.devInput{color:#fff!important;background:#ffffff1a!important;border-color:#fff3!important;width:60px!important;padding:6px 8px!important}.sidebarAddTx{border-bottom:1px solid #ffffff0f;padding:12px 16px 8px}.calCellClickable{cursor:pointer;transition:background .1s;position:relative}.calCellClickable:hover{background:var(--green-50)!important}.calCellClickable:hover:after{content:"+";color:var(--green-500);font-size:16px;font-weight:700;line-height:1;position:absolute;top:4px;right:6px}[draggable=true]{-webkit-user-select:none;user-select:none}
