feat(chat): 将工具调用卡片状态化并嵌入消息流

重构工具消息的呈现与更新逻辑，使其与常规消息一同展示并通过视觉状态反映执行进展。

- 为工具消息新增状态指示（执行中/完成/出错）、图标标签及输入摘要
- 实现通过 toolName/toolStatus 字段定位并就地更新已有工具消息而非追加新项
- 从消息列表中移除对 tool 角色的过滤，使其以内联卡片形式嵌入聊天流
- 添加液体填充动画，在工具执行期间提供进度反馈
- 为视频资源预览增加播放按钮遮罩以提示可播放
- 为 .mp4 与 .webm 文件设置正确的 Content-Type 头

web/client/src/index.css

@@ -38,6 +38,33 @@
   }
 }
 
+/* Tool card progress - liquid fill animation */
+@keyframes liquid-fill {
+  0% { width: 5%; opacity: 0.5; }
+  20% { width: 30%; opacity: 0.9; }
+  40% { width: 55%; opacity: 1; }
+  60% { width: 75%; opacity: 0.95; }
+  80% { width: 92%; opacity: 0.85; }
+  90% { width: 100%; opacity: 0.7; }
+  100% { width: 5%; opacity: 0.5; }
+}
+@keyframes liquid-glow {
+  0%, 100% { box-shadow: 0 0 4px rgba(99, 102, 241, 0.3); }
+  50% { box-shadow: 0 0 12px rgba(99, 102, 241, 0.5); }
+}
+.tool-shimmer-bar {
+  animation: liquid-fill 2.4s cubic-bezier(0.4, 0, 0.2, 1) infinite;
+  border-radius: 9999px;
+  background: linear-gradient(90deg,
+    rgba(99, 102, 241, 0.8),
+    rgba(139, 92, 246, 0.9),
+    rgba(99, 102, 241, 0.7));
+  background-size: 200% 100%;
+}
+.tool-progress-track {
+  animation: liquid-glow 2.4s ease-in-out infinite;
+}
+
 /* GitHub-style Markdown - light theme */
 @layer components {
   .markdown-body {