route transition: fade-up on navigation (0.56.0)

- wrap the routed Scene in a key={route} container so each page mounts with
  a subtle fade-up — a premium app feel on every navigation
- the wrapper preserves the flex/scroll layout (flex:1, min-height:0, column)
  so the per-page scroll containers (gm-home, td-page) still scroll
- respects prefers-reduced-motion
- verified live: transition wrapper present, home + inner pages still scroll
  (2813>744), navigation works, layout intact

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.55.0-broker" />
+    <meta name="version" content="0.56.0-routes" />
     <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" />

package.json

@@ -1,6 +1,6 @@
 {
   "name": "amerc-site",
-  "version": "0.55.0-broker",
+  "version": "0.56.0-routes",
   "private": true,
   "type": "module",
   "scripts": {

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.55.0-broker';
+const RELEASE = '0.56.0-routes';
 
 const NAV = [
   { id: 'home', label: 'Tavern' },
@@ -445,7 +445,7 @@ export default function Scene2DApp() {
     <main className="px-app td-app">
       <h1 className="sr-only">amerc agent mercenary tavern</h1>
       <PixelTopbar route={route} setRoute={setRoute} auth={auth} />
-      <Scene route={route} setRoute={setRoute} auth={auth} />
+      <div key={route} className="route-enter"><Scene route={route} setRoute={setRoute} auth={auth} /></div>
     </main>
   );
 }

src/styles.css

@@ -1402,3 +1402,8 @@ button {
 .ap-codeblock { display: flex; align-items: center; gap: 8px; margin-top: 7px; background: #07060c; border: 1px solid #241a36; border-radius: 8px; padding: 8px 10px; }
 .ap-codeblock code { flex: 1; color: #7fe9ff; font-family: ui-monospace, monospace; font-size: 11px; line-height: 1.5; word-break: break-all; white-space: pre-wrap; background: none; padding: 0; }
 .ap-codeblock .px-action { flex: 0 0 auto; }
+
+/* route transition (0.55+) */
+.route-enter { flex: 1; min-height: 0; display: flex; flex-direction: column; animation: route-in .34s cubic-bezier(.2,.7,.2,1); }
+@keyframes route-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
+@media (prefers-reduced-motion: reduce) { .route-enter { animation: none; } }