Markdown in responses is rendered

AI models produce markdown-formatted output by default: bold, italics, bulleted lists, headers, and inline code are the native vocabulary of modern LLM responses. Rendering that output as plain text means users see raw **asterisks** and ## hashes cluttering every answer, destroying readability and forcing users to mentally parse formatting tokens. This also degrades accessibility by collapsing semantic structure into an undifferentiated wall of text, failing the intent of WCAG 2.2 SC 1.3.1 (Info and Relationships).

Install a markdown renderer and pipe AI message content through it in your message component at src/components/chat/MessageBubble.tsx. Pair it with Tailwind's typography plugin for clean default styling, and never render raw HTML from AI output without sanitization.

import ReactMarkdown from 'react-markdown';
<div className="prose dark:prose-invert">
  <ReactMarkdown>{message.content}</ReactMarkdown>
</div>