.bottom-nav{width:100%;max-width:480px;height:var(--bottom-nav-height);background:var(--card);border-top:1px solid var(--border);z-index:100;padding-bottom:env(safe-area-inset-bottom,0);justify-content:space-around;align-items:center;display:flex;position:fixed;bottom:0;left:50%;transform:translate(-50%)}.nav-item{color:var(--text-secondary);border-radius:8px;flex-direction:column;align-items:center;gap:2px;padding:8px 16px;font-size:11px;text-decoration:none;transition:color .2s;display:flex}.nav-item.active{color:var(--primary)}.nav-icon{font-size:22px}.nav-label{font-weight:500}.record-item{border-bottom:1px solid var(--border);align-items:center;gap:12px;padding:14px 0;display:flex}.record-item:last-child{border-bottom:none}.record-icon{background:var(--bg);border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;width:42px;height:42px;font-size:22px;display:flex}.record-info{flex:1;min-width:0}.record-category{font-size:15px;font-weight:600}.record-note{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;margin-top:2px;font-size:12px;overflow:hidden}.record-date{color:var(--text-secondary);margin-top:2px;font-size:11px}.record-right{flex-shrink:0;align-items:center;gap:8px;display:flex}.record-amount{white-space:nowrap;font-size:16px;font-weight:700}.record-amount.expense{color:var(--danger)}.record-amount.income{color:var(--success)}.record-delete{cursor:pointer;opacity:.4;background:0 0;border:none;padding:4px;font-size:16px;transition:opacity .2s}.record-delete:hover{opacity:1}.home-page{padding-bottom:calc(var(--bottom-nav-height) + 20px)}.date-header{color:var(--text-secondary);margin-bottom:16px;font-size:16px;font-weight:500}.balance-card{text-align:center;color:#fff;background:linear-gradient(135deg,#667eea,#764ba2);margin-bottom:16px;padding:24px 16px}.balance-label{opacity:.85;margin-bottom:8px;font-size:14px}.balance-amount{letter-spacing:-1px;font-size:36px;font-weight:800}.balance-amount.negative{color:#ffd0d0}.summary-cards{grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px;display:grid}.summary-card{border-radius:var(--radius);color:#fff;padding:20px 16px}.summary-card.expense{background:linear-gradient(135deg,#ff6b6b,#ff5252)}.summary-card.income{background:linear-gradient(135deg,#56c596,#4caf84)}.summary-label{opacity:.9;margin-bottom:8px;font-size:13px}.summary-amount{letter-spacing:-1px;font-size:28px;font-weight:800}.quick-section{margin-bottom:16px}.quick-title{color:var(--text-secondary);margin-bottom:12px;font-size:14px;font-weight:600}.quick-buttons{flex-wrap:wrap;gap:8px;display:flex}.quick-add-btn{border:1px solid var(--border);background:var(--bg);cursor:pointer;color:var(--text);border-radius:20px;padding:10px 18px;font-family:inherit;font-size:14px;font-weight:600;transition:all .2s}.quick-add-btn:active{background:var(--primary);color:#fff;border-color:var(--primary)}.section-header{justify-content:space-between;align-items:center;margin-bottom:4px;display:flex}.section-title{font-size:16px;font-weight:700}.section-count{color:var(--text-secondary);font-size:13px}.records-page{padding-bottom:calc(var(--bottom-nav-height) + 20px)}.month-selector{margin-bottom:12px}.month-select{border:1px solid var(--border);border-radius:var(--radius);background:var(--card);width:100%;color:var(--text);appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%238e8e98' d='M6 8L1 3h10z'/%3E%3C/svg%3E");background-position:right 16px center;background-repeat:no-repeat;outline:none;padding:12px 16px;font-family:inherit;font-size:15px;font-weight:600}.month-summary{align-items:center;gap:12px;margin-bottom:16px;font-size:14px;font-weight:600;display:flex}.month-expense{color:var(--danger)}.month-income,.month-balance.positive{color:var(--success)}.month-balance.negative{color:var(--danger)}.month-divider{color:var(--border)}.stats-page{padding-bottom:calc(var(--bottom-nav-height) + 20px)}.section-title{margin-bottom:16px;font-size:16px;font-weight:700}.pie-container{justify-content:center;margin-bottom:20px;display:flex}.pie-chart{border-radius:50%;justify-content:center;align-items:center;width:180px;height:180px;display:flex;position:relative}.pie-hole{background:var(--card);width:100px;height:100px;color:var(--text-secondary);border-radius:50%;justify-content:center;align-items:center;font-size:13px;font-weight:600;display:flex}.pie-legend{flex-direction:column;gap:8px;display:flex}.legend-item{align-items:center;gap:8px;font-size:13px;display:flex}.legend-dot{border-radius:3px;flex-shrink:0;width:10px;height:10px}.legend-icon{font-size:16px}.legend-name{flex:1;font-weight:500}.legend-amount{color:var(--text);font-weight:600}.legend-percent{color:var(--text-secondary);text-align:right;width:36px}.bar-chart{padding-top:8px}.bar-grid{align-items:flex-end;gap:12px;height:180px;padding-bottom:24px;display:flex}.bar-group{flex-direction:column;flex:1;align-items:center;height:100%;display:flex}.bar-column{flex-direction:column;flex:1;justify-content:flex-end;gap:3px;width:100%;display:flex;position:relative}.bar{border-radius:4px 4px 0 0;width:100%;min-height:0;transition:height .3s}.expense-bar{background:var(--danger);opacity:.8}.income-bar{background:var(--success);opacity:.8}.bar-label{color:var(--text-secondary);margin-top:6px;font-size:11px;font-weight:500}.bar-legend{color:var(--text-secondary);justify-content:center;gap:20px;font-size:12px;display:flex}.bar-legend-item{align-items:center;gap:6px;display:flex}.bar-legend-color{border-radius:3px;width:12px;height:12px;display:inline-block}.bar-legend-color.expense{background:var(--danger);opacity:.8}.bar-legend-color.income{background:var(--success);opacity:.8}.empty-hint{text-align:center;color:var(--text-secondary);padding:40px 0;font-size:14px}.add-page{padding-bottom:calc(var(--bottom-nav-height) + 100px)}.type-toggle{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:16px;padding:4px;display:flex}.toggle-btn{cursor:pointer;color:var(--text-secondary);background:0 0;border:none;border-radius:10px;flex:1;padding:10px;font-size:15px;font-weight:600;transition:all .2s}.toggle-btn.active.expense{background:var(--danger);color:#fff}.toggle-btn.active.income{background:var(--success);color:#fff}.amount-display{text-align:center;margin-bottom:12px;padding:20px 0}.currency{color:var(--text-secondary);margin-right:4px;font-size:28px;font-weight:700}.amount-value{letter-spacing:-2px;font-size:48px;font-weight:800}.quick-amounts{gap:8px;margin-bottom:16px;padding-bottom:4px;display:flex;overflow-x:auto}.quick-btn{border:1px solid var(--border);background:var(--card);cursor:pointer;color:var(--text);border-radius:20px;flex-shrink:0;padding:8px 16px;font-size:14px;font-weight:500;transition:all .2s}.quick-btn.selected{background:var(--primary);color:#fff;border-color:var(--primary)}.category-grid{grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:16px;display:grid}.category-btn{border:1.5px solid var(--border);background:var(--card);cursor:pointer;border-radius:12px;flex-direction:column;align-items:center;gap:4px;padding:12px 4px;transition:all .2s;display:flex}.category-btn.selected{border-color:var(--primary);background:var(--primary-light)}.cat-icon{font-size:26px}.cat-name{color:var(--text-secondary);font-size:11px}.category-btn.selected .cat-name{color:var(--primary);font-weight:600}.extra-fields{gap:10px;margin-bottom:16px;display:flex}.date-input,.note-input{border:1px solid var(--border);background:var(--card);color:var(--text);border-radius:10px;outline:none;padding:10px 14px;font-family:inherit;font-size:14px}.date-input:focus,.note-input:focus{border-color:var(--primary)}.date-input{width:130px}.note-input{flex:1}.numpad{grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:16px;display:grid}.numpad-btn{border:1px solid var(--border);background:var(--card);cursor:pointer;color:var(--text);border-radius:10px;padding:16px;font-family:inherit;font-size:20px;font-weight:600;transition:background .15s}.numpad-btn:active{background:var(--bg)}.submit-btn{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:12px;width:100%;padding:16px;font-family:inherit;font-size:17px;font-weight:700;transition:opacity .2s}.submit-btn.disabled{opacity:.4;cursor:not-allowed}:root{--primary:#4f8cff;--primary-light:#e8f0ff;--danger:#ff5252;--success:#4caf84;--warning:#ffa726;--bg:#f5f6f8;--card:#fff;--text:#1a1a2e;--text-secondary:#8e8e98;--border:#e8e8ee;--shadow:0 2px 12px #0000000f;--radius:14px;--bottom-nav-height:64px}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{background:var(--bg);height:100%;color:var(--text);-webkit-font-smoothing:antialiased;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif}.app{background:var(--bg);flex-direction:column;max-width:480px;height:100%;margin:0 auto;display:flex;position:relative}.page{padding:20px 16px;padding-bottom:calc(var(--bottom-nav-height) + 20px);flex:1;overflow-y:auto}.page-title{margin-bottom:20px;font-size:24px;font-weight:700}.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:12px;padding:16px}