*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}input,textarea,button,select{font-family:inherit}input[type=number],input[type=number]:focus{font-family:Arial,Helvetica,sans-serif}select,button{font-family:Arial,Helvetica,sans-serif}:root{--bg:#f5f5f7;--surface:#ffffff;--border:#e2e2e7;--accent:#f5c842;--accent2:#eb9741;--text:#111111;--muted:#6b6b76;--success:#2e9e68;--danger:#d94f4f;--sidebar:220px}body{font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text);display:flex;min-height:100vh;font-size:14px}#sidebar{width:var(--sidebar);min-height:100vh;background:#111;display:flex;flex-direction:column;position:fixed;left:0;top:0;z-index:100}#sidebar .logo{padding:20px 16px 16px;border-bottom:1px solid #2a2a2a}#sidebar .logo span{font-family:Bebas Neue,sans-serif;font-size:22px;color:var(--accent);letter-spacing:1px}#sidebar .logo small{display:block;font-size:10px;color:#666;text-transform:uppercase;letter-spacing:1px;margin-top:2px}#sidebar nav{flex:1;padding:12px 0}#sidebar nav a{display:flex;align-items:center;gap:10px;padding:10px 16px;color:#aaa;text-decoration:none;font-size:13px;font-weight:500;transition:all .15s;border-left:3px solid transparent;cursor:pointer}#sidebar nav a:hover{color:#fff;background:#1e1e1e}#sidebar nav a.active{color:var(--accent);background:#1a1700;border-left-color:var(--accent)}#sidebar nav a svg{width:16px;height:16px;flex-shrink:0;opacity:.7}#sidebar nav a.active svg{opacity:1}#sidebar .sidebar-footer{padding:12px 16px;border-top:1px solid #2a2a2a;font-size:11px;color:#555}#main{margin-left:var(--sidebar);flex:1;display:flex;flex-direction:column;min-height:100vh}#topbar{background:var(--surface);border-bottom:1px solid var(--border);padding:0 24px;height:56px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:50}#topbar h1{font-family:Bebas Neue,sans-serif;font-size:20px;letter-spacing:.5px;color:var(--text)}#topbar .tb-right{display:flex;align-items:center;gap:10px}#content{padding:24px;flex:1}.card{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:20px}.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;margin-bottom:24px}.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:20px}.stat-card .label{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin-bottom:8px}.stat-card .value{font-family:Arial,Helvetica,sans-serif;font-size:24px;font-weight:500;color:var(--text)}.stat-card .sub{font-size:12px;color:var(--muted);margin-top:4px}.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:7px;font-family:Arial,Helvetica,sans-serif;font-size:13px;font-weight:500;cursor:pointer;border:none;transition:all .15s}.btn-primary{background:var(--accent);color:#111}.btn-primary:hover{background:#e8b900}.btn-secondary{background:var(--surface);color:var(--text);border:1px solid var(--border)}.btn-secondary:hover{background:var(--bg)}.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover{background:#c03}.btn-success{background:var(--success);color:#fff}.btn-sm{padding:5px 10px;font-size:12px}.btn-ghost{background:transparent;color:var(--muted);border:1px solid var(--border)}.btn-ghost:hover{color:var(--text);background:var(--bg)}.btn-gmail{background:#ea4335;color:#fff}.btn-gmail:hover{background:#c5221f}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:13px}table th{text-align:left;padding:10px 12px;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);border-bottom:2px solid var(--border);background:var(--bg);border-right:1px solid var(--border)}table th:last-child{border-right:none}table td{padding:11px 12px;vertical-align:middle;border-right:1px solid var(--border)}table td:last-child{border-right:none}table tbody tr:nth-child(odd){background:#fff}table tbody tr:nth-child(2n){background:#f5f5f7}table tr:hover td{background:#fafafa}.mono{font-family:Arial,Helvetica,sans-serif}.badge{display:inline-block;padding:3px 8px;border-radius:4px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.3px}.badge-draft{background:#f0f0f0;color:#777}.badge-sent{background:#e0edff;color:#2563eb}.badge-paid{background:#d4f5e6;color:var(--success)}.badge-overdue{background:#fde8e8;color:var(--danger)}.badge-accepted{background:#d4f5e6;color:var(--success)}.badge-declined{background:#fde8e8;color:var(--danger)}.form-row{display:grid;gap:14px;margin-bottom:14px}.form-row.cols2{grid-template-columns:1fr 1fr}.form-row.cols3{grid-template-columns:1fr 1fr 1fr}.field{display:flex;flex-direction:column;gap:5px}.field label{font-size:12px;font-weight:500;color:var(--muted);text-transform:uppercase;letter-spacing:.3px}.field input,.field select,.field textarea{padding:9px 11px;border:1px solid var(--border);border-radius:7px;font-family:Arial,Helvetica,sans-serif;font-size:13px;background:var(--surface);color:var(--text);outline:none;transition:border .15s}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--accent)}.field textarea{resize:vertical;min-height:80px}#line-items-table{width:100%;border-collapse:collapse;margin-bottom:12px}#line-items-table th{text-align:left;padding:8px 10px;font-size:11px;color:var(--muted);text-transform:uppercase;border-bottom:2px solid var(--border)}#line-items-table td{padding:6px;border-bottom:1px solid var(--border)}#line-items-table input{width:100%;padding:7px 9px;border:1px solid transparent;border-radius:5px;font-family:Arial,Helvetica,sans-serif;font-size:13px;background:transparent}#line-items-table input:focus{border-color:var(--accent);background:var(--surface);outline:none}.line-delete{background:none;border:none;color:var(--muted);cursor:pointer;padding:4px 8px;border-radius:4px;font-size:16px}.line-delete:hover{color:var(--danger);background:#fde8e8}.totals-box{margin-left:auto;width:280px}.totals-box .row{display:flex;justify-content:space-between;padding:6px 0;font-size:13px}.totals-box .row.total{font-weight:700;font-size:15px;border-top:2px solid var(--text);padding-top:10px;margin-top:4px}.quick-btns{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}.quick-btn{padding:7px 12px;border-radius:6px;font-size:12px;font-weight:500;cursor:pointer;border:1px solid var(--border);background:var(--surface);color:var(--text);transition:all .15s}.quick-btn:hover{border-color:var(--accent);background:#fffbe6}.quick-btn.equip{border-color:var(--accent2);background:#fff8f0}.alert{padding:12px 16px;border-radius:8px;margin-bottom:16px;font-size:13px}.alert-warning{background:#fff8e1;border:1px solid #f5c842;color:#7a5800}.alert-danger{background:#fde8e8;border:1px solid #d94f4f;color:#7a1a1a}.alert-success{background:#d4f5e6;border:1px solid #2e9e68;color:#0f5132}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.section-header h2{font-family:Bebas Neue,sans-serif;font-size:22px;letter-spacing:.5px}.overdue-item{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--border)}.overdue-item:last-child{border-bottom:none}.tab-bar{display:flex;gap:2px;background:var(--bg);border-radius:8px;padding:3px;margin-bottom:20px;width:fit-content}.tab-bar button{padding:7px 14px;border:none;background:transparent;border-radius:6px;font-family:Arial,Helvetica,sans-serif;font-size:13px;font-weight:500;cursor:pointer;color:var(--muted);transition:all .15s}.tab-bar button.active{background:var(--surface);color:var(--text);box-shadow:0 1px 3px #00000014}.filter-bar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px;align-items:center}.filter-bar select,.filter-bar input{padding:7px 11px;border:1px solid var(--border);border-radius:7px;font-family:Arial,Helvetica,sans-serif;font-size:13px;background:var(--surface);color:var(--text);outline:none}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;z-index:200;display:flex;align-items:center;justify-content:center;padding:20px}.modal{background:var(--surface);border-radius:12px;width:100%;max-width:560px;max-height:90vh;overflow-y:auto;padding:24px}.modal h3{font-family:Bebas Neue,sans-serif;font-size:22px;margin-bottom:16px}.bas-row{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--border);font-size:13px}.bas-row.highlight{font-weight:600;background:#fffbe6;padding:10px 8px;border-radius:6px;margin-top:4px}.txn-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--border);font-size:13px}.txn-row.unmatched{background:#fff8f8}.txn-badge{font-size:11px;padding:3px 7px;border-radius:4px;font-weight:600}.dash-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px;margin-bottom:24px}.dash-bottom{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}.pl-indicator{display:flex;align-items:center;gap:6px;margin-top:6px}.pl-arrow{font-size:18px;font-weight:700;line-height:1}.pl-arrow.up{color:var(--success)}.pl-arrow.down{color:var(--danger)}@media (max-width:768px){#sidebar{width:60px;overflow:hidden}#sidebar .logo span,#sidebar .logo small{display:none}#sidebar nav a span{display:none}#main{margin-left:60px}}.page{display:none}.page.active{display:block}.role-selector{display:flex;gap:8px;margin-bottom:20px}.role-btn{padding:9px 18px;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;border:2px solid var(--border);background:var(--surface);color:var(--muted);transition:all .15s}.role-btn.active{border-color:var(--accent);background:#fffbe6;color:var(--text)}.drag-handle{color:var(--border);cursor:grab;padding:0 4px;font-size:16px;-webkit-user-select:none;user-select:none}.bank-row-wrap{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--border);border-radius:10px;margin-bottom:10px;overflow:hidden;background:var(--surface);transition:box-shadow .15s}.bank-row-wrap:hover{box-shadow:0 2px 8px #00000012}.bank-row-wrap.is-matched{background:#f0fdf4;border-color:#86efac}.bank-row-wrap.is-suggested{border-color:#93c5fd}.bank-left{padding:16px 20px;border-right:1px solid var(--border)}.bank-right{padding:14px 16px;background:#fafafa}.bank-row-wrap.is-matched .bank-right{background:#f0fdf4}.bank-row-wrap.is-suggested .bank-right{background:#eff6ff}.bank-date{font-size:12px;color:var(--muted);margin-bottom:4px}.bank-desc{font-size:13px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:280px}.bank-amounts{display:flex;gap:20px;margin-top:8px}.bank-amt-label{font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);margin-bottom:2px}.bank-amt-val{font-size:15px;font-weight:700}.bank-spent{color:var(--danger)}.bank-received{color:var(--success)}.bank-match-card{border:1px solid #93c5fd;border-radius:7px;padding:10px 12px;margin-bottom:8px;background:#fff}.bank-match-card.confirmed{border-color:#86efac;background:#f0fdf4}.bank-match-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:#2563eb;margin-bottom:4px}.bank-match-label.confirmed{color:var(--success)}.bank-match-name{font-size:13px;font-weight:600;color:#1e3a8a;margin-bottom:2px}.bank-match-name.confirmed{color:#166534}.bank-match-detail{font-size:11px;color:#3b82f6}.bank-match-detail.confirmed{color:var(--success)}.bank-match-actions{display:flex;gap:6px;margin-top:8px;align-items:center}.bank-ok-btn{background:#2563eb;color:#fff;border:none;border-radius:6px;padding:6px 16px;font-size:13px;font-weight:600;cursor:pointer;font-family:Arial,Helvetica,sans-serif}.bank-ok-btn:hover{background:#1d4ed8}.bank-ok-btn.green{background:var(--success)}.bank-ok-btn.green:hover{background:#1e7a50}.bank-skip-btn{background:transparent;color:var(--muted);border:1px solid var(--border);border-radius:6px;padding:6px 10px;font-size:12px;cursor:pointer;font-family:Arial,Helvetica,sans-serif}.bank-skip-btn:hover{color:var(--danger);border-color:var(--danger)}.bank-confidence{font-size:10px;font-weight:700;color:#2563eb;background:#dbeafe;padding:2px 7px;border-radius:10px;margin-left:6px}.bank-manual-select{width:100%;padding:7px 10px;border:1px solid var(--border);border-radius:6px;font-size:12px;margin-top:6px;background:var(--surface)}.bank-matched-badge{display:inline-flex;align-items:center;gap:5px;background:#d4f5e6;color:var(--success);font-size:12px;font-weight:600;padding:4px 10px;border-radius:6px}.bank-unmatch-btn{background:none;border:none;color:var(--muted);font-size:11px;cursor:pointer;text-decoration:underline;padding:0;margin-left:8px;font-family:Arial,Helvetica,sans-serif}.bank-unmatch-btn:hover{color:var(--danger)}#cashflow-chart,#trend-chart{width:100%;height:180px;display:block}#login-gate{position:fixed;top:0;right:0;bottom:0;left:0;background:#111;z-index:500;display:flex;align-items:center;justify-content:center}#login-gate .login-card{background:var(--surface);border-radius:12px;padding:32px;width:100%;max-width:360px}#login-gate .login-logo{font-family:Bebas Neue,sans-serif;font-size:28px;color:var(--accent2);letter-spacing:1px;margin-bottom:4px;text-align:center}#login-gate .login-sub{font-size:12px;color:var(--muted);text-align:center;margin-bottom:24px}#login-gate .login-error{font-size:12px;color:var(--danger);margin-top:8px;min-height:16px}#login-gate .login-toggle{font-size:12px;color:var(--muted);text-align:center;margin-top:16px;cursor:pointer}#login-gate .login-toggle span{color:var(--accent2);font-weight:600}
