diff --git a/frontend/src/pages/CandidateChatPage.tsx b/frontend/src/pages/CandidateChatPage.tsx
index 0f63c19..7c9b308 100644
--- a/frontend/src/pages/CandidateChatPage.tsx
+++ b/frontend/src/pages/CandidateChatPage.tsx
@@ -42,6 +42,7 @@ import { CandidateInfo } from 'components/CandidateInfo';
 import { useNavigate } from 'react-router-dom';
 import { useSelectedCandidate } from 'hooks/GlobalContext';
 import PropagateLoader from 'react-spinners/PropagateLoader';
+import { BackstoryTextField, BackstoryTextFieldRef } from 'components/BackstoryTextField';
 
 const DRAWER_WIDTH = 300;
 const FAB_WIDTH = 48;
@@ -61,6 +62,7 @@ const CandidateChatPage = forwardRef<ConversationHandle, BackstoryPageProps>((pr
   const isMdUp = useMediaQuery(theme.breakpoints.up('md'));
   const [processingMessage, setProcessingMessage] = useState<ChatMessage | null>(null);
   const [streamingMessage, setStreamingMessage] = useState<ChatMessage | null>(null);
+  const backstoryTextRef = useRef<BackstoryTextFieldRef>(null);
 
   const {
     setSnack,
@@ -70,7 +72,6 @@ const CandidateChatPage = forwardRef<ConversationHandle, BackstoryPageProps>((pr
   const [sessions, setSessions] = useState<CandidateSessionsResponse | null>(null);
   const [chatSession, setChatSession] = useState<ChatSession | null>(null);
   const [messages, setMessages] = useState<ChatMessage[]>([]);
-  const [newMessage, setNewMessage] = useState<string>('');
   const [loading, setLoading] = useState<boolean>(false);
   const [streaming, setStreaming] = useState<boolean>(false);
   const messagesEndRef = useRef(null);
@@ -254,11 +255,10 @@ const CandidateChatPage = forwardRef<ConversationHandle, BackstoryPageProps>((pr
   };
 
   // Send message
-  const sendMessage = async () => {
-    if (!newMessage.trim() || !chatSession?.id || streaming) return;
+  const sendMessage = async (message: string) => {
+    if (!message.trim() || !chatSession?.id || streaming) return;
 
-    const messageContent = newMessage;
-    setNewMessage('');
+    const messageContent = message;
     setStreaming(true);
 
     const chatMessage: ChatMessageUser = {
@@ -446,7 +446,7 @@ const CandidateChatPage = forwardRef<ConversationHandle, BackstoryPageProps>((pr
                   cursor: 'pointer',
                   backgroundColor: 'transparent',
                   '&:hover': {
-                    backgroundColor: chatSession?.id === session.id ? 'primary.light' : 'action.hover'
+                    backgroundColor: 'action.hover'
                   }
                 }}
                 secondaryAction={
@@ -668,26 +668,16 @@ const CandidateChatPage = forwardRef<ConversationHandle, BackstoryPageProps>((pr
 
               {/* Fixed Message Input */}
               <Box sx={{ p: 2, display: 'flex', gap: 1, flexShrink: 0 }}>
-                <TextField
-                  fullWidth
-                  variant="outlined"
+                <BackstoryTextField
                   placeholder="Type your message about the candidate..."
-                  value={newMessage}
-                  onChange={(e) => setNewMessage(e.target.value)}
-                  onKeyDown={(e) => {
-                    if (e.key === 'Enter' && !e.shiftKey) {
-                      e.preventDefault();
-                      sendMessage();
-                    }
-                  }}
+                  ref={backstoryTextRef}
+                  onEnter={sendMessage}
                   disabled={streaming}
-                  multiline
-                  maxRows={4}
                 />
                 <Button
                   variant="contained"
-                  onClick={sendMessage}
-                  disabled={!newMessage.trim() || streaming}
+                  onClick={() => { sendMessage((backstoryTextRef.current && backstoryTextRef.current.getAndResetValue()) || ""); }}
+                  disabled={streaming}
                   sx={{ minWidth: 'auto', px: 2 }}
                 >
                   ▶