2 files changed, 14 insertions, 2 deletions
diff --git a/packages/ui/src/components/message-part.css b/packages/ui/src/components/message-part.css
index 137e6a4d7..07f9aa312 100644
--- a/packages/ui/src/components/message-part.css
+++ b/packages/ui/src/components/message-part.css
@@ -230,6 +230,9 @@
 
   [data-slot="message-part-title"] {
     flex-shrink: 0;
+    display: flex;
+    align-items: center;
+    gap: 4px;
     font-family: var(--font-family-sans);
     font-size: var(--font-size-base);
     font-style: normal;
@@ -237,9 +240,16 @@
     line-height: var(--line-height-large);
     letter-spacing: var(--letter-spacing-normal);
     color: var(--text-base);
+  }
+
+  [data-slot="message-part-title-text"] {
     text-transform: capitalize;
   }
 
+  [data-slot="message-part-title-filename"] {
+    /* No text-transform - preserve original filename casing */
+  }
+
   [data-slot="message-part-path"] {
     display: flex;
     flex-grow: 1;
diff --git a/packages/ui/src/components/message-part.tsx b/packages/ui/src/components/message-part.tsx
index 340c13745..d1788f1df 100644
--- a/packages/ui/src/components/message-part.tsx
+++ b/packages/ui/src/components/message-part.tsx
@@ -1025,7 +1025,8 @@ ToolRegistry.register({
           <div data-component="edit-trigger">
             <div data-slot="message-part-title-area">
               <div data-slot="message-part-title">
-                {i18n.t("ui.messagePart.title.edit")} {filename()}
+                <span data-slot="message-part-title-text">{i18n.t("ui.messagePart.title.edit")}</span>
+                <span data-slot="message-part-title-filename">{filename()}</span>
               </div>
               <Show when={props.input.filePath?.includes("/")}>
                 <div data-slot="message-part-path">
@@ -1077,7 +1078,8 @@ ToolRegistry.register({
           <div data-component="write-trigger">
             <div data-slot="message-part-title-area">
               <div data-slot="message-part-title">
-                {i18n.t("ui.messagePart.title.write")} {filename()}
+                <span data-slot="message-part-title-text">{i18n.t("ui.messagePart.title.write")}</span>
+                <span data-slot="message-part-title-filename">{filename()}</span>
               </div>
               <Show when={props.input.filePath?.includes("/")}>
                 <div data-slot="message-part-path">