fix: quran text excluded from analysis models + styled ref + score preserved

src/css/components.css

@@ -3083,6 +3083,13 @@ input[type="range"]::-moz-range-thumb {
   background: none !important;
   cursor: default !important;
 }
+.quran-ref-inline {
+  font-size: 0.72em;
+  opacity: 0.6;
+  font-weight: 600;
+  margin-right: 4px;
+  color: #06b6d4;
+}
 
 .quran-modal-backdrop {
   position: absolute;

src/index.html

@@ -1314,19 +1314,18 @@
       var editor = document.getElementById('editor-container');
       if (!editor || !_quranCurrentQuery) return false;
       closeQuranModal();
-      // Build the full text with reference
-      var fullText = newText;
-      if (ref) fullText += ' [' + ref + ']';
       // Replace in editor: wrap in quran-applied span to protect from analysis
       var plain = editor.textContent || '';
       var idx = plain.indexOf(_quranCurrentQuery);
       if (idx === -1) return false;
       var before = plain.substring(0, idx);
       var after = plain.substring(idx + _quranCurrentQuery.length);
-      // Build HTML: before (escaped) + quran span + after (escaped)
+      // Build HTML: before + quran span (verse + styled ref) + after
       var esc = function(t) { return t.replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;'); };
+      var refHTML = ref ? ' <span class="quran-ref-inline">[' + esc(ref) + ']</span>' : '';
       editor.innerHTML = esc(before) +
-        '<span class="quran-applied" contenteditable="false" data-quran="true">' + esc(fullText) + '</span>' +
+        '<span class="quran-applied" contenteditable="false" data-quran="true">' +
+        esc(newText) + refHTML + '</span>' +
         esc(after);
       editor.focus();
       editor.dispatchEvent(new Event('input', { bubbles: true }));

src/js/renderer.js

@@ -221,6 +221,8 @@ function walkTextNodes(root, callback) {
 function clearOverlays(editor) {
   const errorSpans = editor.querySelectorAll('.spelling-error, .grammar-error, .punctuation-suggestion');
   errorSpans.forEach(span => {
+    // Skip spans inside quran-applied (they shouldn't be there, but safety)
+    if (span.closest('.quran-applied')) return;
     const parent = span.parentNode;
     while (span.firstChild) {
       parent.insertBefore(span.firstChild, span);

src/js/selection.js

@@ -182,14 +182,20 @@ function setCaretOffset(offset) {
 
 /**
  * Gets the text content of the editor
- * @returns {string} - Plain text content
+ * Masks quran-applied text with spaces to exclude from analysis
+ * @returns {string} - Plain text content (quran regions replaced with spaces)
  */
 function getEditorText() {
   const editor = document.getElementById('editor-container');
   if (!editor) return '';
-  // MUST use textContent to match the offset calculation in overlaySuggestions
-  // innerText adds '\n' for block elements which causes offset mismatch
-  return editor.textContent || '';
+  // Clone the editor to mask quran text without modifying the DOM
+  const clone = editor.cloneNode(true);
+  clone.querySelectorAll('.quran-applied').forEach(function(el) {
+    // Replace quran text with spaces of the same length to preserve offsets
+    var len = (el.textContent || '').length;
+    el.textContent = ' '.repeat(len);
+  });
+  return clone.textContent || '';
 }
 
 /**