Shorts = portrait-only reel; Watch videos = landscape; badge name in gold

- Videos now carry client-detected pixel dimensions (videoW/videoH) captured at
  campaign create (upload or direct link). serveVideo takes an orientation filter:
  Shorts reel (/shorts) serves portrait (height>width); the Watch videos tab
  serves landscape, including legacy/unknown-dimension videos so nothing is orphaned.
- shorts.js requests the portrait feed and has a client guard that skips any
  landscape video that slips through. Create form shows the detected orientation.
- Achievement badge share image: member name now renders in gold with a dark
  outline (was low-contrast dark ink) and sits centered on the ribbon.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

public/assets/shorts.js

@@ -3,7 +3,7 @@
 // then advance to the next. Reuses /api/my/videos + /api/my/videowatch.
 (function () {
   const $ = id => document.getElementById(id);
-  const st = { token: null, secs: 0, maxSeen: 0, credited: false, done: false };
+  const st = { token: null, secs: 0, maxSeen: 0, credited: false, done: false, skips: 0 };
   function j(url, body) {
     return fetch(url, body
       ? { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(body) }
@@ -13,7 +13,7 @@
     st.token = null; st.maxSeen = 0; st.credited = false; st.done = false;
     $('shOver').hidden = true; $('shCta').hidden = true; $('shNext').hidden = true;
     let r = null;
-    try { r = await j('/api/my/videos'); } catch (e) {}
+    try { r = await j('/api/my/videos?orientation=portrait'); } catch (e) {}
     if (!r || r.error) { $('shVideo').hidden = true; $('shMsg').hidden = false; $('shMsg').textContent = 'Sign in on the dashboard to watch shorts and earn.'; return; }
     $('shStat').textContent = 'today: ' + (r.status.count || 0) + ' / ' + r.status.cap;
     if (!r.ad) {
@@ -25,6 +25,13 @@
     const v = $('shVideo');
     $('shMsg').hidden = true; v.hidden = false;
     v.src = r.ad.videoUrl; v.currentTime = 0;
+    // safety net: this reel is portrait-only. If a landscape video slips through, skip to the next.
+    v.onloadedmetadata = () => {
+      if (v.videoWidth && v.videoHeight && v.videoWidth > v.videoHeight) {
+        if (st.skips++ < 4) { load(); return; }
+        v.hidden = true; $('shMsg').hidden = false; $('shMsg').textContent = 'No shorts in rotation right now. Check back soon.';
+      } else { st.skips = 0; }
+    };
     $('shTitle').textContent = r.ad.title || '';
     $('shCta').href = r.ad.ctaUrl; $('shCta').textContent = r.ad.ctaLabel || 'Learn more';
     $('shOver').hidden = false; $('shCta').hidden = false;