:root{--font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--primary:#2563eb;--primary-hover:#1d4ed8;--primary-light:#eff6ff;--primary-border:#bfdbfe;--accent-cyan:#0284c7;--accent-cyan-light:#e0f2fe;--deposit-color:#059669;--deposit-bg:#ecfdf5;--deposit-border:#a7f3d0;--expense-color:#e11d48;--expense-bg:#fff1f2;--expense-border:#fecdd3;--bg-app:#f1f5f9;--bg-card:#fff;--bg-subtle:#f8fafc;--text-primary:#0f172a;--text-secondary:#64748b;--text-muted:#94a3b8;--border-light:#e2e8f0;--border-focus:#93c5fd;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #00000012, 0 2px 4px -2px #0000000d;--shadow-lg:0 10px 25px -5px #2563eb1f, 0 8px 10px -6px #0000000a;--shadow-banner:0 12px 30px -8px #2563eb66;--radius-sm:8px;--radius-md:14px;--radius-lg:20px;--radius-full:9999px;--transition-fast:.18s cubic-bezier(.4, 0, .2, 1);--transition-normal:.28s cubic-bezier(.4, 0, .2, 1)}*,:before,:after{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html,body{background-color:var(--bg-app);width:100%;min-height:100dvh;font-family:var(--font-family);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5;overflow-x:hidden}@media (width>=481px){body{background-color:#e2e8f0}}#root{justify-content:center;align-items:flex-start;width:100%;min-height:100dvh;display:flex}.app-container{background-color:var(--bg-app);width:100%;max-width:480px;min-height:100dvh;padding-bottom:env(safe-area-inset-bottom);flex-direction:column;display:flex;position:relative;box-shadow:0 0 40px #00000014}.banner-wrapper{padding-top:max(20px, calc(14px + env(safe-area-inset-top)));background-color:var(--bg-app);padding-bottom:8px;padding-left:16px;padding-right:16px}.banner-card{color:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-banner);background:linear-gradient(135deg,#1e3a8a 0%,#2563eb 55%,#3b82f6 100%);padding:16px;position:relative;overflow:hidden}.banner-card:before{content:"";pointer-events:none;background:#ffffff1f;border-radius:50%;width:140px;height:140px;position:absolute;top:-40px;right:-40px}.banner-card:after{content:"";pointer-events:none;background:#ffffff0f;border-radius:50%;width:160px;height:160px;position:absolute;bottom:-50px;left:-20px}.banner-top-bar{z-index:10;justify-content:space-between;align-items:center;display:flex;position:relative}.icon-btn{color:#fff;border-radius:var(--radius-full);cursor:pointer;touch-action:manipulation;z-index:15;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;min-width:44px;height:44px;min-height:44px;transition:var(--transition-fast);background:#ffffff2e;border:1px solid #ffffff40;justify-content:center;align-items:center;display:inline-flex;position:relative}.icon-btn:active{background:#ffffff59;transform:scale(.92)}.app-brand{border-radius:var(--radius-full);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000026;align-items:center;gap:6px;padding:4px 12px;display:flex}.brand-dot{background-color:#60a5fa;border-radius:50%;width:8px;height:8px;box-shadow:0 0 8px #60a5fa}.brand-title{letter-spacing:.5px;text-transform:uppercase;font-size:.95rem;font-weight:700}.deposite-list-trigger{border-radius:var(--radius-full);gap:6px;width:auto;min-width:44px;padding:0 12px}.dep-badge-count{border-radius:var(--radius-full);background:#ffffff38;padding:2px 8px;font-size:.78rem;font-weight:600}.banner-balance-section{text-align:center;z-index:2;margin:18px 0 16px;position:relative}.balance-label{text-transform:uppercase;letter-spacing:1px;color:#93c5fd;font-size:.8rem;font-weight:600}.balance-amount-display{margin:4px 0}.balance-value{letter-spacing:-.5px;color:#fff;text-shadow:0 2px 10px #00000026;font-size:2.2rem;font-weight:800}.balance-subtext{color:#dbeafe;opacity:.9;font-size:.75rem}.banner-actions{z-index:2;justify-content:center;display:flex;position:relative}.deposit-action-btn{color:var(--primary);border-radius:var(--radius-full);cursor:pointer;transition:var(--transition-fast);background-color:#fff;border:none;align-items:center;gap:8px;padding:10px 22px;font-size:.92rem;font-weight:700;display:inline-flex;box-shadow:0 4px 14px #00000026}.deposit-action-btn:active{background-color:#f0f7ff;transform:scale(.96)}.main-content{flex:1;padding:8px 16px}.expense-section{flex-direction:column;gap:12px;display:flex}.section-header{justify-content:space-between;align-items:center;margin-bottom:4px;display:flex}.section-title-wrapper{align-items:center;gap:10px;display:flex}.section-icon{border-radius:10px;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.expense-icon-bg{background-color:var(--expense-bg);color:var(--expense-color)}.section-title{color:var(--text-primary);font-size:1.15rem;font-weight:700;line-height:1.2}.section-subtitle{color:var(--text-secondary);font-size:.76rem;display:block}.add-expense-btn{background-color:var(--expense-bg);color:var(--expense-color);border:1px solid var(--expense-border);border-radius:var(--radius-full);cursor:pointer;transition:var(--transition-fast);align-items:center;gap:6px;padding:8px 14px;font-size:.82rem;font-weight:600;display:inline-flex}.add-expense-btn:active{background-color:#ffe4e6;transform:scale(.95)}.controls-card{background-color:var(--bg-card);border-radius:var(--radius-md);border:1px solid var(--border-light);box-shadow:var(--shadow-sm);flex-direction:column;gap:8px;padding:10px 12px;display:flex}.search-input-wrapper{align-items:center;display:flex;position:relative}.search-icon{color:var(--text-muted);pointer-events:none;position:absolute;left:10px}.search-input{border:1px solid var(--border-light);border-radius:var(--radius-sm);background-color:var(--bg-subtle);width:100%;transition:var(--transition-fast);outline:none;padding:8px 30px 8px 34px;font-family:inherit;font-size:.88rem}.search-input:focus{border-color:var(--border-focus);background-color:#fff;box-shadow:0 0 0 3px #2563eb1a}.clear-search-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;font-size:1.2rem;line-height:1;position:absolute;right:10px}.filter-dropdowns{gap:8px;display:flex}.filter-group{flex:1}.filter-select{width:100%;color:var(--text-secondary);background-color:var(--bg-subtle);border:1px solid var(--border-light);border-radius:var(--radius-sm);cursor:pointer;outline:none;padding:6px 10px;font-family:inherit;font-size:.78rem;font-weight:500}.filter-select:focus{border-color:var(--primary)}.transaction-list{flex-direction:column;gap:8px;margin-top:4px;display:flex}.transaction-card{background-color:var(--bg-card);border-radius:var(--radius-md);border:1px solid var(--border-light);box-shadow:var(--shadow-sm);transition:var(--transition-fast);justify-content:space-between;align-items:center;padding:12px 14px;display:flex}.transaction-card:hover{border-color:var(--primary-border)}.tx-left{align-items:center;gap:12px;display:flex}.tx-icon-pill{border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;display:flex}.expense-pill{background-color:var(--expense-bg);color:var(--expense-color)}.deposit-pill{background-color:var(--deposit-bg);color:var(--deposit-color)}.tx-info{flex-direction:column;display:flex}.tx-detail{color:var(--text-primary);font-size:.92rem;font-weight:600}.tx-date{color:var(--text-muted);font-size:.75rem}.tx-right{align-items:center;gap:10px;display:flex}.tx-amount{letter-spacing:-.2px;font-size:.95rem;font-weight:700}.expense-amount{color:var(--expense-color)}.deposit-amount{color:var(--deposit-color)}.tx-actions{opacity:.85;gap:4px;display:flex}.action-icon-btn{width:28px;height:28px;color:var(--text-muted);cursor:pointer;transition:var(--transition-fast);background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;display:flex}.action-icon-btn.edit-btn:hover{background-color:var(--primary-light);color:var(--primary)}.action-icon-btn.delete-btn:hover{background-color:var(--expense-bg);color:var(--expense-color)}.empty-state{text-align:center;background-color:var(--bg-card);border-radius:var(--radius-md);border:1px dashed var(--border-light);flex-direction:column;align-items:center;gap:8px;padding:32px 16px;display:flex}.empty-icon-bg{background-color:var(--expense-bg);width:56px;height:56px;color:var(--expense-color);border-radius:50%;justify-content:center;align-items:center;margin-bottom:4px;display:flex}.deposit-empty-icon{background-color:var(--deposit-bg);color:var(--deposit-color)}.empty-state h3{font-size:1rem;font-weight:700}.empty-state p{color:var(--text-secondary);max-width:260px;font-size:.8rem}.margin-top-btn{margin-top:8px}.deposits-screen-view{padding-top:max(20px, calc(14px + env(safe-area-inset-top)));flex-direction:column;gap:12px;padding-bottom:12px;padding-left:16px;padding-right:16px;display:flex}.screen-header{justify-content:space-between;align-items:center;margin-bottom:4px;display:flex}.back-btn{background-color:var(--bg-card);color:var(--text-primary);border:1px solid var(--border-light)}.screen-header-title{text-align:center}.screen-header-title h2{font-size:1.1rem;font-weight:700}.screen-header-sub{color:var(--text-muted);font-size:.72rem;display:block}.add-deposit-header-btn{background-color:var(--deposit-bg);color:var(--deposit-color);border:1px solid var(--deposit-border);border-radius:var(--radius-full);cursor:pointer;align-items:center;gap:6px;padding:8px 14px;font-size:.82rem;font-weight:600;display:inline-flex}.deposit-summary-card{color:#fff;border-radius:var(--radius-md);background:linear-gradient(135deg,#059669 0%,#10b981 100%);justify-content:space-between;align-items:center;padding:16px;display:flex;box-shadow:0 4px 14px #10b98140}.dep-summary-left{flex-direction:column;display:flex}.dep-summary-label{text-transform:uppercase;letter-spacing:.5px;color:#a7f3d0;font-size:.75rem;font-weight:600}.dep-summary-val{font-size:1.6rem;font-weight:800}.dep-summary-badge{border-radius:var(--radius-full);background:#fff3;align-items:center;gap:6px;padding:6px 12px;font-size:.8rem;font-weight:600;display:flex}.drawer-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background-color:#0f172a73;justify-content:flex-start;animation:.2s ease-out forwards fadeIn;display:flex;position:fixed;inset:0}.drawer-content{background-color:var(--bg-card);flex-direction:column;width:82%;max-width:320px;height:100%;animation:.25s cubic-bezier(.4,0,.2,1) forwards slideDrawer;display:flex;box-shadow:10px 0 30px #00000026}@keyframes slideDrawer{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.drawer-header{border-bottom:1px solid var(--border-light);justify-content:space-between;align-items:center;padding:16px;display:flex}.drawer-title-group{align-items:center;gap:10px;display:flex}.drawer-logo-icon{background-color:var(--primary-light);width:32px;height:32px;color:var(--primary);border-radius:8px;justify-content:center;align-items:center;display:flex}.drawer-title{font-size:1.05rem;font-weight:700}.close-drawer-btn{color:var(--text-muted);background:0 0;border:none}.drawer-tabs{border-bottom:1px solid var(--border-light);background-color:var(--bg-subtle);display:flex}.drawer-tab{color:var(--text-secondary);cursor:pointer;transition:var(--transition-fast);background:0 0;border:none;border-bottom:2px solid #0000;flex:1;padding:10px;font-size:.82rem;font-weight:600}.drawer-tab.active{color:var(--primary);border-bottom-color:var(--primary);background-color:var(--bg-card)}.drawer-body{flex-direction:column;flex:1;gap:16px;padding:16px;display:flex;overflow-y:auto}.setting-card{background-color:var(--bg-subtle);border:1px solid var(--border-light);border-radius:var(--radius-md);padding:14px}.setting-label{color:var(--text-primary);font-size:.88rem;font-weight:700;display:block}.setting-desc{color:var(--text-secondary);margin:4px 0 12px;font-size:.76rem}.custom-select{border-radius:var(--radius-sm);border:1px solid var(--border-light);width:100%;color:var(--text-primary);background-color:#fff;outline:none;padding:10px 12px;font-family:inherit;font-size:.9rem;font-weight:600}.custom-select:focus{border-color:var(--primary)}.app-info-card{background-color:var(--primary-light);border:1px solid var(--primary-border);border-radius:var(--radius-md);color:var(--primary-hover);padding:14px}.app-info-card h3{font-size:.9rem;font-weight:700}.app-info-card p{margin-top:2px;font-size:.78rem}.pwa-status-pill{border-radius:var(--radius-full);color:var(--primary);background-color:#fff;align-items:center;gap:6px;margin-top:10px;padding:4px 10px;font-size:.72rem;font-weight:600;display:inline-flex}.online-dot{background-color:#10b981;border-radius:50%;width:7px;height:7px}.action-button-group{flex-direction:column;gap:8px;display:flex}.flex-btn{border-radius:var(--radius-sm);cursor:pointer;justify-content:center;align-items:center;gap:8px;width:100%;padding:10px;font-size:.85rem;font-weight:600;display:flex}.secondary-btn{border:1px solid var(--border-light);color:var(--text-primary);background-color:#fff}.secondary-btn:active{background-color:var(--bg-app)}.danger-card{border-color:var(--expense-border)}.text-danger{color:var(--expense-color)}.danger-btn{background-color:var(--expense-bg);color:var(--expense-color);border:1px solid var(--expense-border)}.danger-btn:active{background-color:#ffe4e6}.file-input-label{margin:0}.drawer-footer{text-align:center;color:var(--text-muted);border-top:1px solid var(--border-light);padding:12px;font-size:.72rem}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1100;background-color:#0f172a80;justify-content:center;align-items:flex-end;animation:.2s ease-out forwards fadeIn;display:flex;position:fixed;inset:0}.modal-content.bottom-sheet{background-color:var(--bg-card);border-top-left-radius:var(--radius-lg);border-top-right-radius:var(--radius-lg);width:100%;max-width:480px;max-height:90vh;padding:16px 20px 24px;animation:.28s cubic-bezier(.4,0,.2,1) forwards slideBottomSheet;overflow-y:auto;box-shadow:0 -10px 30px #0003}@keyframes slideBottomSheet{0%{transform:translateY(100%)}to{transform:translateY(0)}}.bottom-sheet-handle{background-color:var(--border-light);border-radius:var(--radius-full);width:38px;height:4px;margin:0 auto 12px}.modal-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.modal-title-group{align-items:center;gap:8px;display:flex}.type-badge{border-radius:var(--radius-full);text-transform:uppercase;padding:3px 8px;font-size:.72rem;font-weight:700}.deposit-badge{background-color:var(--deposit-bg);color:var(--deposit-color)}.expense-badge{background-color:var(--expense-bg);color:var(--expense-color)}.modal-title{font-size:1.1rem;font-weight:700}.close-modal-btn{color:var(--text-muted);background:0 0;border:none}.modal-form{flex-direction:column;gap:16px;display:flex}.form-error-alert{background-color:var(--expense-bg);color:var(--expense-color);border-radius:var(--radius-sm);padding:8px 12px;font-size:.8rem;font-weight:600}.form-group{flex-direction:column;gap:6px;display:flex}.form-label{color:var(--text-secondary);font-size:.82rem;font-weight:600}.input-with-icon,.input-with-symbol{align-items:center;display:flex;position:relative}.input-icon{color:var(--text-muted);pointer-events:none;position:absolute;left:12px}.currency-prefix{color:var(--primary);pointer-events:none;font-size:1.1rem;font-weight:700;position:absolute;left:14px}.form-input{border:1px solid var(--border-light);border-radius:var(--radius-sm);background-color:var(--bg-subtle);width:100%;transition:var(--transition-fast);outline:none;padding:12px 14px;font-family:inherit;font-size:.95rem}.input-with-icon .form-input{padding-left:38px}.input-with-symbol .form-input{padding-left:38px;font-size:1.25rem;font-weight:700}.form-input:focus{border-color:var(--primary);background-color:#fff;box-shadow:0 0 0 3px #2563eb1f}.suggestion-chips{flex-wrap:wrap;gap:6px;margin-top:4px;display:flex}.chip-btn{background-color:var(--bg-subtle);border:1px solid var(--border-light);color:var(--text-secondary);border-radius:var(--radius-full);cursor:pointer;transition:var(--transition-fast);padding:4px 10px;font-size:.72rem;font-weight:500}.chip-btn:hover,.chip-btn:active{background-color:var(--primary-light);color:var(--primary);border-color:var(--primary-border)}.modal-actions{gap:10px;margin-top:8px;display:flex}.cancel-btn{background-color:var(--bg-subtle);border:1px solid var(--border-light);color:var(--text-secondary);border-radius:var(--radius-md);cursor:pointer;flex:1;padding:12px;font-size:.9rem;font-weight:600}.submit-btn{color:#fff;border-radius:var(--radius-md);cursor:pointer;box-shadow:var(--shadow-md);transition:var(--transition-fast);border:none;flex:2;padding:12px;font-size:.92rem;font-weight:700}.deposit-submit{background:linear-gradient(135deg,#059669 0%,#10b981 100%)}.expense-submit{background:linear-gradient(135deg,#e11d48 0%,#f43f5e 100%)}.submit-btn:active{transform:scale(.97)}.toast-container{z-index:1200;pointer-events:none;animation:.25s cubic-bezier(.4,0,.2,1) forwards slideToast;position:fixed;bottom:24px;left:50%;transform:translate(-50%)}@keyframes slideToast{0%{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%)}}.toast-content{color:#fff;border-radius:var(--radius-full);background-color:#0f172a;align-items:center;gap:10px;padding:10px 18px;font-size:.85rem;font-weight:600;display:flex;box-shadow:0 10px 25px #00000040}.toast-icon{color:#fff;background-color:#10b981;border-radius:50%;justify-content:center;align-items:center;width:22px;height:22px;display:flex}.user-profile-card{background-color:var(--primary-light);border:1px solid var(--primary-border);border-radius:var(--radius-md);align-items:center;gap:12px;margin-bottom:12px;padding:12px;display:flex}.user-avatar-badge{color:#fff;background:linear-gradient(135deg,#2563eb 0%,#1d4ed8 100%);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;font-size:1.1rem;font-weight:700;display:flex;box-shadow:0 2px 8px #2563eb4d}.user-info{flex-direction:column;flex:1;display:flex;overflow:hidden}.user-name{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:.92rem;font-weight:700;overflow:hidden}.user-email{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:.74rem;overflow:hidden}.logout-btn{border:1px solid var(--expense-border);color:var(--expense-color);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition-fast);background-color:#fff;padding:5px 10px;font-size:.75rem;font-weight:600}.logout-btn:active{background-color:var(--expense-bg)}.auth-page{background:linear-gradient(#eff6ff 0%,#f8fafc 100%);justify-content:center;align-items:center;padding:20px 16px}.auth-card{background-color:var(--bg-card);border-radius:var(--radius-lg);width:100%;max-width:400px;box-shadow:var(--shadow-lg);border:1px solid var(--border-light);flex-direction:column;gap:16px;padding:24px 20px;display:flex}.auth-header{text-align:center}.auth-brand-badge{background-color:var(--primary-light);border-radius:var(--radius-full);align-items:center;gap:6px;margin-bottom:8px;padding:4px 12px;display:inline-flex}.auth-brand-name{color:var(--primary);letter-spacing:.5px;text-transform:uppercase;font-size:.85rem;font-weight:800}.auth-title{color:var(--text-primary);font-size:1.35rem;font-weight:800}.auth-subtitle{color:var(--text-secondary);margin-top:2px;font-size:.8rem}.auth-tabs{background-color:var(--bg-subtle);border-radius:var(--radius-sm);border:1px solid var(--border-light);padding:3px;display:flex}.auth-tab{color:var(--text-secondary);cursor:pointer;transition:var(--transition-fast);background:0 0;border:none;border-radius:6px;flex:1;padding:8px;font-size:.85rem;font-weight:600}.auth-tab.active{color:var(--primary);box-shadow:var(--shadow-sm);background-color:#fff}.auth-form{flex-direction:column;gap:12px;display:flex}.auth-submit-btn{margin-top:6px}.auth-divider{text-align:center;color:var(--text-muted);align-items:center;margin:4px 0;font-size:.72rem;font-weight:700;display:flex}.auth-divider:before,.auth-divider:after{content:"";border-bottom:1px solid var(--border-light);flex:1}.auth-divider span{padding:0 10px}.demo-btn{background-color:var(--primary-light);border-color:var(--primary-border);color:var(--primary)}.demo-btn:active{background-color:#dbeafe}.auth-footer-note{text-align:center;color:var(--text-muted);margin-top:4px;font-size:.72rem}.pwa-install-banner{margin:-4px 0 6px}.pwa-download-action-btn{border:1px solid var(--primary-border);border-radius:var(--radius-md);width:100%;color:var(--primary-hover);cursor:pointer;text-align:left;transition:var(--transition-fast);background:linear-gradient(135deg,#eff6ff 0%,#dbeafe 100%);align-items:center;gap:12px;padding:12px 14px;display:flex;box-shadow:0 2px 8px #2563eb1a}.pwa-download-action-btn:active{background:#bfdbfe;transform:scale(.98)}.pwa-badge-icon{font-size:1.4rem}.pwa-download-info{flex-direction:column;display:flex}.pwa-download-title{color:var(--primary-hover);font-size:.88rem;font-weight:700}.pwa-download-sub{color:var(--text-secondary);font-size:.73rem}.pwa-download-info-pill{background-color:var(--bg-subtle);border:1px solid var(--border-light);border-radius:var(--radius-md);color:var(--text-secondary);justify-content:center;align-items:center;gap:8px;padding:8px 12px;font-size:.76rem;font-weight:600;display:flex}