hermes: use the user's own mark.webp as the icon, drop the SVG attempts

User-authored artwork wins. mark.webp is the main icon; two sibling variants
(mark-wings-both.webp, mark-variant.webp) ship alongside for brand uses.

- bundled-addons/hermes/addon.json: version 0.2.2, icon/panels[0].icon are
  now data:image/webp;base64,... from the main mark.
- bundled-addons/hermes/assets/mark.webp: served by the host via the panel
  page's relative path (seedBundledAddons' fs.cpSync recursive carries it).
- bundled-addons/hermes/panel.html: both top-bar and signin inline SVGs
  become <img src="assets/mark.webp"> at 24 and 72 px.
- site/hermes/index.html: hero SVG → <img> at 120 px.
- site/hermes/branding/{index.html,mark.webp,mark-wings-both.webp,mark-variant.webp}:
  branding kit now carries the three webp files; the inline hero SVG uses
  the main one.
- site-hermes-x/{index,branding,messenger}/index.html: same SVG → <img>
  swap with the appropriate assets/ relative path.
- site-hermes-x/assets/mark{,-wings-both,-variant}.webp: sibling of the
  existing favicon.svg and mark SVGs (kept for backward refs that still
  point at them).

Legacy mark.svg + mark-stroke.svg + favicon.svg stay in place for any
external references; nothing in-repo points at them for the primary icon
slots anymore. favicons still point at the SVG files — safe to leave;
flipping those to webp is a one-liner if you want it.

branding/index.html

@@ -44,7 +44,7 @@
 
 <nav class="topnav">
   <a class="brand" href="../">
-    <svg viewBox="0 0 64 64" aria-hidden="true"><g fill="none" stroke="currentColor" stroke-width="5" stroke-linecap="round" stroke-linejoin="round" transform="rotate(-20 32 32)"><rect x="18" y="24" width="34" height="22" rx="1.5"/><path d="M18 25 L35 39 L52 25"/><path d="M18 36 L-4 36"/></g></svg>
+    <img src="../assets/mark.webp" alt="Hermes" width="5" height="22" style="display:block">
     hermes<span class="x">.x</span>
   </a>
   <a href="../">Overview</a>
@@ -55,7 +55,7 @@
 
 <header class="hero">
   <div class="mark mark-xl" aria-hidden="true">
-    <svg viewBox="0 0 64 64"><g fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" transform="rotate(-20 32 32)"><rect x="18" y="24" width="34" height="22" rx="1.5"/><path d="M18 25 L35 39 L52 25"/><path d="M18 28 L-4 24"/><path d="M18 36 L-6 36"/><path d="M18 44 L0 46"/></g></svg>
+    <img src="../assets/mark.webp" alt="Hermes" width="3" height="22" style="display:block">
   </div>
   <h1>Brand kit</h1>
   <p class="tag">Mark, palette, name, voice. One page so client builds, add-on
@@ -83,19 +83,19 @@
 
   <div class="mark-row">
     <div class="cell">
-      <div class="mark-16"><svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><g fill="none" stroke="currentColor" stroke-width="5" stroke-linecap="round" stroke-linejoin="round" transform="rotate(-20 32 32)"><rect x="18" y="24" width="34" height="22" rx="1.5"/><path d="M18 25 L35 39 L52 25"/><path d="M18 36 L-4 36"/></g></svg></div>
+      <div class="mark-16"><img src="../assets/mark.webp" alt="Hermes" width="5" height="22" style="display:block"></div>
       <small>16 px — stroke variant (one trail)</small>
     </div>
     <div class="cell">
-      <div class="mark-32"><svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><g fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" transform="rotate(-20 32 32)"><rect x="18" y="24" width="34" height="22" rx="1.5"/><path d="M18 25 L35 39 L52 25"/><path d="M18 28 L-4 24"/><path d="M18 36 L-6 36"/><path d="M18 44 L0 46"/></g></svg></div>
+      <div class="mark-32"><img src="../assets/mark.webp" alt="Hermes" width="3" height="22" style="display:block"></div>
       <small>32 px — standard (3 tapered trails)</small>
     </div>
     <div class="cell">
