Show overdue styling on tasks in offline mode

renderTaskItem() never applied the "overdue" CSS class at all, so
overdue tasks in offline mode looked like any other task instead of
getting the red highlight/due-date treatment they get online. Adds
isTaskOverdue(), mirroring Task.is_overdue, applied the same way
_task_item.html does it.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

static/js/offline-tasks.js

@@ -114,9 +114,16 @@ function escapeHtml(str) {
     return div.innerHTML;
 }
 
+function isTaskOverdue(task) {
+    // Mirrors Task.is_overdue in tasks/models.py.
+    if (!task.due_date || task.status === 'completed' || task.status === 'cancelled') return false;
+    return task.due_date < todayLocalStr();
+}
+
 function renderTaskItem(task, tagsBySyncId) {
+    const overdue = isTaskOverdue(task);
     const item = document.createElement('div');
-    item.className = `task-item priority-${task.priority}${task.status === 'completed' ? ' completed' : ''}`;
+    item.className = `task-item priority-${task.priority}${overdue ? ' overdue' : ''}${task.status === 'completed' ? ' completed' : ''}`;
 
     const toggleForm = document.createElement('button');
     toggleForm.type = 'button';
@@ -140,13 +147,13 @@ function renderTaskItem(task, tagsBySyncId) {
 
     const metaParts = [];
     if (task.due_date) {
-        metaParts.push(`📅 ${formatDueDate(task.due_date)}`);
+        metaParts.push(`<span class="task-due${overdue ? ' overdue' : ''}">📅 ${formatDueDate(task.due_date)}</span>`);
     }
     const tagChips = renderTagChips(task, tagsBySyncId);
     if (metaParts.length || tagChips) {
         const meta = document.createElement('div');
         meta.className = 'task-meta';
-        meta.innerHTML = metaParts.map((p) => `<span>${p}</span>`).join(' ') + tagChips;
+        meta.innerHTML = metaParts.join(' ') + tagChips;
         content.appendChild(meta);
     }