*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--sidebar-bg:#1e2030;--sidebar-text:#a0aec0;--sidebar-active:#fff;--accent:#6366f1;--accent-hover:#4f52d9;--bg:#f7f8fc;--surface:#fff;--border:#e2e8f0;--text:#374151;--text-muted:#6b7280;--expense:#ef4444;--payment:#22c55e;--radius:6px;color:var(--text);font-family:system-ui,Segoe UI,Roboto,sans-serif;font-size:14px}body{background:var(--bg)}#root{height:100vh}.app-layout{height:100vh;display:flex}.sidebar{background:var(--sidebar-bg);flex-direction:column;width:200px;min-width:200px;padding:0;display:flex}.sidebar-logo{color:#fff;letter-spacing:.5px;border-bottom:1px solid #ffffff14;padding:24px 20px 20px;font-size:20px;font-weight:700}.sidebar a{color:var(--sidebar-text);border-left:3px solid #0000;padding:12px 20px;text-decoration:none;transition:background .15s,color .15s;display:block}.sidebar a:hover{color:#fff;background:#ffffff0d}.sidebar a.active{color:var(--sidebar-active);border-left-color:var(--accent);background:#6366f126}.logout-btn{color:var(--sidebar-text);cursor:pointer;text-align:left;background:0 0;border:none;border-top:1px solid #ffffff14;margin-top:auto;padding:14px 20px;font-size:14px;transition:color .15s}.logout-btn:hover{color:#fff}.main-content{flex:1;padding:32px;overflow-y:auto}.page h2{color:#1a202c;margin-bottom:24px;font-size:22px;font-weight:600}.page h3{color:#1a202c;margin:20px 0 12px;font-size:16px;font-weight:600}.section-header{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.section-header h2{margin-bottom:0}.loading{height:100vh;color:var(--text-muted);justify-content:center;align-items:center;display:flex}.login-page{background:var(--bg);justify-content:center;align-items:center;min-height:100vh;display:flex}.login-form{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;gap:16px;width:100%;max-width:380px;padding:40px;display:flex}.login-form h1{text-align:center;color:#1a202c;font-size:26px;font-weight:700}label{color:var(--text);flex-direction:column;gap:6px;font-weight:500;display:flex}input,select,textarea{border:1px solid var(--border);border-radius:var(--radius);color:var(--text);background:var(--surface);outline:none;width:100%;padding:8px 10px;font-size:14px;transition:border-color .15s}input:focus,select:focus,textarea:focus{border-color:var(--accent)}textarea{resize:vertical}.checkbox-label{flex-direction:row;align-items:center;font-weight:400}.checkbox-label input{width:auto}button{border-radius:var(--radius);cursor:pointer;background:var(--accent);color:#fff;border:none;padding:8px 14px;font-size:13px;font-weight:500;transition:background .15s}button:hover{background:var(--accent-hover)}button:disabled{opacity:.5;cursor:not-allowed}button[type=button]{background:var(--border);color:var(--text)}button[type=button]:hover{background:#d1d5db}.error{color:var(--expense);border-radius:var(--radius);background:#fef2f2;border:1px solid #fecaca;padding:8px 12px;font-size:13px}.summary-cards{grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:32px;display:grid}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;gap:8px;padding:20px;display:flex}.card-label{color:var(--text-muted);font-size:13px}.card-value{font-size:26px;font-weight:700}.filter-bar{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:20px;display:flex}.filter-bar input,.filter-bar select{width:auto}.table{border-collapse:collapse;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);width:100%;font-size:13px;overflow:hidden}.table th{text-align:left;color:var(--text-muted);border-bottom:1px solid var(--border);white-space:nowrap;background:#f1f5f9;padding:10px 14px;font-weight:600}.table td{border-bottom:1px solid var(--border);vertical-align:middle;padding:10px 14px}.table tr:last-child td{border-bottom:none}.table tr:hover td{background:#f8fafc}.table .empty{text-align:center;color:var(--text-muted);padding:32px}.table .actions{white-space:nowrap;gap:6px;display:flex}.table .actions button{padding:4px 10px;font-size:12px}.expense{color:var(--expense);font-weight:600}.payment{color:var(--payment);font-weight:600}.modal-overlay{z-index:100;background:#00000073;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--surface);border-radius:var(--radius);flex-direction:column;gap:16px;width:100%;max-width:480px;max-height:90vh;padding:28px;display:flex;overflow-y:auto}.modal form{flex-direction:column;gap:14px;display:flex}.modal-header{justify-content:space-between;align-items:center;display:flex}.modal-header h3{font-size:17px;font-weight:600}.close-btn{color:var(--text-muted);background:0 0;padding:0 4px;font-size:20px}.close-btn:hover{color:var(--text);background:0 0}.modal-actions{justify-content:flex-end;gap:10px;margin-top:6px;display:flex}.category-panels{grid-template-columns:1fr 1fr;align-items:start;gap:24px;display:grid}.acc-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}.acc-panel-header{border-bottom:1px solid var(--border);background:#f8fafc;padding:14px 18px}.acc-panel-header h3{color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;margin:0;font-size:13px;font-weight:600}.acc-panel-footer{border-top:1px solid var(--border);background:#fafbfc}.accordion-item{border-bottom:1px solid var(--border)}.accordion-item:last-child{border-bottom:none}.accordion-header{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:10px;padding:12px 16px;transition:background .1s;display:flex}.accordion-header:hover{background:#f8fafc}.accordion-item.open .accordion-header{background:#f1f5f9}.accordion-arrow{color:var(--text-muted);flex-shrink:0;width:12px;font-size:10px}.accordion-title{flex:1;font-size:14px;font-weight:600}.accordion-actions{opacity:0;gap:6px;transition:opacity .15s;display:flex}.accordion-header:hover .accordion-actions{opacity:1}.act-btn{color:var(--text-muted);border:1px solid var(--border);background:0 0;border-radius:4px;padding:3px 8px;font-size:12px}.act-btn:hover{color:var(--text);background:#f1f5f9}.act-btn.danger:hover{color:var(--expense);background:#fef2f2;border-color:#fecaca}.accordion-body{border-top:1px solid var(--border);background:#fafbfc;padding:4px 0}.no-subs{color:var(--text-muted);padding:6px 16px 6px 38px;font-size:12px;font-style:italic}.sub-row{align-items:center;gap:8px;padding:7px 16px 7px 38px;display:flex}.sub-row:hover{background:#f1f5f9}.sub-name{color:var(--text);flex:1;font-size:13px}.sub-actions{opacity:0;gap:6px;transition:opacity .15s;display:flex}.sub-row:hover .sub-actions{opacity:1}.inline-edit{flex:1;align-items:center;gap:8px;display:flex}.inline-edit input{flex:1;padding:5px 8px;font-size:13px}.ie-save{background:var(--accent);color:#fff;padding:4px 12px;font-size:12px}.ie-cancel{color:var(--text-muted);background:0 0;border:none;padding:4px 6px;font-size:14px}.ie-cancel:hover{color:var(--text);background:#f1f5f9}.add-row-trigger{color:var(--text-muted);cursor:pointer;padding:8px 16px;font-size:13px;transition:background .1s,color .1s}.add-row-trigger.indent{padding-left:38px}.add-row-trigger:hover{color:var(--accent);background:#f1f5f9}.add-row-input{align-items:center;gap:8px;padding:8px 16px;display:flex}.add-row-input.indent{padding-left:38px}.add-row-input input{flex:1;padding:5px 8px;font-size:13px}.export-count{color:var(--text-muted);margin-bottom:16px}