feat(messaging-ui): @mentions — autocomplete, resolve to ids, highlight

- contract: SendOpts.mentions (opaque userId notify-list) + optional
  listMembers(threadId) for autocomplete/highlight (capability-degrading)
- mock: listMembers; KernelClientAdapter.send forwards mentions to the socket
  (which already carries them → inbox MENTION items)
- composer: type @ → member/@channel/@here autocomplete; Enter picks the first;
  on send, mentions resolve to ids; message bodies highlight @mentions
- useMembers hook; mentions.tsx helpers (trailingMentionQuery/insertMention/
  resolveMentions/highlightMentions)
- 4 mention tests (helpers + render autocomplete→send carries id); 56 total green

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

packages/iios-messaging-ui/src/styles.css

@@ -175,13 +175,55 @@
   font-style: italic;
 }
 
+/* mentions */
+.miu-mention {
+  color: var(--miu-accent);
+  font-weight: 600;
+}
+.miu-msg.is-mine .miu-bubble .miu-mention {
+  color: var(--miu-accent-text);
+  text-decoration: underline;
+}
+
 /* composer */
 .miu-composer {
+  position: relative;
   display: flex;
   gap: 8px;
   padding: 12px;
   border-top: 1px solid var(--miu-border);
 }
+.miu-suggest {
+  position: absolute;
+  left: 12px;
+  right: 12px;
+  bottom: calc(100% - 4px);
+  margin: 0;
+  padding: 4px;
+  list-style: none;
+  max-height: 200px;
+  overflow-y: auto;
+  border: 1px solid var(--miu-border);
+  border-radius: var(--miu-radius);
+  background: var(--miu-panel);
+  box-shadow: 0 10px 30px -12px rgba(0, 0, 0, 0.6);
+  z-index: 5;
+}
+.miu-suggest-item {
+  display: block;
+  width: 100%;
+  text-align: left;
+  padding: 7px 10px;
+  border: none;
+  border-radius: 8px;
+  background: transparent;
+  color: var(--miu-text);
+  font: inherit;
+  cursor: pointer;
+}
+.miu-suggest-item:hover {
+  background: var(--miu-panel-2);
+}
 .miu-input {
   flex: 1;
   padding: 9px 12px;