Add new categories/envelopes from the Budget page and the loader's categorize card

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

app_page.html

@@ -55,7 +55,7 @@ th{font-size:12px;color:var(--mute);font-weight:600}td.num{text-align:right;font
   </div>
   <div class="card" id="catcard">
     <div class="row"><h2 style="margin:0">4 · Categorize payees</h2><div class="spacer"></div>
-      <button id="auto">Auto-categorize</button><button class="primary" id="savecats" disabled>Save changes</button></div>
+      <button id="addcat">Add category</button><button id="auto">Auto-categorize</button><button class="primary" id="savecats" disabled>Save changes</button></div>
     <div id="catsum" class="mute" style="margin:10px 0"></div>
     <div class="grid" style="max-height:420px;overflow:auto"><table id="cattbl"></table></div>
   </div>
@@ -118,6 +118,7 @@ async function loadPayees(){
   $("#cattbl").innerHTML=j.payees.length?"<tr><th>Payee</th><th class='num'>Payments</th><th class='num'>Total</th><th>Category</th><th>Type</th></tr>"+j.payees.map((p,i)=>`<tr><td>${esc(p.payee)}</td><td class="num">${p.n}</td><td class="num">${fmt(p.total)}</td><td><select data-i="${i}" data-k="category">${opt(j.categories,p.category)}</select></td><td><select data-i="${i}" data-k="type">${opt(j.types,p.type)}</select></td></tr>`).join(""):"";
   document.querySelectorAll("#cattbl select").forEach(sel=>sel.onchange=()=>{const p=j.payees[+sel.dataset.i];(EDITS[p.payee]=EDITS[p.payee]||{payee:p.payee,category:p.category,type:p.type})[sel.dataset.k]=sel.value;$("#savecats").disabled=false});
 }
+$("#addcat").onclick=async()=>{const name=(prompt("Name for the new category:")||"").trim();if(!name)return;try{const j=await post("/api/add_category",JSON.stringify({name}));await loadPayees();alertBox("good",esc(j.message))}catch(e){alertBox("bad",esc(e.message))}};
 $("#auto").onclick=async()=>{try{const j=await post("/api/autocategorize","");await loadPayees();alertBox("good",esc(j.message))}catch(e){alertBox("bad",esc(e.message))}};
 $("#savecats").onclick=async()=>{try{const j=await post("/api/set_categories",JSON.stringify(Object.values(EDITS)));await loadPayees();alertBox("good",esc(j.message))}catch(e){alertBox("bad",esc(e.message))}};
 refresh();loadPayees();