feat(chat): file upload + attachments + pinned canvas

- composer 📎 attach (multi-file) with removable chips; uploads to
  /files then sends a message with attachments; image preview /
  download chips via ?access_token.
- pinned per-channel canvas panel below the topbar (fixed; independent
  of message scroll): md→renderMarkdown, text→<pre>, html→sandboxed
  iframe; collapse/expand.
- share/edit canvas modal (sharer-only Edit/Remove); live via
  canvas.updated/canvas.removed sockets; channel & messages context
  menus get canvas actions.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

src/index.css

@@ -864,3 +864,134 @@ button {
   cursor: not-allowed;
   background: none;
 }
+
+/* ---- canvas (pinned document) ---- */
+.dc-canvas {
+  border-bottom: 1px solid var(--border);
+  background: var(--elevated);
+  display: flex;
+  flex-direction: column;
+  max-height: 46vh;
+}
+.dc-canvas-head {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 8px 14px;
+  border-bottom: 1px solid var(--border);
+}
+.dc-canvas-head .cv-title {
+  font-weight: 600;
+  color: var(--text-h);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 40%;
+}
+.dc-canvas-head .cv-meta {
+  font-size: 12px;
+  color: var(--text-faint);
+  white-space: nowrap;
+}
+.dc-canvas-head .spacer {
+  flex: 1;
+}
+.dc-canvas-body {
+  overflow: auto;
+  padding: 14px 16px;
+}
+.dc-canvas-body .cv-frame {
+  width: 100%;
+  min-height: 320px;
+  border: 0;
+  background: #fff;
+  border-radius: var(--radius-sm);
+}
+.dc-canvas-body .cv-text {
+  margin: 0;
+  white-space: pre-wrap;
+  word-break: break-word;
+  font-family: var(--mono);
+  font-size: 13px;
+  color: var(--text);
+}
+.dc-canvas-body .cv-md {
+  font-size: 14px;
+}
+
+/* ---- message attachments ---- */
+.attachments {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  margin-top: 6px;
+}
+.att-img {
+  max-width: 320px;
+  max-height: 240px;
+  border-radius: var(--radius-sm);
+  display: block;
+}
+.att-chip {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  background: var(--input);
+  border: 1px solid var(--border);
+  color: var(--text);
+  font-size: 13px;
+  padding: 6px 10px;
+  border-radius: var(--radius-sm);
+  text-decoration: none;
+}
+.att-chip:hover {
+  border-color: var(--accent);
+}
+.pf-x {
+  background: none;
+  border: 0;
+  color: var(--text-faint);
+  cursor: pointer;
+  font-size: 14px;
+  line-height: 1;
+  padding: 0 2px;
+}
+.pf-x:hover {
+  color: var(--danger);
+}
+
+/* ---- composer with attachments ---- */
+.dc-composer-wrap {
+  display: flex;
+  flex-direction: column;
+  border-top: 1px solid var(--border);
+}
+.pending-files {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+  padding: 8px 14px 0;
+}
+.dc-composer-wrap .dc-composer {
+  border-top: 0;
+}
+.attach-btn {
+  cursor: pointer;
+  display: inline-flex;
+  align-items: center;
+}
+.attach-btn[aria-disabled='true'] {
+  opacity: 0.4;
+  pointer-events: none;
+}
+textarea.canvas-src {
+  width: 100%;
+  resize: vertical;
+  font-family: var(--mono);
+  font-size: 13px;
+  line-height: 1.5;
+}
+.modal-card.modal-wide {
+  max-width: 720px;
+  width: 92vw;
+}