2026-07-18 07:40:07 +00:00
49 changed files with 389 additions and 119 deletions
--- a/.env.example
+++ b/.env.example
@@ -1,5 +1,7 @@
-# ─── UOMysticmoon — root environment (used by docker-compose) ───
+# ─── Runic Gateway — root environment (used by docker-compose) ───
 # Copy to .env and fill in. NEVER commit the real .env.
+# To run this as an existing branded instance (e.g. UOMysticmoon), see
+# .env.uomysticmoon.example for the exact BRAND_*/DB pinning to copy in.

 # Container image tag pulled by docker-compose (app + bot). Published by the
 # Gitea Actions workflow on every merge to main as `latest` and `sha-<7>`.
@@ -23,12 +25,32 @@ LOG_TO_FILE=true        # set false for console-only
 LOG_DIR=/app/logs       # log directory inside the container (bind-mounted to ./logs)
 LOG_FILE=app.log

+# ─── Branding (BRAND_*) ───────────────────────────────────────────────────
+# Instance identity. Defaults render as "Runic Gateway"; set these to rebrand
+# without a rebuild. Text + colors reach the SPA through the settings API at
+# runtime; the server templates index.html <title>/meta/OG/favicon at boot. The
+# admin-editable "site title" and "contact email" settings, if set, override
+# BRAND_NAME / BRAND_CONTACT_EMAIL.
+BRAND_NAME=Runic Gateway
+BRAND_SHORT_NAME=Runic Gateway
+BRAND_TAGLINE=an independent private Ultima Online shard
+BRAND_DESCRIPTION=Runic Gateway — an independent private Ultima Online shard. News, screenshots, guides, and community notes.
+BRAND_CONTACT_EMAIL=
+BRAND_URL=
+# Accent color — drives the web theme's --accent and the Discord embed color.
+BRAND_ACCENT_COLOR=#7f99bd
+# Image assets: paths under the /brand mount (see docker-compose.yml) or absolute
+# URLs. Blank = built-in defaults (hero falls back to a neutral built-in image).
+BRAND_LOGO=
+BRAND_HERO=
+BRAND_FAVICON=
+
 # Database (the values here are shared by the `db`, `app`, and `bot` containers —
 # the bot only ever touches its own tables: guild_config, mod_actions, warnings)
 DB_HOST=db
 DB_PORT=3306
-DB_NAME=uomysticmoon
-DB_USER=uomm
+DB_NAME=runic_gateway
+DB_USER=runic
 DB_PASSWORD=change-me-db-password
 DB_ROOT_PASSWORD=change-me-root-password

@@ -38,7 +60,8 @@ JWT_EXPIRES_IN=1d
 # auto = Secure cookie only when the request arrives over HTTPS (Pangolin).
 # Leave as auto so login works both via the LAN IP (HTTP) and the proxy (HTTPS).
 COOKIE_SECURE=auto
-COOKIE_NAME=uomm_token
+# Changing this on a live instance invalidates existing sessions (users re-login).
+COOKIE_NAME=rg_token

 # Reverse-proxy trust (req.ip / req.secure for rate limiting, backoff, bot-ban).
 # Path: client -> Pangolin -> newt agent "ptero" (separate VM) -> app. Pin this
@@ -51,8 +74,8 @@ TRUST_PROXY=1
 # request (to verify/refresh ptero's IP without redeploying). Noisy; keep off.
 DEBUG_TRUST_PROXY=0

-# Optional TOTP two-factor (opt-in per user).
-TOTP_ISSUER=UOMysticmoon
+# Optional TOTP two-factor (opt-in per user). Defaults to BRAND_NAME when unset.
+# TOTP_ISSUER=Runic Gateway
 TOTP_CHALLENGE_TTL=5m

 # First admin bootstrap — created only if no users exist yet.
--- a/.env.uomysticmoon.example
+++ b/.env.uomysticmoon.example
@@ -0,0 +1,30 @@
+# ─── UOMysticmoon instance — BRAND_* / identity overrides ───
+#
+# Runic Gateway's first "tenant". Copy these into the deploy .env (on top of
+# .env.example) to run RunicGateway/website as UOMysticmoon. This is the proof
+# that branding is data, not code: the same image renders as UOMysticmoon purely
+# from these vars.
+#
+# Only the values that differ from the Runic Gateway defaults are shown.
+
+# Identity
+BRAND_NAME=UOMysticmoon
+BRAND_SHORT_NAME=Mysticmoon
+BRAND_TAGLINE=an independent private Ultima Online shard
+BRAND_DESCRIPTION=UOMysticmoon — an independent private Ultima Online shard. News, screenshots, guides, and community notes.
+BRAND_CONTACT_EMAIL=UOMysticmoon@gmail.com
+# BRAND_URL=https://<your public url>
+
+# Visual — the existing UOM accent + hero image (baked into the image already).
+BRAND_ACCENT_COLOR=#7f99bd
+BRAND_HERO=/assets/img/uomysticmoon-main-hero.png
+
+# TOTP label (defaults to BRAND_NAME, so optional — shown for clarity).
+TOTP_ISSUER=UOMysticmoon
+
+# ── Infrastructure identifiers — PIN to the existing production values so the
+# ── app keeps talking to the same database and existing sessions stay valid.
+# ── (These are NOT branding; they must match what production already uses.)
+DB_NAME=uomysticmoon
+DB_USER=uomm
+COOKIE_NAME=uomm_token
--- a/README.md
+++ b/README.md
@@ -1,7 +1,10 @@
-# UOMysticmoon Website
+# Runic Gateway Website

