*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#f5f6fa;--surface:#fff;--border:#e2e6ea;--text:#2d3748;--text-muted:#718096;--primary:#6c63ff;--primary-light:#ede9ff;--success:#38a169;--success-light:#e6ffed;--warning:#d97706;--warning-light:#fffbeb;--danger:#e53e3e;--danger-light:#fff5f5;--radius:12px;--shadow:0 1px 3px #00000014, 0 1px 2px #0000000a;--shadow-md:0 4px 12px #0000001a;--bottom-nav-height:64px}html{-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--text);overscroll-behavior:none;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}#root{min-height:100vh}.app{flex-direction:column;min-height:100vh;display:flex}.header{background:var(--primary);color:#fff;box-shadow:var(--shadow-md);z-index:50;justify-content:space-between;align-items:center;padding:14px 20px;display:flex;position:sticky;top:0}.header-left h1{letter-spacing:-.3px;font-size:1.15rem;font-weight:700}.header-left p{opacity:.8;margin-top:1px;font-size:.72rem}.month-nav{align-items:center;gap:8px;font-size:.88rem;font-weight:600;display:flex}.month-nav button{color:#fff;cursor:pointer;-webkit-tap-highlight-color:transparent;background:#fff3;border:none;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:1.1rem;transition:background .15s;display:flex}.month-nav button:active{background:#fff6}.main{width:100%;max-width:960px;padding:16px 12px;padding-bottom:calc(var(--bottom-nav-height) + 16px);flex:1;margin:0 auto}@media (width>=640px){.main{padding:24px 20px}}.summary-grid{grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px;display:grid}@media (width<=400px){.summary-grid{grid-template-columns:1fr;gap:8px}}.summary-card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);border-left:4px solid #0000;padding:12px 14px}@media (width>=640px){.summary-card{padding:16px 20px}}.summary-card.income{border-color:var(--success)}.summary-card.spent{border-color:var(--danger)}.summary-card.remaining{border-color:var(--primary)}.summary-card .label{text-transform:uppercase;letter-spacing:.6px;color:var(--text-muted);font-size:.65rem;font-weight:600}.summary-card .amount{margin-top:3px;font-size:1.3rem;font-weight:700}@media (width>=640px){.summary-card .amount{font-size:1.55rem}}.summary-card.income .amount{color:var(--success)}.summary-card.spent .amount{color:var(--danger)}.summary-card.remaining .amount{color:var(--primary)}.tabs{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);gap:4px;margin-bottom:16px;padding:4px;display:flex}@media (width<=639px){.tabs{display:none}}.tab-btn{cursor:pointer;color:var(--text-muted);-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-radius:8px;flex:1;padding:8px 10px;font-size:.82rem;font-weight:500;transition:all .15s}.tab-btn.active{background:var(--primary);color:#fff;font-weight:600}.tab-btn:hover:not(.active){background:var(--bg);color:var(--text)}.bottom-nav{display:none}@media (width<=639px){.bottom-nav{height:var(--bottom-nav-height);border-top:1px solid var(--border);z-index:50;padding-bottom:env(safe-area-inset-bottom);background:#fff;display:flex;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -2px 12px #00000014}}.bottom-nav-item{cursor:pointer;color:var(--text-muted);text-transform:uppercase;letter-spacing:.3px;-webkit-tap-highlight-color:transparent;background:0 0;border:none;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:3px;padding:6px 0;font-size:.62rem;font-weight:600;transition:color .15s;display:flex}.bottom-nav-item.active{color:var(--primary)}.bottom-nav-item .nav-icon{font-size:1.3rem;line-height:1}.card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:12px;overflow:hidden}.card-header{border-bottom:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;padding:12px 16px;display:flex}@media (width>=640px){.card-header{padding:14px 20px}}.card-header h2{font-size:.92rem;font-weight:700}.card-body{padding:14px 16px}@media (width>=640px){.card-body{padding:16px 20px}}.btn{cursor:pointer;-webkit-tap-highlight-color:transparent;border:none;border-radius:8px;align-items:center;gap:6px;min-height:40px;padding:10px 16px;font-size:.83rem;font-weight:600;transition:all .15s;display:inline-flex}.btn-primary{background:var(--primary);color:#fff}.btn-primary:active{filter:brightness(.9)}.btn-ghost{color:var(--text-muted);border:1px solid var(--border);background:0 0}.btn-ghost:active{background:var(--bg)}.btn-danger{background:var(--danger-light);color:var(--danger)}.btn-danger:active{background:#fed7d7}.btn-sm{min-height:34px;padding:6px 12px;font-size:.75rem}.btn-full{justify-content:center;width:100%}.form-row{flex-wrap:wrap;gap:10px;display:flex}.form-group{flex-direction:column;flex:1;gap:5px;min-width:120px;display:flex}.form-group label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.4px;font-size:.72rem;font-weight:600}.form-group input,.form-group select{border:1.5px solid var(--border);color:var(--text);background:var(--bg);border-radius:8px;outline:none;width:100%;padding:11px 12px;font-size:max(16px,.9rem);transition:border-color .15s}.form-group input:focus,.form-group select:focus{border-color:var(--primary);background:#fff}.category-list{flex-direction:column;gap:14px;display:flex}.category-item{flex-direction:column;gap:6px;display:flex}.category-top{justify-content:space-between;align-items:center;gap:8px;display:flex}.category-name{flex-shrink:0;align-items:center;gap:8px;font-size:.88rem;font-weight:600;display:flex}.cat-icon{border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:30px;height:30px;font-size:.9rem;display:flex}.category-amounts{color:var(--text-muted);flex-wrap:wrap;justify-content:flex-end;gap:8px;font-size:.78rem;display:flex}.category-amounts .spent-amt{color:var(--text);font-weight:600}.progress-bar{background:var(--border);border-radius:99px;height:7px;overflow:hidden}.progress-fill{border-radius:99px;height:100%;transition:width .4s}.progress-fill.ok{background:var(--success)}.progress-fill.warn{background:var(--warning)}.progress-fill.over{background:var(--danger)}.tx-list{flex-direction:column;display:flex}.tx-item{border-bottom:1px solid var(--border);align-items:center;gap:12px;padding:12px 0;display:flex}.tx-item:last-child{border-bottom:none}.tx-icon{border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;font-size:1.1rem;display:flex}.tx-info{flex:1;min-width:0}.tx-desc{white-space:nowrap;text-overflow:ellipsis;font-size:.88rem;font-weight:600;overflow:hidden}.tx-meta{color:var(--text-muted);margin-top:2px;font-size:.73rem}.tx-right{flex-shrink:0;align-items:center;gap:8px;display:flex}.tx-amount{font-size:.9rem;font-weight:700}.tx-amount.expense{color:var(--danger)}.tx-amount.income{color:var(--success)}.modal-overlay{z-index:100;background:#00000080;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}@media (width>=640px){.modal-overlay{align-items:center;padding:16px}}.modal{width:100%;max-width:480px;box-shadow:var(--shadow-md);padding:20px 20px calc(20px + env(safe-area-inset-bottom));background:#fff;border-radius:20px 20px 0 0;max-height:92vh;overflow-y:auto}@media (width>=640px){.modal{border-radius:var(--radius);max-height:none;padding:24px}}.modal:before{content:"";background:var(--border);border-radius:99px;width:36px;height:4px;margin:0 auto 16px;display:block}@media (width>=640px){.modal:before{display:none}}.modal h3{margin-bottom:16px;font-size:1.05rem;font-weight:700}.modal-actions{justify-content:flex-end;gap:8px;margin-top:20px;display:flex}@media (width<=639px){.modal-actions{flex-direction:column-reverse}.modal-actions .btn{justify-content:center;width:100%;min-height:48px;font-size:.95rem}}.budget-setup-list{flex-direction:column;gap:12px;display:flex}.budget-setup-item{align-items:center;gap:10px;display:flex}.budget-setup-item .cat-label{flex:1;font-size:.88rem;font-weight:600}.budget-setup-item input{border:1.5px solid var(--border);text-align:right;border-radius:8px;outline:none;width:88px;padding:8px 10px;font-size:max(16px,.88rem)}.budget-setup-item input:focus{border-color:var(--primary)}.income-row{border-bottom:1px solid var(--border);align-items:center;gap:12px;padding:12px 0;display:flex}.income-row:last-child{border-bottom:none}.income-name{flex:1;font-size:.88rem;font-weight:600}.income-amount{color:var(--success);font-size:.95rem;font-weight:700}.empty{text-align:center;color:var(--text-muted);padding:36px 16px}.empty .empty-icon{margin-bottom:10px;font-size:2.5rem}.empty p{font-size:.88rem}.fab{display:none}@media (width<=639px){.fab{bottom:calc(var(--bottom-nav-height) + 16px);background:var(--primary);color:#fff;cursor:pointer;z-index:40;-webkit-tap-highlight-color:transparent;border:none;border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;font-size:1.6rem;transition:transform .15s;display:flex;position:fixed;right:16px;box-shadow:0 4px 16px #6c63ff73}.fab:active{transform:scale(.93)}}.text-muted{color:var(--text-muted)}.mt-8{margin-top:8px}.mt-12{margin-top:12px}.two-col{grid-template-columns:1fr 1fr;gap:16px;display:grid}@media (width<=640px){.two-col{grid-template-columns:1fr}}