relmio 0.8.0 → 0.8.1

package/CHANGELOG.md

@@ -7,6 +7,17 @@ checks the registry separately after publication.
 
 ## Unreleased
 
+## [0.8.1] - 2026-08-26
+
+### Changed
+
+- Adopt the Gateway Android logo across the GitHub and npm READMEs, hosted
+  site, and local wizard, and stop publishing the retired Harbor Gate mark.
+- Refresh the Open Graph and social-preview card with the Gateway Android while
+  preserving the Relmio relay message and visual flow.
+- Add a prominent Legal warning against bypassing rate limits, restrictions, or
+  safeguards.
+
 ## [0.8.0] - 2026-08-26
 
 ### Added

package/README.md

@@ -1,3 +1,7 @@
+<p align="center">
+  <img src="https://cdn.jsdelivr.net/npm/relmio@latest/docs/images/brand/relmio-logo.png" alt="Relmio gateway android logo" width="180">
+</p>
+
 # Relmio
 
 This package starts Relmio's local setup wizard for a private n8n sidecar or a

package/docs/brand.md

@@ -8,18 +8,19 @@ private OpenAI-compatible OAuth sidecar for self-hosted n8n, while the product
 direction can grow to support other OpenAI-compatible clients and SDK-based
 applications.
 
-## Mark
+## Logo and icon
 
-![Relmio mark](images/brand/relmio-mark.svg)
+![Relmio gateway android logo](images/brand/relmio-logo.png)
 
-The **Harbor Gate** mark uses two distinct boundaries around an open passage.
-Its teal entry stands upright while the ink route bends outward, representing
-a local credential boundary and a controlled path for requests and responses.
-The silhouette stays recognizable at favicon size without provider branding.
+The **Gateway Android** turns Relmio's model relay into a friendly, minimal
+guide standing inside a protected passage. Its teal face represents the live
+AI connection, while the ivory arch depicts the local boundary through which
+requests are deliberately relayed. The two quiet eyes keep it recognizable at
+favicon size without borrowing another provider's branding.
 
-The abstract mark was developed from the checked-in generated concept source at
-[`images/brand/relmio-concept-source.png`](images/brand/relmio-concept-source.png)
-and redrawn as compact SVG geometry for reliable rendering at small sizes.
+The checked-in 512-pixel PNG is the canonical logo and icon asset. It was
+derived from the selected generated source, then resized once for consistent
+rendering across the README, hosted app, and local wizard.
 
 ## Colors
 
@@ -29,11 +30,11 @@ and redrawn as compact SVG geometry for reliable rendering at small sizes.
 | Midnight ink | `#12211f` | Secondary lane, text, high-contrast surfaces |
 | Signal tint | `#e7f3f0` | Quiet selected and informational surfaces |
 | Canvas | `#f4f2ed` | Warm application background |
+| Gateway moss | `#8fa58b` | Logo field and calm supporting brand surfaces |
 
