Integrate TDS v1.2 lt.* APIs throughout app

- app.js: replace raw fetch/escHtml/fmtRelTime with lt.api, lt.escHtml, lt.time.ago; modal open/close via lt.modal; add _toIso() for timestamp normalisation
- index.html: data-action="refresh", data-duration pills, lt.autoRefresh.start, remove local fmtRelTime
- suppressions.html: lt.api.post/delete, data-dur pill delegation
- base.html: user avatar with initials, admin badge, lt.keys.on('r') replaces manual keydown handler
- base.css: add dot-*, chip, row-state aliases so apps can use unprefixed class names

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

templates/base.html

@@ -102,7 +102,12 @@
     </div>
 
     <div class="lt-header-right">
-      <span class="lt-header-user">{{ user.name or user.username }}</span>
+      {% set _uname = user.name or user.username %}
+      <div class="lt-avatar" title="{{ _uname }}" aria-label="{{ _uname }}">{{ _uname[0] | upper }}</div>
+      <span class="lt-header-user">{{ _uname }}</span>
+      {% if user.groups and 'admin' in user.groups %}
+      <span class="lt-badge lt-badge-admin">admin</span>
+      {% endif %}
       <button type="button" class="lt-theme-btn" id="lt-theme-btn"
               aria-label="Toggle theme" title="Toggle light/dark mode">&#x2600;</button>
     </div>
@@ -206,12 +211,8 @@
       }
     });
 
-    // R key to refresh on dashboard
-    document.addEventListener('keydown', function(e) {
-      if (e.target.tagName === 'INPUT' || e.target.tagName === 'TEXTAREA' || e.target.isContentEditable) return;
-      if (e.key === 'r' || e.key === 'R') {
-        if (typeof refreshAll === 'function') { e.preventDefault(); refreshAll(); }
-      }
+    lt.keys.on('r', function() {
+      if (typeof refreshAll === 'function') refreshAll();
     });
   </script>