internal/web/static/app.css

@@ -823,7 +823,21 @@ button[type="submit"]:focus-visible,
 }
 .attachment-bar .attachment-chip:hover { border-color: var(--accent); }
 .attachment-bar .attachment-chip .attachment-name {
-  max-width: 720px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
+  min-width: 0;
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+/* #232: long filenames are truncated but the pill stays a reasonable
+   width; on narrow viewports it shrinks to the container instead of
+   overflowing the card. */
+.attachment-bar .attachment-chip {
+  max-width: 100%;
+}
+.attachment-bar .attachment-chip .attachment-name:hover {
+  white-space: normal;
+  overflow-wrap: anywhere;
 }
 /* #221: images scale to fit the viewer box, aspect ratio preserved. */
 .attachment-preview {