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/* /