Add reconnect UI, disconnect button, and visual cleanup

- Redesign disconnect overlay as a full-screen modal with dark backdrop
- Add working Reconnect button that properly re-establishes WebSocket connection
- Add Disconnect button in Settings for testing
- Separate disconnect and ban/kick codepaths (no reconnect on ban)
- Log disconnect notice in IC log using hrtext style
- Refactor area list rendering from client state (renderAreaList)
- Extract appendICNotice for reusable IC log notices
- Clean up charselect: hide during loading, simplify toolbar layout
- Freshen loading screen and charselect styling
- Remove loading progress text updates (just show "Loading...")
- Guard against undefined client.chars and client.serv

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

1 files changed, 2 insertions, 5 deletions

diff --git a/webAO/dom/areaClick.ts b/webAO/dom/areaClick.ts
index 27682c7..120ef39 100644
--- a/webAO/dom/areaClick.ts
+++ b/webAO/dom/areaClick.ts
@@ -1,4 +1,5 @@
 import { client } from "../client";
+import { appendICNotice } from "../client/appendICNotice";
 import { renderPlayerList } from "./renderPlayerList";
 /**
  * Triggered when an item on the area list is clicked.
@@ -7,11 +8,7 @@ import { renderPlayerList } from "./renderPlayerList";
 export function area_click(el: HTMLElement) {
   const area = client.areas[el.id.substring(4)].name;
   client.sender.sendMusicChange(area);
-
-  const areaHr = document.createElement("div");
-  areaHr.className = "hrtext";
-  areaHr.textContent = `switched to ${el.textContent}`;
-  document.getElementById("client_log")!.appendChild(areaHr);
+  appendICNotice(`switched to ${el.textContent}`);
   client.area = Number(el.id.substring(4));
   renderPlayerList();
 }