feat: Improve quote format with guillemets and styling

- Changed quote format to: @[Username]: »quoted text«
- Added processQuotes() to detect and style »text« patterns
- Quote styling: italic, gray background, left border
- Different styling for own messages vs others

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

app/static/css/style.css

@@ -511,6 +511,22 @@ main {
     background-color: #084298;
 }
 
+/* Quoted Text (»text«) */
+.quote-text {
+    font-style: italic;
+    color: #6c757d;
+    background-color: rgba(108, 117, 125, 0.1);
+    padding: 0.1rem 0.3rem;
+    border-radius: 0.25rem;
+    border-left: 2px solid #6c757d;
+}
+
+.message.own .quote-text {
+    color: #495057;
+    background-color: rgba(8, 66, 152, 0.1);
+    border-left-color: #084298;
+}
+
 /* Clickable Links in Messages */
 .message-link {
     color: #0d6efd;

app/static/js/app.js

@@ -782,7 +782,7 @@ function quoteTo(username, content) {
         quotedText = truncated + '...';
     }
 
-    input.value = `@[${username}] "${quotedText}" `;
+    input.value = `@[${username}]: »${quotedText}« `;
     updateCharCounter();
     input.focus();
 }

app/static/js/message-utils.js

@@ -18,7 +18,10 @@ function processMessageContent(content) {
     // 1. Convert @[Username] mentions to badges
     processed = processMentions(processed);
 
-    // 2. Convert URLs to links (and images to thumbnails)
+    // 2. Convert »quoted text« to styled quotes
+    processed = processQuotes(processed);
+
+    // 3. Convert URLs to links (and images to thumbnails)
     processed = processUrls(processed);
 
     return processed;
@@ -40,6 +43,20 @@ function processMentions(text) {
     });
 }
 
+/**
+ * Convert »quoted text« to styled quote blocks
+ * @param {string} text - HTML-escaped text
+ * @returns {string} - Text with styled quotes
+ */
+function processQuotes(text) {
+    // Match »...« pattern (guillemets)
+    const quotePattern = /»([^«]+)«/g;
+
+    return text.replace(quotePattern, (_match, quoted) => {
+        return `<span class="quote-text">»${quoted}«</span>`;
+    });
+}
+
 /**
  * Convert URLs to clickable links and images to thumbnails
  * @param {string} text - HTML-escaped text