Rebuild /my as a two-purpose tabbed page

Turns the member page into a persistent, tabbed dual-purpose page:
- Persistent context strip: "Member #X's RM Circle page · Verified · Qualified"
- Tab 1 "The Team Build": pitch for promoted-link visitors — hook, embedded
  overview video, 3 steps, live proof (member's real on-chain numbers), Join
  under #X CTA. Persistent (replaces the dismissible cold-intro banner).
- Tab 2 "Position Dashboard": the full dashboard as-is (facts, plan, matrix,
  pipeline, alerts, share, payments, lineage).
- Default: cold visitor opens on the pitch, the member opens on their dashboard;
  both always one tap apart. Retired the coldIntro banner + its handler.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

public/my.html

@@ -4,15 +4,17 @@
 <main class="wrap" style="padding:26px 0 60px">
 <section id="idPrompt" class="login-panel" style="margin:8vh auto"><h1>Your position, live from the blockchain.</h1><p>Enter your RM Circle member ID to see your payments, your team, and your lineage — everything verified on Polygon.</p><form id="idForm"><div class="field"><label for="memberId">Your member ID</label><input id="memberId" class="input" inputmode="numeric" placeholder="e.g. 46" required></div><button class="btn btn-primary" style="width:100%">Show My Dashboard</button><div id="idError" class="micro" style="color:var(--danger)"></div></form></section>
 <section id="dash" class="hidden">
-<div id="coldIntro" class="hidden cold-intro"><button id="coldIntroClose" class="cold-intro-x" title="Dismiss">×</button><div class="eyebrow">New to The RM Circle? Start here</div><h2 style="margin:7px 0 8px;font-size:clamp(21px,3.5vw,26px)">Here's what this is — and how to join.</h2><p style="margin:0 0 15px;line-height:1.6;color:var(--muted)">The <strong style="color:var(--text)">RM Circle Premium team build</strong> is a team-first strategy on the Polygon blockchain. Every payment happens on a public smart contract that no one can fake, pause, or edit — and the plan is simple: <strong style="color:var(--text)">get your 2, then help your 2 get their 2.</strong></p>
+<div class="mp-context"><span class="mp-who">Member <span class="gold" id="dTitle">#—</span>'s RM Circle page</span> <span id="dVerified" class="live-badge" style="vertical-align:middle"><span class="dot"></span> Verified on-chain</span> <span id="dQualified"></span> <button id="switchId" class="btn btn-secondary btn-sm mp-switch">Look up another ID</button></div>
-<div class="gs-steps">
+<div class="mp-tabs"><button class="mp-tab" data-tab="pitch">The Team Build<span>What this is &amp; how to join</span></button><button class="mp-tab" data-tab="dash">Position Dashboard<span>This position's live numbers</span></button></div>
-  <div class="gs-step"><span class="gs-n">1</span><div><strong>See how it works</strong><span>Watch the 60-second overview and how the pay-flow works — plain English, no jargon.</span></div></div>
+<section id="tabPitch" class="mp-panel">
-  <div class="gs-step"><span class="gs-n">2</span><div><strong>Get set up</strong><span>A Polygon wallet plus POL to enter. The training videos walk you through every step.</span></div></div>
+  <div class="pitch-hero"><div class="eyebrow">You've landed on Member <span id="pInvId">#—</span>'s page</div><h1 class="pitch-h1">Get Your 2.<br>Help Your 2 <span class="gold">Get Theirs.</span></h1><p class="pitch-lede">The RM Circle is a team-first build on the Polygon blockchain. Every payout happens on a public smart contract that no one can fake, pause, or edit — no company holds your money. The plan is simple, and it duplicates.</p></div>
-  <div class="gs-step"><span class="gs-n">3</span><div><strong>Join the team</strong><span>Enter through your invite — you'll be placed on the team and start building your own 2.</span></div></div>
+  <div class="pitch-video"><video class="promo" controls preload="none" playsinline poster="/v/rmc-combined-poster.jpg" src="/v/rmc-combined-fe1347c964.mp4"></video><div class="pitch-vcap">▶ <strong>The 60-second overview</strong> — plays right here, no leaving the page.</div></div>
-</div>
+  <div class="pitch-steps"><div class="pitch-step"><span class="pitch-n">1</span><div><strong>See how it works</strong><span>Watch the overview above ↑, then the full pay-flow — plain English, no jargon.</span></div></div><div class="pitch-step"><span class="pitch-n">2</span><div><strong>Get set up</strong><span>A Polygon wallet plus POL to enter. The training walks you through every step.</span></div></div><div class="pitch-step"><span class="pitch-n">3</span><div><strong>Join the team</strong><span>Enter under this member — you're placed on the team and start building your own 2.</span></div></div></div>
-<div style="display:flex;gap:10px;flex-wrap:wrap;margin-top:16px"><a id="coldIntroJoin" class="btn btn-primary btn-sm" href="/join">See how to join →</a><a class="btn btn-secondary btn-sm" href="/training">Watch the training</a><a class="btn btn-secondary btn-sm" href="/">How the strategy works</a></div>
+  <div class="pitch-proof"><div class="lab">Don't take our word for it</div><h3>This is Member <span id="pProofId">#—</span>'s real position — read live from the blockchain.</h3><div class="pitch-nums"><div class="pnum"><b class="ok" id="pEarned">—</b><small>POL earned, on-chain</small></div><div class="pnum"><b class="tl" id="pTeam">—</b><small>members on their team</small></div><div class="pnum"><b class="gd" id="pLevel">—</b><small>current level of 8</small></div></div></div>
-<p class="micro" style="margin:13px 0 0">Everything below is <strong>this member's real, live position</strong>, read straight from the blockchain — proof it pays exactly as described. Participation involves risk • No income is guaranteed.</p></div>
+  <div class="pitch-cta"><a id="pJoinBtn" class="btn btn-primary" href="/join">Join the team →</a><a class="btn btn-secondary" href="/training">Watch the training</a><a class="btn btn-secondary" href="/">How the strategy works</a></div>
-<div style="display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:6px"><div><div class="eyebrow">Member position</div><h1 style="margin:6px 0 0">Position <span class="gold" id="dTitle">#—</span> <span id="dVerified" class="live-badge" style="vertical-align:middle;margin-left:8px"><span class="dot"></span> Verified on-chain</span> <span id="dQualified"></span></h1></div><button id="switchId" class="btn btn-secondary btn-sm">Look up another ID</button></div>
+  <div id="pPayouts" class="pitch-live"></div>
+</section>
+<section id="tabDash" class="mp-panel">
 <div id="dFacts" class="facts" style="grid-template-columns:repeat(3,1fr);margin:18px 0"></div>
 <div id="dNextStep"></div>
 <div class="table-card" style="margin-bottom:18px"><div style="display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap"><div><h2 style="margin:0 0 4px">Your team</h2><p style="color:var(--muted);font-size:13px;margin:0 0 14px">Your position's matrix — the rollup line on each card counts everyone underneath, all the way down. Click a position to drill into that leg. Open slots are where the next placements land.</p></div><button id="dTreeToggle" class="btn btn-secondary btn-sm">List view</button></div><div id="dTreeNav" style="display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px"></div><div id="dTree"></div><p class="micro" style="margin:14px 0 0"><span class="mtp-qmark" style="position:static;display:inline-grid;vertical-align:middle">✓</span> qualified (2/2 directs) · <span class="mt-badge mt-prem">P</span> Premium · <span class="mt-badge">S</span> Standard · ⬇ everyone below that position (all generations) and the POL they've earned · <span style="color:var(--teal)">↧ spillover</span> = placed there by upline activity; only members who join with a position's own ID count toward its 2/2</p><div id="dSpillNote" class="hidden"></div></div>
@@ -24,6 +26,7 @@
 <div class="table-card"><h2 style="margin:0 0 4px">Your lineage</h2><p id="dLineage" style="color:var(--muted);font-size:14px;line-height:1.8;margin:8px 0 0"></p></div>
 <div class="notice" style="margin-top:18px"><strong>Team reminder:</strong> once your two directs are placed, retire your link and help your two get their two — always send new members through the <a href="/start" style="color:var(--gold)">current team sponsor page</a>.</div>
 </section>
+</section>
 </main>
 <footer class="wrap disclaimer">All figures are read live from the RM Circle smart contract on Polygon and are historical facts, not a promise of future results. Participation involves cryptocurrency and smart-contract risk. Never use funds you cannot afford to lose.<div class="footer-links"><a href="/">Home</a><a href="/contract">Contract Security</a><a href="/disclaimer">Disclaimers</a><a href="/tools">Promo Tools</a></div></footer>
 <script src="/track.js"></script><script src="/qrlib.js"></script><script src="/my.js"></script><script src="/payouts.js" defer></script><script src="/chat.js" defer></script></body></html>

public/my.js

@@ -4,6 +4,32 @@
   const date=ts=>ts?new Date(ts*1000).toLocaleDateString(undefined,{year:'numeric',month:'short',day:'numeric'}):'—';
   const prompt=document.getElementById('idPrompt'),dash=document.getElementById('dash');
 
+  // Two-purpose page: a "Team Build" pitch tab (for cold visitors who clicked a
+  // promoted link) and the "Position Dashboard" tab. Persistent — the pitch is
+  // always one tap away, never dismissed.
+  function setTab(name){
+    document.querySelectorAll('.mp-tab').forEach(t=>t.classList.toggle('on',t.dataset.tab===name));
+    const tp=document.getElementById('tabPitch'),td=document.getElementById('tabDash');
+    if(tp)tp.classList.toggle('on',name==='pitch');
+    if(td)td.classList.toggle('on',name==='dash');
+  }
+  document.querySelectorAll('.mp-tab').forEach(t=>t.addEventListener('click',()=>{setTab(t.dataset.tab);window.scrollTo({top:0,behavior:'smooth'});}));
+  function renderPitch(d){
+    const set=(id,v)=>{const el=document.getElementById(id);if(el)el.textContent=v;};
+    set('pInvId','#'+d.id); set('pProofId','#'+d.id);
+    set('pEarned',Math.round(d.totalEarnedPol||0).toLocaleString());
+    set('pTeam',(d.subtree&&d.subtree.downCount!=null)?String(d.subtree.downCount):'—');
+    set('pLevel',d.levelName||'—');
+    const jb=document.getElementById('pJoinBtn'); if(jb){jb.href='/join/'+d.id;jb.textContent='Join under #'+d.id+' →';}
+    const pp=document.getElementById('pPayouts');
+    if(pp){
+      const inc=(d.income||[]).slice(0,3);
+      pp.innerHTML=inc.length
+        ? '<div class="pitch-l-lab">Real payouts landing on this team — verifiable on Polygonscan</div>'+inc.map(p=>`<div class="pitch-l-row"><span>${esc(p.desc)} — from #${p.fromId}</span><b>+${fmt(p.pol)} POL</b></div>`).join('')
+        : '';
+    }
+  }
+
   function pathId(){const m=location.pathname.match(/^\/my\/(\d+)$/);if(m)return m[1];const q=new URLSearchParams(location.search).get('id');if(q&&/^\d+$/.test(q))return q;try{return localStorage.getItem('ctb.myId')||''}catch(e){return ''}}
 
   const treeUI={byId:{},parent:{},homeId:0,rootId:0,mode:'pyramid'};
@@ -58,17 +84,10 @@
   });
   function render(d){
     prompt.classList.add('hidden');dash.classList.remove('hidden');
-    // cold-visitor context banner: shown unless this looks like the member's own
+    // default tab: a cold visitor (hasn't viewed this ID before) opens on the
-    // dashboard (their stored ID matches) or they dismissed it this session
+    // Team Build pitch; the member (their own saved ID) opens on their dashboard.
-    try{
+    renderPitch(d);
-      const intro=document.getElementById('coldIntro');
+    try{ setTab(d._priorId===String(d.id)?'dash':'pitch'); }catch(e){ setTab('pitch'); }
-      const seenBefore=d._priorId===String(d.id); // they've viewed this position before (likely their own)
-      const dismissed=sessionStorage.getItem('ctb.introDismissed')==='1';
-      if(intro){
-        if(!seenBefore&&!dismissed){intro.classList.remove('hidden');const cij=document.getElementById('coldIntroJoin');cij.href='/join/'+d.id;cij.textContent='See how to join under #'+d.id+' →';}
-        else intro.classList.add('hidden');
-      }
-    }catch(e){}
     document.getElementById('dTitle').textContent='#'+d.id;
     const qb=document.getElementById('dQualified');
     if(qb)qb.outerHTML=d.directCount>=2
@@ -298,8 +317,6 @@
       document.getElementById('idError').textContent=x.message;
     }
   }
