*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--color-primary: #6366f1;--color-primary-light: #818cf8;--color-primary-dark: #4f46e5;--color-primary-bg: #eef2ff;--color-income: #10b981;--color-income-bg: #d1fae5;--color-expense: #ef4444;--color-expense-bg: #fee2e2;--color-transfer: #f59e0b;--color-transfer-bg: #fef3c7;--color-bg: #f8fafc;--color-surface: #ffffff;--color-surface-2: #f1f5f9;--color-border: #e2e8f0;--color-text: #0f172a;--color-text-2: #64748b;--color-text-3: #94a3b8;--nav-height: 64px;--header-height: 56px;--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-top: env(safe-area-inset-top, 0px);--radius: 12px;--radius-sm: 8px;--radius-lg: 20px;--shadow-sm: 0 1px 3px rgba(0,0,0,.08);--shadow-md: 0 4px 16px rgba(0,0,0,.1);--shadow-lg: 0 8px 32px rgba(0,0,0,.14);--font: "Inter", system-ui, sans-serif;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem}html,body{font-family:var(--font);font-size:var(--text-base);color:var(--color-text);background:var(--color-bg);min-height:100vh;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}.card{background:var(--color-surface);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:16px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:12px 20px;border:none;border-radius:var(--radius-sm);font-family:var(--font);font-size:var(--text-sm);font-weight:600;cursor:pointer;transition:opacity .15s,transform .1s;text-decoration:none}.btn:active{transform:scale(.97)}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover{background:var(--color-primary-dark)}.btn-ghost{background:transparent;color:var(--color-text-2)}.btn-ghost:hover{background:var(--color-surface-2)}.btn-danger{background:var(--color-expense);color:#fff}.btn-full{width:100%}.btn-sm{padding:8px 14px;font-size:var(--text-xs)}.form-group{display:flex;flex-direction:column;gap:6px}.form-label{font-size:var(--text-sm);font-weight:500;color:var(--color-text-2)}.form-input{width:100%;padding:12px 14px;border:1.5px solid var(--color-border);border-radius:var(--radius-sm);font-family:var(--font);font-size:var(--text-base);color:var(--color-text);background:var(--color-surface);outline:none;transition:border-color .15s;-webkit-appearance:none}.form-input:focus{border-color:var(--color-primary)}.form-input.error{border-color:var(--color-expense)}.form-error{font-size:var(--text-xs);color:var(--color-expense)}.form-select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2364748b' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:36px}.chip{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:999px;font-size:var(--text-xs);font-weight:600}.chip-income{background:var(--color-income-bg);color:var(--color-income)}.chip-expense{background:var(--color-expense-bg);color:var(--color-expense)}.chip-transfer{background:var(--color-transfer-bg);color:var(--color-transfer)}.divider{height:1px;background:var(--color-border);margin:8px 0}.empty-state{display:flex;flex-direction:column;align-items:center;gap:12px;padding:48px 24px;text-align:center;color:var(--color-text-3)}.empty-state .icon{font-size:3rem}.empty-state p{font-size:var(--text-sm)}.spinner{width:24px;height:24px;border:3px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.amount-income{color:var(--color-income);font-weight:600}.amount-expense{color:var(--color-expense);font-weight:600}.app-shell{display:flex;flex-direction:column;min-height:100vh}.page-content{flex:1;padding:16px;padding-top:calc(var(--header-height) + 8px);padding-bottom:calc(var(--nav-height) + var(--safe-bottom) + 8px);overflow-y:auto;-webkit-overflow-scrolling:touch}.overlay{position:fixed;inset:0;background:#00000073;z-index:100;animation:fadeIn .2s ease}.bottom-sheet{position:fixed;bottom:0;left:0;right:0;background:var(--color-surface);border-radius:var(--radius-lg) var(--radius-lg) 0 0;padding:20px 20px calc(20px + var(--safe-bottom));z-index:101;max-height:90vh;overflow-y:auto;animation:slideUp .25s ease}.sheet-handle{width:40px;height:4px;background:var(--color-border);border-radius:99px;margin:0 auto 20px}@keyframes fadeIn{0%{opacity:0}}@keyframes slideUp{0%{transform:translateY(100%)}}.fab{position:fixed;right:20px;bottom:calc(var(--nav-height) + var(--safe-bottom) + 12px);width:56px;height:56px;border-radius:50%;background:var(--color-primary);color:#fff;font-size:1.75rem;line-height:1;border:none;cursor:pointer;box-shadow:var(--shadow-lg);display:flex;align-items:center;justify-content:center;transition:transform .15s,background .15s;z-index:50}.fab:active{transform:scale(.93)}@keyframes shimmer{0%{background-position:-400px 0}to{background-position:400px 0}}.skeleton{background:linear-gradient(90deg,var(--color-border) 25%,var(--color-bg) 50%,var(--color-border) 75%);background-size:800px 100%;animation:shimmer 1.4s infinite linear;border-radius:var(--radius-md)}.skeleton-text{height:14px;margin-bottom:8px}.skeleton-title{height:20px;width:60%;margin-bottom:12px}.skeleton-card{height:72px;border-radius:var(--radius-xl);margin-bottom:10px}.toast{position:fixed;bottom:calc(var(--nav-height) + var(--safe-bottom) + 12px);left:50%;transform:translate(-50%);background:#1e293b;color:#fff;font-size:var(--text-sm);padding:10px 20px;border-radius:99px;box-shadow:0 4px 16px #00000040;z-index:200;white-space:nowrap;animation:toastIn .2s ease}@keyframes toastIn{0%{opacity:0;transform:translate(-50%) translateY(8px)}}.ptr-hint{text-align:center;font-size:var(--text-xs);color:var(--color-text-secondary);padding:8px 0 4px}.net-error{display:flex;align-items:center;gap:8px;background:#fff7ed;border-left:3px solid #f97316;color:#9a3412;font-size:var(--text-sm);padding:10px 16px;margin:8px 16px;border-radius:0 var(--radius-md) var(--radius-md) 0}.amount-positive{color:var(--color-income);font-weight:600}.amount-negative{color:var(--color-expense);font-weight:600}.amount-neutral{color:var(--color-transfer);font-weight:600}button,a,[role=button]{-webkit-tap-highlight-color:transparent}*{scroll-behavior:smooth}
