dashboard: reorder sections into grouped sequence

after reverting the 3-column attempt (74ba8a6), keep the
single-column layout but put related sections adjacent:

  swarm:     containers → kept-state → meta-inputs
  decisions: questions → approvals
  messages:  operator-inbox → message-flow + compose

this is a free improvement — the operator scrolls through one
logical group at a time instead of bouncing between swarm /
decisions / messages mid-page. follow-up improvements
(collapsing rarely-active sections, multi-column at wide
viewports done less aggressively) captured in TODO under
'Dashboard layout overhaul'.

TODO.md

@@ -69,6 +69,29 @@ Pick anything from here when relevant. Cross-cutting design notes live in
 
 ## UI / UX
 
+- **Dashboard layout overhaul.** A 3-column attempt (swarm
+  / 0per4t0r 1n / m3ss4g3s) landed + was reverted in 74ba8a6
+  — looked worse in practice (sticky col-heads fighting the
+  banner, sub-heads too small, columns too narrow for the
+  container rows). Sections are now ordered semantically in
+  a single column (swarm bits first, then decisions, then
+  messages) which is a no-cost improvement. The bigger
+  restructure is still worth doing; next attempt should:
+  - keep current widths usable (don't crunch container
+    rows < ~36em — they have a lot inline)
+  - default the heavy-but-rare sections (kept-state, meta-
+    inputs, msg-flow history) into a collapsed `<details>`
+    so they don't dominate when empty
+  - drop the per-section banner divider lines in favour of
+    something quieter (a single border-top on the h2?)
+  - try a *masonry-ish* layout (CSS `grid-template-rows:
+    masonry` once browsers support it; or just two columns
+    where messages floats on the right at wide viewports
+    while the rest stacks left). avoid sticky headers — they
+    fought the page banner last time.
+
+
+
 - **Web UI for config repos + meta deploy log.** Browse
   per-agent proposed / applied tags
   (`proposal/* / approved/* / building/* / deployed/* /

hive-c0re/assets/index.html

@@ -17,6 +17,8 @@
     <span id="notif-status" class="meta" hidden></span>
   </div>
 
+  <!-- swarm: live containers, dormant state, meta input bumps that
+       affect the whole swarm. -->
   <h2>◆ C0NTAINERS ◆</h2>
   <div class="divider">══════════════════════════════════════════════════════════════</div>
   <div id="containers-section">
@@ -29,15 +31,17 @@
     <p class="meta">loading…</p>
   </div>
 
-  <h2>◆ M1ND H4S QU3STI0NS ◆</h2>
+  <h2>◆ M3T4 1NPUTS ◆</h2>
   <div class="divider">══════════════════════════════════════════════════════════════</div>
-  <div id="questions-section">
+  <p class="meta">select inputs to <code>nix flake update</code> in <code>/meta/</code>. selected agents rebuild in sequence after the lock bump; manager learns each outcome via the usual <code>rebuilt</code> system event.</p>
+  <div id="meta-inputs-section">
     <p class="meta">loading…</p>
   </div>
 
-  <h2>◆ 0PER4T0R 1NB0X ◆</h2>
+  <!-- operator decisions: things waiting on you. -->
+  <h2>◆ M1ND H4S QU3STI0NS ◆</h2>
   <div class="divider">══════════════════════════════════════════════════════════════</div>
-  <div id="inbox-section">
+  <div id="questions-section">
     <p class="meta">loading…</p>
   </div>
 
@@ -47,10 +51,10 @@
     <p class="meta">loading…</p>
   </div>
 
-  <h2>◆ M3T4 1NPUTS ◆</h2>
+  <!-- messages: broker traffic + the compose box that produces it. -->
+  <h2>◆ 0PER4T0R 1NB0X ◆</h2>
   <div class="divider">══════════════════════════════════════════════════════════════</div>
-  <p class="meta">select inputs to <code>nix flake update</code> in <code>/meta/</code>. selected agents rebuild in sequence after the lock bump; manager learns each outcome via the usual <code>rebuilt</code> system event.</p>
-  <div id="meta-inputs-section">
+  <div id="inbox-section">
     <p class="meta">loading…</p>
   </div>