-      <div class="mark-64"><svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><g fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" transform="rotate(-20 32 32)"><rect x="18" y="24" width="34" height="22" rx="1.5"/><path d="M18 25 L35 39 L52 25"/><path d="M18 28 L-4 24"/><path d="M18 36 L-6 36"/><path d="M18 44 L0 46"/></g></svg></div>
+      <div class="mark-64"><img src="../assets/mark.webp" alt="Hermes" width="3" height="22" style="display:block"></div>
       <small>64 px — in-panel</small>
     </div>
     <div class="cell">
-      <div class="mark-neg"><svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><g fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" transform="rotate(-20 32 32)"><rect x="18" y="24" width="34" height="22" rx="1.5"/><path d="M18 25 L35 39 L52 25"/><path d="M18 28 L-4 24"/><path d="M18 36 L-6 36"/><path d="M18 44 L0 46"/></g></svg></div>
+      <div class="mark-neg"><img src="../assets/mark.webp" alt="Hermes" width="3" height="22" style="display:block"></div>
       <small>on sky background</small>
     </div>
   </div>

index.html

@@ -22,7 +22,7 @@
 
 <nav class="topnav">
   <a class="brand" href="./">
-    <svg viewBox="0 0 64 64" aria-hidden="true"><g fill="none" stroke="currentColor" stroke-width="5" stroke-linecap="round" stroke-linejoin="round" transform="rotate(-20 32 32)"><rect x="18" y="24" width="34" height="22" rx="1.5"/><path d="M18 25 L35 39 L52 25"/><path d="M18 36 L-4 36"/></g></svg>
+    <img src="assets/mark.webp" alt="Hermes" width="5" height="22" style="display:block">
     hermes<span class="x">.x</span>
   </a>
   <a href="./" class="here">Overview</a>
@@ -33,7 +33,7 @@
 
 <header class="hero">
   <div class="mark" aria-hidden="true">
-    <svg viewBox="0 0 64 64"><g fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" transform="rotate(-20 32 32)"><rect x="18" y="24" width="34" height="22" rx="1.5"/><path d="M18 25 L35 39 L52 25"/><path d="M18 28 L-4 24"/><path d="M18 36 L-6 36"/><path d="M18 44 L0 46"/></g></svg>
+    <img src="assets/mark.webp" alt="Hermes" width="3" height="22" style="display:block">
   </div>
   <h1>Message by name<span class="x">.</span></h1>
   <p class="tag">End-to-end encrypted DMs over Nostr, addressed by your

messenger/index.html

@@ -85,7 +85,7 @@
 
 <nav class="topnav">
   <a class="brand" href="../">
-    <svg viewBox="0 0 64 64" aria-hidden="true"><g fill="none" stroke="currentColor" stroke-width="5" stroke-linecap="round" stroke-linejoin="round" transform="rotate(-20 32 32)"><rect x="18" y="24" width="34" height="22" rx="1.5"/><path d="M18 25 L35 39 L52 25"/><path d="M18 36 L-4 36"/></g></svg>
+    <img src="../assets/mark.webp" alt="Hermes" width="5" height="22" style="display:block">
     hermes<span class="x">.x</span>
   </a>
   <a href="../">Overview</a>
@@ -96,7 +96,7 @@
 
 <header class="hero">
   <div class="mark" style="color:var(--sky); line-height:0; display:inline-flex" aria-hidden="true">
-    <svg viewBox="0 0 64 64" width="96" height="96"><g fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" transform="rotate(-20 32 32)"><rect x="18" y="24" width="34" height="22" rx="1.5"/><path d="M18 25 L35 39 L52 25"/><path d="M18 28 L-4 24"/><path d="M18 36 L-6 36"/><path d="M18 44 L0 46"/></g></svg>
+    <img src="../assets/mark.webp" alt="Hermes" width="96" height="96" style="display:block">
   </div>
   <h1>Messenger</h1>
   <p class="tag">Hermes in a browser tab — end-to-end encrypted DMs over Nostr,