-  const introX=document.getElementById('coldIntroClose');
-  if(introX)introX.addEventListener('click',()=>{try{sessionStorage.setItem('ctb.introDismissed','1')}catch(e){};document.getElementById('coldIntro').classList.add('hidden')});
   document.getElementById('dJoinForm').addEventListener('submit',async e=>{
     e.preventDefault();
     const form=e.currentTarget,msg=document.getElementById('dJoinMsg');

public/styles.css

@@ -167,6 +167,37 @@ a.brand{text-decoration:none;color:inherit}
 .gs-step strong{display:block;font-size:15px;margin-bottom:3px}
 .gs-step span{color:var(--muted);font-size:13px;line-height:1.45}
 @media(max-width:640px){.gs-steps{grid-template-columns:1fr}}
+/* two-purpose /my page: persistent context strip + tabs + pitch tab */
+.mp-context{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:rgba(11,28,44,.6);border:1px solid var(--line);border-radius:14px;padding:11px 16px;margin-bottom:14px}
+.mp-who{font-weight:800;font-size:15px}
+.mp-switch{margin-left:auto}
+.mp-tabs{display:flex;gap:8px;margin-bottom:22px}
+.mp-tab{flex:1;text-align:center;background:#0b1b2b;border:1px solid var(--line);border-radius:13px;padding:13px 10px;cursor:pointer;font-weight:800;font-size:15px;color:var(--muted);transition:.15s;font-family:inherit}
+.mp-tab span{display:block;font-size:11.5px;font-weight:600;color:var(--muted);margin-top:3px}
+.mp-tab.on{background:linear-gradient(160deg,#12293f,#0b1b2b);border-color:var(--teal);color:var(--text)}
+.mp-tab.on span{color:var(--teal)}
+.mp-panel{display:none}.mp-panel.on{display:block}
+.pitch-hero{padding:8px 0 4px}
+.pitch-h1{font-size:clamp(30px,6vw,52px);line-height:1;letter-spacing:-1.5px;margin:12px 0 12px;font-weight:900}
+.pitch-lede{font-size:clamp(16px,2.2vw,19px);color:var(--muted);line-height:1.55;max-width:640px;margin:0 0 22px}
+.pitch-video{margin:2px 0 24px;text-align:center}
+.pitch-video .promo{width:100%;max-width:700px;aspect-ratio:16/9;display:block;margin:0 auto;border-radius:16px;border:1px solid var(--line);box-shadow:0 18px 55px rgba(0,0,0,.5);background:#000}
+.pitch-vcap{color:var(--muted);font-size:13.5px;margin-top:10px;font-weight:600}.pitch-vcap strong{color:var(--text)}
+.pitch-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:0 0 22px}
+.pitch-step{display:flex;gap:11px;align-items:flex-start;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:15px 16px}
+.pitch-n{flex:0 0 auto;width:28px;height:28px;border-radius:8px;background:#173a52;border:1px solid #2a627b;color:var(--teal);font-weight:900;display:grid;place-items:center;font-size:15px}
+.pitch-step strong{display:block;font-size:16px;margin-bottom:4px}.pitch-step span{color:var(--muted);font-size:13.5px;line-height:1.45}
+.pitch-proof{background:linear-gradient(150deg,rgba(78,214,203,.09),rgba(243,190,67,.05));border:1px solid #2c5f66;border-radius:16px;padding:20px 22px;margin:0 0 22px}
+.pitch-proof .lab{color:var(--teal);text-transform:uppercase;letter-spacing:1.4px;font-weight:800;font-size:12px;margin-bottom:8px}
+.pitch-proof h3{margin:0 0 14px;font-size:20px;font-weight:800}
+.pitch-nums{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
+.pnum b{display:block;font-size:26px;font-weight:900}.pnum .ok{color:var(--ok)}.pnum .gd{color:var(--gold)}.pnum .tl{color:var(--teal)}
+.pnum small{color:var(--muted);font-size:12px}
+.pitch-cta{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}.pitch-cta .btn{padding:13px 22px;font-size:16px}
+.pitch-l-lab{color:var(--muted);font-size:12.5px;font-weight:700;margin-bottom:8px;text-transform:uppercase;letter-spacing:1px}
+.pitch-l-row{display:flex;justify-content:space-between;gap:12px;background:#0b1b2b;border:1px solid var(--line);border-radius:11px;padding:11px 14px;margin-bottom:7px;font-size:14px;color:#cfdcea}
+.pitch-l-row b{color:var(--ok)}
+@media(max-width:680px){.pitch-steps,.pitch-nums{grid-template-columns:1fr}}
 
 /* Eight-generation matrix illustration — compact icons so 256 stays tidy */
 .matrix{overflow-x:auto;padding-bottom:10px}