refactor: sidebar layout for Tech Support and Feature Manager

- Add <aside class="sidebar"> with #sidebar-support and #sidebar-features to index.html
- Restyle .main-content as flex layout (sidebar left, tiles right)
- Body is now display:flex column with overflow:hidden for independent scroll panels
- Sidebar (270px fixed) with overflow-y:auto scrolls independently
- Tiles area (flex:1) scrolls independently
- New sidebar support button (.sidebar-support-btn) replaces support tile in main grid
- Feature Manager now renders into #sidebar-features instead of $tilesArea
- Compact sidebar overrides for .feature-card padding/font-size
- Remove 'support' and 'feature-manager' from CATEGORY_ORDER
- Responsive: sidebar becomes full-width above tiles at <=768px

Agent-Logs-Url: https://github.com/naturallaw777/staging_alpha/sessions/4304350a-bc4f-4698-82b5-8ee28f0ad960

Co-authored-by: naturallaw777 <99053422+naturallaw777@users.noreply.github.com>

app/sovran_systemsos_web/static/app.js

@@ -15,8 +15,6 @@ const CATEGORY_ORDER = [
   "communication",
   "apps",
   "nostr",
-  "support",
-  "feature-manager",
 ];
 
 const FEATURE_SUBCATEGORY_LABELS = {
@@ -59,6 +57,8 @@ let _rebuildIsEnabling    = true;
 // ── DOM refs ──────────────────────────────────────────────────────
 
 const $tilesArea      = document.getElementById("tiles-area");
+const $sidebarSupport = document.getElementById("sidebar-support");
+const $sidebarFeatures = document.getElementById("sidebar-features");
 const $updateBtn      = document.getElementById("btn-update");
 const $updateBadge    = document.getElementById("update-badge");
 const $refreshBtn     = document.getElementById("btn-refresh");
@@ -173,9 +173,15 @@ function buildTiles(services, categoryLabels) {
   _servicesCache = services;
   var grouped = {};
   for (var i = 0; i < services.length; i++) {
-    var cat = services[i].category || "other";
+    var svc = services[i];
+    // Support tiles go to the sidebar, not the main grid
+    if (svc.category === "support" || svc.type === "support") {
+      renderSidebarSupport(svc);
+      continue;
+    }
+    var cat = svc.category || "other";
     if (!grouped[cat]) grouped[cat] = [];
-    grouped[cat].push(services[i]);
+    grouped[cat].push(svc);
   }
   $tilesArea.innerHTML = "";
   var orderedKeys = CATEGORY_ORDER.filter(function(k) { return grouped[k]; });
@@ -202,6 +208,23 @@ function buildTiles(services, categoryLabels) {
   }
 }
 
+function renderSidebarSupport(svc) {
+  $sidebarSupport.innerHTML = "";
+  var btn = document.createElement("button");
+  btn.className = "sidebar-support-btn";
+  btn.innerHTML =
+    '<span class="sidebar-support-icon">🛟</span>' +
+    '<span class="sidebar-support-text">' +
+      '<span class="sidebar-support-title">' + escHtml(svc.name || "Tech Support") + '</span>' +
+      '<span class="sidebar-support-hint">Click for help</span>' +
+    '</span>';
+  btn.addEventListener("click", function() { openSupportModal(); });
+  $sidebarSupport.appendChild(btn);
+  var hr = document.createElement("hr");
+  hr.className = "sidebar-divider";
+  $sidebarSupport.appendChild(hr);
+}
+
 function buildTile(svc) {
   var isSupport = svc.type === "support";
   var sc = statusClass(svc.status);
@@ -1194,7 +1217,7 @@ async function loadFeatureManager() {
 
 function renderFeatureManager(data) {
   // Remove old feature manager section if it exists
-  var old = $tilesArea.querySelector(".feature-manager-section");
+  var old = $sidebarFeatures.querySelector(".feature-manager-section");
   if (old) old.parentNode.removeChild(old);
 
   var section = document.createElement("div");
@@ -1236,7 +1259,7 @@ function renderFeatureManager(data) {
     section.appendChild(subcat);
   }
 
-  $tilesArea.appendChild(section);
+  $sidebarFeatures.appendChild(section);
 }
 
 function buildFeatureCard(feat) {