Chat bubbles, icons for chats, more vivid and distinct colour tags

- Bubbles: own messages right-aligned in their own colour, agent answers left.
- Chat icons (22, validated on the server), shown in list, top bar, project page.
- Colour tags: eight fixed hues (new: pink) with theme-matched lightness and the
  highest chroma sRGB allows; stronger background tint.

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

web/src/components/ProjectPage.tsx

@@ -96,7 +96,10 @@ export function ProjectPage({ cwd, onMenu }: { cwd: string; onMenu: () => void }
                     <li key={s.id} data-color={s.color} className={s.color ? "tagged" : ""}>
                       <a href={`#/s/${s.id}`} onClick={(e) => (e.preventDefault(), navigate(`/s/${s.id}`))}>
                         <div className="tl-title">
-                          <span className={s.color ? "color-badge" : undefined}>{s.title || t("session.untitled")}</span>
+                          <span className={s.color ? "color-badge" : undefined}>
+                            {s.icon && <Icon name={s.icon} className="tiny chat-icon" />}
+                            {s.title || t("session.untitled")}
+                          </span>
                           <span className="tl-when" title={fmtDate(s.updated_at)}>
                             {fmtRelative(s.updated_at)}
                           </span>