:root{--primary: #ff6b35;--primary-light: #fff4f0;--primary-gradient: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);--danger: #e53935;--success: #2e7d32;--info: #1976d2;--text: #1a1a1a;--text-secondary: #666;--text-muted: #999;--bg: #f5f6fa;--card-bg: #ffffff;--border: #e8eaed;--radius: 12px;--radius-sm: 8px;--nav-h: auto}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,sans-serif;color:var(--text);background:var(--bg);line-height:1.5;min-height:100vh;overflow-x:hidden;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}#root{max-width:480px;margin:0 auto;min-height:100vh;position:relative;background:var(--bg)}.page{padding:12px 16px 24px;min-height:calc(100vh - 120px)}.page-title{font-size:1.2rem;font-weight:700;margin-bottom:12px;color:var(--text)}.loading-spinner{text-align:center;padding:3rem 1rem;color:var(--text-secondary);font-size:.95rem}.dash-header-card{background:var(--primary-gradient);border-radius:var(--radius);padding:20px 18px;display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;box-shadow:0 4px 16px #ff6b3540}.dash-header-left{display:flex;align-items:center;gap:10px}.dash-header-avatar{width:42px;height:42px;border-radius:50%;background:#ffffff40;color:#fff;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;flex-shrink:0}.dash-header-title{color:#fff;font-size:1rem;font-weight:600}.dash-header-sub{color:#ffffffbf;font-size:.78rem;margin-top:2px}.dash-header-right{text-align:right}.dash-header-net{color:#fff;font-size:1.5rem;font-weight:800}.dash-header-net.neg{opacity:.85}.dash-header-net-label{color:#ffffffb3;font-size:.72rem;margin-top:2px}.period-switcher{display:flex;gap:0;background:var(--card-bg);border-radius:20px;padding:3px;margin-bottom:14px;box-shadow:0 1px 3px #0000000f}.period-btn{flex:1;padding:7px 0;border:none;background:transparent;font-size:.88rem;font-weight:600;color:var(--text-secondary);cursor:pointer;border-radius:17px;transition:all .2s ease}.period-btn.active{background:var(--primary);color:#fff;box-shadow:0 2px 6px #ff6b354d}.stat-cards-row{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:16px}.stat-card{background:var(--card-bg);border-radius:var(--radius);padding:14px 12px;display:flex;align-items:center;gap:10px;box-shadow:0 1px 4px #0000000f;border-left:4px solid transparent;transition:transform .15s}.stat-card:active{transform:scale(.97)}.stat-card--green{border-left-color:var(--success)}.stat-card--red{border-left-color:var(--danger)}.stat-card--blue{border-left-color:var(--info)}.stat-card--orange{border-left-color:var(--primary)}.stat-card-icon{font-size:22px;flex-shrink:0}.stat-card-body{flex:1;min-width:0}.stat-card-value{font-size:1.05rem;font-weight:800;color:var(--text);line-height:1.2}.stat-card-value.neg{color:var(--danger)}.stat-card-label{font-size:.73rem;color:var(--text-secondary);margin-top:2px}.dash-section{margin-bottom:18px}.dash-section-title{font-size:.92rem;font-weight:600;margin-bottom:10px;color:var(--text);padding-left:2px}.dash-actions{margin-top:16px}.txn-filter-bar{display:flex;gap:6px;margin-bottom:12px;align-items:center}.filter-input,.filter-select{padding:7px 10px;border:1.5px solid var(--border);border-radius:var(--radius-sm);font-size:.85rem;outline:none;background:var(--card-bg);font-family:inherit}.filter-input:focus,.filter-select:focus{border-color:var(--primary)}.filter-select{min-width:80px}.filter-toggle{width:34px;height:34px;border:1.5px solid var(--border);border-radius:var(--radius-sm);background:var(--card-bg);font-size:1.1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}.filter-toggle.active{border-color:var(--primary);color:var(--primary)}.txn-date-group{margin-bottom:12px}.txn-date-header{font-size:.82rem;font-weight:600;color:var(--text-secondary);padding:6px 4px 4px}.txn-item{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;margin-bottom:6px}.txn-item-left{flex:1;min-width:0}.txn-item-right{text-align:right;flex-shrink:0;margin-left:10px;display:flex;align-items:center;gap:6px}.txn-item-cat{display:flex;align-items:center;gap:5px;margin-bottom:3px}.txn-cat-icon{font-size:16px}.txn-cat-name{font-size:.9rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.txn-item-detail{font-size:.8rem;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.txn-amount{font-size:.95rem;font-weight:700;white-space:nowrap}.txn-amount.income{color:var(--success)}.txn-del-btn{padding:3px 8px;font-size:.72rem}.account-list{display:flex;flex-direction:column;gap:8px}.account-card{padding:14px 16px}.account-card-header{display:flex;align-items:center;gap:8px;margin-bottom:10px}.account-type-badge{font-size:.78rem;padding:2px 8px;border-radius:999px;background:var(--primary-light);color:var(--primary);font-weight:600}.account-balance-row{display:flex;justify-content:space-between;align-items:center;padding:6px 0;border-bottom:1px dashed var(--border);margin-bottom:8px}.account-balance-label{font-size:.85rem;color:var(--text-secondary)}.account-balance-value{font-size:1.1rem;font-weight:700}.account-balance-value.neg{color:var(--danger)}.account-stats-row{display:flex;gap:16px}.account-stat{flex:1}.account-stat-label{display:block;font-size:.73rem;color:var(--text-muted);margin-bottom:2px}.account-stat-val{font-size:.88rem;font-weight:600}.account-stat-val.income{color:var(--success)}.account-stat-val.expense{color:var(--danger)}.trip-list{display:flex;flex-direction:column;gap:8px}.trip-form{margin-bottom:14px}.purpose-list{display:flex;flex-direction:column;gap:6px}.purpose-item{display:flex;justify-content:space-between;align-items:center;padding:12px 14px}.purpose-item-left{display:flex;align-items:center;gap:8px}.purpose-tag{font-size:.85rem;font-weight:600;padding:3px 10px;border-radius:999px;background:var(--primary-light);color:var(--primary)}.purpose-count{font-size:.78rem;color:var(--text-muted)}.purpose-item-right{text-align:right}.purpose-distance{display:block;font-size:.82rem;color:var(--text-secondary)}.purpose-cost{display:block;font-size:.95rem;font-weight:700;color:var(--danger)}.trip-item{padding:14px 16px;position:relative}.trip-item-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.trip-date{font-size:.8rem;color:var(--text-muted)}.trip-item-body{display:flex;gap:16px;margin-bottom:6px}.trip-stat{flex:1}.trip-stat-label{display:block;font-size:.73rem;color:var(--text-muted);margin-bottom:2px}.trip-stat strong{font-size:.95rem}.expense-color{color:var(--danger)}.trip-note{font-size:.8rem;color:var(--text-muted);margin-bottom:6px}.trip-del-btn{position:absolute;top:14px;right:14px;padding:3px 8px;font-size:.72rem}.card{background:var(--card-bg);border-radius:var(--radius);padding:14px 16px;box-shadow:0 1px 3px #0000000f;margin-bottom:10px}.card-row{display:flex;justify-content:space-between;align-items:center;padding:4px 0}.card-row+.card-row{border-top:1px solid var(--border)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:4px;padding:11px 18px;border-radius:var(--radius-sm);border:none;font-size:.95rem;font-weight:600;cursor:pointer;transition:opacity .15s,transform .1s;-webkit-tap-highlight-color:transparent}.btn:active{opacity:.75;transform:scale(.98)}.btn-primary{background:var(--primary);color:#fff}.btn-danger{background:var(--danger);color:#fff}.btn-outline{background:transparent;border:1.5px solid var(--primary);color:var(--primary)}.btn-sm{padding:6px 14px;font-size:.82rem}.btn-block{width:100%}.form-group{margin-bottom:12px}.form-group label{display:block;font-size:.85rem;color:var(--text-secondary);margin-bottom:4px;font-weight:500}.form-group input,.form-group select,.form-group textarea{width:100%;padding:10px 12px;border:1.5px solid var(--border);border-radius:var(--radius-sm);font-size:1rem;outline:none;transition:border-color .15s;background:#fff;font-family:inherit;-webkit-appearance:none}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--primary)}.list-item{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:var(--card-bg);border-radius:var(--radius);margin-bottom:6px;box-shadow:0 1px 2px #0000000a}.list-item .li-left{flex:1;min-width:0}.list-item .li-right{text-align:right;flex-shrink:0;margin-left:10px}.tag{display:inline-block;padding:2px 8px;border-radius:999px;font-size:.76rem;font-weight:600}.tag-income{background:#e8f5e9;color:#2e7d32}.tag-expense{background:#fce4ec;color:#c62828}.empty-state{text-align:center;padding:3rem 1rem;color:var(--text-secondary);font-size:.95rem}.chart-wrap{width:100%;height:260px;background:var(--card-bg);border-radius:var(--radius);padding:8px;box-shadow:0 1px 3px #0000000f}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-thumb{background:#ccc;border-radius:4px}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn .25s ease-out both}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}.stat-box{background:var(--card-bg);border-radius:var(--radius);padding:12px 8px;text-align:center;box-shadow:0 1px 3px #0000000f}.stat-box .stat-label{font-size:.76rem;color:var(--text-secondary)}.stat-box .stat-value{font-size:1.05rem;font-weight:700;margin-top:2px}.stat-value.income{color:var(--success)}.stat-value.expense{color:var(--danger)}.tabs{display:flex;gap:0;background:var(--card-bg);border-radius:var(--radius);padding:3px;margin-bottom:12px;overflow-x:auto}.tab-btn{flex:1;padding:8px 0;border:none;background:transparent;font-size:.88rem;font-weight:600;color:var(--text-secondary);cursor:pointer;border-radius:7px;white-space:nowrap}.tab-btn.active{background:var(--primary);color:#fff}.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:#1a1a2e;padding:20px}.login-card{width:100%;max-width:380px;background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:40px 28px 28px;text-align:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.login-icon{width:64px;height:64px;margin:0 auto 16px;background:linear-gradient(135deg,#ff6b35,#f7931e);border-radius:16px;display:flex;align-items:center;justify-content:center;color:#fff}.login-title{font-size:1.5rem;font-weight:700;color:#eee;margin-bottom:4px}.login-subtitle{font-size:.88rem;color:#888;margin-bottom:28px}.login-field{text-align:left;margin-bottom:16px}.login-field label{display:block;font-size:.82rem;color:#999;margin-bottom:6px;font-weight:500}.login-field input{width:100%;padding:12px 14px;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:#00000040;color:#eee;font-size:1rem;outline:none;transition:border-color .2s;font-family:inherit;-webkit-appearance:none}.login-field input::placeholder{color:#555}.login-field input:focus{border-color:var(--primary)}.login-error{color:#f87171;font-size:.85rem;margin-bottom:12px;min-height:20px}.login-btn{width:100%;padding:13px;border:none;border-radius:10px;background:linear-gradient(135deg,#ff6b35,#e85a20);color:#fff;font-size:1rem;font-weight:600;cursor:pointer;transition:opacity .15s,transform .1s;-webkit-tap-highlight-color:transparent}.login-btn:hover{opacity:.92}.login-btn:active{opacity:.8;transform:scale(.98)}.login-btn:disabled{opacity:.5;cursor:not-allowed}.login-footer{margin-top:20px;font-size:.78rem;color:#555}.top-nav{position:sticky;top:0;z-index:100;background:#fff;border-bottom:1px solid var(--border, #eee)}.top-nav-inner{max-width:480px;margin:0 auto}.top-nav-brand{display:flex;align-items:center;gap:8px;padding:12px 16px 8px}.top-nav-logo{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#ff6b35,#f7931e);color:#fff;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;flex-shrink:0}.top-nav-title{font-size:15px;font-weight:600;color:var(--text, #1a1a1a)}.top-nav-tabs{display:flex;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;padding:0 12px 10px;gap:6px}.top-nav-tabs::-webkit-scrollbar{display:none}.top-tab{flex-shrink:0;display:flex;align-items:center;gap:4px;padding:7px 14px;border:1.5px solid transparent;border-radius:20px;background:#f5f5f5;color:#666;font-size:13px;cursor:pointer;transition:all .2s ease;white-space:nowrap;-webkit-tap-highlight-color:transparent}.top-tab.active{border-color:var(--primary, #2f6df6);background:#eff4ff;color:var(--primary, #2f6df6);font-weight:600}.top-tab-icon{font-size:14px}.top-tab-label{font-size:13px}