feat(ui): add chat reading indicator

ui/src/styles/components.css

@@ -595,6 +595,56 @@
   }
 }
 
+.chat-bubble.chat-reading-indicator {
+  width: fit-content;
+  padding: 10px 14px;
+}
+
+.chat-reading-indicator__dots {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  height: 10px;
+}
+
+.chat-reading-indicator__dots > span {
+  width: 6px;
+  height: 6px;
+  border-radius: 999px;
+  background: var(--chat-text);
+  opacity: 0.55;
+  transform: translateY(0);
+  animation: chatReadingDot 1.1s ease-in-out infinite;
+}
+
+.chat-reading-indicator__dots > span:nth-child(2) {
+  animation-delay: 0.12s;
+}
+
+.chat-reading-indicator__dots > span:nth-child(3) {
+  animation-delay: 0.24s;
+}
+
+@keyframes chatReadingDot {
+  0%,
+  80%,
+  100% {
+    opacity: 0.45;
+    transform: translateY(0);
+  }
+  40% {
+    opacity: 0.95;
+    transform: translateY(-2px);
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .chat-reading-indicator__dots > span {
+    animation: none;
+    opacity: 0.75;
+  }
+}
+
 .chat-text {
   overflow-wrap: anywhere;
   word-break: break-word;