*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-base: #080F1A;--bg-surface: #0D1526;--bg-card: #111D35;--bg-card-hover: #172340;--bg-elevated: #1A2A4A;--bg-input: #0D1526;--border: #1E2F50;--border-subtle: #172340;--border-focus: #3B82F6;--text-primary: #F0F4FF;--text-secondary: #8BA3CC;--text-muted: #4A6490;--text-inverse: #080F1A;--accent: #3B82F6;--accent-hover: #2563EB;--accent-light: rgba(59,130,246,.12);--positive: #10B981;--positive-light: rgba(16,185,129,.1);--positive-dim: #059669;--negative: #EF4444;--negative-light: rgba(239,68,68,.1);--warning: #F59E0B;--warning-light: rgba(245,158,11,.1);--info: #06B6D4;--info-light: rgba(6,182,212,.1);--status-late: #EF4444;--status-soon: #F59E0B;--status-ok: #10B981;--font-sans: "Inter", "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", "Fira Code", monospace;--text-xs: 11px;--text-sm: 13px;--text-base: 15px;--text-lg: 17px;--text-xl: 20px;--text-2xl: 24px;--text-3xl: 30px;--font-normal: 400;--font-medium: 500;--font-semi: 600;--font-bold: 700;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--radius-sm: 6px;--radius: 10px;--radius-lg: 14px;--radius-xl: 20px;--radius-full: 9999px;--shadow-sm: 0 1px 3px rgba(0,0,0,.4), 0 1px 2px rgba(0,0,0,.3);--shadow: 0 4px 16px rgba(0,0,0,.5), 0 2px 6px rgba(0,0,0,.3);--shadow-lg: 0 10px 40px rgba(0,0,0,.6), 0 4px 12px rgba(0,0,0,.4);--shadow-accent: 0 4px 20px rgba(59,130,246,.25);--shadow-positive: 0 4px 20px rgba(16,185,129,.2);--transition: .15s ease;--transition-slow: .3s ease}html,body,#root{height:100%;background:var(--bg-surface);color:var(--text-primary);font-family:var(--font-sans);font-size:var(--text-base);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::selection{background:var(--accent-light);color:var(--text-primary)}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.page{min-height:100vh;background:var(--bg-surface)}.container{max-width:960px;margin:0 auto;padding:0 var(--space-4)}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-5);box-shadow:var(--shadow-sm);transition:border-color var(--transition)}.card:hover{border-color:var(--border-focus)}.card-sm{padding:var(--space-4)}.card-title{font-size:var(--text-base);font-weight:var(--font-semi);color:var(--text-primary);margin-bottom:var(--space-4);display:flex;align-items:center;justify-content:space-between}.card-title span{font-size:var(--text-xs);color:var(--text-muted);font-weight:var(--font-normal)}.metric-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-5);display:flex;flex-direction:column;gap:var(--space-2);transition:all var(--transition);position:relative;overflow:hidden}.metric-card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;opacity:0;transition:opacity var(--transition)}.metric-card:hover{border-color:var(--border-focus);box-shadow:var(--shadow)}.metric-card:hover:before{opacity:1}.metric-card.positive:before{background:var(--positive)}.metric-card.negative:before{background:var(--negative)}.metric-card.accent:before{background:var(--accent)}.metric-card.warning:before{background:var(--warning)}.metric-icon{width:36px;height:36px;border-radius:var(--radius);display:flex;align-items:center;justify-content:center;font-size:18px;margin-bottom:var(--space-1)}.metric-icon.positive{background:var(--positive-light)}.metric-icon.negative{background:var(--negative-light)}.metric-icon.accent{background:var(--accent-light)}.metric-icon.warning{background:var(--warning-light)}.metric-label{font-size:var(--text-xs);font-weight:var(--font-medium);color:var(--text-muted);text-transform:uppercase;letter-spacing:.6px}.metric-value{font-size:var(--text-2xl);font-weight:var(--font-bold);line-height:1.1;letter-spacing:-.5px}.metric-value.balance-positive{color:var(--positive)}.metric-value.balance-negative{color:var(--negative)}.metric-value.balance-accent{color:var(--accent)}.metric-value.balance-warning{color:var(--warning)}.metric-value.balance-neutral{color:var(--text-primary)}.metric-sub{font-size:var(--text-xs);color:var(--text-muted);margin-top:var(--space-1)}.dashboard-container{padding:var(--space-6) var(--space-4);max-width:960px;margin:0 auto}.dashboard-header{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:var(--space-4);margin-bottom:var(--space-6)}.dashboard-greeting h1{font-size:var(--text-2xl);font-weight:var(--font-bold);color:var(--text-primary);letter-spacing:-.5px}.dashboard-greeting p{font-size:var(--text-sm);color:var(--text-muted);margin-top:var(--space-1)}.dashboard-greeting .family-name{color:var(--accent);font-weight:var(--font-medium)}.dashboard-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4);margin-bottom:var(--space-4)}.dashboard-secondary{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4);margin-bottom:var(--space-4)}.dashboard-main{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);border-radius:var(--radius-sm);font-size:var(--text-sm);font-weight:var(--font-medium);cursor:pointer;border:1px solid transparent;transition:all var(--transition);text-decoration:none;white-space:nowrap;font-family:var(--font-sans)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-full{width:100%}.btn-primary{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:var(--shadow-accent)}.btn-primary:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}.btn-success{background:var(--positive);color:#fff;border-color:var(--positive)}.btn-success:hover:not(:disabled){background:var(--positive-dim)}.btn-danger{background:var(--negative);color:#fff;border-color:var(--negative)}.btn-danger:hover:not(:disabled){background:#dc2626}.btn-ghost{background:transparent;color:var(--text-secondary);border-color:var(--border)}.btn-ghost:hover:not(:disabled){background:var(--bg-elevated);color:var(--text-primary);border-color:var(--border-focus)}.btn-pay{background:var(--positive-light);color:var(--positive);border:1px solid rgba(16,185,129,.3);font-size:var(--text-xs);padding:3px 10px;border-radius:var(--radius-sm);cursor:pointer;font-family:var(--font-sans);transition:all var(--transition)}.btn-pay:hover{background:var(--positive);color:#fff}.btn-unpay{background:var(--bg-elevated);color:var(--text-muted);border:1px solid var(--border);font-size:var(--text-xs);padding:3px 10px;border-radius:var(--radius-sm);cursor:pointer;font-family:var(--font-sans);transition:all var(--transition)}.btn-edit{background:var(--accent-light);color:var(--accent);border:1px solid rgba(59,130,246,.3);font-size:var(--text-xs);padding:3px 10px;border-radius:var(--radius-sm);cursor:pointer;font-family:var(--font-sans);transition:all var(--transition)}.btn-edit:hover{background:var(--accent);color:#fff}input,select,textarea{width:100%;padding:var(--space-3) var(--space-4);background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-size:var(--text-sm);font-family:var(--font-sans);transition:border-color var(--transition),box-shadow var(--transition);outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px #3b82f626}input::placeholder,textarea::placeholder{color:var(--text-muted)}input:read-only{opacity:.5;cursor:not-allowed}select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1L6 6L11 1' stroke='%234A6490' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:36px;cursor:pointer}select option{background:var(--bg-elevated);color:var(--text-primary)}label{font-size:var(--text-xs);font-weight:var(--font-medium);color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;display:block;margin-bottom:var(--space-2)}.form-group{display:flex;flex-direction:column;gap:var(--space-2);margin-bottom:var(--space-4)}.alert{padding:var(--space-3) var(--space-4);border-radius:var(--radius-sm);font-size:var(--text-sm);margin-bottom:var(--space-4);display:flex;align-items:center;gap:var(--space-3);border:1px solid}.alert-danger{background:var(--negative-light);border-color:#ef44444d;color:#fca5a5}.alert-success{background:var(--positive-light);border-color:#10b9814d;color:#6ee7b7}.alert-warning{background:var(--warning-light);border-color:#f59e0b4d;color:#fcd34d}.badge{display:inline-flex;align-items:center;padding:2px 10px;border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--font-medium)}.badge-success{background:var(--positive-light);color:var(--positive)}.badge-danger{background:var(--negative-light);color:var(--negative)}.badge-accent{background:var(--accent-light);color:var(--accent)}.badge-warning{background:var(--warning-light);color:var(--warning)}.badge-muted{background:#4a649026;color:var(--text-muted)}.vencimento-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius);border:1px solid var(--border-subtle);background:var(--bg-elevated);transition:all var(--transition)}.vencimento-item:hover{border-color:var(--border)}.vencimento-item.pago{opacity:.5}.vencimento-item.late{border-left:3px solid var(--status-late)}.vencimento-item.soon{border-left:3px solid var(--status-soon)}.vencimento-item.ok{border-left:3px solid var(--status-ok)}.vencimento-status-dot{width:8px;height:8px;border-radius:var(--radius-full);flex-shrink:0}.vencimento-status-dot.late{background:var(--status-late);box-shadow:0 0 6px var(--status-late)}.vencimento-status-dot.soon{background:var(--status-soon);box-shadow:0 0 6px var(--status-soon)}.vencimento-status-dot.ok{background:var(--status-ok);box-shadow:0 0 6px var(--status-ok)}.dizimo-card{border-radius:var(--radius-lg);padding:var(--space-5);border:1px solid var(--border);background:var(--bg-card);margin-bottom:var(--space-4)}.dizimo-progress{background:var(--border);border-radius:var(--radius-full);height:6px;overflow:hidden;margin:var(--space-3) 0}.dizimo-progress-bar{height:100%;border-radius:var(--radius-full);background:var(--warning);transition:width .5s ease}.dizimo-progress-bar.completo{background:var(--positive)}.dizimo-membro{display:flex;align-items:center;justify-content:space-between;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);font-size:var(--text-sm);background:var(--bg-elevated);margin-top:var(--space-2)}.progress-track{background:var(--border);border-radius:var(--radius-full);height:5px;overflow:hidden;margin-top:var(--space-1)}.progress-fill{height:100%;border-radius:var(--radius-full);background:var(--negative);transition:width .4s ease}.lancamento-list{display:flex;flex-direction:column}.lancamento-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) 0;border-bottom:1px solid var(--border-subtle);transition:background var(--transition)}.lancamento-item:last-child{border-bottom:none}.lancamento-item.pago{opacity:.55}.lancamento-icon{width:34px;height:34px;border-radius:var(--radius);display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0}.lancamento-icon.entrada{background:var(--positive-light)}.lancamento-icon.despesa{background:var(--negative-light)}.lancamento-meta{flex:1;min-width:0}.lancamento-name{font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lancamento-info{font-size:var(--text-xs);color:var(--text-muted);margin-top:2px}.lancamento-value{font-size:var(--text-base);font-weight:var(--font-semi);flex-shrink:0}.lancamento-value.entrada{color:var(--positive)}.lancamento-value.despesa{color:var(--negative)}.filter-group{display:flex;gap:var(--space-2);flex-wrap:wrap}.filter-btn{padding:5px 14px;border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--font-medium);cursor:pointer;border:1px solid var(--border);background:transparent;color:var(--text-muted);transition:all var(--transition);font-family:var(--font-sans)}.filter-btn:hover{border-color:var(--accent);color:var(--accent)}.filter-btn.active{background:var(--accent-light);border-color:#3b82f666;color:var(--accent)}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4)}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4)}.text-primary{color:var(--text-primary)}.text-secondary{color:var(--text-secondary)}.text-muted{color:var(--text-muted)}.text-accent{color:var(--accent)}.text-positive{color:var(--positive)}.text-negative{color:var(--negative)}.text-warning{color:var(--warning)}.text-xs{font-size:var(--text-xs)}.text-sm{font-size:var(--text-sm)}.text-base{font-size:var(--text-base)}.text-lg{font-size:var(--text-lg)}.font-medium{font-weight:var(--font-medium)}.font-semi{font-weight:var(--font-semi)}.font-bold{font-weight:var(--font-bold)}.text-center{text-align:center}.text-right{text-align:right}.divider{border:none;border-top:1px solid var(--border-subtle);margin:var(--space-4) 0}.loader{display:flex;align-items:center;justify-content:center;min-height:200px;color:var(--text-muted);font-size:var(--text-sm);gap:var(--space-3)}.empty-state{text-align:center;padding:var(--space-8) var(--space-4);color:var(--text-muted);font-size:var(--text-sm)}.empty-state-icon{font-size:40px;margin-bottom:var(--space-3);opacity:.6}@media (max-width: 640px){.grid-2,.grid-3,.grid-4,.dashboard-kpis,.dashboard-secondary,.dashboard-main{grid-template-columns:1fr}.hide-mobile{display:none!important}.card{padding:var(--space-4)}.dashboard-container{padding:var(--space-4) var(--space-3)}}@media (min-width: 641px){.show-mobile{display:none!important}}
