/* ─── Reset ─── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:14px}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:#f4f6f9;color:#222;min-height:100vh}

/* ─── Navbar ─── */
.navbar{background:#1e2433;color:#fff;display:flex;align-items:center;padding:0 1.5rem;height:52px;position:sticky;top:0;z-index:200;gap:1.5rem}
.navbar-brand{font-weight:700;font-size:1.15rem;letter-spacing:.04em;color:#7eb8f7;white-space:nowrap;text-decoration:none}
.nav-menu{display:flex;list-style:none;gap:.15rem;flex:1}
.nav-menu li{position:relative}
.nav-menu a{display:block;padding:.45rem .8rem;color:#c8d0e0;text-decoration:none;border-radius:5px;font-size:.88rem;transition:background .15s,color .15s;white-space:nowrap;cursor:pointer}
.nav-menu a:hover{background:#2d3550;color:#fff}
.nav-menu a.active{background:#2d3550;color:#7eb8f7}
.nav-menu .dropdown-menu{display:none;position:absolute;top:100%;left:0;background:#1e2433;border:1px solid #2d3550;border-radius:6px;min-width:160px;z-index:300;padding:.3rem 0;float:none;box-shadow:none}
.nav-menu li:hover .dropdown-menu{display:block}
.nav-menu .dropdown-menu a{padding:.4rem .9rem;border-radius:0}
.nav-user{margin-left:auto;display:flex;align-items:center;gap:.5rem;color:#c8d0e0;font-size:.85rem;cursor:pointer}
.nav-user a{color:#c8d0e0;text-decoration:none;display:flex;align-items:center;gap:.5rem}
.nav-user a:hover{color:#fff}
.avatar{width:28px;height:28px;border-radius:50%;background:#3d4f78;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.75rem;color:#7eb8f7}
.hamburger{display:none;cursor:pointer;padding:.4rem;color:#c8d0e0;font-size:1.3rem;background:none;border:none}

/* ─── 2-col layout (Payments) ─── */
.payments-layout{display:grid;grid-template-columns:minmax(230px,18%) 1fr;gap:1rem;padding:1rem 1.2rem;max-width:1400px;margin:0 auto;align-items:start}

/* ─── 2-col layout (CRUD sections) ─── */
.crud-layout{display:grid;grid-template-columns:1fr 420px;gap:1rem;padding:1rem 1.2rem;max-width:1200px;margin:0 auto;align-items:start}
.crud-layout.tree-layout{grid-template-columns:1fr 380px}

/* ─── Full layout (Stats) ─── */
.full-layout{padding:1rem 1.2rem;max-width:1200px;margin:0 auto}

/* ─── Panel ─── */
.panel{background:#fff;border-radius:10px;box-shadow:0 1px 4px rgba(0,0,0,.08);overflow:hidden;margin-bottom:1rem}
.panel-header{padding:.65rem 1rem;font-weight:600;font-size:.8rem;color:#666;text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid #f0f0f0;background:#fafbfc;display:flex;align-items:center;justify-content:space-between}
.panel-body{padding:1rem}

/* ─── Calendar ─── */
.cal-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:.8rem}
.cal-nav button{background:none;border:none;cursor:pointer;color:#555;font-size:1.1rem;padding:.2rem .5rem;border-radius:4px;transition:background .12s}
.cal-nav button:hover{background:#eef}
.cal-month{font-weight:600;font-size:.92rem}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;text-align:center}
.cal-grid .dow{font-size:.7rem;color:#999;font-weight:600;padding:.25rem 0;text-transform:uppercase}
.cal-grid .day{padding:.32rem 0;font-size:.83rem;border-radius:5px;cursor:pointer;transition:background .12s,color .12s;color:#333;position:relative}
.cal-grid .day:hover{background:#e8f0fe;color:#1a73e8}
.cal-grid .day.today{background:#1a73e8;color:#fff;font-weight:600}
.cal-grid .day.selected{background:#174ea6;color:#fff}
.cal-grid .day.has-payments::after{content:'';position:absolute;bottom:2px;left:50%;transform:translateX(-50%);width:4px;height:4px;border-radius:50%;background:#1a73e8}
.cal-grid .day.today.has-payments::after{background:#fff}
.cal-grid .day.selected.has-payments::after{background:#fff}
.cal-grid .day.other-month{color:#ccc;cursor:default}
.cal-grid .day.other-month:hover{background:none;color:#ccc}

/* ─── Form elements ─── */
.form-section{margin-bottom:.9rem}
label.field-label{display:block;font-size:.73rem;font-weight:600;color:#718096;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.28rem}
.form-control{width:100%;border:1.5px solid #e2e8f0;border-radius:7px;padding:.42rem .7rem;font-size:.88rem;outline:none;background:#fff;transition:border-color .15s;color:#2d3748;-webkit-appearance:none;font-family:inherit}
.form-control:focus{border-color:#1a73e8;box-shadow:none}
select.form-control{cursor:pointer}
.title-input{width:100%;font-size:1.1rem;font-weight:500;border:2px solid #e2e8f0;border-radius:8px;padding:.6rem 1rem;outline:none;transition:border-color .15s;color:#1a202c;font-family:inherit;background:#fff}
.title-input::placeholder{color:#a0aec0;font-weight:400}
.title-input:focus{border-color:#1a73e8}
.form-row{display:grid;gap:.6rem;margin-top:.6rem}
.cols-3{grid-template-columns:1fr 1fr 1fr}
.cols-2{grid-template-columns:1fr 1fr}
.cols-4{grid-template-columns:1fr 1fr 1fr 1fr}

/* Amount with inline currency */
.amount-group{display:flex;border:1.5px solid #e2e8f0;border-radius:7px;overflow:hidden;transition:border-color .15s}
.amount-group:focus-within{border-color:#1a73e8}
.amount-group input{flex:1;border:none;padding:.42rem .7rem;font-size:.88rem;outline:none;color:#2d3748;min-width:0;background:#fff}
.amount-group select{border:none;border-left:1.5px solid #e2e8f0;background:#fafbfc;padding:.42rem .5rem;font-size:.8rem;font-weight:600;color:#555;cursor:pointer;outline:none;-webkit-appearance:none;padding-right:.8rem}

/* Toggles */
.toggle-row{display:flex;align-items:center;gap:.5rem;font-size:.85rem;color:#4a5568;cursor:pointer}
.toggle,.fc-toggle{position:relative;width:38px;height:21px;flex-shrink:0}
.toggle input,.fc-toggle input{opacity:0;width:0;height:0;position:absolute}
.toggle-slider{position:absolute;top:0;left:0;right:0;bottom:0;background:#cbd5e0;border-radius:21px;transition:.2s}
.toggle-slider::before{content:'';position:absolute;width:15px;height:15px;left:3px;bottom:3px;background:#fff;border-radius:50%;transition:.2s}
.toggle input:checked + .toggle-slider,.fc-toggle input:checked + .toggle-slider{background:#1a73e8}
.toggle input:checked + .toggle-slider::before,.fc-toggle input:checked + .toggle-slider::before{transform:translateX(17px)}
.profit-toggle{display:flex;background:#f0f4f8;border-radius:7px;overflow:hidden;border:1.5px solid #e2e8f0}
.profit-toggle button{flex:1;border:none;padding:.4rem .5rem;font-size:.82rem;font-weight:600;cursor:pointer;background:none;color:#718096;transition:background .12s,color .12s}
.profit-toggle button.active.expense{background:#fff0f0;color:#e53e3e}
.profit-toggle button.active.income{background:#e6f9f0;color:#1a7a4a}

/* Tags */
.tags-input-wrap{border:1.5px solid #e2e8f0;border-radius:7px;padding:.3rem .5rem;display:flex;flex-wrap:wrap;gap:.3rem;cursor:text;min-height:36px;align-items:center;transition:border-color .15s;background:#fff}
.tags-input-wrap:focus-within{border-color:#1a73e8}
.tag-chip{background:#eef2ff;color:#4361cc;border-radius:4px;font-size:.75rem;padding:.15rem .45rem;font-weight:500;display:flex;align-items:center;gap:.3rem;white-space:nowrap}
.tag-chip button{background:none;border:none;cursor:pointer;color:#9ba8d4;font-size:.8rem;padding:0;line-height:1}
.tag-chip button:hover{color:#e53e3e}
.tags-input-inner{border:none;outline:none;font-size:.83rem;min-width:80px;flex:1;font-family:inherit;padding:.1rem 0;background:transparent}
.recent-tags-row{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.4rem}
.recent-tag-chip{display:inline-block;background:#f5f5f5;border:1px solid #e2e8f0;border-radius:10px;padding:.15rem .55rem;font-size:.75rem;cursor:pointer;color:#555;transition:background .12s,border-color .12s}
.recent-tag-chip:hover{background:#e8f0fe;border-color:#1a73e8;color:#1a73e8}

/* Autocomplete */
.autocomplete-wrap{position:relative}
.autocomplete-drop{position:absolute;top:100%;left:0;right:0;background:#fff;border:1.5px solid #e2e8f0;border-top:none;border-radius:0 0 8px 8px;box-shadow:0 4px 12px rgba(0,0,0,.1);z-index:100;max-height:200px;overflow-y:auto;display:none}
.autocomplete-drop.open{display:block}
.ac-item{padding:.55rem 1rem;cursor:pointer;font-size:.88rem;transition:background .1s}
.ac-item:hover{background:#f0f4ff}
.ac-item .ac-meta{font-size:.75rem;color:#a0aec0;margin-top:.1rem}

/* Desc toggle */
.desc-toggle{display:inline-flex;align-items:center;gap:.3rem;margin-top:.4rem;font-size:.78rem;color:#718096;cursor:pointer;background:none;border:none;padding:0;transition:color .12s;font-family:inherit}
.desc-toggle:hover{color:#1a73e8}
.desc-field{margin-top:.5rem}
.desc-field textarea{width:100%;border:1.5px solid #e2e8f0;border-radius:7px;padding:.5rem .7rem;font-size:.85rem;resize:vertical;min-height:60px;font-family:inherit;outline:none;transition:border-color .15s}
.desc-field textarea:focus{border-color:#1a73e8}

/* Presets */
.presets-list{display:flex;flex-wrap:wrap;gap:.4rem}
.preset-chip{display:inline-flex;flex-direction:column;align-items:flex-start;background:#f7f9fc;border:1.5px solid #e2e8f0;border-radius:8px;padding:.35rem .65rem;cursor:pointer;transition:border-color .15s,background .15s;font-size:.8rem;font-family:inherit}
.preset-chip:hover{border-color:#1a73e8;background:#ebf2fe}
.preset-chip .p-name{font-weight:600;color:#2d3748}
.preset-chip .p-meta{font-size:.72rem;color:#a0aec0;margin-top:.1rem}
.preset-chip .p-meta.income{color:#1a7a4a}

/* Buttons */
.btn{border:none;border-radius:7px;padding:.45rem .9rem;font-size:.88rem;font-weight:600;cursor:pointer;transition:background .15s,transform .1s;font-family:inherit;display:inline-block;text-align:center;text-decoration:none;line-height:1.4}
.btn:active{transform:scale(.98)}
.btn-primary{background:#1a73e8;color:#fff}
.btn-primary:hover{background:#1558b0;color:#fff;text-decoration:none}
.btn-secondary{background:#f0f4f8;color:#4a5568;border:1.5px solid #e2e8f0}
.btn-secondary:hover{background:#e2e8f0}
.btn-danger{background:#fff0f0;color:#e53e3e;border:1.5px solid #fecaca}
.btn-danger:hover{background:#fecaca;color:#e53e3e}
.btn-sm{padding:.3rem .65rem;font-size:.8rem}
.btn-xs{padding:.2rem .5rem;font-size:.75rem}
.btn-block{width:100%;padding:.6rem;font-size:.92rem;display:block}
.btn-link{background:none;border:none;color:#718096;font-size:.8rem;cursor:pointer;padding:0;font-weight:400;text-decoration:none}
.btn-link:hover{color:#1a73e8}
.btn-submit{margin-top:.8rem;width:100%;background:#1a73e8;color:#fff;border:none;border-radius:8px;padding:.6rem;font-size:.92rem;font-weight:600;cursor:pointer;transition:background .15s}
.btn-submit:hover{background:#1558b0}
.btn-row{display:flex;gap:.5rem;margin-top:.8rem}
.btn-row .btn-primary{flex:1}

/* ─── Date header ─── */
.date-header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;border-bottom:1px solid #f0f0f0}
.date-title{font-size:.97rem;font-weight:600;color:#2d3748}
.date-nav{display:flex;gap:.3rem}
.date-nav button{background:none;border:1px solid #e2e8f0;border-radius:6px;padding:.22rem .55rem;cursor:pointer;color:#718096;font-size:.88rem;transition:background .12s}
.date-nav button:hover{background:#f0f4ff;color:#1a73e8}

/* ─── Payment table ─── */
.payment-table{width:100%;border-collapse:collapse}
.payment-table thead th{font-size:.72rem;font-weight:600;color:#a0aec0;text-transform:uppercase;letter-spacing:.05em;padding:.45rem 1rem;text-align:left;border-bottom:2px solid #f0f0f0;background:#fafbfc}
.payment-table thead th:last-child{text-align:right}
.payment-table tbody tr{border-bottom:1px solid #f8f8f8;transition:background .1s;cursor:pointer}
.payment-table tbody tr:hover{background:#f7faff}
.payment-table tbody tr.editing{background:#ebf2fe}
.payment-table td{padding:.65rem 1rem;font-size:.88rem;vertical-align:middle}
.payment-table td:last-child{text-align:right}
.p-title-cell{font-weight:500;color:#2d3748}
.p-sub{font-size:.75rem;color:#a0aec0;margin-top:.1rem}
.type-badge{display:inline-block;background:#eef2ff;color:#4361cc;font-size:.7rem;font-weight:600;padding:.12rem .45rem;border-radius:4px;white-space:nowrap}
.type-badge.income{background:#e6f9f0;color:#1a7a4a}
.amount-cell{font-weight:700;white-space:nowrap;color:#2d3748}
.amount-cell.income{color:#1a7a4a}
.row-actions{display:flex;gap:.3rem;justify-content:flex-end;opacity:0;transition:opacity .15s}
.payment-table tbody tr:hover .row-actions{opacity:1}
.payment-table tbody tr.editing .row-actions{opacity:1}
.btn-icon{background:none;border:none;cursor:pointer;width:26px;height:26px;border-radius:5px;display:flex;align-items:center;justify-content:center;color:#a0aec0;transition:background .12s,color .12s;font-size:.82rem;padding:0}
.btn-icon:hover{background:#f0f4ff;color:#1a73e8}
.btn-icon.del:hover{background:#fff0f0;color:#e53e3e}
.empty-state{text-align:center;padding:2.5rem 1rem;color:#a0aec0}
.empty-state .icon{font-size:2rem;margin-bottom:.5rem}
.empty-state p{font-size:.88rem}
.necessary-flag{color:#e67e22;font-size:.75rem;margin-left:.2rem}
.child-row td:first-child{padding-left:2.5rem}
.child-row td:first-child::before{content:'└─ ';color:#cbd5e0;font-size:.8rem}
.transfer-row{background:#fff9e6}
.transfer-badge{display:inline-block;background:#fff3cd;color:#856404;font-size:.7rem;font-weight:600;padding:.12rem .45rem;border-radius:4px}
.form-panel-editing .panel-header{background:#ebf2fe;border-bottom-color:#c7dcf8;color:#1558b0}

/* ─── Stats panel ─── */
.stat-block{padding:.8rem 1rem;border-bottom:1px solid #f5f5f5}
.stat-block:last-child{border-bottom:none}
.stat-title{font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:#a0aec0;margin-bottom:.5rem}
.stat-total{font-size:1.35rem;font-weight:700;margin-bottom:.5rem}
.stat-total.expense{color:#d63031}
.stat-total.income{color:#1a7a4a}
.stat-row{display:flex;align-items:center;justify-content:space-between;padding:.28rem 0;font-size:.83rem}
.stat-row-label{display:flex;align-items:center;gap:.45rem;color:#555}
.stat-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;display:inline-block}
.stat-row-amount{font-weight:600}
.stat-bar-bg{height:4px;background:#f0f0f0;border-radius:3px;overflow:hidden;margin-top:.15rem;margin-bottom:.4rem}
.stat-bar-fill{height:100%;border-radius:3px}
.stat-date{font-size:.8rem;color:#a0aec0;padding:.45rem 1rem;border-bottom:1px solid #f0f0f0}
.balance-row{display:flex;flex-direction:column;gap:.35rem;margin-top:.4rem}
.balance-card{border-radius:7px;padding:.35rem .6rem;text-align:left;display:flex;align-items:baseline;justify-content:space-between;gap:.4rem}
.balance-card.exp{background:#fff5f5}
.balance-card.inc{background:#f0fdf4}
.balance-card .bc-label{font-size:.7rem;color:#a0aec0;white-space:nowrap}
.balance-card .bc-value{font-weight:700;font-size:.88rem}
.balance-card.exp .bc-value{color:#d63031}
.balance-card.inc .bc-value{color:#1a7a4a}

/* ─── CRUD table ─── */
.crud-table{width:100%;border-collapse:collapse}
.crud-table thead th{font-size:.72rem;font-weight:600;color:#a0aec0;text-transform:uppercase;letter-spacing:.05em;padding:.45rem 1rem;text-align:left;border-bottom:2px solid #f0f0f0;background:#fafbfc}
.crud-table tbody tr{border-bottom:1px solid #f5f5f5;transition:background .1s}
.crud-table tbody tr:hover{background:#f7faff}
.crud-table td{padding:.65rem 1rem;font-size:.88rem;vertical-align:middle}
.crud-table td:last-child{text-align:right}
.crud-actions{display:flex;gap:.4rem;justify-content:flex-end}

/* ─── PaymentType tree ─── */
.tree-node{padding:.05rem 0}
.tree-root{padding:.5rem 1rem;display:flex;align-items:center;gap:.5rem;cursor:pointer;border-radius:6px;transition:background .1s;font-weight:600;font-size:.9rem}
.tree-root:hover{background:#f0f4ff}
.tree-root .tree-expand{color:#a0aec0;font-size:.75rem;width:14px;flex-shrink:0;transition:transform .15s}
.tree-root.open .tree-expand{transform:rotate(90deg)}
.tree-children{padding-left:1.5rem;display:none}
.tree-root.open + .tree-children{display:block}
.tree-leaf{padding:.4rem 1rem;display:flex;align-items:center;justify-content:space-between;border-radius:6px;transition:background .1s;font-size:.87rem;color:#4a5568}
.tree-leaf:hover{background:#f7f9fc}
.tree-leaf-name{display:flex;align-items:center;gap:.5rem}
.tree-leaf-actions{display:flex;gap:.3rem;opacity:0;transition:opacity .15s}
.tree-leaf:hover .tree-leaf-actions{opacity:1}
.tree-root:hover .tree-root-actions{opacity:1}
.tree-root-actions{display:flex;gap:.3rem;opacity:0;transition:opacity .15s;margin-left:auto}
.add-root-btn{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;cursor:pointer;font-size:.85rem;color:#a0aec0;transition:color .12s;border-top:1px solid #f0f0f0;margin-top:.5rem}
.add-root-btn:hover{color:#1a73e8}

/* ─── Statistics section ─── */
.stat-filters{display:flex;flex-wrap:wrap;gap:.6rem;align-items:flex-end;margin-bottom:1rem}
.stat-filters .form-group{flex:0 0 auto}
.stat-filters .form-group label{display:block;font-size:.72rem;font-weight:600;color:#718096;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.28rem}
.stat-filters .form-control{min-width:130px}
.charts-grid{display:grid;grid-template-columns:2fr 1fr;gap:1rem;margin-bottom:1rem}
.bar-chart{padding:.8rem 1rem}
.bar-chart-title{font-size:.78rem;font-weight:600;color:#a0aec0;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.8rem}
.bars{display:flex;align-items:flex-end;gap:.4rem;height:120px}
.bar-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:.3rem}
.bar-val{font-size:.65rem;color:#718096;font-weight:600}
.bar-fill{width:100%;border-radius:4px 4px 0 0;transition:height .3s;background:#4361cc}
.bar-fill.income{background:#1a7a4a}
.bar-label{font-size:.65rem;color:#a0aec0;margin-top:.2rem}
.donut-wrap{display:flex;flex-direction:column;align-items:center;padding:1rem}
.donut{width:100px;height:100px;border-radius:50%;margin-bottom:.8rem}
.donut-legend{width:100%;font-size:.78rem}
.donut-legend-item{display:flex;align-items:center;gap:.4rem;padding:.2rem 0;justify-content:space-between}
.stat-summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;margin-bottom:1rem}
.summary-card{background:#fff;border-radius:10px;padding:.9rem 1rem;box-shadow:0 1px 4px rgba(0,0,0,.07)}
.summary-card .sc-label{font-size:.72rem;color:#a0aec0;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.3rem}
.summary-card .sc-value{font-size:1.3rem;font-weight:700}
.summary-card .sc-value.expense{color:#d63031}
.summary-card .sc-value.income{color:#1a7a4a}

/* ─── QuickLinks ─── */
.ql-grid{display:flex;flex-wrap:wrap;gap:.6rem;padding:1rem}
.ql-card{background:#f7f9fc;border:1.5px solid #e2e8f0;border-radius:9px;padding:.6rem .85rem;min-width:140px;cursor:pointer;transition:border-color .15s}
.ql-card:hover{border-color:#1a73e8;background:#ebf2fe}
.ql-card .qc-name{font-weight:600;font-size:.88rem;color:#2d3748}
.ql-card .qc-meta{font-size:.75rem;color:#a0aec0;margin-top:.2rem}
.ql-card .qc-actions{display:flex;gap:.3rem;margin-top:.5rem;opacity:0;transition:opacity .15s}
.ql-card:hover .qc-actions{opacity:1}

/* ─── Settings ─── */
.settings-grid{display:grid;grid-template-columns:220px 1fr;gap:1rem;padding:1rem 1.2rem;max-width:900px;margin:0 auto}
.settings-menu{background:#fff;border-radius:10px;box-shadow:0 1px 4px rgba(0,0,0,.08);padding:.5rem 0;height:fit-content}
.settings-menu a{display:block;padding:.55rem 1.1rem;font-size:.88rem;color:#4a5568;cursor:pointer;transition:background .1s;text-decoration:none;border-left:3px solid transparent}
.settings-menu a:hover{background:#f0f4ff}
.settings-menu a.active{border-left-color:#1a73e8;color:#1a73e8;background:#f0f4ff;font-weight:600}
.settings-content .panel-body{padding:1.3rem}
.settings-section{margin-bottom:1.5rem}
.settings-section h3{font-size:.9rem;font-weight:600;color:#2d3748;margin-bottom:.8rem;padding-bottom:.5rem;border-bottom:1px solid #f0f0f0}
.settings-row{display:flex;align-items:center;justify-content:space-between;padding:.5rem 0;border-bottom:1px solid #f8f8f8;font-size:.88rem}
.settings-row:last-child{border-bottom:none}
.settings-row .sr-label{color:#4a5568}
.settings-row .sr-value{color:#718096;font-size:.82rem}

/* ─── Login ─── */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#1e2433 0%,#2d3550 100%)}
.login-box{background:#fff;border-radius:14px;padding:2.5rem 2rem;width:100%;max-width:380px;box-shadow:0 10px 40px rgba(0,0,0,.3)}
.login-logo{text-align:center;margin-bottom:1.5rem}
.login-logo .brand{font-size:2rem;font-weight:700;color:#1a73e8}
.login-logo .tagline{font-size:.82rem;color:#a0aec0;margin-top:.2rem}
.login-box h2{font-size:1.1rem;font-weight:600;color:#2d3748;margin-bottom:1.3rem;text-align:center}
.login-box .form-group{margin-bottom:.8rem}
.login-box label{display:block;font-size:.78rem;font-weight:600;color:#718096;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.3rem}
.login-remember{display:flex;align-items:center;gap:.5rem;font-size:.85rem;color:#718096;margin:.5rem 0}
.login-remember input{cursor:pointer}
.login-err{background:#fff5f5;border:1.5px solid #fecaca;color:#e53e3e;border-radius:7px;padding:.5rem .75rem;font-size:.83rem;margin-bottom:.8rem;display:none}
.login-err.show{display:block}

/* ─── Misc ─── */
hr.divider{border:none;border-top:1px solid #f0f0f0;margin:.7rem 0}
.badge{display:inline-block;border-radius:4px;font-size:.7rem;font-weight:600;padding:.1rem .45rem}
.badge-blue{background:#eef2ff;color:#4361cc}
.badge-green{background:#e6f9f0;color:#1a7a4a}
.badge-gray{background:#f0f4f8;color:#718096}
.text-muted{color:#a0aec0;font-size:.82rem}
.flex{display:flex}
.gap-4{gap:.4rem}
.items-center{align-items:center}
.ml-auto{margin-left:auto}
/* generic utils for existing pages */
.text-right{text-align:right}
.text-center{text-align:center}
.pull-right{float:right}
.pull-left{float:left}
.clearfix::after{content:'';display:table;clear:both}
.form-group{margin-bottom:.8rem}
.form-group label{display:block;font-size:.8rem;color:#718096;margin-bottom:.3rem;font-weight:600}
.page-content{padding:1rem 1.2rem;max-width:1200px;margin:0 auto}
/* simple table for pages that use .table */
table.table{width:100%;border-collapse:collapse}
table.table th{font-size:.72rem;font-weight:600;color:#a0aec0;text-transform:uppercase;letter-spacing:.05em;padding:.45rem 1rem;text-align:left;border-bottom:2px solid #f0f0f0;background:#fafbfc}
table.table td{padding:.65rem 1rem;font-size:.88rem;vertical-align:middle;border-top:1px solid #f5f5f5}
table.table-hover tbody tr:hover{background:#f7faff}

/* ─── Transfer form panel ─── */
.transfer-panel{display:none}
.transfer-panel.open{display:block}
.transfer-grid{display:grid;grid-template-columns:1fr 40px 1fr;gap:.6rem;align-items:start;margin-bottom:.85rem}
.transfer-arrow-col{display:flex;align-items:center;justify-content:center;padding-top:1.85rem}
.transfer-arrow-circle{width:30px;height:30px;border-radius:50%;background:#e8f0fe;display:flex;align-items:center;justify-content:center;color:#1a73e8;font-size:1rem;font-weight:700;flex-shrink:0}
.transfer-badge{display:inline-flex;align-items:center;gap:.25rem;padding:.15rem .5rem;border-radius:12px;font-size:.74rem;background:#e8f0fe;color:#1a73e8;font-weight:500;white-space:nowrap}
.btn-transfer{display:flex;align-items:center;justify-content:center;gap:.4rem;width:100%;margin-top:.6rem;padding:.4rem .8rem;border-radius:7px;border:1.5px solid #c3d9f7;background:#f0f7ff;color:#1a73e8;font-size:.82rem;font-weight:500;cursor:pointer;transition:background .12s;font-family:inherit}
.btn-transfer:hover{background:#daeeff;border-color:#1a73e8}

/* ─── Statistic page layout ─── */
.stat-layout{display:grid;grid-template-columns:272px 1fr;gap:1rem;padding:1rem 1.2rem;max-width:1200px;margin:0 auto;align-items:start}
.stat-filters-panel .panel-body{padding:.85rem}
.sf-row{margin-bottom:.7rem}
.sf-label{display:block;font-size:.7rem;font-weight:600;color:#a0aec0;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.28rem}
.sf-sep{height:1px;background:#f0f0f0;margin:.65rem 0}

/* Mode toggle */
.mode-toggle{display:flex;border:1.5px solid #e2e8f0;border-radius:7px;overflow:hidden;margin-bottom:.8rem}
.mode-toggle button{flex:1;padding:.38rem .5rem;border:none;background:#f7f9fc;font-size:.82rem;font-weight:500;color:#718096;cursor:pointer;font-family:inherit;transition:background .12s,color .12s}
.mode-toggle button.active{background:#1a73e8;color:#fff}
.mode-toggle button:first-child{border-right:1.5px solid #e2e8f0}

/* Date range */
.date-range-row{display:flex;align-items:center;gap:.3rem;margin-bottom:.4rem}
.date-range-row input{flex:1;min-width:0;border:1.5px solid #e2e8f0;border-radius:7px;padding:.35rem .4rem;font-size:.79rem;outline:none;color:#2d3748;font-family:inherit;transition:border-color .15s}
.date-range-row input:focus{border-color:#1a73e8}
.date-range-row .dr-dash{color:#a0aec0;font-size:.78rem;flex-shrink:0}

/* Listbox presets */
.preset-lbs{display:flex;gap:.35rem}
.lb{display:flex;border:1.5px solid #e2e8f0;border-radius:6px;overflow:hidden}
.lb button{padding:.19rem .38rem;border:none;background:#f7f9fc;font-size:.71rem;font-weight:500;color:#718096;cursor:pointer;font-family:inherit;white-space:nowrap;transition:background .12s,color .12s}
.lb button+button{border-left:1.5px solid #e2e8f0}
.lb button.active{background:#1a73e8;color:#fff}

/* Select + chips */
.sel-filter select{width:100%;border:1.5px solid #e2e8f0;border-radius:7px;padding:.36rem .65rem;font-size:.83rem;outline:none;background:#fff;color:#2d3748;-webkit-appearance:none;font-family:inherit;cursor:pointer;transition:border-color .15s}
.sel-filter select:focus{border-color:#1a73e8}
.sel-chips{display:flex;flex-wrap:wrap;gap:.28rem;margin-top:.3rem}
.sel-chip{display:inline-flex;align-items:center;gap:.2rem;padding:.15rem .5rem;border-radius:12px;background:#e8f0fe;color:#1a73e8;font-size:.74rem;font-weight:500;user-select:none}
.sel-chip .sc-rm{color:#94b8ee;font-size:.63rem;cursor:pointer;line-height:1}
.sel-chip .sc-rm:hover{color:#e53e3e}

/* 3-way profit toggle */
.profit-3{display:flex;border:1.5px solid #e2e8f0;border-radius:7px;overflow:hidden}
.profit-3 button{flex:1;padding:.32rem .2rem;border:none;background:#f7f9fc;font-size:.78rem;font-weight:500;color:#718096;cursor:pointer;font-family:inherit;transition:background .12s}
.profit-3 button+button{border-left:1.5px solid #e2e8f0}
.profit-3 button.p-all{background:#f0f7ff;color:#1a73e8}
.profit-3 button.p-exp{background:#fff5f5;color:#d63031}
.profit-3 button.p-inc{background:#f0fdf4;color:#1a7a4a}

/* Grouping toggle */
.grp-toggle{display:flex;border:1.5px solid #e2e8f0;border-radius:7px;overflow:hidden}
.grp-toggle button{flex:1;padding:.3rem .2rem;border:none;background:#f7f9fc;font-size:.78rem;font-weight:500;color:#718096;cursor:pointer;font-family:inherit;transition:background .12s}
.grp-toggle button+button{border-left:1.5px solid #e2e8f0}
.grp-toggle button.active{background:#1a73e8;color:#fff}

/* Tag filter */
.tag-filter-wrap{border:1.5px solid #e2e8f0;border-radius:7px;padding:.28rem .4rem;display:flex;flex-wrap:wrap;gap:.28rem;min-height:32px;transition:border-color .15s;background:#fff;cursor:text}
.tag-filter-wrap:focus-within{border-color:#1a73e8}
.tf-tag{display:inline-flex;align-items:center;gap:.2rem;padding:.1rem .45rem;border-radius:12px;background:#eef2ff;color:#4361cc;font-size:.74rem;font-weight:500}
.tf-tag .tf-rm{color:#9db4d4;font-size:.63rem;cursor:pointer}
.tf-tag .tf-rm:hover{color:#e53e3e}
.tf-input{border:none;outline:none;font-size:.8rem;min-width:70px;flex:1;font-family:inherit;background:transparent;padding:.05rem 0}

/* Summary cards (stat page) */
.stat-summary-row{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin-bottom:1rem}
.sc2{background:#fff;border-radius:10px;box-shadow:0 1px 4px rgba(0,0,0,.08);padding:.8rem 1rem}
.sc2-label{font-size:.7rem;font-weight:600;color:#a0aec0;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.2rem}
.sc2-value{font-size:1.25rem;font-weight:700;letter-spacing:-.01em}
.sc2-sub{font-size:.72rem;color:#a0aec0;margin-top:.1rem}
.sc2.exp .sc2-value{color:#d63031}
.sc2.inc .sc2-value{color:#1a7a4a}
.sc2.bal .sc2-value{color:#1a73e8}

/* Stat bar chart */
.stat-chart-wrap{padding:.85rem .85rem .55rem}
.stat-chart-title{font-size:.75rem;font-weight:600;color:#a0aec0;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.75rem}
.stat-bars{display:flex;align-items:flex-end;gap:4px;height:110px;border-bottom:1.5px solid #f0f0f0}
.stat-bar-grp{display:flex;align-items:flex-end;gap:2px;flex:1;cursor:pointer}
.stat-bar-grp:hover .stat-bar-item{opacity:.75}
.stat-bar-item{border-radius:3px 3px 0 0;min-height:2px;flex:1;transition:opacity .1s}
.stat-bar-item.sbe{background:#f87171}
.stat-bar-item.sbi{background:#4ade80}
.stat-bar-lbls{display:flex;gap:4px;margin-top:.3rem}
.stat-bar-lbl{flex:1;text-align:center;font-size:.64rem;color:#a0aec0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.stat-chart-legend{display:flex;gap:.8rem;margin-top:.5rem;justify-content:flex-end}
.stat-chart-legend span{display:flex;align-items:center;gap:.25rem;font-size:.72rem;color:#718096}
.stat-chart-legend i{width:9px;height:9px;border-radius:2px;flex-shrink:0}
.stat-chart-legend i.le{background:#f87171}
.stat-chart-legend i.li{background:#4ade80}

/* Categories & accounts bottom grid */
.stat-bottom-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1rem}
.stat-cat-item{padding:.38rem 0;cursor:pointer}
.stat-cat-item:hover .stat-cat-name{color:#1a73e8}
.stat-cat-top{display:flex;align-items:center;gap:.45rem}
.stat-cat-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.stat-cat-name{flex:1;font-size:.83rem;color:#2d3748}
.stat-cat-amt{font-size:.83rem;font-weight:600;color:#2d3748}
.stat-cat-pct{font-size:.69rem;color:#a0aec0;min-width:32px;text-align:right}
.stat-cat-bg{width:100%;height:3px;background:#f0f0f0;border-radius:2px;margin-top:.28rem}
.stat-cat-fill{height:3px;border-radius:2px}
.stat-acc-item{display:flex;align-items:center;justify-content:space-between;padding:.38rem 0;border-bottom:1px solid #f7f7f7}
.stat-acc-item:last-child{border-bottom:none}
.stat-acc-name{font-size:.83rem;font-weight:500;color:#2d3748}
.stat-acc-iso{font-size:.69rem;color:#a0aec0}
.stat-acc-nums{text-align:right}
.stat-acc-exp{font-size:.8rem;font-weight:600;color:#d63031}
.stat-acc-inc{font-size:.72rem;color:#1a7a4a;margin-top:.08rem}

/* Payment list table */
.stat-plist-table{width:100%;border-collapse:collapse}
.stat-plist-table th{font-size:.7rem;font-weight:600;color:#a0aec0;text-transform:uppercase;letter-spacing:.05em;padding:.42rem .75rem;text-align:left;border-bottom:1.5px solid #f0f0f0;background:#fafbfc;white-space:nowrap}
.stat-plist-table td{padding:.48rem .75rem;border-bottom:1px solid #f7f9fc;vertical-align:middle;font-size:.83rem}
.stat-plist-table tr:last-child td{border-bottom:none}
.stat-plist-table tbody tr:hover td{background:#f7f9fc;cursor:pointer}
.stat-plist-date{color:#a0aec0;white-space:nowrap}
.stat-plist-amt{font-weight:600;white-space:nowrap;color:#2d3748}
.stat-plist-amt.pos{color:#1a7a4a}
.stat-plist-badge{display:inline-flex;align-items:center;padding:.1rem .42rem;border-radius:10px;font-size:.7rem;font-weight:500}
.stat-plist-badge.bexp{background:#fff5f5;color:#d63031}
.stat-plist-badge.binc{background:#f0fdf4;color:#1a7a4a}
.stat-plist-badge.btr{background:#e8f0fe;color:#1a73e8}
.stat-plist-type{display:inline-flex;align-items:center;padding:.1rem .42rem;border-radius:10px;font-size:.7rem;font-weight:500;background:#f0f4f8;color:#4a5568}
.stat-view{display:none}
.stat-view.active{display:block}
.stat-cur-tabs{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:1rem}
.stat-cur-tab{padding:.28rem .85rem;border-radius:6px;border:1.5px solid #e2e8f0;background:#fff;font-size:.82rem;font-weight:600;color:#718096;cursor:pointer;transition:border-color .15s,color .15s,background .15s;line-height:1.5}
.stat-cur-tab:hover{border-color:#1a73e8;color:#1a73e8}
.stat-cur-tab.active{background:#1a73e8;border-color:#1a73e8;color:#fff}
.stat-summary-row.two-col{grid-template-columns:1fr 1fr}
.sc2-iso{font-size:.72rem;font-weight:400;color:#718096}
.stat-line-chart{overflow:hidden}

/* Stat modal */
.stat-modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.38);z-index:500;align-items:center;justify-content:center}
.stat-modal-overlay.open{display:flex}
.stat-modal{background:#fff;border-radius:12px;box-shadow:0 8px 32px rgba(0,0,0,.18);width:480px;max-width:95vw;overflow:hidden}
.stat-modal-header{padding:.7rem 1.1rem;font-weight:600;font-size:.88rem;border-bottom:1px solid #f0f0f0;display:flex;align-items:center;justify-content:space-between;background:#fafbfc}
.stat-modal-body{padding:1.1rem}
.sm-row{margin-bottom:.7rem}
.sm-label{font-size:.7rem;font-weight:600;color:#a0aec0;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.25rem}
.sm-input{width:100%;border:1.5px solid #e2e8f0;border-radius:7px;padding:.38rem .65rem;font-size:.85rem;outline:none;font-family:inherit;color:#2d3748;transition:border-color .15s}
.sm-input:focus{border-color:#1a73e8}
.sm-grid2{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
.sm-grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.6rem}
.sm-actions{display:flex;justify-content:flex-end;gap:.55rem;margin-top:1rem;align-items:center}
.sm-danger{background:none;border:none;color:#d63031;font-size:.82rem;cursor:pointer;font-family:inherit;margin-right:auto;padding:.2rem 0}
.sm-danger:hover{text-decoration:underline}

/* Mobile stat */
@media(max-width:1200px) and (min-width:901px){.stat-bottom-grid{grid-template-columns:1fr 1fr}}
@media(max-width:900px){.stat-layout{grid-template-columns:1fr}.stat-bottom-grid{grid-template-columns:1fr}.stat-summary-row{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.stat-summary-row{grid-template-columns:1fr}}

/* ─── Mobile ─── */
@media(max-width:900px){
  .payments-layout{grid-template-columns:1fr;padding:.75rem}
  .col-left{display:none}
  .col-left.mob-open{display:block}
  .nav-menu{display:none;flex-direction:column;position:absolute;top:52px;left:0;right:0;background:#1e2433;padding:.5rem;border-bottom:1px solid #2d3550;z-index:200}
  .nav-menu.open{display:flex}
  .hamburger{display:block}
  .crud-layout{grid-template-columns:1fr}
  .charts-grid{grid-template-columns:1fr}
  .stat-summary-grid{grid-template-columns:1fr 1fr}
  .settings-grid{grid-template-columns:1fr}
}
@media(max-width:560px){
  .cols-3,.cols-4{grid-template-columns:1fr 1fr}
  .cols-2{grid-template-columns:1fr}
  .stat-summary-grid{grid-template-columns:1fr}
}

/* ── Management pages ── */
.mgmt-wrap{padding:1rem 1.2rem;max-width:960px;margin:0 auto}
.mgmt-table{width:100%;border-collapse:collapse}
.mgmt-table th{font-size:.7rem;font-weight:600;color:#a0aec0;text-transform:uppercase;letter-spacing:.05em;padding:.42rem .75rem;text-align:left;border-bottom:1.5px solid #f0f0f0;background:#fafbfc;white-space:nowrap}
.mgmt-table td{padding:.5rem .75rem;border-bottom:1px solid #f7f9fc;font-size:.84rem;vertical-align:middle}
.mgmt-table tr:last-child td{border-bottom:none}
.mgmt-table tbody tr:hover td{background:#f7f9fc}
.mgmt-actions{text-align:right;white-space:nowrap;width:1px}
.mgmt-empty{text-align:center;padding:2rem;color:#a0aec0;font-size:.85rem}
.mgmt-iso{display:inline-block;padding:.1rem .48rem;background:#f0f4f8;border-radius:5px;font-size:.72rem;font-weight:700;color:#4a5568;letter-spacing:.05em}
.mgmt-profit{display:inline-block;padding:.1rem .45rem;border-radius:5px;font-size:.72rem;font-weight:500}
.mgmt-profit.exp{background:#fff5f5;color:#d63031}
.mgmt-profit.inc{background:#f0fdf4;color:#1a7a4a}
.mgmt-cat{font-size:.77rem;color:#718096}
.mgmt-nec{color:#f59e0b;font-size:.8rem}
.mgmt-indent{padding-left:2rem!important}
.mgmt-type-global{opacity:.55}
.mgmt-global-badge{display:inline-block;padding:.05rem .35rem;background:#f0f4f8;border-radius:4px;font-size:.68rem;color:#a0aec0;font-weight:400;font-style:normal}

/* Category tree (payment types / categories page) */
.category-tree-panel{padding:.25rem .5rem .75rem;min-height:4rem}
.category-tree{list-style:none;margin:0;padding:0}
.category-tree-branch{list-style:none;margin:0 0 .2rem;padding:0}
.category-tree-children{
  list-style:none;margin:.1rem 0 .1rem 1.5rem;padding:0 0 0 .75rem;
  border-left:2px solid #e8edf3;
}
.category-tree-children > li{list-style:none;margin:0;padding:0}
.category-tree-node{
  display:flex;align-items:center;gap:.35rem;min-height:1rem;
  padding:.25rem .5rem;border-radius:5px;font-size:.84rem;
  transition:background .12s ease;
}
.category-tree-node:hover{background:#f0f4f8}
.category-tree-node:hover .category-tree-actions{opacity:1}
.category-tree-node--root{font-weight:500}
.category-tree-node--child{font-size:.82rem;color:#4a5568}
.category-tree-glyph{
  flex:0 0 .5rem;width:.5rem;height:.5rem;border-radius:50%;
  background:#cbd5e1;
}
.category-tree-glyph--leaf{
  width:.35rem;height:.35rem;
  background:#e2e8f0;
  margin-left:.075rem;
}
.category-tree-label{flex:1;min-width:0;line-height:1.35}
.category-tree-actions{flex:0 0 auto;opacity:0;transition:opacity .1s ease}

/* Payment form validation errors */
.pf-error-block{
  background:#fff5f5;border:1px solid #fed7d7;border-radius:6px;
  padding:.6rem .85rem;margin-bottom:.75rem;display:none;
}
.pf-error-item{
  color:#c53030;font-size:.84rem;line-height:1.6;
}
.pf-invalid{
  border-color:#e53e3e !important;
  box-shadow:0 0 0 2px rgba(229,62,62,.2) !important;
}