Member area rebuilt as a back-office shell

Fixed left sidebar (iconed menu with active accent, site links, user chip,
logout), sticky top bar with per-section title and rehearsal notice,
content region per pane. Mobile gets a hamburger off-canvas drawer that
closes on selection. Marketing nav no longer wraps the member area;
signed-out visitors get a centered auth page. All flows and pane IDs
preserved; verified on desktop and 390px. Assets v=20260904r.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

public/assets/my.js

@@ -1,8 +1,15 @@
 // My account: email-first join/login, wallet link at purchase time,
 // free payout activation, invite link, on-chain activity.
 (async function () {
-  await IAP.renderNav('my');
+  // back-office shell: no marketing nav here; rehearsal notice lives in the top bar
   const $ = IAP.$;
+  try {
+    const c = await IAP.getConfig();
+    if (c.rehearsal && $('boRehearsal')) {
+      $('boRehearsal').hidden = false;
+      $('boRehearsal').innerHTML = '<b>Testnet rehearsal</b> · ' + c.chainName;
+    }
+  } catch (e) {}
 
   async function api(path, body) {
     const r = await (await fetch(path, { method: 'POST',
@@ -58,21 +65,27 @@
     } catch (e) {}
   }
 
-  // ── members-area menu: hash-routed panes ──────────────
+  // ── back-office menu: hash-routed panes ───────────────
   const PANES = ['overview', 'line', 'campaigns', 'earnings', 'wallet'];
+  const TITLES = { overview: 'Overview', line: 'My line', campaigns: 'Campaigns',
+    earnings: 'Earnings', wallet: 'Wallet & account' };
   function setPane(name) {
     if (!PANES.includes(name)) name = 'overview';
     for (const p of PANES) {
       const el = $('pane-' + p);
       if (el) el.hidden = p !== name;
     }
-    document.querySelectorAll('.subnav [data-pane]').forEach(b =>
+    document.querySelectorAll('.bo-menu [data-pane]').forEach(b =>
       b.classList.toggle('on', b.dataset.pane === name));
+    if ($('boTitle')) $('boTitle').textContent = TITLES[name];
+    document.getElementById('memberArea').classList.remove('side-open'); // close mobile drawer
     if (location.hash !== '#' + name) history.replaceState(null, '', '#' + name);
   }
-  document.querySelectorAll('.subnav [data-pane]').forEach(b =>
+  document.querySelectorAll('.bo-menu [data-pane]').forEach(b =>
     b.addEventListener('click', () => setPane(b.dataset.pane)));
   window.addEventListener('hashchange', () => setPane(location.hash.slice(1)));
+  if ($('boBurger')) $('boBurger').addEventListener('click', () =>
+    document.getElementById('memberArea').classList.toggle('side-open'));
 
   async function render() {
     const me = await IAP.refreshNavWallet();

public/assets/site.css

@@ -222,6 +222,41 @@ input[type=range]{padding:0;border:0;background:transparent;accent-color:var(--m
 input:focus,select:focus{border-color:var(--mint)}
 :focus-visible{outline:2px solid var(--mint);outline-offset:2px}
 .hero-note{font-family:var(--mono);font-size:12px;color:var(--muted);margin-top:26px}
+/* ── member back-office shell ─────────────────────────── */
+.bo-body{background:var(--ground)}
+.bo{display:grid;grid-template-columns:236px 1fr;min-height:100vh}
+.bo-side{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:22px;
+  padding:22px 16px;background:rgba(10,18,15,.92);border-right:1px solid var(--line)}
+.bo-side .logo{font-size:19px;padding:0 8px}
+.bo-menu{display:flex;flex-direction:column;gap:4px}
+.bo-menu button{display:flex;align-items:center;gap:11px;background:transparent;border:0;color:var(--muted);
+  font:600 14px var(--disp);padding:11px 12px;border-radius:11px;cursor:pointer;text-align:left;
+  border-left:3px solid transparent}
+.bo-menu button svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
+.bo-menu button:hover{color:var(--ink);background:rgba(67,232,195,.05)}
+.bo-menu button.on{color:var(--mint);background:rgba(67,232,195,.09);border-left-color:var(--mint)}
+.bo-links{display:flex;flex-direction:column;gap:2px;padding:14px 12px;border-top:1px solid var(--line)}
+.bo-cap{font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
+.bo-links a{color:var(--muted);font-size:13.5px;padding:5px 0}
+.bo-links a:hover{color:var(--ink);text-decoration:none}
+.bo-foot{margin-top:auto;padding:14px 12px 0;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:6px;overflow-wrap:anywhere}
+.bo-main{min-width:0;display:flex;flex-direction:column}
+.bo-top{display:flex;align-items:center;gap:16px;padding:16px 26px;border-bottom:1px solid var(--line);
+  background:rgba(6,10,8,.75);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);position:sticky;top:0;z-index:5}
+.bo-top h2{font-size:20px}
+#boBurger{display:none;background:transparent;border:1px solid var(--line-strong);color:var(--ink);
+  border-radius:9px;font-size:17px;padding:5px 11px;cursor:pointer}
+.bo-rehearsal{margin-left:auto;color:var(--muted)}
+.bo-rehearsal b{color:var(--mint)}
+.bo-content{padding:26px;max-width:1060px;width:100%}
+@media(max-width:959px){
+  .bo{grid-template-columns:1fr}
+  .bo-side{position:fixed;left:0;top:0;bottom:0;width:250px;z-index:20;transform:translateX(-100%);
+    transition:transform .22s ease;height:100dvh}
+  .bo.side-open .bo-side{transform:none;box-shadow:0 0 60px rgba(0,0,0,.6)}
+  #boBurger{display:block}
+  .bo-content{padding:18px}
+}
 /* member sub-navigation */
 .subnav{display:flex;gap:6px;flex-wrap:wrap;background:rgba(16,28,24,.7);border:1px solid var(--line);
   border-radius:999px;padding:6px 8px;width:fit-content;margin:0 0 22px}