.

frontend/src/components/MessageContent.tsx

@@ -16,11 +16,16 @@ import { cn } from "../lib/cn.ts";
  */
 const ATTACH_RE = /^(\[.*?\])\n```text\n([\s\S]*?)\n```/gm;
 
-function AttachmentBlock({ header, body }: { header: string; body: string }) {
+function AttachmentBlock({ header, body, tone }: { header: string; body: string; tone: "accent" | "plain" }) {
   const [open, setOpen] = useState(false);
   const label = header.startsWith("[") && header.endsWith("]") ? header.slice(1, -1) : header;
   return (
-    <span className="mt-2 block overflow-hidden rounded-2xl bg-black/25 text-left dark:bg-black/30">
+    <span
+      className={cn(
+        "mt-2 block overflow-hidden rounded-2xl text-left",
+        tone === "accent" ? "bg-black/25 dark:bg-black/30" : "bg-stone-200/70 dark:bg-zinc-800",
+      )}
+    >
       <button
         type="button"
         onClick={() => setOpen((v) => !v)}
@@ -35,7 +40,12 @@ function AttachmentBlock({ header, body }: { header: string; body: string }) {
         />
       </button>
       {open && (
-        <pre className="max-h-72 overflow-auto whitespace-pre-wrap break-words border-t border-white/10 px-3 py-2 font-mono text-[12.5px] leading-relaxed">
+        <pre
+          className={cn(
+            "max-h-72 overflow-auto whitespace-pre-wrap break-words border-t px-3 py-2 font-mono text-[12.5px] leading-relaxed",
+            tone === "accent" ? "border-white/10" : "border-stone-300/70 dark:border-zinc-700",
+          )}
+        >
           {body}
         </pre>
       )}
@@ -43,7 +53,7 @@ function AttachmentBlock({ header, body }: { header: string; body: string }) {
   );
 }
 
-export function UserMessageContent({ content }: { content: string }) {
+export function UserMessageContent({ content, tone = "accent" }: { content: string; tone?: "accent" | "plain" }) {
   const parts: React.ReactNode[] = [];
   let last = 0;
   let key = 0;
@@ -51,7 +61,7 @@ export function UserMessageContent({ content }: { content: string }) {
   let m: RegExpExecArray | null;
   while ((m = ATTACH_RE.exec(content)) !== null) {
     if (m.index > last) parts.push(<span key={key++}>{content.slice(last, m.index)}</span>);
-    parts.push(<AttachmentBlock key={key++} header={m[1]!} body={m[2] ?? ""} />);
+    parts.push(<AttachmentBlock key={key++} header={m[1]!} body={m[2] ?? ""} tone={tone} />);
     last = m.index + m[0].length;
   }
   if (last < content.length) parts.push(<span key={key++}>{content.slice(last)}</span>);