feat(refactor): dynamic agent status ticker card across all execution rounds

vibn-frontend/components/vibn-chat/chat-panel.tsx

@@ -1683,53 +1683,31 @@ export function ChatPanel({
           <MessageBubble key={msg.id || i} msg={msg} />
         ))}
 
-        {sending && messages[messages.length - 1]?.role !== "assistant" && (
+        {sending && (
           <div
             style={{
               display: "flex",
               alignItems: "center",
               gap: 8,
-              padding: "6px 0",
+              padding: "8px 12px",
+              margin: "6px 0",
+              background: "#faf8f5",
+              border: "1px dashed #e8e4dc",
+              borderRadius: 8,
+              fontSize: "0.75rem",
+              color: "#8c8580",
+              fontFamily: "var(--font-inter),ui-sans-serif,sans-serif",
             }}
           >
-            <div
-              style={{
-                width: 24,
-                height: 24,
-                borderRadius: "50%",
-                background: "#1a1a1a",
-                display: "flex",
-                alignItems: "center",
-                justifyContent: "center",
-                flexShrink: 0,
-              }}
-            >
-              <span
-                style={{
-                  color: "#fff",
-                  fontSize: "0.6rem",
-                  fontWeight: 700,
-                  fontFamily: "var(--font-lora),serif",
-                }}
-              >
-                V
-              </span>
-            </div>
-            <div style={{ display: "flex", gap: 4 }}>
-              {[0, 1, 2].map((i) => (
-                <span
-                  key={i}
-                  style={{
-                    width: 6,
-                    height: 6,
-                    borderRadius: "50%",
-                    background: "#c0bab2",
-                    animation: `vibn-bounce 1.2s ease infinite ${i * 0.2}s`,
-                    display: "inline-block",
-                  }}
+            <Loader2
+              style={{ width: 12, height: 12, color: "#3d5afe" }}
+              className="animate-spin"
             />
-              ))}
-            </div>
+            <span style={{ fontStyle: "italic" }}>
+              {messages[messages.length - 1]?.role !== "assistant"
+                ? "Vibn AI is formulating plan..."
+                : "Vibn AI is executing tools & planning next steps..."}
+            </span>
           </div>
         )}