Give cold visitors context on member dashboards

/my/<id> links circulate (address-bar shares, pre-/join links), and a
cold prospect landing there saw stats with no story. First-time viewers
of a position now get a banner: two-sentence RM Circle summary, a
"Read your invitation from this member" CTA into /join/<id>, a strategy
link, and the risk line. Hidden for repeat viewers of the same position
(likely the member) and dismissible per session.

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

public/my.html

@@ -4,6 +4,7 @@
 <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 here? What you're looking at</div><p style="margin:8px 0 12px;line-height:1.6">This is a live member dashboard for the <strong>RM Circle Premium team build</strong> — a team-first strategy on the Polygon blockchain where every payment happens on a public smart contract that nobody can fake or edit. The plan is simple: <strong>get your 2, then help your 2 get their 2.</strong> Every number on this page is this member's real position, read straight from the blockchain.</p><div style="display:flex;gap:10px;flex-wrap:wrap"><a id="coldIntroJoin" class="btn btn-primary btn-sm" href="/join">Read your invitation from this member →</a><a class="btn btn-secondary btn-sm" href="/">How the strategy works</a></div><p class="micro" style="margin:10px 0 0">Independent team training resource • Participation involves risk • No income is guaranteed</p></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="dFacts" class="facts" style="grid-template-columns:repeat(3,1fr);margin:18px 0"></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>

public/my.js

@@ -58,6 +58,17 @@
   });
   function render(d){
     prompt.classList.add('hidden');dash.classList.remove('hidden');
+    // cold-visitor context banner: shown unless this looks like the member's own
+    // dashboard (their stored ID matches) or they dismissed it this session
+    try{
+      const intro=document.getElementById('coldIntro');
+      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');document.getElementById('coldIntroJoin').href='/join/'+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
@@ -128,7 +139,7 @@
       const d=await r.json();
       if(!r.ok)throw new Error(d.error||'Lookup failed');
       if(!d.registered)throw new Error(`ID ${id} isn't registered on the smart contract — double-check the number.`);
-      try{localStorage.setItem('ctb.myId',String(id))}catch(e){}
+      try{d._priorId=localStorage.getItem('ctb.myId');localStorage.setItem('ctb.myId',String(id))}catch(e){}
       if(!/^\/my\/\d+$/.test(location.pathname))history.replaceState(null,'','/my/'+id);
       render(d);
     }catch(x){
@@ -136,6 +147,8 @@
       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

@@ -122,3 +122,7 @@ img.qr-img{object-fit:contain}
 a.brand{text-decoration:none;color:inherit}
 
 .mtp-spill{font-size:10px;color:var(--teal);width:100%;margin-top:3px}
+
+.cold-intro{position:relative;background:linear-gradient(145deg,rgba(78,214,203,.08),rgba(243,190,67,.06));border:1px solid rgba(78,214,203,.3);border-radius:16px;padding:18px 40px 16px 20px;margin-bottom:20px}
+.cold-intro-x{position:absolute;top:10px;right:12px;appearance:none;background:none;border:0;color:var(--muted);font-size:20px;cursor:pointer;line-height:1}
+.cold-intro-x:hover{color:var(--text)}