-Use the two-color mark on light backgrounds. On a dark surface, place the
-unchanged mark on a white or canvas-colored tile with enough padding. Do not
-rotate, stretch, outline, add gradients, or recreate the mark with provider
-brand colors.
+Keep the logo square and preserve its built-in moss background on both light
+and dark surfaces. Do not crop, rotate, stretch, outline, recolor, or recreate
+the logo with provider brand colors.
 
 ## Compatibility names
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "relmio",
-  "version": "0.8.0",
+  "version": "0.8.1",
   "description": "Install private local OpenAI API and Codex endpoints with explicit provider credential boundaries, plus the existing isolated n8n sidecar.",
   "keywords": [
     "relmio",

package/src/ui/index.html

@@ -8,10 +8,7 @@
       content="Relmio connects compatible AI clients to a private ChatGPT/Codex OAuth sidecar, starting with self-hosted n8n."
     />
     <title>Relmio | n8n Setup</title>
-    <link
-      rel="icon"
-      href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='%23137c74' d='M7 8h19l31 24H41L26 20v10L7 17Z'/%3E%3Cpath fill='%2312211f' d='M7 47l19-13v10l15-12h16L26 56H7Z'/%3E%3C/svg%3E"
-    />
+    <link rel="icon" href="/relmio-icon.png" type="image/png" />
     <link rel="stylesheet" href="/styles.css" />
     <script src="/theme.js" type="module"></script>
     <script src="/app.js" type="module"></script>
@@ -21,15 +18,13 @@
 
     <header class="site-header">
       <div class="brand">
-        <svg
+        <img
           class="brand-mark"
-          viewBox="0 0 64 64"
-          aria-hidden="true"
-          focusable="false"
-        >
-          <path fill="#137c74" d="M7 8h19l31 24H41L26 20v10L7 17Z" />
-          <path fill="#12211f" d="M7 47l19-13v10l15-12h16L26 56H7Z" />
-        </svg>
+          src="/relmio-icon.png"
+          alt=""
+          width="28"
+          height="28"
+        />
         <span>Relmio</span>
       </div>
       <div class="header-actions">

package/src/ui/local.html

@@ -8,10 +8,7 @@
       content="Install a loopback-only Relmio endpoint for the OpenAI API or the official Codex App Server."
     />
     <title>Relmio | Local Endpoint Setup</title>
-    <link
-      rel="icon"
-      href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='%23137c74' d='M8 13 28 5v38c0 4-2 7-6 9L8 59Z'/%3E%3Cpath fill='%2312211f' d='M36 5l11 5c6 3 9 8 9 15v9c0 3 1 5 3 7l3 3c3 3 3 8 0 11s-8 3-11 0L40 44c-3-3-4-6-4-10Z'/%3E%3C/svg%3E"
-    />
+    <link rel="icon" href="/relmio-icon.png" type="image/png" />
     <link rel="stylesheet" href="/styles.css" />
     <link rel="stylesheet" href="/local.css" />
     <script src="/theme.js" type="module"></script>
@@ -22,15 +19,13 @@
 
     <header class="site-header">
       <div class="brand">
-        <svg
+        <img
           class="brand-mark"
-          viewBox="0 0 64 64"
-          aria-hidden="true"
-          focusable="false"
-        >
-          <path fill="#137c74" d="M8 13 28 5v38c0 4-2 7-6 9L8 59Z" />
-          <path fill="#12211f" d="M36 5l11 5c6 3 9 8 9 15v9c0 3 1 5 3 7l3 3c3 3 3 8 0 11s-8 3-11 0L40 44c-3-3-4-6-4-10Z" />
-        </svg>
+          src="/relmio-icon.png"
+          alt=""
+          width="28"
+          height="28"
+        />
         <span>Relmio</span>
       </div>
       <div class="header-actions">

package/src/ui/styles.css

@@ -1126,15 +1126,11 @@ footer p {
 /* ---------- Dark mode refinement ---------- */
 
 :root[data-theme="dark"] .brand-mark {
-  padding: 0.125rem;
-  background: #f7f8f5;
   box-shadow: 0 0 0 1px rgb(255 255 255 / 14%);
 }
 
 @media (prefers-color-scheme: dark) {
   :root:not([data-theme]) .brand-mark {
-    padding: 0.125rem;
-    background: #f7f8f5;
     box-shadow: 0 0 0 1px rgb(255 255 255 / 14%);
   }
 }

package/src/web/server.js

@@ -363,6 +363,7 @@ async function loadDefaultUiFiles() {
     readFile(new URL("../ui/icons/monitor.svg", import.meta.url), "utf8"),
     readFile(new URL("../ui/icons/sun.svg", import.meta.url), "utf8"),
     readFile(new URL("../ui/icons/moon.svg", import.meta.url), "utf8"),
+    readFile(new URL("../ui/relmio-icon.png", import.meta.url)),
   ]);
 
   return {
@@ -378,6 +379,7 @@ async function loadDefaultUiFiles() {
     "/icons/monitor.svg": files[9],
     "/icons/sun.svg": files[10],
     "/icons/moon.svg": files[11],
+    "/relmio-icon.png": files[12],
   };
 }
 
@@ -1241,9 +1243,11 @@ function createRequestHandler(state) {
           ? "text/javascript; charset=utf-8"
           : path.endsWith(".svg")
             ? "image/svg+xml; charset=utf-8"
-            : path.endsWith(".css")
-              ? "text/css; charset=utf-8"
-              : "text/html; charset=utf-8";
+            : path.endsWith(".png")
+              ? "image/png"
+              : path.endsWith(".css")
+                ? "text/css; charset=utf-8"
+                : "text/html; charset=utf-8";
       const contents = state.uiFiles[path];
       response.writeHead(200, {
         "Content-Type": contentType,

package/docs/images/brand/relmio-mark.svg

@@ -1,10 +0,0 @@
-<svg
-  xmlns="http://www.w3.org/2000/svg"
-  viewBox="0 0 64 64"
-  role="img"
-  aria-labelledby="relmio-mark-title"
->
-  <title id="relmio-mark-title">Relmio mark</title>
-  <path fill="#137c74" d="M8 13 28 5v38c0 4-2 7-6 9L8 59Z" />
-  <path fill="#12211f" d="M36 5l11 5c6 3 9 8 9 15v9c0 3 1 5 3 7l3 3c3 3 3 8 0 11s-8 3-11 0L40 44c-3-3-4-6-4-10Z" />
-</svg>