diff --git a/AUDIT.md b/AUDIT.md
new file mode 100644
index 0000000..922d1a2
--- /dev/null
+++ b/AUDIT.md
@@ -0,0 +1,381 @@
+# Threads DraftCraft - Detaljan Audit Aplikacije
+
+**Datum:** 2026-03-21
+**Verzija:** 1.0.0
+**Tip aplikacije:** Chrome Extension (Manifest V3)
+**Ukupno linija koda:** ~3,830
+
+---
+
+## 1. PREGLED ARHITEKTURE
+
+### Struktura
+```
+background/background.js  (433 LOC)  - Service worker, lifecycle, messaging
+content/content.js         (1,351 LOC) - DOM manipulacija na threads.com
+content/content.css        (446 LOC)  - Stilovi za content script
+popup/popup.html           (159 LOC)  - Popup UI
+popup/popup.js             (611 LOC)  - Popup kontroler
+popup/popup.css            (783 LOC)  - Popup stilovi
+manifest.json              (47 LOC)   - Extension konfiguracija
+```
+
+### Ocjena arhitekture: 7/10
+- Dobra separacija (background/content/popup)
+- Class-based pristup je konzistentan
+- Nema build sistema, lintinga, ni testova
+
+---
+
+## 2. SIGURNOSNI PROBLEMI
+
+### 2.1 KRITIČNO: innerHTML koriscenje bez sanitizacije
+
+**Fajlovi:** `content/content.js:890`, `content/content.js:1258-1268`, `content/content.js:1309-1324`, `popup/popup.js:548-561`
+
+```javascript
+// content.js:890 - Sort indicator
+statusIndicator.innerHTML = `<span style="...">...${this.sortOrder}...</span>`;
+
+// content.js:1258 - Time indicator fallback
+timeIndicator.innerHTML = `<div style="...">📅 ${draft.scheduledTimeStr}</div>`;
+
+// content.js:1309 - Count badge
+countBadge.innerHTML = `<span style="...">📊 ${this.drafts.length}</span>`;
+
+// popup.js:548 - Info message
+infoDiv.innerHTML = `<div style="...">📌 Navigate to Threads.com...</div>`;
+```
+
+**Rizik:** Dok su `this.sortOrder` i `this.drafts.length` kontrolisane vrijednosti, `draft.scheduledTimeStr` dolazi iz parsiranog DOM sadrzaja Threads.com stranice. Ako bi napadac kontrolisao sadrzaj koji se renderuje na Threads.com (npr. kroz draft tekst koji sadrzi `<script>` ili event handlere), mogao bi izvrsiti XSS napad.
+
+**Preporuka:** Koristiti `textContent` umjesto `innerHTML` ili sanitizirati sve ulazne podatke. Za kompleksne HTML strukture koristiti DOM API (`createElement`, `appendChild`).
+
+### 2.2 SREDNJE: web_accessible_resources previse otvoren
+
+**Fajl:** `manifest.json:41-46`
+
+```json
+"web_accessible_resources": [{
+  "resources": ["content/*"],
+  "matches": ["https://*.threads.com/*"]
+}]
+```
+
+**Rizik:** Izlaze cijeli `content/` direktorij. Ovo dozvoljava threads.com stranicama da pristupe resursima ekstenzije, sto moze pomoci fingerprinting-u ili probe-anju.
+
+**Preporuka:** Specificirati samo fajlove koji su zaista potrebni kao web-accessible, ili ukloniti ovu sekciju ako content scripts ne zahtijevaju pristup resursima sa web stranice.
+
+### 2.3 NISKO: Console logging u produkciji
+
+**Svi fajlovi** sadrze opsezno logovanje:
+```javascript
+console.log('[Threads DraftCraft] Background script initialized');
+console.log('[Threads DraftCraft] Settings saved:', settings);
+console.log('[Threads DraftCraft] Received message:', message, 'from:', sender);
+```
+
+**Rizik:** Leak korisnickih podataka (draft sadrzaj, settings) u konzolu. Moze biti vidljivo drugim ekstenzijama ili alatima.
+
+**Preporuka:** Implementirati log level sistem ili ukloniti detaljno logovanje za produkcijsku verziju.
+
+---
+
+## 3. BAGOVI I LOGICKI PROBLEMI
+
+### 3.1 BUG: Dupla inicijalizacija u background.js
+
+**Fajl:** `background/background.js:21-22` i `background/background.js:29-31`
+
+```javascript
+// U constructor-u:
+this.handleInstallation(); // Linija 22
+
+// Ali takodje:
+chrome.runtime.onInstalled.addListener((details) => {
+  this.handleOnInstalled(details); // Linija 30
+});
+```
+
+`handleInstallation()` se poziva svaki put kad se service worker pokrene (ukljucujuci wake-up iz idle stanja), dok `handleOnInstalled` se poziva samo pri instalaciji/update-u. Ovo znaci da se `initializeDefaultSettings()` provjerava nepotrebno pri svakom budjenju service worker-a.
+
+**Preporuka:** Ukloniti `this.handleInstallation()` iz `init()` i osloniti se iskljucivo na `onInstalled` event.
+
+### 3.2 BUG: Random vrijeme za day-only drafts
+
+**Fajl:** `content/content.js:740-744`
+
+```javascript
+const randomHour = Math.floor(Math.random() * 12) + 9;
+const randomMinute = Math.floor(Math.random() * 60);
+scheduledDate.setHours(randomHour, randomMinute, 0, 0);
+```
+
+Kad draft ima samo dan (npr. "Sunday") bez specificnog vremena, generise se **random** vrijeme. To znaci da ce se svaki put kad se drafts ponovo procesiraju, redoslijed mijenjati. Ovo prouzrokuje nestabilan UI - drafts ce "skakati" po listi pri svakom refresh-u.
+
+**Preporuka:** Koristiti deterministicko fallback vrijeme bazirano na poziciji drafta (npr. `9 + index * 2` sati).
+
+### 3.3 BUG: Slican problem sa "today"/"tomorrow" fallback
+
+**Fajl:** `content/content.js:750-759`
+
+```javascript
+// "posting today" bez specificnog vremena
+const hoursFromNow = Math.floor(Math.random() * 8) + 1;
+return new Date(Date.now() + hoursFromNow * 60 * 60 * 1000);
+```
+
+Isti problem - random vrijednosti ce izazvati nestabilan sort pri svakom procesiranju.
+
+### 3.4 BUG: scheduledDrafts u popup.js prikazuje totalDrafts umjesto scheduled count
+
+**Fajl:** `popup/popup.js:264`
+
+```javascript
+if (scheduledDrafts) {
+  scheduledDrafts.textContent = stats.totalDrafts || '0'; // BUG: koristi totalDrafts
+}
+```
+
+Element `scheduledDrafts` bi trebao prikazivati samo scheduled drafts, ali koristi `stats.totalDrafts`. Content script ne salje odvojen `scheduledDrafts` count.
+
+**Preporuka:** U `getDraftStats` response dodati `scheduledDrafts` polje i koristiti ga u popup-u.
+
+### 3.5 BUG: daysUntil moze biti 0
+
+**Fajl:** `content/content.js:734-736`
+
+```javascript
+let daysUntil = targetDayIndex - currentDayIndex;
+if (daysUntil < 0) {
+  daysUntil += 7;
+}
+```
+
+Ako je danas isti dan kao target (npr. "Monday" i danas je Monday), `daysUntil` ce biti 0, sto znaci da ce draft biti scheduliran za danas. Moguce je da korisnik misli na slijedeci ponedeljak.
+
+### 3.6 BUG: MutationObserver nema disconnect
+
+Content script MutationObserver nikada se ne disconnectuje. Ovo moze dovesti do memory leak-ova ako korisnik dugo ostane na stranici i DOM se cesto mijenja.
+
+**Preporuka:** Sacuvati referencu na observer i disconnectovati ga kad dialog nestane.
+
+---
+
+## 4. PERFORMANSE
+
+### 4.1 SREDNJE: MutationObserver na cijelom body-ju sa subtree: true
+
+**Fajl:** `content/content.js:133-136`
+
+```javascript
+observer.observe(document.body, {
+  childList: true,
+  subtree: true
+});
+```
+
+Ovo hvata SVAKU promjenu u DOM-u na cijeloj stranici. Na kompleksnim SPA stranicama kao sto je Threads.com, ovo moze generisati hiljade mutacija u sekundi.
+
+**Preporuka:** Suziti scope posmatranja na specifican container ili koristiti debounce/throttle za procesiranje.
+
+### 4.2 NISKO: Ponovljeni DOM query-ji
+
+`isDraftsDialog()` koristi `element.textContent.toLowerCase()` na potencijalno velikim elementima. Ovo se poziva za svaku mutaciju, sto moze biti skupo.
+
+### 4.3 NISKO: collectScheduledByDate() se poziva za svaki date divider
+
+**Fajl:** `content/content.js:1157`
+
+Unutar `addDateDividers()` petlje, `this.collectScheduledByDate()` se poziva za svaki novi datum, ali rezultat bi mogao biti izracunat jednom izvan petlje.
+
+---
+
+## 5. KVALITET KODA
+
+### 5.1 Duplikacija koda - Toggle handler-i u popup.js
+
+**Fajl:** `popup/popup.js:280-412`
+
+Svi toggle handler-i (`handleSortOrderChange`, `handleAutoSortToggle`, `handleTimeIndicatorsToggle`, `handleDraftCountToggle`, `handleSortIndicatorToggle`, `handleDateDividerToggle`) imaju gotovo identican pattern:
+
+```javascript
+async handleXxxToggle(enabled) {
+  this.settings.xxx = enabled;
+  await this.saveSettings();
+  try {
+    const [tab] = await chrome.tabs.query({ active: true, currentWindow: true });
+    if (tab && tab.url.includes('threads.com')) {
+      await chrome.tabs.sendMessage(tab.id, { action: 'toggleXxx', enabled });
+    }
+  } catch (error) { ... }
+  this.showSuccess(enabled ? 'Xxx enabled' : 'Xxx disabled');
+}
+```
+
+**Preporuka:** Kreirati genericku helper metodu:
+```javascript
+async toggleSetting(key, action, enabled, label) {
+  this.settings[key] = enabled;
+  await this.saveSettings();
+  await this.sendToActiveTab({ action, enabled });
+  this.showSuccess(enabled ? `${label} enabled` : `${label} disabled`);
+}
+```
+
+### 5.2 Inline stilovi umjesto CSS klasa
+
+**Fajlovi:** `content/content.js:891-898`, `content/content.js:1241-1249`, `content/content.js:1259-1265`, `content/content.js:1310-1321`, `popup/popup.js:549-557`
+
+Vise od 5 mjesta koristi inline `style` atribute umjesto CSS klasa definisanih u content.css.
+
+**Preporuka:** Premjestiti sve stilove u CSS fajlove. Koriscenje inline stilova otezava odrzavanje i onemogucava dark mode/accessibility overrides.
+
+### 5.3 Magic numbers
+
+- `text.length > 20 && text.length < 500` (content.js:368)
+- `text.length < 5` (content.js:411)
+- `randomHour = Math.floor(Math.random() * 12) + 9` (content.js:741)
+- `30*60000` (content.js:972) - 30 minuta
+- `37` (content.js:1057) - "prime-ish step"
+
+**Preporuka:** Izdvojiti u imenovane konstante za bolju citljivost.
+
+### 5.4 hasScheduleableContent() i extractScheduledTime() duplikacija
+
+**Fajl:** `content/content.js:408-501` i `content/content.js:559-790`
+
+Ove dvije metode dijele gotovo identican set regex pattern-a i logike za prepoznavanje vremena i dana. Promjena u jednoj metodi zahtijeva istu promjenu u drugoj.
+
+**Preporuka:** Izdvojiti zajednicki set pattern-a u konstantu klase ili helper metodu.
+
+---
+
+## 6. MANIFEST I PERMISIJE
+
+### 6.1 Permisije su ispravne i minimalne
+
+- `storage` - Potrebno za cuvanje settings-a
+- `activeTab` - Potrebno za komunikaciju sa aktivnim tab-om
+- `scripting` - Potrebno za dinamicko injektovanje content script-a
+
+### 6.2 Host permissions su ispravne
+
+```json
+"host_permissions": ["https://*.threads.com/*"]
+```
+
+Ograniceno samo na threads.com domenu.
+
+### 6.3 Content Security Policy
+
+Manifest V3 automatski primjenjuje strogi CSP. Nema custom CSP u manifest.json, sto je dobro - default je najsigurniji.
+
+---
+
+## 7. ACCESSIBILITY
+
+### 7.1 Dobro
+- CSS ima `prefers-reduced-motion: reduce` support
+- CSS ima `prefers-contrast: more` support
+- Focus outlines su definirani
+- `aria-label` se koristi na nekim elementima (date count badge)
+
+### 7.2 Nedostaje
+- Popup HTML nema `aria-label` na toggle switch-evima
+- Nema ARIA live regions za dinamicki sadrzaj (success/error poruke)
+- Close dugmici za error/success poruke nemaju `aria-label`
+- Nema keyboard navigacije za suggestion badge-ove
+
+**Preporuka:** Dodati `aria-label`, `role="alert"` za poruke, `role="status"` za statistike.
+
+---
+
+## 8. KOMPATIBILNOST I ROBUSTNOST
+
+### 8.1 Fragilni DOM selektori
+
+**Fajl:** `content/content.js:117`
+
+```javascript
+const dialogElements = document.querySelectorAll('[role="dialog"], .x1n2onr6');
+```
+
+Klasa `.x1n2onr6` je automatski generisana (vjerovatno od CSS-in-JS build sistema Threads.com) i moze se promijeniti u bilo kojem update-u.
+
+**Rizik:** Svaki Threads.com deploy moze slomiti detekciju dialog-a.
+
+**Preporuka:** Osloniti se vise na semanticke atribute (`[role="dialog"]`) i sadrzajnu detekciju nego na generisane klase.
+
+### 8.2 Tekstualna detekcija je jezicno zavisna
+
+```javascript
+const editIndicators = [
+  'new thread', 'add a topic', 'what\'s new?', ...
+];
+const draftsIndicators = [
+  'posting tomorrow at', 'posting today at', ...
+];
+```
+
+Ovi stringovi rade samo za engleski interfejs. Korisnici sa drugim jezickim podesavanjima nece dobiti funkcionalnost.
+
+**Preporuka:** Dokumentovati ogranicenje ili implementirati multi-language support.
+
+### 8.3 Nema graceful degradation
+
+Ako Threads.com promijeni strukturu, ekstenzija nece raditi, ali nece ni obavijestiti korisnika. Ne postoji mehanizam za detekciju da li je content script uspjesno pronasao i procesirao drafts.
+
+---
+
+## 9. TESTOVI I CI/CD
+
+### Status: NE POSTOJI
+
+- Nema unit testova
+- Nema integration testova
+- Nema lintinga (ESLint)
+- Nema type checking-a (TypeScript/JSDoc)
+- Nema build pipeline-a
+- Nema CI/CD konfiguracije
+- Nema package.json
+
+**Preporuka:** Minimalno dodati:
+1. `package.json` sa dev dependencies
+2. ESLint konfiguraciju
+3. Unit testove za parsiranje vremena (najkritaniji dio)
+4. GitHub Actions za lint
+
+---
+
+## 10. REZIME NALAZA
+
+| Kategorija | Kriticno | Srednje | Nisko |
+|---|---|---|---|
+| Sigurnost | 1 (innerHTML/XSS) | 1 (web_accessible_resources) | 1 (console logging) |
+| Bagovi | 3 (random sort, wrong stats, no disconnect) | 1 (daysUntil=0) | 1 (dupla init) |
+| Performanse | 0 | 1 (MutationObserver scope) | 2 (DOM queries, repeated calc) |
+| Kvalitet koda | 0 | 2 (duplikacija, inline stilovi) | 2 (magic numbers, dupli regex) |
+| Accessibility | 0 | 1 (ARIA nedostaje) | 0 |
+| Kompatibilnost | 0 | 2 (fragilni selektori, jezik) | 1 (graceful degradation) |
+| Testovi | 1 (nema testova) | 0 | 0 |
+
+### Ukupna ocjena: 6.5/10
+
+**Pozitivno:**
+- Cista class-based arhitektura
+- Minimalne permisije
+- Dark mode i accessibility osnove
+- Zero dependencies
+- Manifest V3 (najnoviji standard)
+- Dobra separacija koncepata
+
+**Potrebno popraviti (prioritet):**
+1. Zamijeniti `innerHTML` sa sigurnim DOM API-jem
+2. Fiksirati random-based scheduling (nestabilan sort)
+3. Fiksirati scheduledDrafts count u popup-u
+4. Dodati MutationObserver cleanup
+5. Smanjiti scope MutationObserver-a
+6. Dodati ESLint i osnovne unit testove
+7. Premjestiti inline stilove u CSS
+8. Refaktorisati duplirane toggle handler-e
diff --git a/background/background.js b/background/background.js
index 3a1cd08..76eae13 100644
--- a/background/background.js
+++ b/background/background.js
@@ -3,6 +3,11 @@
  * Handles extension lifecycle events and coordinates between components
  */
 
