fix modal code block overflow - add responsive max-width to prevent horizontal scrollbars

Added max-width constraints to code blocks in AI messages:
- Mobile (< 768px): 340px max-width
- Desktop (≥ 768px): 720px max-width

Code blocks now get their own horizontal scrollbar when content is too wide,
preventing the modal from getting horizontal scrollbars. All code formatting
and whitespace is preserved.

src/uncloseai-modal-builtin.css

@@ -1117,6 +1117,26 @@ dialog#uncloseai-embedded-modal[data-theme="dark"] .uncloseai-chat-box {
   box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
 }
 
+/* Code blocks within AI messages - allow horizontal scroll, preserve all whitespace */
+.ai-message pre {
+  overflow-x: auto;
+  max-width: 340px;
+}
+
+.ai-message code {
+  max-width: 340px;
+}
+
+@media (min-width: 768px) {
+  .ai-message pre {
+    max-width: 720px;
+  }
+
+  .ai-message code {
+    max-width: 720px;
+  }
+}
+
 .message-text {
   margin-bottom: 8px;
 }

src/uncloseai-modal-pico.css

@@ -1188,6 +1188,26 @@ dialog#uncloseai-embedded-modal[data-theme="dark"] .uncloseai-chat-box {
   box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) !important;
 }
 
+/* Code blocks within AI messages - allow horizontal scroll, preserve all whitespace */
+.ai-message pre {
+  overflow-x: auto;
+  max-width: 340px;
+}
+
+.ai-message code {
+  max-width: 340px;
+}
+
+@media (min-width: 768px) {
+  .ai-message pre {
+    max-width: 720px;
+  }
+
+  .ai-message code {
+    max-width: 720px;
+  }
+}
+
 .message-text {
   margin-bottom: 8px !important;
 }