feat(ui): refine expert workspace header

apps/ui/src/features/chat/ConversationWorkspaceView.tsx

@@ -257,9 +257,11 @@ export function ConversationWorkspaceView({
       </span>
     </div>
   ) : expertWorkspaceLogo ? (
-    <div className="expert-hero-heading">
+    <div className={"expert-hero-heading expert-brand-card expert-brand-card-" + activeExpertKey}>
       {expertWorkspaceLogo}
-      <strong className="expert-hero-title">{activeExpertName}</strong>
+      <span className="expert-hero-body">
+        <strong className="expert-hero-title">{activeExpertName}</strong>
+      </span>
     </div>
   ) : (
     <div className="conversation-panel-kicker expert-hero-kicker">

apps/ui/src/styles/chat.css

@@ -571,15 +571,38 @@
   min-width: 0;
 }
 
+.conversation-shell .expert-brand-card {
+  max-width: min(100%, 280px);
+  min-height: 48px;
+  gap: 10px;
+  padding: 5px 12px 5px 6px;
+  overflow: hidden;
+  border: 1px solid rgba(255, 255, 255, 0.76);
+  border-radius: 16px;
+  background: linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(239, 248, 255, 0.72));
+  box-shadow: 0 12px 26px rgba(15, 23, 42, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.72);
+  backdrop-filter: blur(16px);
+}
+
+.conversation-shell .expert-hero-body {
+  display: flex;
+  min-width: 0;
+  flex-direction: column;
+  gap: 2px;
+}
+
 .conversation-shell .expert-hero-title {
   min-width: 0;
+  overflow: hidden;
   color: #12355f;
   font-size: 13px;
   font-weight: 700;
   line-height: 1.2;
+  text-overflow: ellipsis;
   white-space: nowrap;
 }
 
+
 .conversation-shell .expert-workspace-logo {
   width: 44px;
   height: 44px;
@@ -592,22 +615,45 @@
   box-shadow: 0 14px 28px rgba(15, 23, 42, 0.1);
 }
 
+.conversation-shell .expert-brand-card .expert-workspace-logo {
+  width: 36px;
+  height: 36px;
+  border-color: rgba(255, 255, 255, 0.7);
+  border-radius: 12px;
+}
+
 .conversation-shell .expert-workspace-logo svg {
   width: 26px;
   height: 26px;
   display: block;
 }
 
+.conversation-shell .expert-brand-card .expert-workspace-logo svg {
+  width: 22px;
+  height: 22px;
+  filter: drop-shadow(0 1px 2px rgba(15, 23, 42, 0.18));
+}
+
 .conversation-shell .expert-workspace-logo-xiaohongshu {
   background: linear-gradient(135deg, rgba(255, 245, 245, 0.96), rgba(255, 228, 230, 0.9));
   box-shadow: 0 14px 28px rgba(239, 68, 68, 0.16);
 }
 
+.conversation-shell .expert-brand-card .expert-workspace-logo-xiaohongshu {
+  background: linear-gradient(135deg, #ff6b76 0%, #ef4444 56%, #dc2626 100%);
+  box-shadow: 0 12px 24px rgba(239, 68, 68, 0.22);
+}
+
 .conversation-shell .expert-workspace-logo-douyin {
   background: linear-gradient(135deg, rgba(236, 254, 255, 0.96), rgba(244, 244, 255, 0.92));
   box-shadow: 0 14px 28px rgba(109, 125, 255, 0.16);
 }
 
+.conversation-shell .expert-brand-card .expert-workspace-logo-douyin {
+  background: linear-gradient(135deg, #3ddcff 0%, #6d7dff 50%, #ff4d8d 100%);
+  box-shadow: 0 12px 24px rgba(109, 125, 255, 0.2);
+}
+
 .conversation-shell .conversation-panel-actions {
   display: inline-flex;
   align-items: center;