docs(registry): add caption catalog pages and overflow protection

- Add 15 .mdx doc pages under docs/catalog/components/ for all caption styles
- Add "Captions" group as first section in the Catalog tab navigation
- Add canvas-based fitFontSize to 14 caption components to prevent text overflow
- Fix parallax-layers vertical clipping by repositioning the behind safe zone
- Re-render all 15 preview videos at high quality and upload to CDN

registry/components/caption-gradient-fill/demo.html

@@ -108,6 +108,19 @@
       (function () {
         window.__timelines = window.__timelines || {};
 
+        var _fitCanvas = document.createElement("canvas");
+        var _fitCtx = _fitCanvas.getContext("2d");
+        function fitFontSize(text, baseFontSize, fontWeight, fontFamily, maxWidth) {
+          var size = baseFontSize;
+          var minSize = Math.floor(baseFontSize * 0.45);
+          while (size > minSize) {
+            _fitCtx.font = fontWeight + " " + size + "px " + fontFamily;
+            if (_fitCtx.measureText(text).width <= maxWidth) return size;
+            size -= 2;
+          }
+          return minSize;
+        }
+
         var WORDS = [
           { text: "Every", start: 0.0, end: 0.3 },
           { text: "great", start: 0.3, end: 0.55 },
@@ -175,6 +188,8 @@
 
         GROUPS.forEach(function (g, gi) {
           var groupWords = WORDS.slice(g.wordStart, g.wordEnd + 1);
+          var groupText = groupWords.map(function (w) { return w.text; }).join(" ");
+          var fontSize = fitFontSize(groupText, 100, "900", "'Nunito', sans-serif", 1760);
           var grp = document.createElement("div");
           grp.className = "gr-group";
           grp.id = "gr-grp-" + gi;
@@ -185,7 +200,7 @@
             span.className = "gr-word";
             span.id = "gr-w-" + wi;
             span.textContent = w.text;
-            span.style.fontSize = "100px";
+            span.style.fontSize = fontSize + "px";
             var grad = KEYWORD_GRADS[wi] || GRADS[wi % 7];
             span.style.background = grad;
             span.style.webkitBackgroundClip = "text";