Add WhyRating Templates - brand identity system

Next.js app showcasing WhyRating brand guidelines with interactive
tabs for colors, typography, proportions, logos, voice, downloads,
and AI context. Includes email templates (headers, signatures, CTAs)
and presentation component.

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

whyrating-templates/public/assets/whymyrating-icon-dark-bg.svg

@@ -0,0 +1,48 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 120" width="120" height="120">
+  <!--
+    whymyrating.com Logo Icon - colorScheme="dark"
+    Use on dark backgrounds (#171717 or darker)
+    SVG is TRANSPARENT - no background baked in
+    Magnifier ring/handle: #1E293B (Dark Slate) + #475569 stroke (edge definition)
+    Lens interior: #FEF3C7 (Light Yellow - same hue as star)
+  -->
+  <defs>
+    <clipPath id="circleClip">
+      <circle cx="60" cy="62" r="21"/>
+    </clipPath>
+  </defs>
+
+  <!-- Star - Google Yellow #FBBC05 -->
+  <polygon
+    points="60,15 71.5,42 101,46 79.5,66 85,95 60,82 35,95 40.5,66 19,46 48.5,42"
+    fill="#FBBC05"
+    stroke="#FBBC05"
+    stroke-width="6"
+    stroke-linejoin="round"
+  />
+
+  <!-- Magnifying Glass - seamless handle and ring -->
+  <g>
+    <!-- 1. Handle outline (behind everything) -->
+    <line x1="83" y1="81" x2="95" y2="91" stroke="#475569" stroke-width="11" stroke-linecap="round"/>
+
+    <!-- 2. Magnifier ring with stroke -->
+    <circle cx="60" cy="62" r="27" fill="#1E293B" stroke="#475569" stroke-width="1.5"/>
+
+    <!-- 3. Handle fill (covers circle stroke where they meet) -->
+    <line x1="83" y1="81" x2="95" y2="91" stroke="#1E293B" stroke-width="9" stroke-linecap="round"/>
+
+    <!-- 4. Lens interior - Light Yellow -->
+    <circle cx="60" cy="62" r="21" fill="#FEF3C7"/>
+
+    <!-- 5. Growth Bars -->
+    <g clip-path="url(#circleClip)">
+      <rect x="42" y="58" width="11" height="35" rx="1.5" ry="1.5" fill="#86EFAC"/>
+      <rect x="55" y="51" width="11" height="42" rx="1.5" ry="1.5" fill="#22C55E"/>
+      <rect x="68" y="44" width="11" height="49" rx="1.5" ry="1.5" fill="#15803D"/>
+    </g>
+
+    <!-- 6. Bar Overflow -->
+    <rect x="68" y="44" width="11" height="18" rx="1.5" ry="1.5" fill="#15803D"/>
+  </g>
+</svg>