feat(card): clock (Melbourne)

public/views/cards/clock.js

@@ -1,2 +1,23 @@
-// temporary stub — filled in Task 5
+// public/views/cards/clock.js
-export default { id: 'clock', title: 'Clock', size: 's', mount() {}, start() {}, stop() {} };
+import { el, mount } from '../../dom.js';
+
+let body, timer;
+function fmt(tz) {
+  return new Intl.DateTimeFormat('en-AU', {
+    timeZone: tz, hour: '2-digit', minute: '2-digit', second: '2-digit', hour12: false
+  }).format(new Date());
+}
+function tick() {
+  if (!body) return;
+  mount(body,
+    el('div', { class: 'sv-row', style: { fontSize: '22px' } },
+      el('span', { style: { fontFamily: 'var(--font-mono)' } }, fmt('Australia/Melbourne'))),
+    el('div', { class: 'sv-row' }, el('span', { class: 'k' }, 'Melbourne'), el('span', {}, 'AEST/AEDT'))
+  );
+}
+export default {
+  id: 'clock', title: 'Clock', size: 's',
+  mount(el_) { body = el_; tick(); },
+  start() { timer = setInterval(tick, 1000); },
+  stop() { clearInterval(timer); body = null; }
+};