*{box-sizing:border-box;margin:0;padding:0}:root{--bg:#f5f5f0;--surface:#fff;--text:#1a1a1a;--text-secondary:#666;--border:#ddd;--primary:#2d6a4f;--danger:#d32f2f;--success:#2e7d32;--radius:8px;--shadow:0 1px 3px #0000001a;--font:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif}body{font-family:var(--font);background:var(--bg);color:var(--text);min-height:100dvh;font-size:16px;line-height:1.4}#app{padding-bottom:40px}input,button{font-family:inherit;font-size:inherit}.header{background:var(--primary);color:#fff;text-align:center;z-index:100;padding:16px;font-size:18px;font-weight:600;position:sticky;top:0}.card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);margin:12px 16px;padding:16px}.form-group{margin-bottom:14px}.form-group label{color:var(--text-secondary);margin-bottom:4px;font-size:14px;font-weight:500;display:block}.form-group input{border:1.5px solid var(--border);border-radius:var(--radius);text-align:center;letter-spacing:8px;outline:none;width:100%;padding:10px 12px;font-size:24px}.form-group input:focus{border-color:var(--primary)}.btn{border-radius:var(--radius);cursor:pointer;border:none;justify-content:center;align-items:center;width:100%;padding:12px 24px;font-size:16px;font-weight:500;display:inline-flex}.btn-primary{background:var(--primary);color:#fff}.btn-outline{border:1.5px solid var(--primary);color:var(--primary);background:0 0}.btn-sm{padding:6px 12px;font-size:13px}.btn:disabled{opacity:.5}.client-info{text-align:center;padding:16px}.client-info h2{font-size:22px;font-weight:700}.client-info .ref,.client-info .phone{color:var(--text-secondary);margin-top:4px;font-size:14px}.movement-group{margin:4px 16px}.movement-group .date-header{color:var(--text-secondary);padding:6px 12px 2px;font-size:12px;font-weight:600}.tab-bar{border-bottom:2px solid var(--border);background:var(--surface);z-index:50;margin:0 16px;display:flex;position:sticky;top:54px}.tab-bar .tab{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;flex:1;margin-bottom:-2px;padding:12px;font-size:15px;font-weight:500}.tab-bar .tab.active{color:var(--primary);border-bottom-color:var(--primary)}.movement-item{border-bottom:1px solid #f0f0f0;justify-content:space-between;padding:8px 12px;font-size:14px;display:flex}.movement-item.cancelled{color:var(--text-secondary);text-decoration:line-through}.movement-time{color:var(--text-secondary);white-space:nowrap;margin-right:4px;font-size:12px}.movement-item .amount{font-weight:600}.movement-item .amount.debt{color:var(--primary);white-space:nowrap}.movement-item .amount.payment{color:var(--danger)}.total-row{border-top:2px solid var(--text);justify-content:space-between;margin:0 16px;padding:10px 12px;font-size:16px;font-weight:700;display:flex}.total-row.payment{border-top:1px dashed var(--border);color:var(--danger)}.total-row.balance{color:var(--primary)}.account-nav{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);justify-content:space-between;align-items:center;gap:8px;margin:8px 16px;padding:8px 16px;display:flex}.account-nav .account-label{color:var(--text-secondary);white-space:nowrap;font-size:13px;font-weight:600}.account-nav .btn[disabled]{opacity:.35;pointer-events:none}.previous-balance{color:var(--text-secondary);justify-content:space-between;margin:0 16px;padding:6px 16px;font-size:14px;font-style:italic;display:flex}.pagination-nav{justify-content:space-between;align-items:center;gap:8px;margin:8px 16px;padding:8px 16px;display:flex}.pagination-nav .page-info{color:var(--text-secondary);white-space:nowrap;font-size:13px;font-weight:500}.pagination-nav button{border:1.5px solid var(--primary);border-radius:var(--radius);color:var(--primary);cursor:pointer;background:0 0;align-items:center;gap:4px;padding:6px 12px;font-size:13px;font-weight:500;display:inline-flex}.pagination-nav button:hover:not([disabled]){background:var(--primary);color:#fff}.pagination-nav button:active:not([disabled]){opacity:.8}.pagination-nav button[disabled]{opacity:.3;cursor:default}.error-msg{color:var(--danger);text-align:center;padding:12px;font-size:14px}.empty-state{text-align:center;color:var(--text-secondary);padding:48px 24px}.empty-state .icon{margin-bottom:12px;font-size:48px}.debt-items{padding:4px 0 0 8px;font-size:14px}.debt-item{justify-content:space-between;padding:2px 0;display:flex}.debt-item .item-desc{color:var(--text-secondary)}.debt-item .item-amount{white-space:nowrap;margin-left:8px;font-weight:500}.debt-item.sub-payment{border-top:1px dashed #ccc;margin-top:2px;padding-top:6px}.debt-item.sub-payment .item-desc{color:var(--text);font-style:italic}.debt-note{color:var(--text-secondary);padding:2px 0 2px 8px;font-size:13px;font-style:italic}.movement-item.cancelled .debt-item .item-amount,.movement-item.cancelled .debt-item .item-desc{color:var(--text-secondary);text-decoration:line-through}
