swarm-ui: give Panel an optional header icon slot

Adds an `icon` prop to Panel (small emoji glyph left of the title,
aria-hidden, chosen per panel with no default) and wires it into every
current Panel caller: hives (bee), create-agent's form (robot) and info
panel (identity card, moved off the info panel's body copy where it
started as a one-off), jobs (puzzle piece), the components gallery
itself (toolbox), and the 404 page (compass). Adds a components-page
demo section and a whimsy-section pointer in the design guide.

Closes: #3508

docs/web-ui/design-guide.md

@@ -24,7 +24,13 @@ repeated here.
   home.js`, is the reference example — currently in the dashboard
   package, not swarm-ui itself, but the pattern it sets applies here
   too). Whimsy still has to clear the accessibility bar below (motion,
-  in particular).
+  in particular). swarm-ui's own reference example: `Panel`'s optional
+  `icon` prop (`src/ui/panel/Panel.tsx`), a small emoji glyph in a
+  panel's header, chosen per panel with no default — grew out of a
+  one-off emoji dropped into a single page's copy, which wasn't whimsy
+  in this sense (a *consistent*, reusable touch) until it became a real
+  prop every panel can opt into. `aria-hidden`, since it's decorative —
+  the title text is still the actual label.
 - **Efficient navigation** — minimize clicks/hops for a common task.
 - **Avoid junk drawers.** A control belongs next to the thing it
   affects, not tucked into a catch-all menu. Concrete anti-example (not