Polish sticky headers, Custom View, docs page and dialogs

- Status tables: the whole header (column names + filters) sticks as one
  block, tucked 1px under the group header, so no gap can open between
  the rows; offsets use fractional heights
- Phones/tablets: the filter panel sticks under the group header too, and
  is opaque and compact (three filters per row on phones)
- Custom View: fix the group header being pushed over the column header
  (it lives inside the view's own scroll box); the column header now pins
  to the top of that box on desktop, and the header strip sticks on phones
- All Devices: group title is "All Devices (N)" instead of "Missing
  Software", matching the page title count
- Documentation fits the window on desktop: only the article list and the
  article scroll; placeholder no longer says "from the left"
- Dialogs sit above the terminal dock so it can't cover their last rows;
  page bottom padding follows the dock's measured height

web/index.html

@@ -459,7 +459,7 @@
             
             <div class="table-wrapper" style="overflow-x: auto; background: var(--bg-card); border-radius: 8px; box-shadow: 0 4px 6px rgba(0,0,0,0.3); transition: padding-bottom 0.2s;">
                 <div class="group-header" style="margin-top: 0; border-radius: 8px 8px 0 0;">
-                    <span>Missing Software</span>
+                    <span>All Devices <span id="softwareGroupCount"></span></span>
                     <div style="display: flex; gap: 8px;">
                         <button class="copy-table-btn no-copy" onclick="copyLocationInfo('software', this)">
                             <svg class="icon-svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><path d="M215.7 499.2C267 435 384 279.4 384 192C384 86 298 0 192 0S0 86 0 192c0 87.4 117 243 168.3 307.2c12.3 15.3 35.1 15.3 47.4 0zM192 128a64 64 0 1 1 0 128 64 64 0 1 1 0-128z"/></svg> Copy Location Info
@@ -595,7 +595,7 @@
                         <button class="nav-btn" id="btn-edit-mode" onclick="setDocMode('edit')" title="Switch to Edit Mode" style="padding: 6px 10px; border: 1px solid var(--border-color);"></button>
                     </div>
 
-                    <div id="docContent" style="flex: 1; overflow-y: auto; line-height: 1.6; min-height: 0; padding-right: 10px;">Select a document from the left...</div>
+                    <div id="docContent" style="flex: 1; overflow-y: auto; line-height: 1.6; min-height: 0; padding-right: 10px;">Select an article from the list to read it.</div>
                     <textarea id="docEditor" style="display: none; flex: 1; width: 100%; background: var(--input-bg); color: var(--text-main); border: 1px solid var(--border-color); border-radius: 4px; padding: 15px; font-family: monospace; font-size: 1.05em; resize: none; min-height: 0; box-sizing: border-box;"></textarea>
                 </div>
 
@@ -880,6 +880,8 @@
             let swVis = Array.from(swRows).filter(tr => tr.style.display !== 'none').length;
             let sc = document.getElementById('softwareCount');
             if(sc) sc.innerText = `(${swVis})`;
+            let sgc = document.getElementById('softwareGroupCount');
+            if(sgc) sgc.innerText = `(${swVis})`;
         }
         
         let globalDataLastUpdated = "Never";
@@ -2242,7 +2244,7 @@
                     
                     if (res.ok) {
                         showToast("Article archived successfully!");
-                        document.getElementById('docContent').innerHTML = "Select a document from the left...";
+                        document.getElementById('docContent').innerHTML = "Select an article from the list to read it.";
                         document.getElementById('docToolbar').style.display = 'none';
                         document.getElementById('docEditor').style.display = 'none';
                         currentDocTitle = "";