.dashboard{animation:fadeIn .3s}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.dashboard-header h1{font-family:"DM Serif Display",serif;font-weight:400;font-size:28px;color:#1a1a18}.header-actions{display:flex;gap:12px}.totals-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:32px}.total-card{background:#fff;border:1px solid #dddbd3;padding:24px;border-radius:6px;border-left:4px solid}.total-card.overdue{border-left-color:#c0392b}.total-card.due-soon{border-left-color:#b8863f}.total-card.upcoming{border-left-color:#2e8b57}.total-label{font-size:.68rem;text-transform:uppercase;letter-spacing:.1em;color:#888680;font-weight:500;margin-bottom:8px}.total-amount{font-size:32px;font-weight:700;color:#1a1a18;margin-bottom:4px}.total-count{font-size:13px;color:#888680}.bills-section{margin-bottom:32px}.bills-section h2{font-family:"DM Serif Display",serif;font-weight:400;font-size:20px;margin-bottom:16px;color:#1a1a18}.bills-list{display:grid;gap:16px}.bill-card{background:#fff;border:1px solid #dddbd3;border-radius:6px;padding:20px;border-left:4px solid;transition:all .2s}.bill-card:hover{box-shadow:0 4px 12px #0000000f}.bill-card.overdue{border-left-color:#c0392b;background:#c0392b0a}.bill-card.due-soon{border-left-color:#b8863f;background:#b8863f0f}.bill-card.upcoming{border-left-color:#2e8b57}.bill-card.autopay{border-left-color:#3777b5}.bill-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.bill-name-section{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.bill-name-section h3{font-size:18px;font-weight:600;color:#1a1a18}.bill-type-badge{padding:4px 10px;border-radius:12px;font-size:11px;font-weight:600;color:#fff;text-transform:uppercase}.bill-amount{font-size:22px;font-weight:700;color:#1a1a18}.variable-indicator{font-size:14px;color:#888680;margin-left:4px}.bill-details{font-size:14px;color:#888680;line-height:1.6;margin-bottom:16px}.bill-details>div{margin-bottom:4px}.autopay-info{color:#3777b5}.bill-notes{margin-top:8px;padding-top:8px;border-top:1px solid #dddbd3;font-style:italic}.bill-actions{display:flex;gap:8px}.btn-mark-paid{background:#2e8b57;color:#fff;border:none;padding:10px 20px;border-radius:6px;font-family:DM Mono,monospace;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;font-weight:500;cursor:pointer;transition:background .2s;flex:1}.btn-mark-paid:hover{background:#256e46}.recent-payments{background:#fff;border:1px solid #dddbd3;border-radius:6px;padding:24px}.recent-payments h2{font-family:"DM Serif Display",serif;font-weight:400;font-size:18px;margin-bottom:16px;color:#1a1a18}.payments-list{display:flex;flex-direction:column;gap:12px}.payment-item{display:flex;justify-content:space-between;align-items:center;padding:12px;background:#f0efe9;border-radius:6px}.payment-name{font-weight:500;color:#1a1a18}.payment-date{font-size:13px;color:#888680}.payment-amount{font-weight:600;color:#1a1a18}@media (max-width: 768px){.dashboard-header{flex-direction:column;align-items:flex-start;gap:16px}.header-actions{width:100%;flex-direction:column}.header-actions button{width:100%}.totals-grid{grid-template-columns:1fr}}.bills-page{animation:fadeIn .3s}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.page-header h1{font-family:"DM Serif Display",serif;font-weight:400;font-size:28px;color:#1a1a18}.filters{display:flex;gap:8px;margin-bottom:24px;background:#fff;border:1px solid #dddbd3;padding:12px;border-radius:6px}.filters button{background:none;border:1px solid #dddbd3;padding:8px 16px;border-radius:6px;font-family:DM Mono,monospace;font-size:13px;font-weight:500;color:#888680;cursor:pointer;transition:all .15s}.filters button:hover{background:#f0efe9;border-color:#888680}.filters button.active{background:#c8a96e;color:#0e0f11;border-color:#c8a96e}.bills-table{background:#fff;border:1px solid #dddbd3;border-radius:6px;overflow:hidden}.bills-table table{width:100%;border-collapse:collapse}.bills-table th{background:#f0efe9;padding:16px;text-align:left;font-size:.65rem;font-weight:600;color:#888680;text-transform:uppercase;letter-spacing:.1em;border-bottom:1px solid #dddbd3}.bills-table td{padding:16px;border-bottom:1px solid #dddbd3;font-size:14px;color:#1a1a18}.bills-table tbody tr:hover{background:#f0efe9}.bills-table tbody tr:last-child td{border-bottom:none}.variable{color:#b8863f;font-weight:600}.status-paid{color:#2e8b57;font-weight:500}.status-unpaid{color:#888680}.actions{display:flex;gap:8px}.btn-edit{background:transparent;color:#3777b5;border:1px solid rgba(55,119,181,.35);padding:6px 12px;border-radius:6px;font-family:DM Mono,monospace;font-size:11px;font-weight:500;cursor:pointer;transition:background .15s}.btn-edit:hover{background:#3777b514}.btn-delete{background:transparent;color:#c0392b;border:1px solid rgba(192,57,43,.35);padding:6px 12px;border-radius:6px;font-family:DM Mono,monospace;font-size:11px;font-weight:500;cursor:pointer;transition:all .15s}.btn-delete:hover{background:#c0392b12}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;justify-content:center;align-items:center;z-index:1000;padding:20px;animation:fadeIn .2s}.modal-content{background:#fff;border:1px solid #dddbd3;border-radius:6px;padding:32px;max-width:600px;width:100%;max-height:90vh;overflow-y:auto;box-shadow:0 8px 40px #00000017;animation:slideUp .3s}@keyframes slideUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.modal-content h2{font-family:"DM Serif Display",serif;font-weight:400;font-size:22px;color:#1a1a18;margin-bottom:24px}.form-actions{display:flex;gap:12px;margin-top:24px;justify-content:flex-end}@media (max-width: 768px){.bills-table{overflow-x:auto}.bills-table table{min-width:800px}.page-header{flex-direction:column;align-items:flex-start;gap:16px}.filters{flex-wrap:wrap}.modal-content{padding:24px}}.payments-page{animation:fadeIn .3s}.filters-section{background:#fff;border:1px solid #dddbd3;border-radius:6px;padding:20px;margin-bottom:24px}.date-filters{display:flex;gap:16px;margin-bottom:16px}.date-filters .form-group{margin-bottom:0}.type-filters{display:flex;gap:8px}.type-filters button{background:none;border:1px solid #dddbd3;padding:8px 16px;border-radius:6px;font-family:DM Mono,monospace;font-size:13px;font-weight:500;color:#888680;cursor:pointer;transition:all .15s}.type-filters button:hover{background:#f0efe9;border-color:#888680}.type-filters button.active{background:#c8a96e;color:#0e0f11;border-color:#c8a96e}.totals-summary{background:#fff;border:1px solid #dddbd3;border-radius:6px;padding:20px;margin-bottom:24px;display:flex;gap:32px;align-items:center}.total-item{display:flex;align-items:baseline;gap:8px}.total-label{font-size:.68rem;text-transform:uppercase;letter-spacing:.1em;color:#888680;font-weight:500}.total-value{font-size:24px;font-weight:700;color:#1a1a18}.total-item.business .total-value{color:#2e8b57}.total-item.personal .total-value{color:#3777b5}.payments-table{background:#fff;border:1px solid #dddbd3;border-radius:6px;overflow:hidden}.payments-table table{width:100%;border-collapse:collapse}.payments-table th{background:#f0efe9;padding:16px;text-align:left;font-size:.65rem;font-weight:600;color:#888680;text-transform:uppercase;letter-spacing:.1em;border-bottom:1px solid #dddbd3}.payments-table td{padding:16px;border-bottom:1px solid #dddbd3;font-size:14px;color:#1a1a18}.payments-table td.amount{font-weight:600}.payments-table tbody tr:hover{background:#f0efe9}.payments-table tbody tr:last-child td{border-bottom:none}.no-data{text-align:center;color:#888680;padding:40px!important;font-style:italic}.status-late{color:#c0392b;font-weight:500}.status-on-time{color:#2e8b57;font-weight:500}@media (max-width: 768px){.date-filters{flex-direction:column}.totals-summary{flex-direction:column;align-items:flex-start;gap:16px}.payments-table{overflow-x:auto}.payments-table table{min-width:900px}}.auth-page{min-height:calc(100vh - 56px);display:flex;justify-content:center;align-items:center;background:#f5f5f3;padding:20px}.auth-container{width:100%;max-width:450px}.auth-header{text-align:center;margin-bottom:32px;color:#1a1a18}.auth-header h1{font-family:"DM Serif Display",serif;font-weight:400;font-size:32px;margin-bottom:8px}.auth-header p{font-size:14px;color:#888680}.auth-form{background:#fff;border:1px solid #dddbd3;padding:40px;border-radius:6px;box-shadow:0 8px 40px #0000000f}.auth-form h2{font-family:"DM Serif Display",serif;font-weight:400;font-size:22px;color:#1a1a18;margin-bottom:24px;text-align:center}.error-message{background:#c0392b12;color:#c0392b;padding:12px;border-radius:6px;font-size:14px;margin-bottom:20px;border:1px solid rgba(192,57,43,.25)}.auth-footer{text-align:center;margin-top:24px;font-size:13px;color:#888680}.auth-footer a{color:#8a7048;text-decoration:none;font-weight:500}.auth-footer a:hover{text-decoration:underline}@media (max-width: 480px){.auth-form{padding:32px 24px}.auth-header h1{font-size:28px}}.app-layout{min-height:100vh;display:flex;flex-direction:column}.navbar{background:#f5f5f3f2;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid #dddbd3;padding:0 24px;display:flex;align-items:center;justify-content:space-between;height:56px;position:sticky;top:56px;z-index:90}.nav-brand h1{font-family:"DM Serif Display",serif;font-weight:400;font-size:18px;color:#1a1a18}.nav-links{display:flex;gap:8px;flex:1;justify-content:center}.nav-links button{background:none;border:none;padding:8px 16px;font-family:DM Mono,monospace;font-size:13px;font-weight:500;text-transform:uppercase;letter-spacing:.06em;color:#888680;cursor:pointer;border-radius:6px;transition:all .15s}.nav-links button:hover{background:#f0efe9;color:#1a1a18}.nav-links button.active{background:#f0efe9;color:#1a1a18;box-shadow:inset 0 -2px #c8a96e}.nav-user{display:flex;align-items:center;gap:16px}.user-name{font-family:DM Mono,monospace;font-size:13px;color:#888680;font-weight:500}.btn-logout{background:transparent;color:#c0392b;border:1px solid rgba(192,57,43,.35);padding:6px 14px;border-radius:6px;font-family:DM Mono,monospace;font-size:12px;font-weight:500;cursor:pointer;transition:all .15s}.btn-logout:hover{background:#c0392b12;border-color:#c0392b}.main-content{flex:1;padding:24px;max-width:1400px;width:100%;margin:0 auto}@media (max-width: 768px){.navbar{padding:0 16px}.nav-brand h1{font-size:16px}.nav-links{gap:4px}.nav-links button{padding:6px 12px;font-size:12px}.user-name{display:none}.main-content{padding:16px}}:root{--bg: #f5f5f3;--surface: #ffffff;--surface2: #f0efe9;--border: #dddbd3;--accent: #c8a96e;--accent-dim:#8a7048;--text: #1a1a18;--muted: #888680;--radius: 6px;--green: #2e8b57;--blue: #3777b5;--red: #c0392b;--amber: #b8863f}*{margin:0;padding:0;box-sizing:border-box}body{font-family:DM Mono,monospace;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--bg);color:var(--text)}.loading{display:flex;justify-content:center;align-items:center;min-height:100vh;font-size:14px;color:var(--muted);font-family:DM Mono,monospace}.error{padding:20px;color:var(--red);text-align:center}.btn-primary{background:var(--accent);color:#0e0f11;border:none;padding:10px 20px;border-radius:var(--radius);font-family:DM Mono,monospace;font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.08em;cursor:pointer;transition:background .15s}.btn-primary:hover{background:#d9bc85}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{background:transparent;color:var(--muted);border:1px solid var(--border);padding:10px 20px;border-radius:var(--radius);font-family:DM Mono,monospace;font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.08em;cursor:pointer;transition:all .15s}.btn-secondary:hover{color:var(--text);border-color:var(--muted)}.btn-full{width:100%}.form-group{margin-bottom:16px}.form-group label{display:block;margin-bottom:6px;font-size:.68rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}.form-group input,.form-group select,.form-group textarea{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);color:var(--text);font-family:DM Mono,monospace;font-size:14px;transition:border-color .2s}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--accent-dim)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.category-badge{display:inline-block;padding:4px 10px;border-radius:12px;font-size:12px;font-weight:500;color:#fff}.type-badge{display:inline-block;padding:4px 10px;border-radius:12px;font-size:12px;font-weight:500;text-transform:capitalize}.type-badge.business{background:var(--green);color:#fff}.type-badge.personal{background:var(--blue);color:#fff}
