fix(frontend): apply message image maxWidth via inline style (#4446)

frontend/src/components/workspace/messages/message-list-item.tsx

@@ -205,17 +205,22 @@ function MessageImage({
 }) {
   if (!src) return null;
 
-  const imgClassName = cn("overflow-hidden rounded-lg", `max-w-[${maxWidth}]`);
+  // `maxWidth` is applied inline rather than through a `max-w-[${maxWidth}]`
+  // class: Tailwind's JIT only generates utilities it can find as literal
+  // source tokens, so an interpolated arbitrary value would never be emitted.
+  const imgClassName = cn("overflow-hidden rounded-lg", props.className);
+  const imgStyle: React.CSSProperties = { maxWidth, ...props.style };
 
   if (typeof src !== "string") {
     return (
       <img
+        {...props}
         className={imgClassName}
+        style={imgStyle}
         src={src}
         alt={alt}
         loading="lazy"
         decoding="async"
-        {...props}
       />
     );
   }
@@ -225,12 +230,13 @@ function MessageImage({
   return (
     <a href={url} target="_blank" rel="noopener noreferrer">
       <img
+        {...props}
         className={imgClassName}
+        style={imgStyle}
         src={url}
         alt={alt}
         loading="lazy"
         decoding="async"
-        {...props}
       />
     </a>
   );