From 22719be3c8ba2420bcc2323ce83be8e6dd1c7b3f Mon Sep 17 00:00:00 2001
From: artheru <artheru@gmail.com>
Date: Wed, 10 Jun 2026 07:53:23 +0800
Subject: [PATCH] =?UTF-8?q?discoverability:=20version=E2=86=92changelog,?=
 =?UTF-8?q?=20status=20pill=E2=86=92status=20(0.54.0)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- topbar version (vX.Y.Z) is now a button linking to the changelog — the
  natural 'what's new' entry point (moved out of the logo button)
- footer 'All systems operational' pill now links to the status page, with
  a hover lift
- both new utility pages are now reachable from natural entry points
- also audited the full home page on mobile (390px): hero CTAs wrap, flow
  diagram stacks vertically, session preview stacks, live screen renders,
  and zero horizontal overflow — no regressions from recent additions
- verified live: both links route correctly
---
 index.html      | 2 +-
 package.json    | 2 +-
 src/Scene2D.jsx | 9 +++++----
 src/styles.css  | 6 ++++++
 4 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/index.html b/index.html
index 0c703a9..734fa7f 100644
--- a/index.html
+++ b/index.html
@@ -4,7 +4,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <meta name="theme-color" content="#0e0a14" />
     <meta name="description" content="amerc is the agent mercenary tavern — hire, run, publish, and remotely deliver AI agents across software boundaries. No infrastructure, just skills." />
-    <meta name="version" content="0.53.0-livescreen" />
+    <meta name="version" content="0.54.0-discover" />
     <link rel="icon" href="/favicon.svg" type="image/svg+xml" />
     <link rel="icon" href="/app-192.png" type="image/png" sizes="192x192" />
     <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
diff --git a/package.json b/package.json
index 0edbd9e..836cb1d 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "amerc-site",
-  "version": "0.53.0-livescreen",
+  "version": "0.54.0-discover",
   "private": true,
   "type": "module",
   "scripts": {
diff --git a/src/Scene2D.jsx b/src/Scene2D.jsx
index fec6328..828c29d 100644
--- a/src/Scene2D.jsx
+++ b/src/Scene2D.jsx
@@ -7,7 +7,7 @@ import Account from './Account.jsx';
 import TavernGame from './TavernGame.jsx';
 import { api } from './api.js';
 
-const RELEASE = '0.53.0-livescreen';
+const RELEASE = '0.54.0-discover';
 
 const NAV = [
   { id: 'home', label: 'Tavern' },
@@ -61,8 +61,9 @@ function PixelTopbar({ route, setRoute, auth }) {
   return (
     <header className="px-topbar">
       <button className="px-logo" onClick={() => go('home')} type="button" aria-label="amerc home">
-        <span className="px-logo-gem" aria-hidden="true" /><strong>amerc</strong><small>agent mercenary tavern</small><em>v{RELEASE}</em>
+        <span className="px-logo-gem" aria-hidden="true" /><strong>amerc</strong><small>agent mercenary tavern</small>
       </button>
+      <button className="px-ver" onClick={() => go('changelog')} type="button" title="What's new — changelog">v{RELEASE}</button>
       <nav className="px-nav" aria-label="Primary">{nav}</nav>
       <button className="px-menu" onClick={() => setOpen((v) => !v)} type="button" aria-label="Toggle menu">{open ? <X size={20} /> : <Menu size={20} />}</button>
       {open && <div className="px-mobile">{nav}</div>}
@@ -262,9 +263,9 @@ function Footer({ setRoute }) {
         <div className="ft-brand">
           <div className="ft-logo"><span className="px-logo-gem" aria-hidden="true" /><strong>amerc</strong></div>
           <p>Hire, run, and deliver AI agents across software boundaries — no infrastructure, just skills.</p>
-          <span className={`ft-status${ok === false ? ' down' : ''}`}>
+          <button className={`ft-status${ok === false ? ' down' : ''}`} onClick={() => setRoute('status')} title="View system status">
             <i /> {ok === null ? 'checking…' : ok ? 'All systems operational' : 'Service degraded'}{stats ? ` · ${stats.online} online · ${stats.sessions} live` : ''}
-          </span>
+          </button>
         </div>
         <div className="ft-col"><h5>Product</h5>
           <button onClick={() => setRoute('agents')}>Browse Agents</button>
diff --git a/src/styles.css b/src/styles.css
index 818ca24..75767c6 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -1387,3 +1387,9 @@ button {
 .cl-date { margin-left: auto; color: #7a6a98; font-size: 12px; }
 .cl-card ul { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 5px; }
 .cl-card li { color: #b6a7d4; font-size: 13px; line-height: 1.5; }
+
+/* clickable version pill + status pill (0.54) */
+.px-ver { font-family: inherit; font-size: 7px; color: #6f5736; background: none; border: 0; cursor: pointer; letter-spacing: 0.5px; padding: 2px 5px; align-self: center; transition: color .15s; white-space: nowrap; }
+.px-ver:hover { color: var(--cyan); }
+.ft-status { font-family: inherit; cursor: pointer; transition: border-color .15s, transform .15s; }
+.ft-status:hover { transform: translateY(-1px); border-color: rgba(54,240,176,0.6); }