feat: Reachy Mini logo as app icon (PNG via Git LFS)

Use the downloaded morse.png (resized to 512px) as the icon everywhere:
favicon, host top-bar appIconUrl, HF catalog tile, and the in-app header brand
mark (replacing the 📡 emoji). Tracked via Git LFS since HF rejects plain
binary blobs. Removed the placeholder icon.svg.

.gitattributes

@@ -1,2 +1,3 @@
 *.mp3 filter=lfs diff=lfs merge=lfs -text
 *.wav filter=lfs diff=lfs merge=lfs -text
+*.png filter=lfs diff=lfs merge=lfs -text

index.html

@@ -6,7 +6,7 @@
 <title>Morse Code · Reachy Mini</title>
 <meta name="description" content="Talk to Reachy Mini in Morse code — antenna taps and beeps, decoded live through the mic." />
 <meta name="theme-color" content="#0d1117" />
-<link rel="icon" type="image/svg+xml" href="public/icon.svg" />
+<link rel="icon" type="image/png" href="public/icon.png" />
 <link rel="preconnect" href="https://fonts.googleapis.com" />
 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
 <link rel="preconnect" href="https://cdn.jsdelivr.net" crossorigin />

lib/version.js

@@ -1,3 +1,3 @@
 // Deployment version label, shown in Settings so you can verify which build
 // is actually loaded after a push. Format: "YYYY-MM-DD rN", bumped on push.
-export const APP_VERSION = "2026-06-02 r6 demo mode";
+export const APP_VERSION = "2026-06-02 r7 robot logo";

main.js

@@ -36,7 +36,7 @@ const isEmbed = params.get("embedded") === "1" || params.get("embed") === "1";
 if (!isEmbed) {
     mountHost({
         appName: "Morse Code",
-        appIconUrl: "public/icon.svg",
+        appIconUrl: "public/icon.png",
         appEmoji: "📡",
         // We capture the LAPTOP/PHONE mic via getUserMedia for decoding; we do
         // not need the robot's inbound audio track, so no enableMicrophone.
@@ -154,7 +154,10 @@ async function bootEmbed() {
         modeSeg.append(b);
     });
     const header = el("header.appbar", {}, [
-        el("div.brand", {}, [el("span.brand-logo", {}, "📡"), el("span.brand-name", {}, "Morse Code")]),
+        el("div.brand", {}, [
+            el("img.brand-logo-img", { src: "public/icon.png", alt: "" }),
+            el("span.brand-name", {}, "Morse Code"),
+        ]),
         modeSeg,
         el("button.icon-btn", { title: "Settings", onclick: openSettings }, "⚙️"),
     ]);

style.css

@@ -66,8 +66,9 @@ html, body {
     backdrop-filter: blur(12px);
     border-bottom: 1px solid var(--line);
 }
-.brand { display: flex; align-items: center; gap: 10px; font-weight: 800; font-size: 19px; letter-spacing: -0.02em; }
+.brand { display: flex; align-items: center; gap: 9px; font-weight: 800; font-size: 19px; letter-spacing: -0.02em; }
 .brand-logo { font-size: 22px; }
+.brand-logo-img { width: 30px; height: 30px; border-radius: 8px; object-fit: contain; display: block; }
 
 .icon-btn {
     appearance: none;