feat: safety plan version history with diff view

- Each save pushes current plan to versioned history (max 20)
- History modal shows versions with timestamps
- Diff view highlights additions/deletions between versions
- One-click restore to any previous version
- Only saves versions when content actually changes

Fixes #96

index.html

@@ -739,6 +739,7 @@ html, body {
     </div>
     <div class="modal-footer">
       <button class="btn btn-secondary" id="cancel-safety-plan">Cancel</button>
+      <button class="btn btn-secondary" id="history-safety-plan" style="margin-right:auto;">History</button>
       <button class="btn btn-primary" id="save-safety-plan">Save Plan</button>
     </div>
   </div>
@@ -1202,6 +1203,7 @@ Sovereignty and service always.`;
       environment: document.getElementById('sp-environment').value
     };
     try {
+      _pushPlanVersion(plan);
       localStorage.setItem('timmy_safety_plan', JSON.stringify(plan));
       safetyPlanModal.classList.remove('active');
       _restoreSafetyPlanFocus();
@@ -1211,6 +1213,123 @@ Sovereignty and service always.`;
     }
   });
 
+
+  // ===== SAFETY PLAN VERSION HISTORY =====
+  var MAX_HISTORY = 20;
+
+  function _getPlanHistory() {
+    try {
+      var raw = localStorage.getItem('timmy_safety_plan_history');
+      return raw ? JSON.parse(raw) : [];
+    } catch (e) { return []; }
+  }
+
+  function _pushPlanVersion(plan) {
+    var history = _getPlanHistory();
+    var last = history.length > 0 ? history[history.length - 1] : null;
+    // Only save if different from last version
+    if (last && JSON.stringify(last.plan) === JSON.stringify(plan)) return;
+    history.push({ ts: Date.now(), plan: plan });
+    if (history.length > MAX_HISTORY) history = history.slice(-MAX_HISTORY);
+    localStorage.setItem('timmy_safety_plan_history', JSON.stringify(history));
+  }
+
+  function _diffPlans(oldPlan, newPlan) {
+    var fields = ['warningSigns', 'coping', 'distraction', 'help', 'environment'];
+    var labels = { warningSigns: 'Warning signs', coping: 'Coping strategies', distraction: 'Distractions', help: 'People who can help', environment: 'Safe environment' };
+    var diffs = [];
+    fields.forEach(function(f) {
+      var oldVal = (oldPlan[f] || '').trim();
+      var newVal = (newPlan[f] || '').trim();
+      if (oldVal !== newVal) {
+        diffs.push({ field: labels[f], old: oldVal, _new: newVal });
+      }
+    });
+    return diffs;
+  }
+
+  var historyModal = null;
+
+  function _showHistoryModal() {
+    var history = _getPlanHistory();
+    if (history.length === 0) {
+      alert('No saved versions yet.');
+      return;
+    }
+
+    // Create modal if not exists
+    if (!historyModal) {
+      historyModal = document.createElement('div');
+      historyModal.id = 'sp-history-modal';
+      historyModal.className = 'modal-overlay';
+      historyModal.setAttribute('role', 'dialog');
+      historyModal.setAttribute('aria-modal', 'true');
+      historyModal.innerHTML = '<div class="modal-content" style="max-width:600px;max-height:80vh;overflow-y:auto;">' +
+        '<div class="modal-header"><h2>Safety Plan History</h2><button class="close-modal" id="close-sp-history" aria-label="Close">&times;</button></div>' +
+        '<div class="modal-body" id="sp-history-body"></div>' +
+        '</div>';
+      document.body.appendChild(historyModal);
+      document.getElementById('close-sp-history').addEventListener('click', function() {
+        historyModal.classList.remove('active');
+      });
+      historyModal.addEventListener('click', function(e) {
+        if (e.target === historyModal) historyModal.classList.remove('active');
+      });
+    }
+
+    var body = document.getElementById('sp-history-body');
+    var html = '';
+    for (var i = history.length - 1; i >= 0; i--) {
+      var entry = history[i];
+      var date = new Date(entry.ts);
+      var label = date.toLocaleDateString() + ' ' + date.toLocaleTimeString([], {hour:'2-digit', minute:'2-digit'});
+      var prev = i > 0 ? history[i - 1].plan : {};
+      var diffs = _diffPlans(prev, entry.plan);
+
+      html += '<div style="border:1px solid #30363d;border-radius:8px;padding:12px;margin-bottom:10px;">';
+      html += '<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;">';
+      html += '<strong style="color:#c9d1d9;">v' + (i + 1) + ' — ' + label + '</strong>';
+      html += '<button class="btn btn-secondary sp-restore-btn" data-idx="' + i + '" style="font-size:0.8rem;padding:4px 10px;">Restore</button>';
+      html += '</div>';
+
+      if (diffs.length === 0 && i === 0) {
+        html += '<span style="color:#8b949e;font-size:0.85rem;">Initial version</span>';
+      } else if (diffs.length === 0) {
+        html += '<span style="color:#8b949e;font-size:0.85rem;">No changes from previous</span>';
+      } else {
+        diffs.forEach(function(d) {
+          html += '<div style="margin-bottom:6px;">';
+          html += '<div style="color:#8b949e;font-size:0.8rem;">' + d.field + '</div>';
+          if (d.old) html += '<div style="color:#f85149;font-size:0.85rem;text-decoration:line-through;">' + d.old.substring(0, 120) + '</div>';
+          if (d._new) html += '<div style="color:#3fb950;font-size:0.85rem;">' + d._new.substring(0, 120) + '</div>';
+          html += '</div>';
+        });
+      }
+      html += '</div>';
+    }
+    body.innerHTML = html;
+
+    // Wire restore buttons
+    body.querySelectorAll('.sp-restore-btn').forEach(function(btn) {
+      btn.addEventListener('click', function() {
+        var idx = parseInt(btn.dataset.idx);
+        var plan = history[idx].plan;
+        document.getElementById('sp-warning-signs').value = plan.warningSigns || '';
+        document.getElementById('sp-coping').value = plan.coping || '';
+        document.getElementById('sp-distraction').value = plan.distraction || '';
+        document.getElementById('sp-help').value = plan.help || '';
+        document.getElementById('sp-environment').value = plan.environment || '';
+        localStorage.setItem('timmy_safety_plan', JSON.stringify(plan));
+        historyModal.classList.remove('active');
+        alert('Restored version ' + (idx + 1) + '.');
+      });
+    });
+
+    historyModal.classList.add('active');
+  }
+
+  document.getElementById('history-safety-plan').addEventListener('click', _showHistoryModal);
+
   // ===== SAFETY PLAN FOCUS TRAP (fix #65) =====
   // Focusable elements inside the modal, in tab order
   var _spFocusableIds = [