Align sent attachment previews

frontend/src/components/ChatView/ChatView.css

@@ -2325,7 +2325,7 @@
   width: fit-content;
   padding: 0;
   border: 0;
-  border-radius: 8px;
+  border-radius: 14px;
   background: transparent;
   color: inherit;
   cursor: pointer;
@@ -2337,10 +2337,12 @@
 }
 
 .chat__attach-thumb {
-  height: 80px;
-  max-width: 160px;
+  /* Match the composer's attachment card after send. The thumbnail is a
+     consistent square crop; tapping it still opens the full source image. */
+  width: 96px;
+  height: 96px;
   object-fit: cover;
-  border-radius: 8px;
+  border-radius: 14px;
   border: 1px solid var(--border-light); /* CONTRACT: subtle 1px hairline on opaque fill */
   cursor: inherit;
   transition: opacity 0.15s;

frontend/src/components/ChatView/__tests__/attachmentSizing.test.js

@@ -0,0 +1,37 @@
+import { test } from 'node:test'
+import assert from 'node:assert/strict'
+import { readFileSync } from 'node:fs'
+
+const css = readFileSync(new URL('../ChatView.css', import.meta.url), 'utf8')
+const msgContent = readFileSync(new URL('../MsgContent.jsx', import.meta.url), 'utf8')
+
+function ruleBody(selector) {
+  const escaped = selector.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
+  const match = css.match(new RegExp(`${escaped}\\s*\\{([^}]*)\\}`))
+  assert.ok(match, `${selector} rule must exist`)
+  return match[1]
+}
+
+test('sent image attachments match the composer card height and corners', () => {
+  const composer = ruleBody('.chat__attach-card--image')
+  const sentButton = ruleBody('.chat__attach-thumb-button')
+  const sent = ruleBody('.chat__attach-thumb')
+
+  assert.match(composer, /height:\s*96px/)
+  assert.match(sent, /width:\s*96px/)
+  assert.match(sent, /height:\s*96px/)
+  assert.match(composer, /border-radius:\s*14px/)
+  assert.match(sentButton, /border-radius:\s*14px/)
+  assert.match(sent, /border-radius:\s*14px/)
+})
+
+test('sent attachments render above message text in both message paths', () => {
+  const attachmentNeedle = "msg.role === 'user' && <Attachments"
+  const firstAttachments = msgContent.indexOf(attachmentNeedle)
+  const blockContent = msgContent.indexOf('{nodes.map(', firstAttachments)
+  const secondAttachments = msgContent.indexOf(attachmentNeedle, firstAttachments + 1)
+  const plainText = msgContent.indexOf('{text ? (', secondAttachments)
+
+  assert.ok(firstAttachments >= 0 && firstAttachments < blockContent)
+  assert.ok(secondAttachments >= 0 && secondAttachments < plainText)
+})