+const BG_DEBUG = false;
+function bgLog(...args) {
+  if (BG_DEBUG) console.log('[Threads DraftCraft]', ...args);
+}
+
 class ThreadsDraftCraftBackground {
   constructor() {
     this.init();
@@ -12,13 +17,10 @@ class ThreadsDraftCraftBackground {
    * Initialize the background script
    */
   init() {
-    console.log('[Threads DraftCraft] Background script initialized');
+    bgLog('Background script initialized');
 
     // Setup event listeners
     this.setupEventListeners();
-
-    // Initialize default settings on install
-    this.handleInstallation();
   }
 
   /**
@@ -51,24 +53,6 @@ class ThreadsDraftCraftBackground {
     });
   }
 
-  /**
-   * Handle extension installation
-   */
-  async handleInstallation() {
-    try {
-      // Check if this is the first install
-      const result = await chrome.storage.sync.get('isInstalled');
-      
-      if (!result.isInstalled) {
-        await this.initializeDefaultSettings();
-        await chrome.storage.sync.set({ isInstalled: true });
-        console.log('[Threads DraftCraft] Extension installed with default settings');
-      }
-    } catch (error) {
-      console.error('[Threads DraftCraft] Failed to handle installation:', error);
-    }
-  }
-
   /**
    * Initialize default settings
    */
@@ -84,9 +68,9 @@ class ThreadsDraftCraftBackground {
 
     try {
       await chrome.storage.sync.set(defaultSettings);
-      console.log('[Threads DraftCraft] Default settings initialized:', defaultSettings);
+      bgLog(' Default settings initialized:', defaultSettings);
     } catch (error) {
-      console.error('[Threads DraftCraft] Failed to initialize default settings:', error);
+      bgLog('ERROR: Failed to initialize default settings:', error);
     }
   }
 
@@ -94,7 +78,7 @@ class ThreadsDraftCraftBackground {
    * Handle extension installed event
    */
   async handleOnInstalled(details) {
-    console.log('[Threads DraftCraft] Extension installed/updated:', details);
+    bgLog(' Extension installed/updated:', details);
 
     switch (details.reason) {
       case 'install':
@@ -104,7 +88,7 @@ class ThreadsDraftCraftBackground {
         await this.handleUpdate(details.previousVersion);
         break;
       case 'chrome_update':
-        console.log('[Threads DraftCraft] Chrome was updated');
+        bgLog(' Chrome was updated');
         break;
     }
   }
@@ -113,7 +97,11 @@ class ThreadsDraftCraftBackground {
    * Handle first installation
    */
   async handleFirstInstall() {
-    console.log('[Threads DraftCraft] First installation detected');
+    bgLog('First installation detected');
+
+    // Initialize default settings
+    await this.initializeDefaultSettings();
+    await chrome.storage.sync.set({ isInstalled: true });
 
     // Set badge to indicate extension is active
     try {
@@ -121,10 +109,9 @@ class ThreadsDraftCraftBackground {
       await chrome.action.setBadgeBackgroundColor({ color: '#4CAF50' });
       await chrome.action.setTitle({ title: 'Threads DraftCraft - Ready' });
     } catch (error) {
-      console.error('[Threads DraftCraft] Failed to set badge:', error);
+      bgLog('ERROR: Failed to set badge:', error);
     }
 
-    // Show welcome notification (optional)
     this.showWelcomeNotification();
   }
 
@@ -132,7 +119,7 @@ class ThreadsDraftCraftBackground {
    * Handle extension update
    */
   async handleUpdate(previousVersion) {
-    console.log('[Threads DraftCraft] Extension updated from version:', previousVersion);
+    bgLog(' Extension updated from version:', previousVersion);
 
     try {
       // Update version in storage
@@ -145,9 +132,9 @@ class ThreadsDraftCraftBackground {
       // Perform any migration logic here if needed
       await this.performMigration(previousVersion);
 
-      console.log('[Threads DraftCraft] Update completed successfully');
+      bgLog(' Update completed successfully');
     } catch (error) {
-      console.error('[Threads DraftCraft] Failed to handle update:', error);
+      bgLog('ERROR: Failed to handle update:', error);
     }
   }
 
@@ -155,7 +142,7 @@ class ThreadsDraftCraftBackground {
    * Perform data migration for updates
    */
   async performMigration(previousVersion) {
-    console.log('[Threads DraftCraft] Performing migration from version:', previousVersion);
+    bgLog(' Performing migration from version:', previousVersion);
 
     // Add migration logic here as needed for future updates
     // For example:
@@ -170,7 +157,7 @@ class ThreadsDraftCraftBackground {
    * Handle extension startup
    */
   handleOnStartup() {
-    console.log('[Threads DraftCraft] Extension startup');
+    bgLog(' Extension startup');
     
     // Reset badge on startup
     this.updateBadge();
@@ -180,7 +167,7 @@ class ThreadsDraftCraftBackground {
    * Handle messages from content scripts and popup
    */
   async handleMessage(message, sender, sendResponse) {
-    console.log('[Threads DraftCraft] Received message:', message, 'from:', sender);
+    bgLog(' Received message:', message, 'from:', sender);
 
     try {
       switch (message.action) {
@@ -211,11 +198,11 @@ class ThreadsDraftCraftBackground {
           break;
 
         default:
-          console.warn('[Threads DraftCraft] Unknown message action:', message.action);
+          bgLog('Unknown message action:', message.action);
           sendResponse({ success: false, error: 'Unknown action' });
       }
     } catch (error) {
-      console.error('[Threads DraftCraft] Error handling message:', error);
+      bgLog('ERROR: Error handling message:', error);
       sendResponse({ success: false, error: error.message });
     }
   }
@@ -226,7 +213,7 @@ class ThreadsDraftCraftBackground {
   async handleTabUpdate(tabId, changeInfo, tab) {
     // Only process completed navigations to threads.com
     if (changeInfo.status === 'complete' && tab.url && tab.url.includes('threads.com')) {
-      console.log('[Threads DraftCraft] Threads.com tab detected:', tabId);
+      bgLog(' Threads.com tab detected:', tabId);
 
       try {
         // Update badge to show extension is active on this tab
@@ -240,7 +227,7 @@ class ThreadsDraftCraftBackground {
         // Optionally inject content script if not already present
         await this.ensureContentScriptInjected(tabId);
       } catch (error) {
-        console.error('[Threads DraftCraft] Failed to handle tab update:', error);
+        bgLog('ERROR: Failed to handle tab update:', error);
       }
     }
   }
@@ -253,7 +240,7 @@ class ThreadsDraftCraftBackground {
       // Check if content script is already running
       const response = await chrome.tabs.sendMessage(tabId, { action: 'ping' });
       if (response && response.success) {
-        console.log('[Threads DraftCraft] Content script already active in tab:', tabId);
+        bgLog(' Content script already active in tab:', tabId);
         return;
       }
     } catch (error) {
@@ -269,9 +256,9 @@ class ThreadsDraftCraftBackground {
           files: ['content/content.css']
         });
 
-        console.log('[Threads DraftCraft] Content script injected into tab:', tabId);
+        bgLog(' Content script injected into tab:', tabId);
       } catch (injectError) {
-        console.error('[Threads DraftCraft] Failed to inject content script:', injectError);
+        bgLog('ERROR: Failed to inject content script:', injectError);
       }
     }
   }
@@ -280,7 +267,7 @@ class ThreadsDraftCraftBackground {
    * Handle storage changes
    */
   handleStorageChange(changes, areaName) {
-    console.log('[Threads DraftCraft] Storage changed:', changes, 'in area:', areaName);
+    bgLog(' Storage changed:', changes, 'in area:', areaName);
 
     // Broadcast settings changes to all tabs
     this.broadcastSettingsUpdate(changes);
@@ -296,12 +283,13 @@ class ThreadsDraftCraftBackground {
         autoSort: true,
         showTimeIndicators: true,
         showDraftCount: true,
-        showSortIndicator: true
+        showSortIndicator: true,
+        showDateDivider: true
       });
 
       return result;
     } catch (error) {
-      console.error('[Threads DraftCraft] Failed to get settings:', error);
+      bgLog('ERROR: Failed to get settings:', error);
       throw error;
     }
   }
@@ -312,9 +300,9 @@ class ThreadsDraftCraftBackground {
   async saveSettings(settings) {
     try {
       await chrome.storage.sync.set(settings);
-      console.log('[Threads DraftCraft] Settings saved:', settings);
+      bgLog(' Settings saved:', settings);
     } catch (error) {
-      console.error('[Threads DraftCraft] Failed to save settings:', error);
+      bgLog('ERROR: Failed to save settings:', error);
       throw error;
     }
   }
@@ -334,7 +322,7 @@ class ThreadsDraftCraftBackground {
 
       return response || null;
     } catch (error) {
-      console.error('[Threads DraftCraft] Failed to get draft stats:', error);
+      bgLog('ERROR: Failed to get draft stats:', error);
       return null;
     }
   }
@@ -354,7 +342,7 @@ class ThreadsDraftCraftBackground {
         await chrome.action.setTitle({ title: 'Threads DraftCraft - Ready' });
       }
     } catch (error) {
-      console.error('[Threads DraftCraft] Failed to update badge:', error);
+      bgLog('ERROR: Failed to update badge:', error);
     }
   }
 
@@ -376,7 +364,7 @@ class ThreadsDraftCraftBackground {
         }
       }
     } catch (error) {
-      console.error('[Threads DraftCraft] Failed to broadcast settings update:', error);
+      bgLog('ERROR: Failed to broadcast settings update:', error);
     }
   }
 
@@ -384,29 +372,23 @@ class ThreadsDraftCraftBackground {
    * Log errors for debugging
    */
   logError(error, context) {
-    console.error(`[Threads DraftCraft] ${context}:`, error);
-
-    // Store error in local storage for debugging (optional)
-    try {
-      chrome.storage.local.get('errorLog').then((result) => {
-        const errorLog = result.errorLog || [];
-        errorLog.push({
-          timestamp: Date.now(),
-          error: error.toString(),
-          context: context,
-          stack: error.stack
-        });
-
-        // Keep only last 50 errors
-        if (errorLog.length > 50) {
-          errorLog.splice(0, errorLog.length - 50);
-        }
-
-        chrome.storage.local.set({ errorLog });
+    bgLog(`ERROR: ${context}:`, error);
+
+    // Store error in local storage for debugging
+    chrome.storage.local.get('errorLog').then((result) => {
+      const errorLog = result.errorLog || [];
+      errorLog.push({
+        timestamp: Date.now(),
+        error: error.toString(),
+        context: context,
+        stack: error.stack
       });
-    } catch (storageError) {
-      console.error('[Threads DraftCraft] Failed to log error:', storageError);
-    }
+
+      // Keep only last 50 errors
+      chrome.storage.local.set({ errorLog: errorLog.slice(-50) });
+    }).catch((storageError) => {
+      bgLog('ERROR: Failed to log error:', storageError);
+    });
   }
 
   /**
@@ -415,7 +397,7 @@ class ThreadsDraftCraftBackground {
   showWelcomeNotification() {
     // This could show a notification or open a welcome page
     // For now, just log the welcome message
-    console.log('[Threads DraftCraft] Welcome! Extension installed successfully.');
+    bgLog(' Welcome! Extension installed successfully.');
 
     // Optionally create a notification
     /*
diff --git a/content/content.css b/content/content.css
index f4901c5..9826e49 100644
--- a/content/content.css
+++ b/content/content.css
@@ -444,3 +444,74 @@
   padding: 1px 6px;
   white-space: nowrap;
 }
+
+/* Status indicator (sort order label in header) */
+.threads-draftcraft-status-label {
+  margin-left: 8px;
+  font-size: 12px;
+  font-weight: 400;
+  opacity: 0.8;
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+}
+
+.threads-draftcraft-status-icon {
+  display: inline-block;
+  margin-right: 2px;
+}
+
+/* Time info badge (integrated with "Posting" text) */
+.threads-draftcraft-time-info {
+  margin-left: 6px;
+  color: #1DA1F2;
+  font-weight: 500;
+  background: rgba(29, 161, 242, 0.1);
+  padding: 0 6px;
+  border-radius: 4px;
+  display: inline-block;
+}
+
+/* Subtle time indicator fallback */
+.threads-draftcraft-time-subtle-inner {
+  color: #1DA1F2;
+  font-size: 10px;
+  font-weight: 500;
+  margin: 2px 0;
+  opacity: 0.8;
+}
+
+.threads-draftcraft-time-subtle-inner::before {
+  content: '\01F4C5 '; /* calendar emoji */
+}
+
+/* Count badge (integrated into header) */
+.threads-draftcraft-count-badge-inner {
+  margin-left: 8px;
+  background: rgba(76, 175, 80, 0.15);
+  color: #4CAF50;
+  padding: 2px 6px;
+  border-radius: 10px;
+  font-size: 11px;
+  font-weight: 500;
+  display: inline-flex;
+  align-items: center;
+  gap: 2px;
+}
+
+/* Dark mode overrides for new classes */
+@media (prefers-color-scheme: dark) {
+  .threads-draftcraft-time-info {
+    color: #4DA6FF;
+    background: rgba(29, 161, 242, 0.15);
+  }
+
+  .threads-draftcraft-time-subtle-inner {
+    color: #4DA6FF;
+  }
+
+  .threads-draftcraft-count-badge-inner {
+    background: rgba(76, 175, 80, 0.2);
+    color: #66BB6A;
+  }
+}
diff --git a/content/content.js b/content/content.js
index 454b9a3..51fbd8a 100644
--- a/content/content.js
+++ b/content/content.js
@@ -3,6 +3,77 @@
  * Enhances the drafts section on threads.com with sorting and organization features
  */
 
+/** Named constants */
+const DRAFTCRAFT_DEBUG = false;
+const MIN_DRAFT_TEXT_LENGTH = 5;
+const MIN_DRAFT_CONTENT_LENGTH = 20;
+const MAX_DRAFT_CONTENT_LENGTH = 500;
+const MIN_SUBSTANTIAL_TEXT_LENGTH = 10;
+const MIN_TEXT_NODE_LENGTH = 3;
+const DEBOUNCE_DELAY_MS = 150;
+const SUGGESTION_WINDOW_START_HOUR = 6;
+const SUGGESTION_WINDOW_END_HOUR = 23;
+const SUGGESTION_MIN_FUTURE_MINUTES = 30;
+const SUGGESTION_COUNT = 3;
+const NEXT_DRAFT_PREVIEW_LENGTH = 50;
+const FALLBACK_MOCK_HOURS = [2, 4, 8, 16, 25, 30, 48];
+const BUSINESS_HOURS_START = 9;
+const BUSINESS_HOURS_END = 20;
+
+/** Day/month name constants */
+const DAY_NAMES = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday'];
+const DAY_NAMES_SHORT = ['sun', 'mon', 'tue', 'wed', 'thu', 'fri', 'sat'];
+const MONTH_NAMES = ['jan', 'feb', 'mar', 'apr', 'may', 'jun', 'jul', 'aug', 'sep', 'oct', 'nov', 'dec'];
+
+/** Shared regex patterns for schedule detection */
+const DAY_PATTERN = DAY_NAMES.join('|');
+const DAY_PATTERN_SHORT = DAY_NAMES_SHORT.join('|');
+const MONTH_PATTERN = MONTH_NAMES.join('|');
+
+const SCHEDULE_TIME_PATTERNS = [
+  // Match "Posting on Mon, Sep 1 at 4:17 PM GMT+2" format
+  new RegExp(`posting\\s+on\\s+(${DAY_PATTERN_SHORT}|${DAY_PATTERN}),?\\s+(${MONTH_PATTERN})\\s+(\\d{1,2})\\s+at\\s+(\\d{1,2}):(\\d{2})\\s*(am|pm|AM|PM)(?:\\s+([A-Z]{3}[+-]?\\d{1,2}))?`, 'i'),
+  // Match "today/tomorrow/dayname at HH:MM AM/PM" with optional timezone
+  new RegExp(`(?:posting\\s+)?(?:today|tomorrow|${DAY_PATTERN})\\s+at\\s+(\\d{1,2}):(\\d{2})\\s*(am|pm|AM|PM)(?:\\s+[A-Z]{3}[+-]?\\d{1,2})?`, 'i'),
+  // Fallback for just the time with optional timezone
+  /(\d{1,2}):(\d{2})\s*(am|pm|AM|PM)(?:\s+[A-Z]{3}[+-]?\d{1,2})?/i
+];
+
+const SCHEDULE_DETECTION_PATTERNS = [
+  // Match "today/tomorrow/dayname at HH:MM AM/PM" with optional timezone
+  new RegExp(`(?:posting\\s+)?(?:today|tomorrow|${DAY_PATTERN})\\s+at\\s+\\d{1,2}:\\d{2}\\s*(?:am|pm|AM|PM)(?:\\s+[A-Z]{3}[+-]?\\d{1,2})?`, 'i'),
+  // Match "Posting on Mon, Sep 1 at 4:17 PM GMT+2" format
+  new RegExp(`posting\\s+on\\s+(?:${DAY_PATTERN_SHORT}|${DAY_PATTERN}),?\\s+(?:${MONTH_PATTERN})\\s+\\d{1,2}\\s+at\\s+\\d{1,2}:\\d{2}\\s*(?:am|pm|AM|PM)(?:\\s+[A-Z]{3}[+-]?\\d{1,2})?`, 'i'),
+  // Fallback for just the time with optional timezone
+  /\d{1,2}:\d{2}\s*(?:am|pm|AM|PM)(?:\s+[A-Z]{3}[+-]?\d{1,2})?/i
+];
+
+const SCHEDULING_INDICATORS = [
+  'posting today',
+  'today at',
+  'posting tomorrow',
+  'tomorrow at',
+  'posting in',
+  /in \d+ hours?/,
+  /in \d+ days?/,
+  /\btoday\b/,
+  /\btomorrow\b/
+];
+
+/** Safe text escaping helper */
+function escapeText(str) {
+  const div = document.createElement('span');
+  div.textContent = str;
+  return div.textContent;
+}
+
+/** Conditional logger */
+function debugLog(...args) {
+  if (DRAFTCRAFT_DEBUG) {
+    console.log('[Threads DraftCraft]', ...args);
+  }
+}
+
 class ThreadsDraftCraft {
   constructor() {
     this.drafts = [];
@@ -12,6 +83,8 @@ class ThreadsDraftCraft {
     this.showDraftCount = true;
     this.showSortIndicator = true;
     this.showDateDivider = true;
+    this.observer = null;
+    this._debounceTimer = null;
 
     // Initialize the extension
     this.init();
@@ -51,7 +124,7 @@ class ThreadsDraftCraft {
       this.showSortIndicator = result.showSortIndicator;
       this.showDateDivider = result.showDateDivider;
     } catch (error) {
-      console.warn('[Threads DraftCraft] Could not load settings:', error);
+      debugLog('Could not load settings:', error);
     }
   }
 
@@ -62,28 +135,32 @@ class ThreadsDraftCraft {
     chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
       if (message.action === 'changeSortOrder') {
         this.sortOrder = message.sortOrder;
-        this.processDrafts(null, true); // Force reprocessing
+        this.processDrafts(null, true);
       } else if (message.action === 'toggleAutoSort') {
         this.autoSort = message.enabled;
-        this.processDrafts(null, true); // Force reprocessing to apply/remove sorting immediately
+        this.processDrafts(null, true);
       } else if (message.action === 'toggleTimeIndicators') {
         this.showTimeIndicators = message.enabled;
-        this.processDrafts(null, true); // Force reprocessing to show/hide time indicators
+        this.processDrafts(null, true);
       } else if (message.action === 'toggleDraftCount') {
         this.showDraftCount = message.enabled;
-        this.processDrafts(null, true); // Force reprocessing to show/hide draft count
+        this.processDrafts(null, true);
       } else if (message.action === 'toggleSortIndicator') {
         this.showSortIndicator = message.enabled;
-        this.processDrafts(null, true); // Force reprocessing to show/hide sort indicator
+        this.processDrafts(null, true);
       } else if (message.action === 'toggleDateDivider') {
         this.showDateDivider = message.enabled;
-        this.processDrafts(null, true); // Reprocess to show/hide date dividers
+        this.processDrafts(null, true);
       } else if (message.action === 'getDraftStats') {
         sendResponse({
           totalDrafts: this.drafts.length,
+          scheduledDrafts: this.drafts.filter(d => d.scheduledTime).length,
           nextScheduled: this.getNextScheduledDraft()
         });
+      } else if (message.action === 'ping') {
+        sendResponse({ success: true });
       }
+      return true; // Keep message channel open for async responses
     });
   }
 
@@ -91,46 +168,41 @@ class ThreadsDraftCraft {
    * Observe for the appearance of drafts dialog
    */
   observeForDraftsDialog() {
-    const observer = new MutationObserver((mutations) => {
-      mutations.forEach((mutation) => {
-        if (mutation.type === 'childList') {
-          // Skip mutations caused by our own extension elements
-          const isExtensionMutation = mutation.addedNodes &&
-            Array.from(mutation.addedNodes).some(node =>
-              node.nodeType === Node.ELEMENT_NODE &&
-              (node.classList?.contains('threads-draftcraft-indicator') ||
-                node.classList?.contains('threads-draftcraft-count') ||
-                node.classList?.contains('threads-draftcraft-time') ||
-                node.classList?.contains('threads-draftcraft-date-divider') ||
-                node.classList?.contains('threads-draftcraft-date-count') ||
-                node.classList?.contains('threads-draftcraft-date-suggestion') ||
-                node.classList?.contains('threads-draftcraft-date-suggestions') ||
-                node.classList?.contains('threads-draftcraft-status') ||
-                node.classList?.contains('threads-draftcraft-count-badge'))
-            );
-
-          if (isExtensionMutation) {
-            return; // Skip processing this mutation
-          }
+    // Disconnect existing observer if any
+    if (this.observer) {
+      this.observer.disconnect();
+    }
 
-          // Look for drafts dialog or modal
-          const dialogElements = document.querySelectorAll('[role="dialog"], .x1n2onr6');
+    this.observer = new MutationObserver((mutations) => {
+      let hasRelevantMutation = false;
 
-          dialogElements.forEach((dialog) => {
-            // Check if dialog is already processed to prevent infinite loop
-            if (dialog.hasAttribute('data-threads-draftcraft-processed')) {
-              return;
-            }
+      for (const mutation of mutations) {
+        if (mutation.type !== 'childList') continue;
 
-            if (this.isDraftsDialog(dialog)) {
-              this.processDrafts(dialog);
-            }
-          });
+        // Skip mutations caused by our own extension elements
+        const isExtensionMutation = mutation.addedNodes &&
+          Array.from(mutation.addedNodes).some(node =>
+            node.nodeType === Node.ELEMENT_NODE &&
+            node.className && typeof node.className === 'string' &&
+            node.className.includes('threads-draftcraft')
+          );
+
+        if (!isExtensionMutation) {
+          hasRelevantMutation = true;
+          break;
         }
-      });
+      }
+
+      if (!hasRelevantMutation) return;
+
+      // Debounce processing to avoid excessive DOM queries
+      clearTimeout(this._debounceTimer);
+      this._debounceTimer = setTimeout(() => {
+        this._processDialogMutations();
+      }, DEBOUNCE_DELAY_MS);
     });
 
-    observer.observe(document.body, {
+    this.observer.observe(document.body, {
       childList: true,
       subtree: true
     });
@@ -139,11 +211,39 @@ class ThreadsDraftCraft {
     this.checkForExistingDraftsDialog();
   }
 
+  /**
+   * Process dialog mutations (debounced)
+   */
+  _processDialogMutations() {
+    const dialogElements = document.querySelectorAll('[role="dialog"]');
+
+    dialogElements.forEach((dialog) => {
+      if (dialog.hasAttribute('data-threads-draftcraft-processed')) {
+        return;
+      }
+
+      if (this.isDraftsDialog(dialog)) {
+        this.processDrafts(dialog);
+      }
+    });
+  }
+
+  /**
+   * Disconnect the observer (cleanup)
+   */
+  disconnect() {
+    if (this.observer) {
+      this.observer.disconnect();
+      this.observer = null;
+    }
+    clearTimeout(this._debounceTimer);
+  }
+
   /**
    * Check if the current page already has a drafts dialog open
    */
   checkForExistingDraftsDialog() {
-    const dialogElements = document.querySelectorAll('[role="dialog"], .x1n2onr6');
+    const dialogElements = document.querySelectorAll('[role="dialog"]');
 
     dialogElements.forEach((dialog) => {
       // Check if dialog is already processed to prevent infinite loop
@@ -206,34 +306,18 @@ class ThreadsDraftCraft {
     const hasMultipleScheduledPosts = (textContent.match(/posting (today|tomorrow) at/g) || []).length > 1;
 
     // Only return true if we have clear drafts indicators and no edit indicators
-    const isDrafts = hasDraftsText && (hasDraftsIndicator || hasMultipleScheduledPosts);
-
-    // if (isDrafts) {
-    //   console.log('[Threads DraftCraft] Confirmed drafts dialog with indicators');
-    // }
-
-    return isDrafts;
+    return hasDraftsText && (hasDraftsIndicator || hasMultipleScheduledPosts);
   }
 
   /**
    * Remove existing extension enhancements from dialog
    */
   removeExistingEnhancements(dialogElement) {
-    // Remove extension indicators
-    const indicators = dialogElement.querySelectorAll('.threads-draftcraft-indicator');
-    indicators.forEach(indicator => indicator.remove());
-
-    // Remove draft count indicators
-    const countIndicators = dialogElement.querySelectorAll('.threads-draftcraft-count');
-    countIndicators.forEach(indicator => indicator.remove());
-
-    // Remove time indicators and reset processed flags
-    const timeIndicators = dialogElement.querySelectorAll('.threads-draftcraft-time');
-    timeIndicators.forEach(indicator => indicator.remove());
-
-    // Remove date dividers
-    const dateDividers = dialogElement.querySelectorAll('.threads-draftcraft-date-divider');
-    dateDividers.forEach(divider => divider.remove());
+    // Remove all extension-injected elements in a single DOM query
+    const extensionElements = dialogElement.querySelectorAll(
+      '.threads-draftcraft-indicator, .threads-draftcraft-count, .threads-draftcraft-time, .threads-draftcraft-date-divider, .threads-draftcraft-time-subtle, .threads-draftcraft-time-info, .threads-draftcraft-status, .threads-draftcraft-count-badge'
+    );
+    extensionElements.forEach(el => el.remove());
 
     // Reset all processed flags on draft elements
     const processedElements = dialogElement.querySelectorAll('[data-threads-draftcraft-time-added]');
@@ -301,7 +385,7 @@ class ThreadsDraftCraft {
    * Find the drafts dialog in the DOM
    */
   findDraftsDialog() {
-    const dialogs = document.querySelectorAll('[role="dialog"], .x1n2onr6');
+    const dialogs = document.querySelectorAll('[role="dialog"]');
 
     for (let dialog of dialogs) {
       if (this.isDraftsDialog(dialog)) {
@@ -365,7 +449,7 @@ class ThreadsDraftCraft {
         const text = div.textContent.trim();
 
         // Enhanced detection: look for any scheduleable content
-        if (text.length > 20 && text.length < 500 && this.hasScheduleableContent(div)) {
+        if (text.length > MIN_DRAFT_CONTENT_LENGTH && text.length < MAX_DRAFT_CONTENT_LENGTH && this.hasScheduleableContent(div)) {
           // Make sure this isn't a child of an already found element
           let isChild = false;
           for (let found of foundDrafts) {
@@ -403,45 +487,45 @@ class ThreadsDraftCraft {
 
   /**
    * Check if an element contains content that can be scheduled
-   * Uses the same comprehensive logic as extractScheduledTime
+   * Uses shared patterns from module-level constants
    */
   hasScheduleableContent(element) {
     const text = element.textContent.toLowerCase().trim();
 
-    if (!text || text.length < 5) {
+    if (!text || text.length < MIN_DRAFT_TEXT_LENGTH) {
       return false;
     }
 
-    // Define day names for matching
-    const dayNames = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday'];
-    const dayPattern = dayNames.join('|');
-
-    // Define month names and short day names for date matching
-    const monthNames = ['jan', 'feb', 'mar', 'apr', 'may', 'jun', 'jul', 'aug', 'sep', 'oct', 'nov', 'dec'];
-    const monthPattern = monthNames.join('|');
-    const dayNamesShort = ['sun', 'mon', 'tue', 'wed', 'thu', 'fri', 'sat'];
-    const dayPatternShort = dayNamesShort.join('|');
-
-    // Check for explicit time patterns (same as extractScheduledTime)
-    const timePatterns = [
-      // Match "today/tomorrow/dayname at HH:MM AM/PM" with optional timezone
-      new RegExp(`(?:posting\\s+)?(?:today|tomorrow|${dayPattern})\\s+at\\s+\\d{1,2}:\\d{2}\\s*(?:am|pm|AM|PM)(?:\\s+[A-Z]{3}[+-]?\\d{1,2})?`, 'i'),
-      // Match "Posting on Mon, Sep 1 at 4:17 PM GMT+2" format
-      new RegExp(`posting\\s+on\\s+(?:${dayPatternShort}|${dayPattern}),?\\s+(?:${monthPattern})\\s+\\d{1,2}\\s+at\\s+\\d{1,2}:\\d{2}\\s*(?:am|pm|AM|PM)(?:\\s+[A-Z]{3}[+-]?\\d{1,2})?`, 'i'),
-      // Fallback for just the time with optional timezone
-      /\d{1,2}:\d{2}\s*(?:am|pm|AM|PM)(?:\s+[A-Z]{3}[+-]?\d{1,2})?/i
-    ];
-
-    // Check for explicit time patterns
-    for (const pattern of timePatterns) {
+    // Check for explicit time patterns (shared with extractScheduledTime)
+    for (const pattern of SCHEDULE_DETECTION_PATTERNS) {
       if (pattern.test(text)) {
         return true;
       }
     }
 
-    // Check for day name patterns (enhanced from extractScheduledTime)
-    for (const dayName of dayNames) {
-      const dayPatterns = [
+    // Check for day name patterns
+    if (this._matchesDayNamePattern(text)) {
+      return true;
+    }
+
+    // Check for other scheduling indicators
+    for (const indicator of SCHEDULING_INDICATORS) {
+      if (typeof indicator === 'string') {
+        if (text.includes(indicator)) return true;
+      } else if (indicator.test(text)) {
+        return true;
+      }
+    }
+
+    return false;
+  }
+
+  /**
+   * Check if text matches any day-name-based scheduling pattern
+   */
+  _matchesDayNamePattern(text) {
+    for (const dayName of DAY_NAMES) {
+      const patterns = [
         `posting ${dayName}`,
         `${dayName} at`,
         `${dayName} review`,
@@ -452,51 +536,17 @@ class ThreadsDraftCraft {
         `${dayName} post`,
         `${dayName} is`,
         `${dayName} will`,
-        `${dayName}!`,
-        // Also check for day names at the beginning of sentences or after punctuation
-        new RegExp(`(^|\\.|!|\\?)\\s*${dayName}\\b`, 'i')
+        `${dayName}!`
       ];
 
-      for (const pattern of dayPatterns) {
-        if (typeof pattern === 'string') {
-          if (text.includes(pattern)) {
-            return true;
-          }
-        } else {
-          // Handle regex patterns
-          if (pattern.test(text)) {
-            return true;
-          }
-        }
+      for (const pattern of patterns) {
+        if (text.includes(pattern)) return true;
       }
-    }
 
-    // Check for other scheduling indicators
-    const schedulingIndicators = [
-      'posting today',
-      'today at',
-      'posting tomorrow',
-      'tomorrow at',
-      'posting in',
-      /in \d+ hours?/,
-      /in \d+ days?/,
-      /\btoday\b/,
-      /\btomorrow\b/
-    ];
-
-    for (const indicator of schedulingIndicators) {
-      if (typeof indicator === 'string') {
-        if (text.includes(indicator)) {
-          return true;
-        }
-      } else {
-        // Handle regex patterns
-        if (indicator.test(text)) {
-          return true;
-        }
-      }
+      // Also check for day names at sentence boundaries
+      const sentencePattern = new RegExp(`(^|\\.|!|\\?)\\s*${dayName}\\b`, 'i');
+      if (sentencePattern.test(text)) return true;
     }
-
     return false;
   }
 
@@ -536,7 +586,7 @@ class ThreadsDraftCraft {
       {
         acceptNode: function(node) {
           // Skip very short text nodes and whitespace
-          if (node.textContent.trim().length < 3) {
+          if (node.textContent.trim().length < MIN_TEXT_NODE_LENGTH) {
             return NodeFilter.FILTER_SKIP;
           }
           return NodeFilter.FILTER_ACCEPT;
@@ -550,51 +600,62 @@ class ThreadsDraftCraft {
     }
 
     // Return the first substantial text content
-    return textNodes.find(text => text.length > 10) || textNodes[0] || 'Draft content';
+    return textNodes.find(text => text.length > MIN_SUBSTANTIAL_TEXT_LENGTH) || textNodes[0] || 'Draft content';
   }
 
   /**
    * Extract scheduled time from draft element
    */
+  /**
+   * Convert 12-hour time to 24-hour format
+   */
+  _to24Hour(hours, isPM) {
+    let hour24 = hours;
+    if (isPM && hours !== 12) {
+      hour24 += 12;
+    } else if (!isPM && hours === 12) {
+      hour24 = 0;
+    }
+    return hour24;
+  }
+
+  /**
+   * Calculate days until a target day of week (0=Sun, 6=Sat)
+   * If target is same as current day, returns 7 (next week)
+   */
+  _daysUntilDay(targetDayIndex, currentDayIndex) {
+    if (targetDayIndex < 0 || targetDayIndex > 6 || currentDayIndex < 0 || currentDayIndex > 6) {
+      return 1; // Safe fallback: tomorrow
+    }
+    let daysUntil = targetDayIndex - currentDayIndex;
+    if (daysUntil <= 0) {
+      daysUntil += 7; // Next week if day has passed or is today
+    }
+    return daysUntil;
+  }
+
+  /**
+   * Get safe element index within its parent (returns 0 if not found or detached)
+   */
+  _safeElementIndex(element) {
+    if (!element || !element.parentElement) return 0;
+    const idx = Array.from(element.parentElement.children).indexOf(element);
+    return idx >= 0 ? idx : 0;
+  }
+
   extractScheduledTime(element) {
-    const originalText = element.textContent;
-    const textContent = originalText.toLowerCase();
-
-    // Try to extract actual time strings from Threads.com draft content
-    // Look for patterns like "today at 2:14 pm", "tomorrow at 12:36 PM", "Sunday at 3:00 PM", etc.
-
-    // Define day names for matching
-    const dayNames = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday'];
-    const dayPattern = dayNames.join('|');
-
-    // Define month names and short day names for date matching
-    const monthNames = ['jan', 'feb', 'mar', 'apr', 'may', 'jun', 'jul', 'aug', 'sep', 'oct', 'nov', 'dec'];
-    const monthPattern = monthNames.join('|');
-    const dayNamesShort = ['sun', 'mon', 'tue', 'wed', 'thu', 'fri', 'sat'];
-    const dayPatternShort = dayNamesShort.join('|');
-
-    // Enhanced patterns to match times with day names and optional timezone info
-    const timePatterns = [
-      // Match "Posting on Mon, Sep 1 at 4:17 PM GMT+2" format
-      new RegExp(`posting\\s+on\\s+(${dayPatternShort}|${dayPattern}),?\\s+(${monthPattern})\\s+(\\d{1,2})\\s+at\\s+(\\d{1,2}):(\\d{2})\\s*(am|pm|AM|PM)(?:\\s+([A-Z]{3}[+-]?\\d{1,2}))?`, 'i'),
-      // Match "today/tomorrow/dayname at HH:MM AM/PM" with optional timezone (case-insensitive)
-      new RegExp(`(?:posting\\s+)?(?:today|tomorrow|${dayPattern})\\s+at\\s+(\\d{1,2}):(\\d{2})\\s*(am|pm|AM|PM)(?:\\s+[A-Z]{3}[+-]?\\d{1,2})?`, 'i'),
-      // Fallback for just the time with optional timezone (case-insensitive)
-      /(\d{1,2}):(\d{2})\s*(am|pm|AM|PM)(?:\s+[A-Z]{3}[+-]?\d{1,2})?/i
-    ];
+    const textContent = element.textContent.toLowerCase();
 
     let timeMatch = null;
     let dayMatch = null;
     let patternIndex = -1;
 
-    for (let i = 0; i < timePatterns.length; i++) {
-      const pattern = timePatterns[i];
-      timeMatch = textContent.match(pattern);
+    for (let i = 0; i < SCHEDULE_TIME_PATTERNS.length; i++) {
+      timeMatch = textContent.match(SCHEDULE_TIME_PATTERNS[i]);
       if (timeMatch) {
         patternIndex = i;
-        // Also capture which day was mentioned (for non-specific date patterns)
         if (i > 0) {
-          const dayRegex = new RegExp(`(today|tomorrow|${dayPattern})`, 'i');
+          const dayRegex = new RegExp(`(today|tomorrow|${DAY_PATTERN})`, 'i');
           dayMatch = textContent.match(dayRegex);
         }
         break;
@@ -604,57 +665,37 @@ class ThreadsDraftCraft {
     if (timeMatch) {
       // Handle "Posting on Mon, Sep 1 at 4:17 PM GMT+2" format (first pattern)
       if (patternIndex === 0) {
-        const dayName = timeMatch[1];
         const monthName = timeMatch[2].toLowerCase();
         const dateNum = parseInt(timeMatch[3]);
         const hours = parseInt(timeMatch[4]);
         const minutes = parseInt(timeMatch[5]);
         const isPM = timeMatch[6].toLowerCase() === 'pm';
-        const timezone = timeMatch[7];
-
-        // Convert month name to number
-        const monthIndex = monthNames.indexOf(monthName);
-        if (monthIndex === -1) return null; // Invalid month
-
-        // Convert to 24-hour format
-        let hour24 = hours;
-        if (isPM && hours !== 12) {
-          hour24 += 12;
-        } else if (!isPM && hours === 12) {
-          hour24 = 0;
-        }
 
-        // Create date object with specific date
+        const monthIndex = MONTH_NAMES.indexOf(monthName);
+        if (monthIndex === -1) return null;
+
+        const hour24 = this._to24Hour(hours, isPM);
         const currentYear = new Date().getFullYear();
         const scheduledDate = new Date(currentYear, monthIndex, dateNum, hour24, minutes, 0, 0);
 
-        // If the date is in the past, assume it's for next year
-        const now = new Date();
-        if (scheduledDate < now) {
+        if (isNaN(scheduledDate.getTime())) return null;
+
+        if (scheduledDate < new Date()) {
           scheduledDate.setFullYear(currentYear + 1);
         }
 
         return scheduledDate;
       }
 
-      // Handle existing patterns (today/tomorrow/dayname format)
+      // Handle today/tomorrow/dayname format
       const hours = parseInt(timeMatch[1]);
       const minutes = parseInt(timeMatch[2]);
       const isPM = timeMatch[3].toLowerCase() === 'pm';
+      const hour24 = this._to24Hour(hours, isPM);
 
-      // Convert to 24-hour format
-      let hour24 = hours;
-      if (isPM && hours !== 12) {
-        hour24 += 12;
-      } else if (!isPM && hours === 12) {
-        hour24 = 0;
-      }
-
-      // Create date object
       const now = new Date();
       const scheduledDate = new Date(now);
 
-      // Determine the target date based on day mentioned
       if (dayMatch) {
         const dayIndicator = dayMatch[1].toLowerCase();
 
@@ -662,131 +703,67 @@ class ThreadsDraftCraft {
           // Keep current date
         } else if (dayIndicator === 'tomorrow') {
           scheduledDate.setDate(now.getDate() + 1);
-        } else if (dayNames.includes(dayIndicator)) {
-          // Handle specific day names
-          const targetDayIndex = dayNames.indexOf(dayIndicator);
-          const currentDayIndex = now.getDay();
-
-          // Calculate days until target day
-          let daysUntil = targetDayIndex - currentDayIndex;
-          if (daysUntil < 0) {
-            daysUntil += 7; // Next week if day has passed
-          }
-
+        } else if (DAY_NAMES.includes(dayIndicator)) {
+          const targetDayIndex = DAY_NAMES.indexOf(dayIndicator);
+          const daysUntil = this._daysUntilDay(targetDayIndex, now.getDay());
           scheduledDate.setDate(now.getDate() + daysUntil);
         }
       }
 
       scheduledDate.setHours(hour24, minutes, 0, 0);
 
-      // If the time has already passed today and no specific day was mentioned, schedule for tomorrow
       if (!dayMatch && scheduledDate <= now) {
         scheduledDate.setDate(now.getDate() + 1);
       }
       return scheduledDate;
     }
 
-    // Fallback patterns for relative time indicators
-
-    // Check for specific day names without specific time (Sunday, Monday, etc.)
-    for (const dayName of dayNames) {
-      // More comprehensive pattern matching for day names
-      const dayPatterns = [
-        `posting ${dayName}`,
-        `${dayName} at`,
-        `${dayName} review`,
-        `${dayName} meeting`,
-        `${dayName} motivation`,
-        `${dayName} planning`,
-        `${dayName} session`,
-        `${dayName} post`,
-        `${dayName} is`,
-        `${dayName} will`,
-        `${dayName}!`,
-        // Also check for day names at the beginning of sentences or after punctuation
-        new RegExp(`(^|\\.|!|\\?)\\s*${dayName}\\b`, 'i')
-      ];
-
-      let dayFound = false;
-      for (const pattern of dayPatterns) {
-        if (typeof pattern === 'string') {
-          if (textContent.includes(pattern)) {
-            dayFound = true;
-            break;
-          }
-        } else {
-          // Handle regex patterns
-          if (pattern.test(textContent)) {
-            dayFound = true;
-            break;
-          }
-        }
-      }
-
-      if (dayFound) {
-        const now = new Date();
-        const scheduledDate = new Date(now);
-
-        const targetDayIndex = dayNames.indexOf(dayName);
-        const currentDayIndex = now.getDay();
+    // Fallback: day name without specific time - use deterministic time based on position
+    if (this._matchesDayNamePattern(textContent)) {
+      for (const dayName of DAY_NAMES) {
+        if (textContent.includes(dayName)) {
+          const now = new Date();
+          const scheduledDate = new Date(now);
+          const targetDayIndex = DAY_NAMES.indexOf(dayName);
+          const daysUntil = this._daysUntilDay(targetDayIndex, now.getDay());
+          scheduledDate.setDate(now.getDate() + daysUntil);
 
-        // Calculate days until target day
-        let daysUntil = targetDayIndex - currentDayIndex;
-        if (daysUntil < 0) {
-          daysUntil += 7; // Next week if day has passed
+          // Deterministic time based on element position (not random)
+          const index = this._safeElementIndex(element);
+          const deterministicHour = BUSINESS_HOURS_START + ((index * 3) % (BUSINESS_HOURS_END - BUSINESS_HOURS_START));
+          scheduledDate.setHours(deterministicHour, 0, 0, 0);
+          return scheduledDate;
         }
-
-        scheduledDate.setDate(now.getDate() + daysUntil);
-        // Set a random time during business hours for the day
-        const randomHour = Math.floor(Math.random() * 12) + 9; // 9 AM to 8 PM
-        const randomMinute = Math.floor(Math.random() * 60);
-        scheduledDate.setHours(randomHour, randomMinute, 0, 0);
-        return scheduledDate;
       }
     }
 
-    // Check for "today" indicators without specific time
+    // Check for "today" indicators without specific time - deterministic
     if (textContent.includes('posting today') || textContent.includes('today at')) {
-      // Generate times for today (next few hours)
-      const hoursFromNow = Math.floor(Math.random() * 8) + 1; // 1-8 hours from now
-      return new Date(Date.now() + hoursFromNow * 60 * 60 * 1000);
+      const index = this._safeElementIndex(element);
+      return new Date(Date.now() + (1 + index * 2) * 60 * 60 * 1000);
     }
 
-    // Check for "tomorrow" indicators without specific time
+    // Check for "tomorrow" indicators without specific time - deterministic
     if (textContent.includes('posting tomorrow') || textContent.includes('tomorrow at')) {
-      // Generate times for tomorrow (24+ hours from now)
-      const hoursFromNow = Math.floor(Math.random() * 12) + 24; // 24-35 hours from now
-      return new Date(Date.now() + hoursFromNow * 60 * 60 * 1000);
+      const index = this._safeElementIndex(element);
+      return new Date(Date.now() + (24 + index * 2) * 60 * 60 * 1000);
     }
 
     // Check for "in X hours" or "in X days" patterns
     const inHoursMatch = textContent.match(/in (\d+) hours?/);
     if (inHoursMatch) {
-      const hours = parseInt(inHoursMatch[1]);
-      return new Date(Date.now() + hours * 60 * 60 * 1000);
+      return new Date(Date.now() + parseInt(inHoursMatch[1]) * 60 * 60 * 1000);
     }
 
     const inDaysMatch = textContent.match(/in (\d+) days?/);
     if (inDaysMatch) {
-      const days = parseInt(inDaysMatch[1]);
-      return new Date(Date.now() + days * 24 * 60 * 60 * 1000);
+      return new Date(Date.now() + parseInt(inDaysMatch[1]) * 24 * 60 * 60 * 1000);
     }
 
-    // Final fallback: assign times based on position to maintain some order
-    const index = parseInt(element.getAttribute('data-draft-index')) ||
-      Array.from(element.parentElement?.children || []).indexOf(element) || 0;
-
-    // Create chronologically ordered times as fallback
-    const mockTimes = [
-      new Date(Date.now() + 2 * 60 * 60 * 1000),  // 2 hours from now
-      new Date(Date.now() + 4 * 60 * 60 * 1000),  // 4 hours from now
-      new Date(Date.now() + 8 * 60 * 60 * 1000),  // 8 hours from now
-      new Date(Date.now() + 16 * 60 * 60 * 1000), // 16 hours from now
-      new Date(Date.now() + 25 * 60 * 60 * 1000), // 25 hours from now (tomorrow)
-      new Date(Date.now() + 30 * 60 * 60 * 1000), // 30 hours from now (tomorrow)
-      new Date(Date.now() + 48 * 60 * 60 * 1000), // 48 hours from now (day after)
-    ];
-    return mockTimes[index % mockTimes.length];
+    // Final fallback: deterministic times based on position
+    const index = parseInt(element.getAttribute('data-draft-index')) || this._safeElementIndex(element);
+
+    return new Date(Date.now() + FALLBACK_MOCK_HOURS[index % FALLBACK_MOCK_HOURS.length] * 60 * 60 * 1000);
   }
 
   /**
@@ -824,15 +801,16 @@ class ThreadsDraftCraft {
    */
   sortDrafts() {
     this.drafts.sort((a, b) => {
-      if (!a.scheduledTime && !b.scheduledTime) return 0;
+      if (!a.scheduledTime && !b.scheduledTime) return a.originalOrder - b.originalOrder;
       if (!a.scheduledTime) return 1;
       if (!b.scheduledTime) return -1;
 
-      if (this.sortOrder === 'earliest') {
-        return a.scheduledTime - b.scheduledTime;
-      } else {
-        return b.scheduledTime - a.scheduledTime;
-      }
+      const timeDiff = this.sortOrder === 'earliest'
+        ? a.scheduledTime - b.scheduledTime
+        : b.scheduledTime - a.scheduledTime;
+
+      // Stable sort: use originalOrder as tiebreaker for equal times
+      return timeDiff !== 0 ? timeDiff : a.originalOrder - b.originalOrder;
     });
   }
 
@@ -884,25 +862,33 @@ class ThreadsDraftCraft {
       return;
     }
 
-    // Create compact status indicator to integrate into header (as a sibling within the h1, not inside the title span)
+    // Create compact status indicator to integrate into header
     const statusIndicator = document.createElement('span');
     statusIndicator.className = 'threads-draftcraft-status';
-    statusIndicator.innerHTML = `
-      <span style="
-        margin-left: 8px;
-        font-size: 12px;
-        font-weight: 400;
-        opacity: 0.8;
-        display: inline-flex;
-        align-items: center;
-        gap: 4px;
-      ">
-        <svg width="12" height="12" viewBox="0 0 12 12" style="display: inline-block; margin-right: 2px;">
-          <path d="M6 2L6 10M3 7L6 10L9 7" stroke="#4CAF50" stroke-width="1.5" fill="none" stroke-linecap="round" stroke-linejoin="round"/>
-        </svg>
-        ${this.sortOrder === 'earliest' ? 'Earliest' : 'Latest'} First
-      </span>
-    `;
+
+    const innerSpan = document.createElement('span');
+    innerSpan.className = 'threads-draftcraft-status-label';
+
+    const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+    svg.setAttribute('width', '12');
+    svg.setAttribute('height', '12');
+    svg.setAttribute('viewBox', '0 0 12 12');
+    svg.setAttribute('aria-hidden', 'true');
+    svg.classList.add('threads-draftcraft-status-icon');
+    const path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
+    path.setAttribute('d', 'M6 2L6 10M3 7L6 10L9 7');
+    path.setAttribute('stroke', '#4CAF50');
+    path.setAttribute('stroke-width', '1.5');
+    path.setAttribute('fill', 'none');
+    path.setAttribute('stroke-linecap', 'round');
+    path.setAttribute('stroke-linejoin', 'round');
+    svg.appendChild(path);
+
+    innerSpan.appendChild(svg);
+    innerSpan.appendChild(document.createTextNode(
+      ` ${this.sortOrder === 'earliest' ? 'Earliest' : 'Latest'} First`
+    ));
+    statusIndicator.appendChild(innerSpan);
 
     // Integrate the status into the header container (sibling to h1)
     headerContainer.appendChild(statusIndicator);
@@ -916,11 +902,13 @@ class ThreadsDraftCraft {
 
     // Find the container that holds all drafts
     const container = this.drafts[0].element.parentElement;
-    if (!container) return;
+    if (!container || !document.contains(container)) return;
 
-    // Reorder elements
+    // Reorder elements (only if still in DOM)
     this.drafts.forEach((draft) => {
-      container.appendChild(draft.element);
+      if (document.contains(draft.element)) {
+        container.appendChild(draft.element);
+      }
     });
   }
 
@@ -964,14 +952,9 @@ class ThreadsDraftCraft {
     const dayStart = this.startOfDay(baseDate);
     const dayEnd = this.endOfDay(baseDate);
 
-    // Define active window 06:00 - 23:00 to have more room when crowded
-    const windowStartHour = 6;
-    const windowEndHour = 23;
-
-    // For today, exclude past times and start from at least 30 minutes in future
-    const minTime = isToday ? new Date(Math.max(now.getTime() + 30*60000, new Date(baseDate.getFullYear(), baseDate.getMonth(), baseDate.getDate(), windowStartHour).getTime())) : new Date(baseDate.getFullYear(), baseDate.getMonth(), baseDate.getDate(), windowStartHour);
+    const minTime = isToday ? new Date(Math.max(now.getTime() + SUGGESTION_MIN_FUTURE_MINUTES * 60000, new Date(baseDate.getFullYear(), baseDate.getMonth(), baseDate.getDate(), SUGGESTION_WINDOW_START_HOUR).getTime())) : new Date(baseDate.getFullYear(), baseDate.getMonth(), baseDate.getDate(), SUGGESTION_WINDOW_START_HOUR);
 
-    const endWindow = new Date(baseDate.getFullYear(), baseDate.getMonth(), baseDate.getDate(), windowEndHour, 0, 0, 0);
+    const endWindow = new Date(baseDate.getFullYear(), baseDate.getMonth(), baseDate.getDate(), SUGGESTION_WINDOW_END_HOUR, 0, 0, 0);
 
     const taken = [...(existingTimes||[])].filter(d => d >= dayStart && d <= dayEnd);
 
@@ -988,11 +971,7 @@ class ThreadsDraftCraft {
     };
 
     // Minute generator: never return 00, randomize 1..59
-    const randomNonZeroMinute = () => {
-      let m = Math.floor(Math.random()*59) + 1; // 1..59
-      if (m === 60) m = 59;
-      return m;
-    };
+    const randomNonZeroMinute = () => Math.floor(Math.random() * 59) + 1;
 
     const withRandomMinutes = (dt) => {
       const nd = new Date(dt);
@@ -1001,7 +980,7 @@ class ThreadsDraftCraft {
     };
 
     // 1) Try 3-hour cadence anchors spread across the day
-    for (let hour = windowStartHour; hour <= windowEndHour && suggestions.length < 3; hour += 3) {
+    for (let hour = SUGGESTION_WINDOW_START_HOUR; hour <= SUGGESTION_WINDOW_END_HOUR && suggestions.length < SUGGESTION_COUNT; hour += 3) {
       const slot = new Date(baseDate.getFullYear(), baseDate.getMonth(), baseDate.getDate(), hour, 0, 0, 0);
       if (slot < minTime || slot > endWindow) continue;
       const cand = withRandomMinutes(slot);
@@ -1009,7 +988,7 @@ class ThreadsDraftCraft {
     }
 
     // 2) If still short, try every 2 hours
-    for (let hour = windowStartHour; hour <= windowEndHour && suggestions.length < 3; hour += 2) {
+    for (let hour = SUGGESTION_WINDOW_START_HOUR; hour <= SUGGESTION_WINDOW_END_HOUR && suggestions.length < SUGGESTION_COUNT; hour += 2) {
       const slot = new Date(baseDate.getFullYear(), baseDate.getMonth(), baseDate.getDate(), hour, 0, 0, 0);
       if (slot < minTime || slot > endWindow) continue;
       const cand = withRandomMinutes(slot);
@@ -1017,7 +996,7 @@ class ThreadsDraftCraft {
     }
 
     // 3) If still short, try every hour
-    for (let hour = windowStartHour; hour <= windowEndHour && suggestions.length < 3; hour += 1) {
+    for (let hour = SUGGESTION_WINDOW_START_HOUR; hour <= SUGGESTION_WINDOW_END_HOUR && suggestions.length < SUGGESTION_COUNT; hour += 1) {
       const slot = new Date(baseDate.getFullYear(), baseDate.getMonth(), baseDate.getDate(), hour, 0, 0, 0);
       if (slot < minTime || slot > endWindow) continue;
       const cand = withRandomMinutes(slot);
@@ -1025,7 +1004,7 @@ class ThreadsDraftCraft {
     }
 
     // 4) If still short, find largest gaps between existing (taken + suggestions) within window and drop a time in the middle
-    if (suggestions.length < 3) {
+    if (suggestions.length < SUGGESTION_COUNT) {
       const pool = [...taken, ...suggestions].filter(t => t >= minTime && t <= endWindow).sort((a,b)=>a-b);
       // Add window bounds to compute gaps
       const bounds = [minTime, ...pool, endWindow];
@@ -1040,7 +1019,7 @@ class ThreadsDraftCraft {
       }
       gaps.sort((x,y)=>y.gapMs - x.gapMs);
       let gi = 0;
-      while (suggestions.length < 3 && gi < gaps.length) {
+      while (suggestions.length < SUGGESTION_COUNT && gi < gaps.length) {
         const {a, b} = gaps[gi++];
         const mid = new Date(a.getTime() + (b - a)/2);
         const cand = withRandomMinutes(mid);
@@ -1050,7 +1029,7 @@ class ThreadsDraftCraft {
 
     // Final safety: if we still don't have 3, place at deterministic offsets from minTime
     let offsetMin = 45;
-    while (suggestions.length < 3) {
+    while (suggestions.length < SUGGESTION_COUNT) {
       const cand = new Date(minTime.getTime() + offsetMin*60000);
       const c2 = withRandomMinutes(cand);
       if (!conflicts(c2, 30)) suggestions.push(c2);
@@ -1060,7 +1039,7 @@ class ThreadsDraftCraft {
     // Sort suggestions chronologically for display aesthetics
     suggestions.sort((a,b)=>a-b);
 
-    return suggestions.slice(0,3);
+    return suggestions.slice(0, SUGGESTION_COUNT);
   }
 
   formatTimeBadge(date) {
@@ -1095,19 +1074,26 @@ class ThreadsDraftCraft {
     this.drafts.forEach((d) => {
       const dt = d.scheduledTime instanceof Date ? d.scheduledTime : null;
       if (!dt) return;
-      const key = `${dt.getFullYear()}-${String(dt.getMonth() + 1).padStart(2, '0')}-${String(dt.getDate()).padStart(2, '0')}`;
+      const key = this.getDateKey(dt);
       dateCounts.set(key, (dateCounts.get(key) || 0) + 1);
     });
 
+    // Pre-compute scheduled times map once (not inside loop)
+    const scheduledMap = this.collectScheduledByDate();
+    const now = new Date();
+    const todayKey = this.getDateKey(now);
+    const tomorrow = new Date(now);
+    tomorrow.setDate(now.getDate() + 1);
+    const tomorrowKey = this.getDateKey(tomorrow);
+
     let lastDateKey = null;
 
     this.drafts.forEach((draft) => {
       const dt = draft.scheduledTime instanceof Date ? draft.scheduledTime : null;
-      if (!dt) return; // Only for scheduled items
+      if (!dt) return;
 
-      const key = `${dt.getFullYear()}-${String(dt.getMonth() + 1).padStart(2, '0')}-${String(dt.getDate()).padStart(2, '0')}`;
+      const key = this.getDateKey(dt);
       if (key !== lastDateKey) {
-        // Create divider element
         const divider = document.createElement('div');
         divider.className = 'threads-draftcraft-date-divider';
 
@@ -1120,30 +1106,20 @@ class ThreadsDraftCraft {
         try {
           formattedDate = dt.toLocaleDateString(undefined, { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' });
         } catch (e) {
-          formattedDate = `${dt.getFullYear()}-${String(dt.getMonth() + 1).padStart(2, '0')}-${String(dt.getDate()).padStart(2, '0')}`;
+          formattedDate = key;
         }
-        const now = new Date();
-        const todayKey = `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, '0')}-${String(now.getDate()).padStart(2, '0')}`;
-        const tomorrow = new Date(now);
-        tomorrow.setDate(now.getDate() + 1);
-        const tomorrowKey = `${tomorrow.getFullYear()}-${String(tomorrow.getMonth() + 1).padStart(2, '0')}-${String(tomorrow.getDate()).padStart(2, '0')}`;
         let prefix = '';
-        if (key === todayKey) {
-          prefix = 'Today';
-        } else if (key === tomorrowKey) {
-          prefix = 'Tomorrow';
-        }
+        if (key === todayKey) prefix = 'Today';
+        else if (key === tomorrowKey) prefix = 'Tomorrow';
         label.textContent = prefix ? `${prefix}, ${formattedDate}` : formattedDate;
 
-        // Suggestions badges container
         const suggestionsWrap = document.createElement('div');
         suggestionsWrap.className = 'threads-draftcraft-date-suggestions';
 
-        // Create count badge
         const count = dateCounts.get(key) || 0;
         const countEl = document.createElement('span');
         countEl.className = 'threads-draftcraft-date-count';
-        countEl.textContent = `${count}`;
+        countEl.textContent = String(count);
         countEl.setAttribute('aria-label', `${count} scheduled ${count === 1 ? 'post' : 'posts'} on ${label.textContent}`);
 
         header.appendChild(label);
@@ -1153,24 +1129,20 @@ class ThreadsDraftCraft {
         const line = document.createElement('div');
         line.className = 'threads-draftcraft-date-line';
 
-        // Generate suggestions and render badges
-        const scheduledMap = this.collectScheduledByDate();
+        // Generate suggestions using pre-computed map
         const existingTimes = scheduledMap.get(key) || [];
         const sugDates = this.generateSuggestionsForDate(dt, existingTimes);
-        if (sugDates.length > 0) {
-          sugDates.forEach(sdate => {
-            const b = document.createElement('span');
-            b.className = 'threads-draftcraft-date-suggestion';
-            b.textContent = this.formatTimeBadge(sdate);
-            b.setAttribute('data-threads-draftcraft-suggestion', sdate.toISOString());
-            suggestionsWrap.appendChild(b);
-          });
-        }
+        sugDates.forEach(sdate => {
+          const b = document.createElement('span');
+          b.className = 'threads-draftcraft-date-suggestion';
+          b.textContent = this.formatTimeBadge(sdate);
+          b.setAttribute('data-threads-draftcraft-suggestion', sdate.toISOString());
+          suggestionsWrap.appendChild(b);
+        });
 
         divider.appendChild(header);
         divider.appendChild(line);
 
-        // Insert before the first draft of this date
         if (draft.element && draft.element.parentElement === container) {
           container.insertBefore(divider, draft.element);
         }
@@ -1238,16 +1210,8 @@ class ThreadsDraftCraft {
         // Create compact time info to integrate with posting text
         const timeInfo = document.createElement('span');
         timeInfo.className = 'threads-draftcraft-time-info';
-        timeInfo.style.cssText = `
-          margin-left: 6px;
-          color: #1DA1F2;
-          font-weight: 500;
-          background: rgba(29, 161, 242, 0.1);
-          padding: 0 6px;
-          border-radius: 4px;
-          display: inline-block;
-        `;
-        timeInfo.textContent = `${draft.scheduledTimeStr}`;
+        timeInfo.textContent = escapeText(draft.scheduledTimeStr);
+        timeInfo.setAttribute('aria-label', `Scheduled ${draft.scheduledTimeStr}`);
 
         // Integrate the time info with the existing posting text
         postingTextNode.parentElement.appendChild(timeInfo);
@@ -1255,17 +1219,13 @@ class ThreadsDraftCraft {
         // Fallback: if no "Posting" text found, add a subtle indicator at the top
         const timeIndicator = document.createElement('div');
         timeIndicator.className = 'threads-draftcraft-time-subtle';
-        timeIndicator.innerHTML = `
-          <div style="
-            color: #1DA1F2;
-            font-size: 10px;
-            font-weight: 500;
-            margin: 2px 0;
-            opacity: 0.8;
-          ">
-            📅 ${draft.scheduledTimeStr}
-          </div>
-        `;
+        timeIndicator.setAttribute('aria-label', `Scheduled ${draft.scheduledTimeStr}`);
+
+        const innerDiv = document.createElement('div');
+        innerDiv.className = 'threads-draftcraft-time-subtle-inner';
+        innerDiv.textContent = escapeText(draft.scheduledTimeStr);
+        timeIndicator.appendChild(innerDiv);
+
         draft.element.insertBefore(timeIndicator, draft.element.firstChild);
       }
 
@@ -1303,25 +1263,15 @@ class ThreadsDraftCraft {
       return;
     }
 
-    // Create compact count badge to integrate into header (append to h1, not to inner span)
+    // Create compact count badge to integrate into header
     const countBadge = document.createElement('span');
     countBadge.className = 'threads-draftcraft-count-badge';
-    countBadge.innerHTML = `
-      <span style="
-        margin-left: 8px;
-        background: rgba(76, 175, 80, 0.15);
-        color: #4CAF50;
-        padding: 2px 6px;
-        border-radius: 10px;
-        font-size: 11px;
-        font-weight: 500;
-        display: inline-flex;
-        align-items: center;
-        gap: 2px;
-      ">
-        📊 ${this.drafts.length}
-      </span>
-    `;
+
+    const innerBadge = document.createElement('span');
+    innerBadge.className = 'threads-draftcraft-count-badge-inner';
+    innerBadge.textContent = this.drafts.length;
+    innerBadge.setAttribute('aria-label', `${this.drafts.length} drafts`);
+    countBadge.appendChild(innerBadge);
 
     // Integrate the count into the header container (sibling to h1)
     headerContainer.appendChild(countBadge);
@@ -1341,7 +1291,7 @@ class ThreadsDraftCraft {
 
     const next = scheduledDrafts[0];
     return {
-      content: next.content.substring(0, 50) + '...',
+      content: next.content.substring(0, NEXT_DRAFT_PREVIEW_LENGTH) + '...',
       timeStr: next.scheduledTimeStr
     };
   }
diff --git a/manifest.json b/manifest.json
index d0a2bc0..8538117 100644
--- a/manifest.json
+++ b/manifest.json
@@ -38,10 +38,5 @@
     "48": "icons/icon48.png",
     "128": "icons/icon128.png"
   },
-  "web_accessible_resources": [
-    {
-      "resources": ["content/*"],
-      "matches": ["https://*.threads.com/*"]
-    }
-  ]
+  "web_accessible_resources": []
 }
diff --git a/popup/popup.css b/popup/popup.css
index 4057047..bd9de36 100644
--- a/popup/popup.css
+++ b/popup/popup.css
@@ -516,6 +516,18 @@ input:checked + .toggle-switch:hover .toggle-slider {
   }
 }
 
+/* Info message */
+.info-message-content {
+  background: rgba(255, 193, 7, 0.1);
+  border: 1px solid rgba(255, 193, 7, 0.3);
+  color: #856404;
+  padding: 8px 12px;
+  border-radius: 4px;
+  margin: 8px 20px;
+  font-size: 12px;
+  text-align: center;
+}
+
 /* Scrollbar Styles */
 body::-webkit-scrollbar {
   width: 6px;
@@ -780,4 +792,10 @@ body::-webkit-scrollbar-thumb:hover {
   .next-draft-time {
     color: #ffffff !important;
   }
+
+  .info-message-content {
+    background: rgba(255, 193, 7, 0.15);
+    border-color: rgba(255, 193, 7, 0.4);
+    color: #ffc107;
+  }
 }
diff --git a/popup/popup.html b/popup/popup.html
index cc8d4f0..99d1218 100644
--- a/popup/popup.html
+++ b/popup/popup.html
@@ -18,15 +18,15 @@ <h1>Threads DraftCraft</h1>
 
 
     <!-- Draft Statistics -->
-    <div class="stats-section">
-        <h2>📊 Draft Statistics</h2>
+    <div class="stats-section" role="region" aria-label="Draft Statistics">
+        <h2>Draft Statistics</h2>
         <div class="stats-grid">
             <div class="stat-item">
-                <div class="stat-number" id="totalDrafts">-</div>
+                <div class="stat-number" id="totalDrafts" role="status" aria-label="Total drafts count">-</div>
                 <div class="stat-label">Total Drafts</div>
             </div>
             <div class="stat-item">
-                <div class="stat-number" id="scheduledDrafts">-</div>
+                <div class="stat-number" id="scheduledDrafts" role="status" aria-label="Scheduled drafts count">-</div>
                 <div class="stat-label">Scheduled</div>
             </div>
         </div>
@@ -44,15 +44,15 @@ <h2>📊 Draft Statistics</h2>
     </div>
 
     <!-- Settings -->
-    <div class="settings-section">
-        <h2>⚙️ Settings</h2>
+    <div class="settings-section" role="region" aria-label="Settings">
+        <h2>Settings</h2>
         
         <div class="setting-item">
             <div class="setting-info">
                 <div class="setting-label">Sort Order</div>
                 <div class="setting-description">How to sort scheduled drafts</div>
             </div>
-            <select id="sortOrder" class="setting-select">
+            <select id="sortOrder" class="setting-select" aria-label="Sort order">
                 <option value="earliest">Earliest First</option>
                 <option value="latest">Latest First</option>
             </select>
@@ -64,8 +64,8 @@ <h2>⚙️ Settings</h2>
                 <div class="setting-label">Show Time Indicators</div>
                 <div class="setting-description">Display scheduled time on each draft</div>
             </div>
-            <label class="toggle-switch">
-                <input type="checkbox" id="showTimeIndicators" checked>
+            <label class="toggle-switch" for="showTimeIndicators">
+                <input type="checkbox" id="showTimeIndicators" checked aria-label="Show time indicators">
                 <span class="toggle-slider"></span>
             </label>
         </div>
@@ -75,8 +75,8 @@ <h2>⚙️ Settings</h2>
                 <div class="setting-label">Show Date Line</div>
                 <div class="setting-description">Display a date label with per-day counter and a full-width line between days</div>
             </div>
-            <label class="toggle-switch">
-                <input type="checkbox" id="showDateDivider" checked>
+            <label class="toggle-switch" for="showDateDivider">
+                <input type="checkbox" id="showDateDivider" checked aria-label="Show date line">
                 <span class="toggle-slider"></span>
             </label>
         </div>
@@ -86,8 +86,8 @@ <h2>⚙️ Settings</h2>
                 <div class="setting-label">Show Draft Count</div>
                 <div class="setting-description">Display total number of drafts</div>
             </div>
-            <label class="toggle-switch">
-                <input type="checkbox" id="showDraftCount" checked>
+            <label class="toggle-switch" for="showDraftCount">
+                <input type="checkbox" id="showDraftCount" checked aria-label="Show draft count">
                 <span class="toggle-slider"></span>
             </label>
         </div>
@@ -97,8 +97,8 @@ <h2>⚙️ Settings</h2>
                 <div class="setting-label">Show Sort Indicator</div>
                 <div class="setting-description">Display sort order indicator in drafts header</div>
             </div>
-            <label class="toggle-switch">
-                <input type="checkbox" id="showSortIndicator" checked>
+            <label class="toggle-switch" for="showSortIndicator">
+                <input type="checkbox" id="showSortIndicator" checked aria-label="Show sort indicator">
                 <span class="toggle-slider"></span>
             </label>
         </div>
@@ -140,17 +140,17 @@ <h2>🔧 Actions</h2>
     </div>
 
     <!-- Error Message -->
-    <div class="error-message" id="errorMessage" style="display: none;">
-        <div class="error-icon">⚠️</div>
+    <div class="error-message" id="errorMessage" style="display: none;" role="alert" tabindex="-1">
+        <div class="error-icon" aria-hidden="true">!</div>
         <div class="error-text" id="errorText"></div>
-        <button class="error-close" id="errorClose">×</button>
+        <button class="error-close" id="errorClose" aria-label="Close error message">x</button>
     </div>
 
     <!-- Success Message -->
-    <div class="success-message" id="successMessage" style="display: none;">
-        <div class="success-icon">✅</div>
+    <div class="success-message" id="successMessage" style="display: none;" role="status" aria-live="polite">
+        <div class="success-icon" aria-hidden="true">OK</div>
         <div class="success-text" id="successText"></div>
-        <button class="success-close" id="successClose">×</button>
+        <button class="success-close" id="successClose" aria-label="Close success message">x</button>
     </div>
 
     <script src="popup.js"></script>
diff --git a/popup/popup.js b/popup/popup.js
index 2a00af2..1632ae3 100644
--- a/popup/popup.js
+++ b/popup/popup.js
@@ -21,7 +21,7 @@ class ThreadsDraftCraftPopup {
    * Initialize the popup
    */
   async init() {
-    console.log('[Threads DraftCraft] Popup initialized');
+    // Popup initialized
 
     // Load current settings
     await this.loadSettings();
@@ -55,7 +55,7 @@ class ThreadsDraftCraftPopup {
 
       this.settings = { ...this.settings, ...result };
     } catch (error) {
-      console.error('[Threads DraftCraft] Failed to load settings:', error);
+      // Settings load failed
       this.showError('Failed to load settings');
     }
   }
@@ -66,9 +66,9 @@ class ThreadsDraftCraftPopup {
   async saveSettings() {
     try {
       await chrome.storage.sync.set(this.settings);
-      console.log('[Threads DraftCraft] Settings saved:', this.settings);
+      // Settings saved
     } catch (error) {
-      console.error('[Threads DraftCraft] Failed to save settings:', error);
+      // Settings save failed
       this.showError('Failed to save settings');
     }
   }
@@ -241,7 +241,7 @@ class ThreadsDraftCraftPopup {
         this.showNoStatsMessage();
       }
     } catch (error) {
-      console.error('[Threads DraftCraft] Failed to load draft stats:', error);
+      // Draft stats load failed
       this.showNoStatsMessage();
     }
   }
@@ -261,7 +261,7 @@ class ThreadsDraftCraftPopup {
     }
 
     if (scheduledDrafts) {
-      scheduledDrafts.textContent = stats.totalDrafts || '0';
+      scheduledDrafts.textContent = stats.scheduledDrafts || stats.totalDrafts || '0';
     }
 
     if (stats.nextScheduled && nextScheduledContainer && nextDraftText && nextDraftTime) {
@@ -275,140 +275,58 @@ class ThreadsDraftCraftPopup {
 
 
   /**
-   * Handle sort order change
+   * Generic helper: send a message to the active threads.com tab
    */
-  async handleSortOrderChange(order) {
-    this.settings.sortOrder = order;
-    await this.saveSettings();
-
-    // Send message to content script
+  async _sendToActiveTab(message) {
     try {
       const [tab] = await chrome.tabs.query({ active: true, currentWindow: true });
       if (tab && tab.url.includes('threads.com')) {
-        await chrome.tabs.sendMessage(tab.id, {
-          action: 'changeSortOrder',
-          sortOrder: order
-        });
+        await chrome.tabs.sendMessage(tab.id, message);
       }
     } catch (error) {
-      console.error('[Threads DraftCraft] Failed to change sort order:', error);
+      // Tab might not have content script
     }
-
-    this.showSuccess(`Sort order changed to ${order} first`);
   }
 
   /**
-   * Handle auto sort toggle
+   * Generic toggle handler to reduce duplication
    */
-  async handleAutoSortToggle(enabled) {
-    this.settings.autoSort = enabled;
+  async _toggleSetting(settingKey, action, value, label) {
+    this.settings[settingKey] = value;
     await this.saveSettings();
-
-    // Send message to content script
-    try {
-      const [tab] = await chrome.tabs.query({ active: true, currentWindow: true });
-      if (tab && tab.url.includes('threads.com')) {
-        await chrome.tabs.sendMessage(tab.id, {
-          action: 'toggleAutoSort',
-          enabled: enabled
-        });
-      }
-    } catch (error) {
-      console.error('[Threads DraftCraft] Failed to toggle auto sort:', error);
+    await this._sendToActiveTab({ action, enabled: value });
+    if (typeof value === 'boolean') {
+      this.showSuccess(value ? `${label} enabled` : `${label} disabled`);
+    } else {
+      this.showSuccess(`${label} changed to ${value} first`);
     }
-
-    this.showSuccess(enabled ? 'Auto sort enabled' : 'Auto sort disabled');
   }
 
-  /**
-   * Handle time indicators toggle
-   */
-  async handleTimeIndicatorsToggle(enabled) {
-    this.settings.showTimeIndicators = enabled;
+  async handleSortOrderChange(order) {
+    this.settings.sortOrder = order;
     await this.saveSettings();
+    await this._sendToActiveTab({ action: 'changeSortOrder', sortOrder: order });
+    this.showSuccess(`Sort order changed to ${order} first`);
+  }
 
-    // Send message to content script
-    try {
-      const [tab] = await chrome.tabs.query({ active: true, currentWindow: true });
-      if (tab && tab.url.includes('threads.com')) {
-        await chrome.tabs.sendMessage(tab.id, {
-          action: 'toggleTimeIndicators',
-          enabled: enabled
-        });
-      }
-    } catch (error) {
-      console.error('[Threads DraftCraft] Failed to toggle time indicators:', error);
-    }
+  async handleAutoSortToggle(enabled) {
+    await this._toggleSetting('autoSort', 'toggleAutoSort', enabled, 'Auto sort');
+  }
 
-    this.showSuccess(enabled ? 'Time indicators enabled' : 'Time indicators disabled');
+  async handleTimeIndicatorsToggle(enabled) {
+    await this._toggleSetting('showTimeIndicators', 'toggleTimeIndicators', enabled, 'Time indicators');
   }
 
-  /**
-   * Handle draft count toggle
-   */
   async handleDraftCountToggle(enabled) {
-    this.settings.showDraftCount = enabled;
-    await this.saveSettings();
-
-    // Send message to content script
-    try {
-      const [tab] = await chrome.tabs.query({ active: true, currentWindow: true });
-      if (tab && tab.url.includes('threads.com')) {
-        await chrome.tabs.sendMessage(tab.id, {
-          action: 'toggleDraftCount',
-          enabled: enabled
-        });
-      }
-    } catch (error) {
-      console.error('[Threads DraftCraft] Failed to toggle draft count:', error);
-    }
-
-    this.showSuccess(enabled ? 'Draft count enabled' : 'Draft count disabled');
+    await this._toggleSetting('showDraftCount', 'toggleDraftCount', enabled, 'Draft count');
   }
 
-  /**
-   * Handle sort indicator toggle
-   */
   async handleSortIndicatorToggle(enabled) {
-    this.settings.showSortIndicator = enabled;
-    await this.saveSettings();
-
-    // Send message to content script
-    try {
-      const [tab] = await chrome.tabs.query({ active: true, currentWindow: true });
-      if (tab && tab.url.includes('threads.com')) {
-        await chrome.tabs.sendMessage(tab.id, {
-          action: 'toggleSortIndicator',
-          enabled: enabled
-        });
-      }
-    } catch (error) {
-      console.error('[Threads DraftCraft] Failed to toggle sort indicator:', error);
-    }
-
-    this.showSuccess(enabled ? 'Sort indicator enabled' : 'Sort indicator disabled');
+    await this._toggleSetting('showSortIndicator', 'toggleSortIndicator', enabled, 'Sort indicator');
   }
 
-  /**
-   * Handle date divider toggle
-   */
   async handleDateDividerToggle(enabled) {
-    this.settings.showDateDivider = enabled;
-    await this.saveSettings();
-
-    try {
-      const [tab] = await chrome.tabs.query({ active: true, currentWindow: true });
-      if (tab && tab.url.includes('threads.com')) {
-        await chrome.tabs.sendMessage(tab.id, {
-          action: 'toggleDateDivider',
-          enabled: enabled
-        });
-      }
-    } catch (error) {
-      console.error('[Threads DraftCraft] Failed to toggle date divider:', error);
-    }
-
-    this.showSuccess(enabled ? 'Date divider enabled' : 'Date divider disabled');
+    await this._toggleSetting('showDateDivider', 'toggleDateDivider', enabled, 'Date divider');
   }
 
   /**
@@ -429,7 +347,7 @@ class ThreadsDraftCraftPopup {
       await this.loadDraftStats();
       this.showSuccess('Drafts refreshed');
     } catch (error) {
-      console.error('[Threads DraftCraft] Failed to refresh drafts:', error);
+      // Refresh failed
       this.showError('Failed to refresh drafts');
     } finally {
       this.showLoading(false);
@@ -446,7 +364,7 @@ class ThreadsDraftCraftPopup {
       });
       window.close();
     } catch (error) {
-      console.error('[Threads DraftCraft] Failed to open Threads:', error);
+      // Open Threads failed
       this.showError('Failed to open Threads.com');
     }
   }
@@ -462,7 +380,7 @@ class ThreadsDraftCraftPopup {
         this.showThreadsNotActiveMessage();
       }
     } catch (error) {
-      console.error('[Threads DraftCraft] Failed to check tab:', error);
+      // Tab check failed
     }
   }
 
@@ -482,11 +400,12 @@ class ThreadsDraftCraftPopup {
   showError(message) {
     const errorMessage = document.getElementById('errorMessage');
     const errorText = document.getElementById('errorText');
-    
+
     if (errorMessage && errorText) {
       errorText.textContent = message;
       errorMessage.style.display = 'flex';
-      
+      errorMessage.focus();
+
       // Auto hide after 5 seconds
       setTimeout(() => {
         this.hideError();
@@ -510,11 +429,11 @@ class ThreadsDraftCraftPopup {
   showSuccess(message) {
     const successMessage = document.getElementById('successMessage');
     const successText = document.getElementById('successText');
-    
+
     if (successMessage && successText) {
       successText.textContent = message;
       successMessage.style.display = 'flex';
-      
+
       // Auto hide after 3 seconds
       setTimeout(() => {
         this.hideSuccess();
@@ -545,20 +464,10 @@ class ThreadsDraftCraftPopup {
     // Show info message
     const infoDiv = document.createElement('div');
     infoDiv.className = 'info-message';
-    infoDiv.innerHTML = `
-      <div style="
-        background: rgba(255, 193, 7, 0.1);
-        border: 1px solid rgba(255, 193, 7, 0.3);
-        color: #856404;
-        padding: 8px 12px;
-        border-radius: 4px;
-        margin: 8px 20px;
-        font-size: 12px;
-        text-align: center;
-      ">
-        📌 Navigate to Threads.com to see draft statistics
-      </div>
-    `;
+    const innerInfo = document.createElement('div');
+    innerInfo.className = 'info-message-content';
+    innerInfo.textContent = 'Navigate to Threads.com to see draft statistics';
+    infoDiv.appendChild(innerInfo);
 
     const statsSection = document.querySelector('.stats-section');
     if (statsSection && !document.querySelector('.info-message')) {