feat: polish chat view with symbol labels, bordered card, and consistent spacing

Replace "You"/"AI" role labels with › / ◆ symbols, wrap chat area in a
bordered card matching SummaryView panels, fix label-content spacing by
nesting symbol inside parent Text node, and unify message marginBottom.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: asanmateu

CHANGELOG.md

@@ -11,6 +11,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - Chat export: press `Ctrl+s` in chat view to save the conversation as `chat.md` in the session directory; auto-saves on every subsequent message
 
+### Changed
+
+- Chat view: role labels changed from "You"/"AI" to `›`/`◆` symbols, messages wrapped in bordered card, consistent spacing between messages
+
 ## [2.1.0] - 2026-02-21
 
 ### Added

src/components/ChatView.tsx

@@ -110,29 +110,33 @@ export function ChatView({
     : "[Esc] back · [q] back (when empty) · [Ctrl+s] save chat";
 
   return (
-    <Box flexDirection="column" paddingX={1}>
+    <Box flexDirection="column" paddingX={1} borderStyle="round" borderColor={theme.brandBorder}>
       <Box marginBottom={1}>
         <Text bold color={theme.accent}>
           Chat — ask questions about this summary
         </Text>
       </Box>
 
       {messages.map((msg, i) => (
-        <Box key={`msg-${i}-${msg.role}`} marginBottom={msg.role === "assistant" ? 1 : 0}>
-          <Text bold color={msg.role === "user" ? theme.warning : theme.success}>
-            {msg.role === "user" ? "You: " : "AI: "}
+        <Box key={`msg-${i}-${msg.role}`} marginBottom={1}>
+          <Text wrap="wrap">
+            <Text bold color={msg.role === "user" ? theme.warning : theme.success}>
+              {msg.role === "user" ? "› " : "◆ "}
+            </Text>
+            {msg.content}
           </Text>
-          <Text wrap="wrap">{msg.content}</Text>
         </Box>
       ))}
 
       {isStreaming && (
         <Box marginBottom={1}>
-          <Text bold color={theme.success}>
-            AI:{" "}
+          <Text wrap="wrap">
+            <Text bold color={theme.success}>
+              {"◆ "}
+            </Text>
+            {streamingResponse}
+            <Text color={theme.accent}>▊</Text>
           </Text>
-          <Text wrap="wrap">{streamingResponse}</Text>
-          <Text color={theme.accent}>▊</Text>
         </Box>
       )}