-Public site, wiki, and protected admin panel for the **UOMysticmoon** private Ultima Online
-shard — a full-stack app in one repo:
+Public site, wiki, and protected admin panel for a private Ultima Online shard — a
+full-stack app in one repo. Branding is instance-configurable via `BRAND_*` (see
+[Branding](#branding)); **UOMysticmoon** is the first instance.
+
+A full-stack app in one repo:

 - **Backend** — Node.js + Express REST API (layered `router → controller → model → db`), MariaDB, a provider-agnostic session layer (JWT cookie for web, bearer tokens for mobile, pluggable SSO).
 - **Frontend** — React + Vite single-page app (public site, wiki, and the admin panel), dark "gothic" theme (Cinzel + Georgia).
@@ -133,14 +136,14 @@ to the backend, so the SPA stays same-origin (cookies work).
 **1. Start a MariaDB the backend can reach** (published on `localhost:3306`):

 ```bash
-docker run -d --name uomm-db -p 3306:3306 -e MARIADB_DATABASE=uomysticmoon -e MARIADB_USER=uomm -e MARIADB_PASSWORD=devpass -e MARIADB_ROOT_PASSWORD=rootpass mariadb:11
+docker run -d --name rg-db -p 3306:3306 -e MARIADB_DATABASE=runic_gateway -e MARIADB_USER=runic -e MARIADB_PASSWORD=devpass -e MARIADB_ROOT_PASSWORD=rootpass mariadb:11
 ```

 **2. Configure + start the backend** (terminal 1):

 ```bash
 cp server/.env.example server/.env
-# Set DB_HOST=127.0.0.1, DB_PORT=3306, DB_USER=uomm, DB_PASSWORD=devpass,
+# Set DB_HOST=127.0.0.1, DB_PORT=3306, DB_USER=runic, DB_PASSWORD=devpass,
 #     JWT_SECRET=<anything>, ADMIN_USERNAME=admin, ADMIN_PASSWORD=<your password>
 npm run install-server
 npm run server          # nodemon → http://localhost:3000
@@ -249,7 +252,7 @@ actually returns (`400` validation, `401`/`403` auth, `404`, `409` conflicts, `4

 **Authentication in the UI** — click **Authorize** and provide either:

- `cookieAuth` — the `uomm_token` session cookie (set automatically in the browser after
+- `cookieAuth` — the session cookie (name `rg_token`, configurable via `COOKIE_NAME`; set automatically in the browser after
  `POST /api/v1/auth/login`), or
 - `bearerAuth` — a mobile access token from `POST /api/v1/auth/mobile/login` (sent as
  `Authorization: Bearer <token>`).
@@ -348,19 +351,20 @@ Copy `.env.example` (Compose) or `server/.env.example` (local) and fill in. **`.
 | `PORT` | `3000` | server listens on `0.0.0.0:PORT` |
 | `UPLOAD_DIR` | `<server>/uploads` | where post images are written (`/app/uploads`, volume-mounted, in Compose) |
 | `DB_HOST` / `DB_PORT` | `db` / `3306` | `db` in Compose; `127.0.0.1` for local dev |
-| `DB_NAME` / `DB_USER` / `DB_PASSWORD` | `uomysticmoon` / `uomm` / — | app database credentials |
+| `DB_NAME` / `DB_USER` / `DB_PASSWORD` | `runic_gateway` / `runic` / — | app database credentials |
 | `DB_ROOT_PASSWORD` | — | MariaDB root (Compose only) |
 | `JWT_SECRET` | — | **required** — long random string; signs session, mobile, and SSO-flow tokens |
 | `JWT_EXPIRES_IN` | `1d` | web session token + cookie lifetime |
 | `COOKIE_SECURE` | `auto` | `auto` = Secure only over HTTPS (works on LAN HTTP + Pangolin HTTPS) |
-| `COOKIE_NAME` | `uomm_token` | |
+| `COOKIE_NAME` | `rg_token` | changing it on a live instance invalidates existing sessions |
+| `BRAND_*` | Runic Gateway | instance branding (name, tagline, colors, logo/hero/favicon) — see [Branding](#branding) |
 | `SECRET_ENC_KEY` | — | **required in prod** — key for AES-256-GCM encryption of stored OAuth client secrets. Dev falls back to a key derived from `JWT_SECRET` (with a warning) |
 | `APP_BASE_URL` | — | public base URL, used to build the SSO OAuth `redirect_uri` (`${APP_BASE_URL}/api/v1/auth/sso/:provider/callback`). Set in prod to match what you register with Google/Discord; if unset it is derived from the request (fine for local dev) |
 | `MOBILE_ACCESS_TTL` | `15m` | mobile bearer **access** token lifetime (short-lived) |
 | `MOBILE_REFRESH_TTL_DAYS` | `30` | mobile **refresh** token lifetime (long-lived, rotated on use) |
 | `TRUST_PROXY` | `1` | reverse-proxy trust for correct `req.ip` / `req.secure` (rate limiting, backoff, bot-ban). Pin to the proxy hop's LAN IP in prod. A blanket `true` is rejected (coerced to `1`) to block `X-Forwarded-For` spoofing |
 | `DEBUG_TRUST_PROXY` | `0` | `1` logs raw peer address + `X-Forwarded-For` + resolved `req.ip` per request (to verify/refresh the proxy IP). Noisy — leave off |
-| `TOTP_ISSUER` | `UOMysticmoon` | label shown in authenticator apps for optional per-user 2FA |
+| `TOTP_ISSUER` | `BRAND_NAME` | label shown in authenticator apps for optional per-user 2FA |
 | `TOTP_CHALLENGE_TTL` | `5m` | lifetime of the short-lived post-password "awaiting code" step |
 | `ADMIN_USERNAME` / `ADMIN_PASSWORD` | — | first-admin bootstrap (first boot only) |
 | _Email_ | — | configured in Admin → Settings → Email (Gmail OAuth2), not via env; recipient = `contact_email` setting |
@@ -372,6 +376,32 @@ Copy `.env.example` (Compose) or `server/.env.example` (local) and fill in. **`.

 ---

+## Branding
+
+Instance identity is data, not code — set via `BRAND_*` env vars, so one prebuilt
+image can run as any shard. With none set, everything renders as **Runic Gateway**.
+
+| Var | What |
+|---|---|
+| `BRAND_NAME` / `BRAND_SHORT_NAME` | display name (full / short-in-prose) |
+| `BRAND_TAGLINE` / `BRAND_DESCRIPTION` | tagline + meta/OG description |
+| `BRAND_CONTACT_EMAIL` / `BRAND_URL` | contact + canonical URL (for OG/absolute links) |
+| `BRAND_ACCENT_COLOR` | theme `--accent` (web) + Discord embed color |
+| `BRAND_LOGO` / `BRAND_HERO` / `BRAND_FAVICON` | image paths under the `/brand` mount, or absolute URLs |
+
+**How it flows:** text/colors reach the SPA at runtime through the public settings
+API (`SiteContext`), so no rebuild is needed; the server templates `index.html`
+`<title>`/meta/OG/favicon at boot; emails, TOTP issuer, and the Discord bot read
+`BRAND_*` directly. The admin-editable **site title** and **contact email**
+settings override `BRAND_NAME` / `BRAND_CONTACT_EMAIL` when set. Image assets are
+delivered from the `./brand` bind-mount (see `brand/README.md`).
+
+**UOMysticmoon** is the first instance — [`.env.uomysticmoon.example`](.env.uomysticmoon.example)
+holds the exact `BRAND_*` + infra (`DB_NAME`/`DB_USER`/`COOKIE_NAME`) pinning to
+run this repo as UOMysticmoon.
+
+---
+
 ## Security

 **Session & authorization**
--- a/bot/.env.example
+++ b/bot/.env.example
@@ -1,4 +1,4 @@
-# ─── UOMysticmoon Discord bot — local dev environment ───
+# ─── Runic Gateway Discord bot — local dev environment ───
 # Copy to bot/.env for running `npm run dev` outside Docker.
 # (In Docker, the root .env / docker-compose provides these instead.)
 #
@@ -40,6 +40,6 @@ SITE_PUBLIC_URL=http://localhost:3000/api/v1/public
 # etc.) directly. Point this at the same DB the server/ uses.
 DB_HOST=127.0.0.1
 DB_PORT=3306
-DB_NAME=uomysticmoon
-DB_USER=uomm
+DB_NAME=runic_gateway
+DB_USER=runic
 DB_PASSWORD=change-me-db-password
--- a/bot/package-lock.json
+++ b/bot/package-lock.json
@@ -1,11 +1,11 @@
 {
-  "name": "uomysticmoon-bot",
+  "name": "runic-gateway-bot",
  "version": "1.0.0",
  "lockfileVersion": 3,
  "requires": true,
  "packages": {
    "": {
-      "name": "uomysticmoon-bot",
+      "name": "runic-gateway-bot",
      "version": "1.0.0",
      "license": "ISC",
      "dependencies": {
--- a/bot/package.json
+++ b/bot/package.json
@@ -1,7 +1,7 @@
 {
-  "name": "uomysticmoon-bot",
+  "name": "runic-gateway-bot",
  "version": "1.0.0",
-  "description": "Discord bot for the UOMysticmoon community server",
+  "description": "Discord bot for the Runic Gateway community server",
  "private": true,
  "main": "src/server.js",
  "scripts": {
--- a/bot/src/brand.js
+++ b/bot/src/brand.js
@@ -0,0 +1,13 @@
+// Branding for the Discord bot. Mirrors the server's BRAND_* scheme so embeds and
+// logs carry the instance identity. Kept minimal — the bot only needs the name
+// and the accent color (as an int for discord.js embeds).
+require('dotenv').config()
+
+const name = process.env.BRAND_NAME || 'Runic Gateway'
+const accentHex = process.env.BRAND_ACCENT_COLOR || '#7f99bd'
+const accentInt = (() => {
+  const n = parseInt(String(accentHex).replace('#', ''), 16)
+  return Number.isNaN(n) ? 0x7f99bd : n
+})()
+
+module.exports = { name, accentHex, accentInt }
--- a/bot/src/db.js
+++ b/bot/src/db.js
@@ -12,7 +12,7 @@ const pool = mariadb.createPool({
  port: Number(process.env.DB_PORT) || 3306,
  user: process.env.DB_USER || 'root',
  password: process.env.DB_PASSWORD || '',
-  database: process.env.DB_NAME || 'uomysticmoon',
+  database: process.env.DB_NAME || 'runic_gateway',
  connectionLimit: 5,
  insertIdAsNumber: true,
  bigIntAsNumber: true,
--- a/bot/src/discord/commands/rolemenu.command.js
+++ b/bot/src/discord/commands/rolemenu.command.js
@@ -9,6 +9,7 @@ const {
 } = require('discord.js')

 const roleMenus = require('../../model/roleMenus')
+const brand = require('../../brand')

 // Capped at 5 roles per menu — a single Discord action row holds at most 5
 // buttons, and one row keeps this a single simple slash command instead of
@@ -62,7 +63,7 @@ module.exports = {
      return
    }

-    const embed = new EmbedBuilder().setTitle(title).setColor(0x6a8fc2)
+    const embed = new EmbedBuilder().setTitle(title).setColor(brand.accentInt)
    if (description) embed.setDescription(description)

    const row = new ActionRowBuilder().addComponents(
--- a/bot/src/discord/newsAnnounce.js
+++ b/bot/src/discord/newsAnnounce.js
@@ -4,6 +4,7 @@
 const { EmbedBuilder } = require('discord.js')

 const guildConfig = require('../model/guildConfig')
+const brand = require('../brand')
 const createLogger = require('../utils/logger')

 const log = createLogger('news')
@@ -15,7 +16,7 @@ async function postAnnounce(client, guildId, { title, excerpt, url, imageUrl })
  const channel = await client.channels.fetch(channelId)
  if (!channel || !channel.isTextBased()) throw new Error('Configured news channel is missing or not text-based.')

-  const embed = new EmbedBuilder().setColor(0x6a8fc2).setTitle(title).setURL(url)
+  const embed = new EmbedBuilder().setColor(brand.accentInt).setTitle(title).setURL(url)
  if (excerpt) embed.setDescription(excerpt)
  if (imageUrl) embed.setImage(imageUrl)

--- a/bot/src/internal/requireInternalKey.js
+++ b/bot/src/internal/requireInternalKey.js
@@ -1,4 +1,4 @@
-// Gate for the bot's /internal/* API. The only caller is the main UOMysticmoon
+// Gate for the bot's /internal/* API. The only caller is the main Runic Gateway
 // server, over the private compose network — never expose this route through
 // the public reverse proxy. Timing-safe compare so response time can't be used
 // to brute-force the shared secret one byte at a time.
--- a/bot/src/server.js
+++ b/bot/src/server.js
@@ -4,6 +4,7 @@ const app = require('./app')
 const bootstrap = require('./bootstrap')
 const createLogger = require('./utils/logger')
 const discordManager = require('./discord/discordManager')
+const brand = require('./brand')
 const pkg = require('../package.json')

 const log = createLogger('server')
@@ -11,7 +12,7 @@ const PORT = Number(process.env.PORT) || 4100
 const HOST = '0.0.0.0'

 async function start() {
-  log.info(`starting UOMysticmoon bot v${pkg.version}`, {
+  log.info(`starting ${brand.name} bot v${pkg.version}`, {
    node: process.version,
    logFile: createLogger.logFilePath || 'disabled (console only)',
  })
--- a/brand/README.md
+++ b/brand/README.md
@@ -0,0 +1,15 @@
+# Brand assets (per-instance)
+
+This directory is bind-mounted into the container at `/app/brand` (see
+`docker-compose.yml`). Drop instance branding images here and point the matching
+`BRAND_*` env vars at them, e.g.:
+
+```
+BRAND_LOGO=/brand/logo.png
+BRAND_HERO=/brand/hero.png
+BRAND_FAVICON=/brand/favicon.ico
+```
+
+Leave the vars blank to use the built-in defaults (the hero falls back to a
+neutral built-in image; no logo/favicon is injected). Nothing here is required
+for the app to run — it renders cleanly with an empty `brand/`.
--- a/client/index.html
+++ b/client/index.html
@@ -3,8 +3,8 @@
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <title>UOMysticmoon</title>
-    <meta name="description" content="UOMysticmoon — an independent private Ultima Online shard. News, screenshots, guides, and community notes." />
+    <title>Runic Gateway</title>
+    <meta name="description" content="Runic Gateway — an independent private Ultima Online shard. News, screenshots, guides, and community notes." />
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link href="https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700&display=swap" rel="stylesheet" />
--- a/client/package-lock.json
+++ b/client/package-lock.json
@@ -1,11 +1,11 @@
 {
-  "name": "uomysticmoon-client",
+  "name": "runic-gateway-client",
  "version": "1.0.0",
  "lockfileVersion": 3,
  "requires": true,
  "packages": {
    "": {
-      "name": "uomysticmoon-client",
+      "name": "runic-gateway-client",
      "version": "1.0.0",
      "dependencies": {
        "@tiptap/extension-image": "^2.27.2",
--- a/client/package.json
+++ b/client/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "uomysticmoon-client",
+  "name": "runic-gateway-client",
  "private": true,
  "version": "1.0.0",
  "type": "module",
--- a/client/src/components/SiteFooter.jsx
+++ b/client/src/components/SiteFooter.jsx
@@ -2,7 +2,7 @@ import { Link } from 'react-router-dom'
 import { useSite } from '../contexts/SiteContext.jsx'

 export default function SiteFooter() {
-  const { contactEmail } = useSite()
+  const { contactEmail, siteTitle } = useSite()
  return (
    <footer
      className="sans"
@@ -16,7 +16,7 @@ export default function SiteFooter() {
      }}
    >
      <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', gap: 6 }}>
-        <span>UOMysticmoon is an independent private shard project.</span>
+        <span>{siteTitle} is an independent private shard project.</span>
        <span style={{ color: 'var(--dim)', fontSize: '0.84rem' }}>
          <a href={`mailto:${contactEmail}`} style={{ color: 'var(--accent)', textDecoration: 'none' }}>
            {contactEmail}
--- a/client/src/components/SiteHeader.jsx
+++ b/client/src/components/SiteHeader.jsx
@@ -1,6 +1,7 @@
 import { Link, NavLink } from 'react-router-dom'
 import MoonDot from './MoonDot.jsx'
 import { useAuth } from '../contexts/AuthContext.jsx'
+import { useSite } from '../contexts/SiteContext.jsx'

 // One consistent top nav for the whole public site. Every page gets the same
 // main links plus an auth-aware entry on the right (Sign in / My Account / Admin).
@@ -27,6 +28,7 @@ const linkStyle = ({ isActive }) => ({

 export default function SiteHeader() {
  const { user, loading } = useAuth()
+  const { siteTitle } = useSite()

  // Where the auth entry points: staff → admin, player → portal, else sign in.
  const account =
@@ -57,7 +59,7 @@ export default function SiteHeader() {
          style={{ display: 'flex', alignItems: 'center', gap: 10, fontSize: '1.2rem', letterSpacing: '0.05em', color: 'var(--accent-bright)', textDecoration: 'none', fontWeight: 600 }}
        >
          <MoonDot />
-          UOMysticmoon
+          {siteTitle}
        </Link>
        <nav style={{ display: 'flex', flexWrap: 'wrap', gap: 8, alignItems: 'center' }}>
          {NAV.map((l) => (
--- a/client/src/contexts/SiteContext.jsx
+++ b/client/src/contexts/SiteContext.jsx
@@ -23,13 +23,24 @@ export function SiteProvider({ children }) {
    refresh()
  }, [refresh])

+  const brand = settings.brand || {}
+
+  // Apply the instance accent color to the CSS variable the theme is built on,
+  // so branding flows to every `var(--accent)` at runtime (no rebuild).
+  useEffect(() => {
+    if (brand.accent) document.documentElement.style.setProperty('--accent', brand.accent)
+  }, [brand.accent])
+
  const value = {
    settings,
    loading,
    refresh,
+    brand,
    mode: settings.site_mode || 'live',
-    siteTitle: settings.site_title || 'UOMysticmoon',
-    contactEmail: settings.contact_email || 'UOMysticmoon@gmail.com',
+    siteTitle: brand.name || settings.site_title || 'Runic Gateway',
+    siteShortName: brand.shortName || brand.name || settings.site_title || 'Runic Gateway',
+    contactEmail: brand.contactEmail || settings.contact_email || '',
+    heroImage: brand.hero || '/assets/img/hero-moon.png',
  }

  return <SiteContext.Provider value={value}>{children}</SiteContext.Provider>
--- a/client/src/lib/heroLayout.js
+++ b/client/src/lib/heroLayout.js
@@ -1,13 +1,20 @@
 // Shared hero-layout helpers used by the public portal and the admin editor.

-export const DEFAULT_HERO_IMAGE = '/assets/img/uomysticmoon-main-hero.png'
+// Neutral built-in default; the instance hero image (BRAND_HERO) overrides it at
+// runtime, threaded in as `defaultImage` by the portal.
+export const DEFAULT_HERO_IMAGE = '/assets/img/hero-moon.png'

-// The original hand-tuned multi-gradient hero background (used only for the
-// untouched default so the live page is byte-for-byte unchanged until edited).
-export const HERO_BG =
-  "linear-gradient(90deg,rgba(11,15,20,0.34) 0%,rgba(11,15,20,0.5) 36%,rgba(11,15,20,0.78) 62%,rgba(11,15,20,0.66) 100%),linear-gradient(180deg,rgba(11,15,20,0.08) 0%,rgba(11,15,20,0.72) 100%),url('" +
-  DEFAULT_HERO_IMAGE +
-  "')"
+// The original hand-tuned multi-gradient hero background over a given image
+// (used for the untouched default so the live page stays consistent until edited).
+export function heroBgStack(image) {
+  return (
+    "linear-gradient(90deg,rgba(11,15,20,0.34) 0%,rgba(11,15,20,0.5) 36%,rgba(11,15,20,0.78) 62%,rgba(11,15,20,0.66) 100%),linear-gradient(180deg,rgba(11,15,20,0.08) 0%,rgba(11,15,20,0.72) 100%),url('" +
+    (image || DEFAULT_HERO_IMAGE) +
+    "')"
+  )
+}
+
+export const HERO_BG = heroBgStack(DEFAULT_HERO_IMAGE)

 // Single-stop dark overlay driven by the editor's opacity slider.
 export function buildOverlay(opacity) {
@@ -16,12 +23,13 @@ export function buildOverlay(opacity) {

 // Background style for a layout. When `isDefault` and no custom image is set, use
 // the exact original gradient stack; otherwise compose the overlay over the image.
-export function heroBackground(layout, { isDefault = false } = {}) {
+export function heroBackground(layout, { isDefault = false, defaultImage } = {}) {
  const bg = layout.background || {}
+  const fallback = defaultImage || DEFAULT_HERO_IMAGE
  const backgroundImage =
    isDefault && !bg.image_url
-      ? HERO_BG
-      : `${buildOverlay(layout.overlay?.opacity ?? 0.72)}, url('${bg.image_url || DEFAULT_HERO_IMAGE}')`
+      ? heroBgStack(fallback)
+      : `${buildOverlay(layout.overlay?.opacity ?? 0.72)}, url('${bg.image_url || fallback}')`
  return {
    backgroundColor: 'var(--bg-deep)',
    backgroundImage,
@@ -44,7 +52,7 @@ export function parseLayout(str) {
 // The current hardcoded hero as a HeroLayout, so the page is unchanged until
 // staff publish their own. Font sizes use the existing clamp() strings so the
 // default stays responsive (editor-created text uses px).
-export function defaultLayout(teaser) {
+export function defaultLayout(teaser, name = 'Runic Gateway') {
  return {
    version: 1,
    background: { image_url: null, position_x: 'left', position_y: 'center', size: 'cover' },
@@ -62,7 +70,7 @@ export function defaultLayout(teaser) {
          width: 760,
          lines: [
            { text: 'Private shard project', tag: 'span', fontSize: '0.74rem', color: '#c2d2e6', weight: 700, letterSpacing: '0.22em', transform: 'uppercase', font: 'sans' },
-            { text: 'UOMysticmoon', tag: 'h1', fontSize: 'clamp(3rem,8.5vw,5.75rem)', color: 'var(--head)', weight: 600, letterSpacing: '0.02em', lineHeight: 1, font: 'display', marginTop: 14 },
+            { text: name, tag: 'h1', fontSize: 'clamp(3rem,8.5vw,5.75rem)', color: 'var(--head)', weight: 600, letterSpacing: '0.02em', lineHeight: 1, font: 'display', marginTop: 14 },
            { text: 'A private Ultima Online world in progress', tag: 'p', fontSize: '1.32rem', color: '#dbe2ea', italic: true, marginTop: 22 },
            { text: teaser, tag: 'div', html: true, fontSize: '1.06rem', color: '#c4cdd8', maxWidth: 600, marginTop: 22 },
          ],
--- a/client/src/routes/admin/AdminLayout.jsx
+++ b/client/src/routes/admin/AdminLayout.jsx
@@ -126,7 +126,7 @@ const navBtnBase = {

 export default function AdminLayout() {
  const { user, logout } = useAuth()
-  const { mode } = useSite()
+  const { mode, siteTitle } = useSite()
  const navigate = useNavigate()
  const location = useLocation()
  const title =
@@ -225,7 +225,7 @@ export default function AdminLayout() {
          <MoonDot />
          <div>
            <div className="display" style={{ fontSize: '1.02rem', color: 'var(--head)', letterSpacing: '0.03em' }}>
-              UOMysticmoon
+              {siteTitle}
            </div>
            <div className="sans" style={{ color: 'var(--dim)', fontSize: '0.66rem', letterSpacing: '0.14em', textTransform: 'uppercase' }}>
              Admin
--- a/client/src/routes/admin/AdminLogin.jsx
+++ b/client/src/routes/admin/AdminLogin.jsx
@@ -3,6 +3,7 @@ import { Link, useNavigate, useLocation } from 'react-router-dom'
 import MoonDot from '../../components/MoonDot.jsx'
 import ProviderIcon from '../../components/ProviderIcon.jsx'
 import { useAuth } from '../../contexts/AuthContext.jsx'
+import { useSite } from '../../contexts/SiteContext.jsx'
 import { api } from '../../api/client.js'

 // Friendly copy for the ?sso_error codes the SSO callback can redirect back with.
@@ -15,9 +16,6 @@ const SSO_ERRORS = {
  error: 'Could not complete sign-in. Please try again.',
 }

-const BG =
-  "linear-gradient(180deg,rgba(11,15,20,0.72),rgba(11,15,20,0.9)),url('/assets/img/uomysticmoon-main-hero.png')"
-
 // Hidden anti-bot field. Off-screen via CSS (NOT display:none/hidden, which bots
 // skip) so real users never fill it but naive scripted bots do. Name must match
 // the server's HONEYPOT_FIELD ('company').
@@ -33,6 +31,8 @@ const honeypotStyle = {

 export default function AdminLogin() {
  const { user, login, loginTotp, ssoLoginTotp } = useAuth()
+  const { siteTitle, heroImage } = useSite()
+  const BG = `linear-gradient(180deg,rgba(11,15,20,0.72),rgba(11,15,20,0.9)),url('${heroImage}')`
  const navigate = useNavigate()
  const location = useLocation()
  const dest = location.state?.from?.pathname || '/admin'
@@ -160,7 +160,7 @@ export default function AdminLogin() {
            <MoonDot size={15} glow={0.55} />
          </div>
          <h1 className="display" style={{ margin: 0, fontSize: '1.7rem', letterSpacing: '0.04em', color: 'var(--head)' }}>
-            UOMysticmoon
+            {siteTitle}
          </h1>
          <p className="sans" style={{ margin: '6px 0 0', color: '#9aa6b4', fontSize: '0.8rem', letterSpacing: '0.16em', textTransform: 'uppercase' }}>
            Admin Panel
--- a/client/src/routes/admin/views/EmailDelivery.jsx
+++ b/client/src/routes/admin/views/EmailDelivery.jsx
@@ -1,5 +1,6 @@
 import { useCallback, useEffect, useState } from 'react'
 import { api } from '../../../api/client.js'
+import { useSite } from '../../../contexts/SiteContext.jsx'

 // Email delivery panel (Gmail over OAuth2), rendered as a section on the Settings
 // page. Sending is authorized by an in-app "Connect Gmail" consent flow that
@@ -52,6 +53,7 @@ function StatusPanel({ config }) {
 }

 export default function EmailDelivery() {
+  const { siteTitle } = useSite()
  const [config, setConfig] = useState(null)
  const [error, setError] = useState('')
  const [senderName, setSenderName] = useState('')
@@ -213,7 +215,7 @@ export default function EmailDelivery() {
              onChange={(e) => setSenderName(e.target.value)}
              className="input"
              autoComplete="off"
-              placeholder="UOMysticmoon"
+              placeholder={siteTitle}
            />
          </label>

--- a/client/src/routes/player/PlayerPortalLayout.jsx
+++ b/client/src/routes/player/PlayerPortalLayout.jsx
@@ -1,6 +1,7 @@
 import { NavLink, Outlet, useNavigate, useLocation } from 'react-router-dom'
 import MoonDot from '../../components/MoonDot.jsx'
 import { useAuth } from '../../contexts/AuthContext.jsx'
+import { useSite } from '../../contexts/SiteContext.jsx'

 // Shared shell for the logged-in player portal. Uses the same sidebar shell as
 // Admin (icon nav, sticky content header, footer sign-out) so the two logged-in
@@ -55,6 +56,7 @@ const navBtnBase = {

 export default function PlayerPortalLayout() {
  const { user, logout } = useAuth()
+  const { siteTitle } = useSite()
  const navigate = useNavigate()
  const location = useLocation()
  const title =
@@ -84,7 +86,7 @@ export default function PlayerPortalLayout() {
          <MoonDot />
          <div>
            <div className="display" style={{ fontSize: '1.02rem', color: 'var(--head)', letterSpacing: '0.03em' }}>
-              UOMysticmoon
+              {siteTitle}
            </div>
            <div className="sans" style={{ color: 'var(--dim)', fontSize: '0.66rem', letterSpacing: '0.14em', textTransform: 'uppercase' }}>
              Player Portal
--- a/client/src/routes/player/PlayerShell.jsx
+++ b/client/src/routes/player/PlayerShell.jsx
@@ -1,12 +1,12 @@
 import { Link } from 'react-router-dom'
 import MoonDot from '../../components/MoonDot.jsx'
-
-const BG =
-  "linear-gradient(180deg,rgba(11,15,20,0.72),rgba(11,15,20,0.9)),url('/assets/img/uomysticmoon-main-hero.png')"
+import { useSite } from '../../contexts/SiteContext.jsx'

 // Centered card layout shared by the player login / register pages. `subtitle`
 // labels the card; `footer` is optional content under the card (e.g. cross-links).
 export default function PlayerShell({ subtitle, children, footer }) {
+  const { siteTitle, heroImage } = useSite()
+  const bg = `linear-gradient(180deg,rgba(11,15,20,0.72),rgba(11,15,20,0.9)),url('${heroImage}')`
  return (
    <main
      style={{
@@ -16,7 +16,7 @@ export default function PlayerShell({ subtitle, children, footer }) {
        padding: '40px 18px',
        overflow: 'hidden',
        backgroundColor: 'var(--bg-deep)',
-        backgroundImage: BG,
+        backgroundImage: bg,
        backgroundPosition: 'center',
        backgroundSize: 'cover',
      }}
@@ -27,7 +27,7 @@ export default function PlayerShell({ subtitle, children, footer }) {
            <MoonDot size={15} glow={0.55} />
          </div>
          <h1 className="display" style={{ margin: 0, fontSize: '1.7rem', letterSpacing: '0.04em', color: 'var(--head)' }}>
-            UOMysticmoon
+            {siteTitle}
          </h1>
          <p className="sans" style={{ margin: '6px 0 0', color: '#9aa6b4', fontSize: '0.8rem', letterSpacing: '0.16em', textTransform: 'uppercase' }}>
            {subtitle}
--- a/client/src/routes/public/About.jsx
+++ b/client/src/routes/public/About.jsx
@@ -3,14 +3,14 @@ import PageHeader from '../../components/PageHeader.jsx'
 import { useSite } from '../../contexts/SiteContext.jsx'

 export default function About() {
-  const { contactEmail } = useSite()
+  const { contactEmail, siteShortName } = useSite()
  return (
    <PublicLayout section="website">
      <div className="shell-narrow page-body">
-        <PageHeader eyebrow="About" title="About Mysticmoon" />
+        <PageHeader eyebrow="About" title={`About ${siteShortName}`} />
        <div className="prose">
          <p>
-            Mysticmoon is an independent, privately-run Ultima Online shard built by a small group of long-time players.
+            {siteShortName} is an independent, privately-run Ultima Online shard built by a small group of long-time players.
            It is not affiliated with or endorsed by the owners of Ultima Online — it is a labor of love for the old
            worlds and the friendships made in them.
          </p>
--- a/client/src/routes/public/Maintenance.jsx
+++ b/client/src/routes/public/Maintenance.jsx
@@ -2,14 +2,12 @@ import { Link } from 'react-router-dom'
 import MoonDot from '../../components/MoonDot.jsx'
 import { useSite } from '../../contexts/SiteContext.jsx'

-const HERO_BG =
-  "linear-gradient(180deg,rgba(11,15,20,0.55) 0%,rgba(11,15,20,0.74) 60%,rgba(11,15,20,0.92) 100%),url('/assets/img/uomysticmoon-main-hero.png')"
-
 export default function Maintenance() {
-  const { settings, contactEmail } = useSite()
+  const { settings, contactEmail, siteShortName, heroImage } = useSite()
+  const heroBg = `linear-gradient(180deg,rgba(11,15,20,0.55) 0%,rgba(11,15,20,0.74) 60%,rgba(11,15,20,0.92) 100%),url('${heroImage}')`
  const message =
    settings.maintenance_message ||
-    'Mysticmoon is in maintenance while we shape its towns, roads, and dungeons. The gates will open soon. Until then, follow along as the world wakes.'
+    `${siteShortName} is in maintenance while we shape its towns, roads, and dungeons. The gates will open soon. Until then, follow along as the world wakes.`

  return (
    <main
@@ -22,7 +20,7 @@ export default function Maintenance() {
        padding: '80px max(18px,calc((100% - 760px)/2))',
        overflow: 'hidden',
        backgroundColor: 'var(--bg-deep)',
-        backgroundImage: HERO_BG,
+        backgroundImage: heroBg,
        backgroundPosition: 'center',
        backgroundRepeat: 'no-repeat',
        backgroundSize: 'cover',
--- a/client/src/routes/public/News.jsx
+++ b/client/src/routes/public/News.jsx
@@ -4,9 +4,11 @@ import { Loading, ErrorState, EmptyState } from '../../components/PageState.jsx'
 import { useAsync } from '../../lib/useAsync.js'
 import { longDate } from '../../lib/format.js'
 import { api } from '../../api/client.js'
+import { useSite } from '../../contexts/SiteContext.jsx'

 export default function News() {
  const { loading, error, data } = useAsync(() => api.posts('news'))
+  const { siteShortName } = useSite()
  const posts = data || []

  return (
@@ -15,7 +17,7 @@ export default function News() {
        <PageHeader
          eyebrow="Development"
          title="News & Updates"
-          lead="Progress notes and announcements as Mysticmoon takes shape."
+          lead={`Progress notes and announcements as ${siteShortName} takes shape.`}
        />
        <section style={{ display: 'flex', flexDirection: 'column', gap: 20 }}>
          {loading && <Loading />}
--- a/client/src/routes/public/Portal.jsx
+++ b/client/src/routes/public/Portal.jsx
@@ -9,10 +9,10 @@ import { defaultLayout, parseLayout, heroBackground } from '../../lib/heroLayout
 const PREVIEW = typeof window !== 'undefined' && new URLSearchParams(window.location.search).get('preview') === '1'

 export default function Portal() {
-  const { settings } = useSite()
+  const { settings, siteShortName, siteTitle, heroImage } = useSite()
  const teaser =
    settings.homepage_teaser ||
-    'Mysticmoon is still being shaped beneath a midnight sky — a quiet preview for the news, screenshots, guides, and community notes to come as the world wakes.'
+    `${siteShortName} is still being shaped beneath a midnight sky — a quiet preview for the news, screenshots, guides, and community notes to come as the world wakes.`

  // Published layout (public). Falls back to the pre-populated default if missing,
  // malformed, the wrong version, or empty — so the hero is never blank.
@@ -34,9 +34,9 @@ export default function Portal() {
  }, [])

  const active = (PREVIEW && draft) || (published && published.elements.length ? published : null)
-  const layout = active || defaultLayout(teaser)
+  const layout = active || defaultLayout(teaser, siteTitle)
  const isDefault = !active
-  const bgStyle = heroBackground(layout, { isDefault })
+  const bgStyle = heroBackground(layout, { isDefault, defaultImage: heroImage })
  const elements = [...layout.elements].sort((a, b) => (a.z || 0) - (b.z || 0))

  return (
--- a/client/src/routes/public/Website.jsx
+++ b/client/src/routes/public/Website.jsx
@@ -1,24 +1,26 @@
 import { Link } from 'react-router-dom'
 import PublicLayout from '../../components/PublicLayout.jsx'
 import PageHeader from '../../components/PageHeader.jsx'
+import { useSite } from '../../contexts/SiteContext.jsx'

 const CARDS = [
  { kicker: 'Gallery', title: 'Gameplay Pictures', body: 'Screenshots from towns, dungeons, events, and daily life on the shard.', to: '/site/screenshots' },
  { kicker: 'Updates', title: 'Development News', body: 'Progress notes, shard milestones, and public announcements.', to: '/site/news' },
  { kicker: 'Community', title: 'Five on Friday', body: 'Weekly questions, small previews, and notes from the team.', to: '/site/five-on-friday' },
  { kicker: 'Long-form', title: 'Monthly Newsletter', body: 'Fuller summaries for players who want the whole picture.', to: '/site/newsletter' },
-  { kicker: 'Reference', title: 'Wiki', body: 'Guides and reference pages for the Mysticmoon world.', to: '/wiki' },
+  { kicker: 'Reference', title: 'Wiki', body: 'Guides and reference pages for the game world.', to: '/wiki' },
  { kicker: 'Live', title: 'Shard Status', body: 'Launch state, test windows, and known issues.', to: '/site/status' },
 ]

 export default function Website() {
+  const { siteShortName } = useSite()
  return (
    <PublicLayout section="website">
      <div className="shell page-body">
        <PageHeader
          center
          eyebrow="Public portal"
-          title="Mysticmoon Website"
+          title={`${siteShortName} Website`}
          lead="A home for gameplay pictures, development updates, community posts, monthly newsletters, and weekly Five on Friday notes."
        />
        <section className="grid-3">
--- a/client/src/routes/wiki/Wiki.jsx
+++ b/client/src/routes/wiki/Wiki.jsx
@@ -5,6 +5,7 @@ import PageHeader from '../../components/PageHeader.jsx'
 import { Loading, ErrorState, EmptyState } from '../../components/PageState.jsx'
 import { useAsync } from '../../lib/useAsync.js'
 import { api } from '../../api/client.js'
+import { useSite } from '../../contexts/SiteContext.jsx'

 function SearchBox({ initial, onSubmit }) {
  const [term, setTerm] = useState(initial || '')
@@ -61,6 +62,7 @@ function PageCard({ page }) {
 }

 export default function Wiki() {
+  const { siteShortName } = useSite()
  const [searchParams, setSearchParams] = useSearchParams()
  const activeCategory = searchParams.get('category')
  const activeTag = searchParams.get('tag')
@@ -92,7 +94,7 @@ export default function Wiki() {
        <PageHeader
          center
          eyebrow="Knowledge base"
-          title="Mysticmoon Wiki"
+          title={`${siteShortName} Wiki`}
          lead="A calm starting point for shard guides, the world and its lore, gameplay systems, and community rules."
        />
        <SearchBox initial={activeQ || ''} onSubmit={runSearch} />
--- a/client/src/styles/theme.css
+++ b/client/src/styles/theme.css
@@ -1,4 +1,4 @@
-/* ===== UOMysticmoon design tokens (from the Claude Design handoff) ===== */
+/* ===== Runic Gateway design tokens (from the Claude Design handoff) ===== */
 :root {
  --bg: #0e1318;
  --bg-deep: #0b0f14;
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -42,6 +42,11 @@ services:
      - uploads:/app/uploads
      # Bind-mount logs to the host so app.log is directly readable at ./logs/
      - ./logs:/app/logs
+      # Instance branding assets (logo/hero/favicon), served at /brand when
+      # BRAND_LOGO/HERO/FAVICON point there. Optional — defaults are baked into
+      # the image, so this mount only matters for custom brand images. Create
+      # ./brand/ on the host and drop assets in; read-only in the container.
+      - ./brand:/app/brand:ro
    # Only the PUBLIC API port (3000) is published. The internal server<->bot
    # port (INTERNAL_PORT, default 3001) is deliberately NOT listed here, so it
    # stays reachable only over the private compose network — Pangolin/the public
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
-  "name": "uomysticmoon-website",
+  "name": "runic-gateway-website",
  "version": "1.0.0",
-  "description": "UOMysticmoon — public site, wiki, and admin panel for a private Ultima Online shard",
+  "description": "Runic Gateway — public site, wiki, and admin panel for a private Ultima Online shard",
  "private": true,
  "scripts": {
    "install-server": "npm install --prefix server",
--- a/server/.env.example
+++ b/server/.env.example
@@ -1,4 +1,4 @@
-# ─── UOMysticmoon server — local dev environment ───
+# ─── Runic Gateway server — local dev environment ───
 # Copy to server/.env for running `npm run dev` outside Docker.
 # (In Docker, the root .env / docker-compose provides these instead.)

@@ -18,14 +18,14 @@ LOG_TO_FILE=true        # set false for console-only
 # Point at a local or Dockerized MariaDB
 DB_HOST=127.0.0.1
 DB_PORT=3306
-DB_NAME=uomysticmoon
-DB_USER=uomm
+DB_NAME=runic_gateway
+DB_USER=runic
 DB_PASSWORD=change-me-db-password

 JWT_SECRET=dev-only-change-me
 JWT_EXPIRES_IN=1d
 COOKIE_SECURE=auto
-COOKIE_NAME=uomm_token
+COOKIE_NAME=rg_token

 # Encryption key for secrets stored at rest (OAuth client secrets in auth_providers).
 # Any string — hashed to a 256-bit AES-GCM key. REQUIRED in production; in dev an
@@ -62,7 +62,8 @@ TRUST_PROXY=1
 DEBUG_TRUST_PROXY=0

 # Optional TOTP two-factor (opt-in per user).
-TOTP_ISSUER=UOMysticmoon
+# TOTP_ISSUER defaults to BRAND_NAME; BRAND_* live in the root .env (see root .env.example)
+TOTP_ISSUER=Runic Gateway
 # How long the "password verified, awaiting code" step stays valid.
 TOTP_CHALLENGE_TTL=5m

--- a/server/db/schema.sql
+++ b/server/db/schema.sql
@@ -1,4 +1,4 @@
-- UOMysticmoon database schema (MariaDB)
+-- Runic Gateway database schema (MariaDB)
 -- Run automatically by the MariaDB container (docker-entrypoint-initdb.d) on a
 -- fresh volume, and idempotently by ensureSchema() on every server boot.

--- a/server/db/seed.js
+++ b/server/db/seed.js
@@ -4,6 +4,7 @@ const settingsDb = require('../src/model/settings/settings.db')
 const wikiDb = require('../src/model/wiki/wiki.db')
 const users = require('../src/model/users/users.model')
 const { ensureSchema, close } = require('../src/utils/db')
+const brand = require('../src/config/brand')

 const log = require('../src/utils/logger')('seed')

@@ -13,20 +14,20 @@ const DEFAULT_SETTINGS = {
  site_mode_changed_at: '',
  site_mode_changed_by: '',
  maintenance_message:
-    'Mysticmoon is being shaped beneath a midnight sky. The site will return soon.',
+    `${brand.shortName} is being shaped beneath a midnight sky. The site will return soon.`,
  status_message: 'In progress.',
  homepage_teaser:
-    'Mysticmoon is still being shaped beneath a midnight sky. A quiet preview for ' +
+    `${brand.shortName} is still being shaped beneath a midnight sky. A quiet preview for ` +
    'future news, screenshots, guides, and community notes as the world comes online.',
-  contact_email: process.env.CONTACT_TO || 'UOMysticmoon@gmail.com',
-  site_title: 'UOMysticmoon',
+  contact_email: brand.contactEmail,
+  site_title: brand.name,
 }

 // Starter wiki sections (editable later via the admin panel).
 // [slug, title, description, sort_order]
 const WIKI_CATEGORIES = [
  ['guides', 'Guides', 'Getting started and how-to guides.', 10],
-  ['world', 'World & Lore', 'Regions, maps, and the story of Mysticmoon.', 20],
+  ['world', 'World & Lore', `Regions, maps, and the story of ${brand.shortName}.`, 20],
  ['gameplay', 'Systems & Gameplay', 'Mechanics, items, monsters, and crafting.', 30],
  ['community', 'Community & Rules', 'Player conduct and shard policies.', 40],
 ]
--- a/server/package-lock.json
+++ b/server/package-lock.json
@@ -1,11 +1,11 @@
 {
-  "name": "uomysticmoon-server",
+  "name": "runic-gateway-server",
  "version": "1.0.0",
  "lockfileVersion": 3,
  "requires": true,
  "packages": {
    "": {
-      "name": "uomysticmoon-server",
+      "name": "runic-gateway-server",
      "version": "1.0.0",
      "license": "ISC",
      "dependencies": {
--- a/server/package.json
+++ b/server/package.json
@@ -1,7 +1,7 @@
 {
-  "name": "uomysticmoon-server",
+  "name": "runic-gateway-server",
  "version": "1.0.0",
-  "description": "REST API for the UOMysticmoon website and admin panel",
+  "description": "REST API for the Runic Gateway website and admin panel",
  "main": "src/server.js",
  "scripts": {
    "start": "node src/server.js",
--- a/server/src/app.js
+++ b/server/src/app.js
@@ -10,6 +10,7 @@ require('dotenv').config()
 const swaggerUi = require('swagger-ui-express')

 const apiRouter = require('./router/api.router')
+const brand = require('./config/brand')
 const createLogger = require('./utils/logger')
 const { applyTrustProxy, trustProxyDebug } = require('./utils/trustProxy')
 const botScore = require('./middleware/botScore')
@@ -64,8 +65,41 @@ const SERVER_ROOT = path.join(__dirname, '..')
 const REPO_ROOT = path.join(SERVER_ROOT, '..')
 const UPLOAD_DIR = process.env.UPLOAD_DIR || path.join(SERVER_ROOT, 'uploads')
 const CLIENT_DIST = path.join(REPO_ROOT, 'client', 'dist')
+const BRAND_DIR = process.env.BRAND_DIR || path.join(REPO_ROOT, 'brand')
 fs.mkdirSync(UPLOAD_DIR, { recursive: true })

+// Escape user/brand text for safe interpolation into the HTML shell.
+const htmlEscape = (s) =>
+  String(s).replace(
+    /[&<>"']/g,
+    (c) => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' }[c]),
+  )
+
+// Template the built index.html <head> with instance branding (title, meta
+// description, Open Graph/Twitter, favicon). Done once at boot from BRAND_* env,
+// so the prebuilt SPA image serves per-instance metadata without a rebuild.
+function renderIndexHtml(html) {
+  const title = htmlEscape(brand.name)
+  const desc = htmlEscape(brand.description)
+  const tags = [
+    `<meta property="og:title" content="${title}" />`,
+    `<meta property="og:description" content="${desc}" />`,
+    '<meta property="og:type" content="website" />',
+    brand.url ? `<meta property="og:url" content="${htmlEscape(brand.url)}" />` : '',
+    brand.logo ? `<meta property="og:image" content="${htmlEscape(brand.logo)}" />` : '',
+    '<meta name="twitter:card" content="summary_large_image" />',
+    `<meta name="twitter:title" content="${title}" />`,
+    `<meta name="twitter:description" content="${desc}" />`,
+    brand.favicon ? `<link rel="icon" href="${htmlEscape(brand.favicon)}" />` : '',
+  ]
+    .filter(Boolean)
+    .join('\n    ')
+  return html
+    .replace(/<title>[\s\S]*?<\/title>/i, `<title>${title}</title>`)
+    .replace(/(<meta\s+name="description"\s+content=")[\s\S]*?("\s*\/?>)/i, `$1${desc}$2`)
+    .replace(/<\/head>/i, `    ${tags}\n  </head>`)
+}
+
 // Uploaded images — always served, even during maintenance. Force nosniff so a
 // stored file is never interpreted as anything other than its declared type
 // (defense in depth alongside helmet's global X-Content-Type-Options, and in
@@ -89,7 +123,7 @@ try {
    res.json(swaggerSpec)
  })
  app.use('/api/docs', swaggerUi.serve, swaggerUi.setup(swaggerSpec, {
-    customSiteTitle: 'UOMysticmoon API docs',
+    customSiteTitle: `${brand.name} API docs`,
    swaggerOptions: { persistAuthorization: true },
  }))
 } catch (err) {
@@ -112,15 +146,30 @@ app.use('/api', (req, res) => res.status(404).json({ message: 'Not found' }))
 // ── Client SPA ────────────────────────────────────────────────────────
 // Serve the built React app if present; otherwise show a placeholder so the
 // server is usable API-only before the frontend phase.
+// Brand assets (logo/hero/favicon) from a mounted directory, used when BRAND_*
+// paths point at /brand/*. Optional — the defaults live under the SPA's /assets,
+// so this only matters for a custom mount.
+if (fs.existsSync(BRAND_DIR)) {
+  app.use(
+    '/brand',
+    express.static(BRAND_DIR, {
+      setHeaders: (res) => res.set('X-Content-Type-Options', 'nosniff'),
+    }),
+  )
+}
+
 if (fs.existsSync(path.join(CLIENT_DIST, 'index.html'))) {
-  app.use(express.static(CLIENT_DIST))
-  app.get('*', (req, res) => res.sendFile(path.join(CLIENT_DIST, 'index.html')))
+  // Serve a branded copy of the index.html shell for every SPA route; assets keep
+  // their own cache-friendly static handler.
+  const indexHtml = renderIndexHtml(fs.readFileSync(path.join(CLIENT_DIST, 'index.html'), 'utf8'))
+  app.use(express.static(CLIENT_DIST, { index: false }))
+  app.get('*', (req, res) => res.type('html').send(indexHtml))
 } else {
  app.get('*', (req, res) =>
    res
      .type('html')
      .send(
-        '<h1>UOMysticmoon API</h1><p>The web client has not been built yet. ' +
+        `<h1>${htmlEscape(brand.name)} API</h1><p>The web client has not been built yet. ` +
          'The API is available under <code>/api/v1</code>.</p>',
      ),
  )
--- a/server/src/auth/token.js
+++ b/server/src/auth/token.js
@@ -14,7 +14,7 @@ require('dotenv').config()
 const log = require('../utils/logger')('auth')

 const JWT_EXPIRES_IN = process.env.JWT_EXPIRES_IN || '1d'
-const COOKIE_NAME = process.env.COOKIE_NAME || 'uomm_token'
+const COOKIE_NAME = process.env.COOKIE_NAME || 'rg_token'
 // Lifetime of the short-lived "password verified, awaiting TOTP" token.
 const TOTP_CHALLENGE_TTL = process.env.TOTP_CHALLENGE_TTL || '5m'

--- a/server/src/config/brand.js
+++ b/server/src/config/brand.js
@@ -0,0 +1,46 @@
+// ── Branding (BRAND_*) ─────────────────────────────────────────────────────
+//
+// Single source of instance branding. Reads BRAND_* env vars once at startup,
+// with Runic Gateway defaults, so any instance substitutes its own identity
+// without a rebuild (the app ships as one prebuilt image).
+//
+// How it reaches the UI:
+//   • Text + colors + asset paths are surfaced to the SPA through the public
+//     settings API (settings.model.getPublic → SiteContext). The two fields the
+//     admin can edit (site title, contact email) override these defaults.
+//   • The static index.html shell (title/description/OG/favicon) is templated by
+//     Express at serve time (see src/app.js).
+//   • Server-side consumers (emails, TOTP issuer, API docs) read this directly.
+//
+// Image assets are delivered from the /brand mount (BRAND_LOGO/HERO/FAVICON), or
+// any absolute URL. Runic Gateway ships neutral defaults baked into the image so
+// an instance with no BRAND_* set still renders.
+require('dotenv').config()
+
+const name = process.env.BRAND_NAME || 'Runic Gateway'
+
+const brand = {
+  name,
+  shortName: process.env.BRAND_SHORT_NAME || name,
+  tagline: process.env.BRAND_TAGLINE || 'an independent private Ultima Online shard',
+  description:
+    process.env.BRAND_DESCRIPTION ||
+    `${name} — an independent private Ultima Online shard. News, screenshots, guides, and community notes.`,
+  contactEmail: process.env.BRAND_CONTACT_EMAIL || process.env.CONTACT_TO || '',
+  url: process.env.BRAND_URL || '',
+  // Visual
+  accent: process.env.BRAND_ACCENT_COLOR || '#7f99bd',
+  logo: process.env.BRAND_LOGO || '', // empty → no logo image rendered
+  hero: process.env.BRAND_HERO || '/assets/img/hero-moon.png',
+  favicon: process.env.BRAND_FAVICON || '', // empty → no favicon link injected
+}
+
+// Discord embeds want an int (0xRRGGBB). Parse the accent hex once; fall back to
+// the default accent if it's malformed.
+brand.accentInt = (() => {
+  const hex = String(brand.accent).replace('#', '')
+  const n = parseInt(hex, 16)
+  return Number.isNaN(n) ? 0x7f99bd : n
+})()
+
+module.exports = brand
--- a/server/src/model/settings/settings.model.js
+++ b/server/src/model/settings/settings.model.js
@@ -1,4 +1,5 @@
 const settingsDb = require('./settings.db')
+const brand = require('../../config/brand')

 // Keys safe to expose on the public site.
 const PUBLIC_KEYS = [
@@ -89,6 +90,21 @@ async function getPublic() {
  // the final say when the call is made). Lets the portal show/hide the form.
  const gsMode = GAME_SIGNUP_MODES.includes(all[GAME_SIGNUP_KEY]) ? all[GAME_SIGNUP_KEY] : 'disabled'
  out.gameAccountSignup = GAME_SIGNUP_OFFER.includes(gsMode)
+  // Instance branding (BRAND_* env defaults). The two admin-editable settings —
+  // site title and contact email — override the env value when set, so existing
+  // installs keep their DB-configured name; everything else comes from env.
+  out.brand = {
+    name: out.site_title || brand.name,
+    shortName: brand.shortName,
+    tagline: brand.tagline,
+    description: brand.description,
+    contactEmail: out.contact_email || brand.contactEmail,
+    url: brand.url,
+    accent: brand.accent,
+    logo: brand.logo,
+    hero: brand.hero,
+    favicon: brand.favicon,
+  }
  return out
 }

--- a/server/src/server.js
+++ b/server/src/server.js
@@ -15,6 +15,7 @@ const settings = require('./model/settings/settings.model')
 const revokedSessions = require('./model/revokedSessions/revokedSessions.model')
 const createLogger = require('./utils/logger')
 const { evaluateBotInternalKey } = require('./utils/botInternalKey')
+const brand = require('./config/brand')
 const pkg = require('../package.json')

 const log = createLogger('server')
@@ -27,12 +28,12 @@ const INTERNAL_PORT = Number(process.env.INTERNAL_PORT) || 3001
 const HOST = '0.0.0.0' // bind all interfaces so Pangolin / the LAN can reach it

 async function start() {
-  log.info(`starting UOMysticmoon server v${pkg.version}`, {
+  log.info(`starting ${brand.name} server v${pkg.version}`, {
    node: process.version,
    env: process.env.NODE_ENV || 'development',
    logLevel: process.env.LOG_LEVEL || 'info',
    logFile: createLogger.logFilePath || 'disabled (console only)',
-    db: `${process.env.DB_HOST || '127.0.0.1'}:${process.env.DB_PORT || 3306}/${process.env.DB_NAME || 'uomysticmoon'}`,
+    db: `${process.env.DB_HOST || '127.0.0.1'}:${process.env.DB_PORT || 3306}/${process.env.DB_NAME || 'runic_gateway'}`,
    cookieSecure: process.env.COOKIE_SECURE || 'auto',
    email: 'gmail-oauth2 (configured in admin → settings)',
  })
--- a/server/src/utils/db.js
+++ b/server/src/utils/db.js
@@ -10,7 +10,7 @@ const pool = mariadb.createPool({
  port: Number(process.env.DB_PORT) || 3306,
  user: process.env.DB_USER || 'root',
  password: process.env.DB_PASSWORD || '',
-  database: process.env.DB_NAME || 'uomysticmoon',
+  database: process.env.DB_NAME || 'runic_gateway',
  connectionLimit: 5,
  // Return plain JS numbers, never BigInt — keeps JSON responses clean.
  insertIdAsNumber: true,
--- a/server/src/utils/mailer.js
+++ b/server/src/utils/mailer.js
@@ -14,6 +14,7 @@ const nodemailer = require('nodemailer')
 const emailConfig = require('../model/emailConfig/emailConfig.model')
 const authProviders = require('../model/authProviders/authProviders.model')
 const settings = require('../model/settings/settings.model')
+const brand = require('../config/brand')
 const log = require('./logger')('mailer')

 // Ready to send only when enabled, connected (has a refresh token), and we know
@@ -76,7 +77,7 @@ async function sendContactMessage({ name, email, message }) {
      from: fromHeader(config),
      to,
      replyTo: email,
-      subject: `UOMysticmoon contact from ${name || 'a visitor'}`,
+      subject: `${brand.name} contact from ${name || 'a visitor'}`,
      text: `From: ${name || 'unknown'} <${email || 'no email'}>\n\n${message}`,
    })
    await emailConfig.recordStatus({ status: 'connected', statusDetail: 'Last send OK', lastVerifiedAt: new Date() })
@@ -110,7 +111,7 @@ async function sendTest(to) {
    await transport.sendMail({
      from: fromHeader(config),
      to: recipient,
-      subject: 'UOMysticmoon email test',
+      subject: `${brand.name} email test`,
      text: 'This is a test message confirming Gmail OAuth2 email delivery is working.',
    })
    await emailConfig.recordStatus({ status: 'connected', statusDetail: 'Test send OK', lastVerifiedAt: new Date() })
@@ -139,9 +140,9 @@ async function sendInvite({ to, acceptUrl, role, invitedByName }) {
    await transport.sendMail({
      from: fromHeader(config),
      to,
-      subject: 'Your UOMysticmoon invitation',
+      subject: `Your ${brand.name} invitation`,
      text:
-        `You have been invited${by} to join UOMysticmoon${roleLabel}.\n\n` +
+        `You have been invited${by} to join ${brand.name}${roleLabel}.\n\n` +
        `Accept your invitation and set up your account here:\n${acceptUrl}\n\n` +
        `This link is single-use and will expire. If you weren't expecting this, you can ignore it.`,
    })
--- a/server/src/utils/totp.js
+++ b/server/src/utils/totp.js
@@ -9,7 +9,9 @@
 const speakeasy = require('speakeasy')
 const QRCode = require('qrcode')

-const ISSUER = process.env.TOTP_ISSUER || 'UOMysticmoon'
+const brand = require('../config/brand')
+
+const ISSUER = process.env.TOTP_ISSUER || brand.name

 // Generate a new secret. Returns the base32 secret to persist plus the otpauth
 // URL to encode in a QR code.
--- a/server/swagger/swagger-output.json
+++ b/server/swagger/swagger-output.json
@@ -1,9 +1,9 @@
 {
  "openapi": "3.0.0",
  "info": {
-    "title": "UOMysticmoon API",
+    "title": "Runic Gateway API",
    "version": "1.0.0",
-    "description": "REST API for the UOMysticmoon website, wiki and admin panel — a private Ultima Online shard.\n\n### Authentication\n- **Web / admin panel** uses an httpOnly session cookie (`uomm_token`) issued by `POST /api/v1/auth/login` (plus `/login/totp` when 2FA is enabled).\n- **Native / mobile clients** use bearer access tokens from `POST /api/v1/auth/mobile/login`, refreshed via `/auth/mobile/refresh`.\n\nEndpoints under `/api/v1/admin/**` require a valid session; some are further restricted to the `admin` role (editors are limited to content)."
+    "description": "REST API for the Runic Gateway website, wiki and admin panel — a private Ultima Online shard.\n\n### Authentication\n- **Web / admin panel** uses an httpOnly session cookie (`rg_token`) issued by `POST /api/v1/auth/login` (plus `/login/totp` when 2FA is enabled).\n- **Native / mobile clients** use bearer access tokens from `POST /api/v1/auth/mobile/login`, refreshed via `/auth/mobile/refresh`.\n\nEndpoints under `/api/v1/admin/**` require a valid session; some are further restricted to the `admin` role (editors are limited to content)."
  },
  "servers": [
    {
@@ -8861,7 +8861,7 @@
      "cookieAuth": {
        "type": "apiKey",
        "in": "cookie",
-        "name": "uomm_token",
+        "name": "rg_token",
        "description": "Session JWT set as an httpOnly cookie by POST /api/v1/auth/login."
      },
      "bearerAuth": {
@@ -11718,7 +11718,7 @@
                  },
                  "example": {
                    "type": "string",
-                    "example": "otpauth://totp/UOMysticmoon:admin?secret=..."
+                    "example": "otpauth://totp/Runic Gateway:admin?secret=..."
                  }
                }
              },
--- a/server/swagger/swagger.js
+++ b/server/swagger/swagger.js
@@ -13,6 +13,11 @@

 const swaggerAutogen = require('swagger-autogen')({ openapi: '3.0.0' })
 const pkg = require('../package.json')
+const brand = require('../src/config/brand')
+
+// Cookie name is env-configurable (COOKIE_NAME); the spec documents whatever this
+// build targets. This is a build-time artifact — regenerate with `npm run swagger`.
+const COOKIE_NAME = process.env.COOKIE_NAME || 'rg_token'

 const outputFile = './swagger/swagger-output.json'

@@ -23,13 +28,13 @@ const routes = ['./src/app.js']

 const doc = {
  info: {
-    title: 'UOMysticmoon API',
+    title: `${brand.name} API`,
    version: pkg.version,
    description:
-      'REST API for the UOMysticmoon website, wiki and admin panel — a private ' +
+      `REST API for the ${brand.name} website, wiki and admin panel — a private ` +
      'Ultima Online shard.\n\n' +
      '### Authentication\n' +
-      '- **Web / admin panel** uses an httpOnly session cookie (`uomm_token`) issued by ' +
+      `- **Web / admin panel** uses an httpOnly session cookie (\`${COOKIE_NAME}\`) issued by ` +
      '`POST /api/v1/auth/login` (plus `/login/totp` when 2FA is enabled).\n' +
      '- **Native / mobile clients** use bearer access tokens from ' +
      '`POST /api/v1/auth/mobile/login`, refreshed via `/auth/mobile/refresh`.\n\n' +
@@ -67,7 +72,7 @@ const doc = {
      cookieAuth: {
        type: 'apiKey',
        in: 'cookie',
-        name: 'uomm_token',
+        name: COOKIE_NAME,
        description: 'Session JWT set as an httpOnly cookie by POST /api/v1/auth/login.',
      },
      // Native/mobile clients — Authorization: Bearer <accessToken>.
@@ -450,7 +455,7 @@ const doc = {
        type: 'object',
        description: 'Enrollment material returned by POST /account/totp/setup.',
        properties: {
-          otpauthUrl: { type: 'string', example: 'otpauth://totp/UOMysticmoon:admin?secret=...' },
+          otpauthUrl: { type: 'string', example: `otpauth://totp/${brand.name}:admin?secret=...` },
          qr: { type: 'string', description: 'QR code as a data: URL.', example: 'data:image/png;base64,iVBORw0KGgo...' },
        },
      },