six-degrees 0.2.0 → 0.3.0-beta.1

package/.next/standalone/app/launch/page.js

@@ -2,6 +2,7 @@
 
 import { useEffect, useState, useRef, useCallback } from 'react';
 import Link from 'next/link';
+import { SAMPLE_STATS } from '../../lib/sample-stats';
 
 // ── Intersection Observer hook for scroll-triggered animations ──
 function useInView(options = {}) {
@@ -177,13 +178,15 @@ function HeroSection() {
 // ═══════════════════════════════════════════════════════════════
 // STATS BAR — Animated counters
 // ═══════════════════════════════════════════════════════════════
+// The numbers on this page are the invented sample network's
+// (lib/sample-stats.js), never one person's real network.
 function StatsBar() {
   const [ref, inView] = useInView();
   const stats = [
-    { label: 'Connections Mapped', value: 2438, color: '#3498DB' },
-    { label: 'Bridges Discovered', value: 25, color: '#FFD700' },
-    { label: 'Power Scored', value: 575, color: '#9B59B6' },
-    { label: 'Degrees Deep', value: 6, color: '#00ff88' },
+    { label: 'Connections Mapped', value: SAMPLE_STATS.connections, color: '#3498DB' },
+    { label: 'Bridges Discovered', value: SAMPLE_STATS.bridges, color: '#FFD700' },
+    { label: 'People Scored', value: SAMPLE_STATS.people, color: '#9B59B6' },
+    { label: 'Companies', value: SAMPLE_STATS.companies, color: '#00ff88' },
   ];
   return (
     <section ref={ref} style={{ padding: '80px 24px', borderTop: '1px solid rgba(255,255,255,0.05)', borderBottom: '1px solid rgba(255,255,255,0.05)' }}>
@@ -196,12 +199,14 @@ function StatsBar() {
           }}>
             <div style={{ fontSize: 48, fontWeight: 800, color: s.color, lineHeight: 1 }}>
               <Counter end={s.value} active={inView} />
-              {s.value > 100 ? '+' : ''}
             </div>
             <div style={{ fontSize: 13, color: '#666', marginTop: 8, fontWeight: 500, letterSpacing: 0.5 }}>{s.label}</div>
           </div>
         ))}
       </div>
+      <p style={{ textAlign: 'center', fontSize: 12, color: '#555', margin: '32px auto 0', maxWidth: 520 }}>
+        Counted from the sample network that comes with the app. Every person in it is invented.
+      </p>
     </section>
   );
 }
@@ -315,9 +320,10 @@ function GalaxySection() {
 function ChainSection() {
   const [ref, inView] = useInView();
   const degrees = [
-    { d: 1, label: 'Your Connections', desc: 'Direct network — scored & tiered', color: '#3498DB', count: 575 },
-    { d: 2, label: 'Bridge Connections', desc: 'Friends of your bridges', color: '#9B59B6', count: 1519 },
-    { d: 3, label: 'Extended Reach', desc: 'Bridged from promoted D2s', color: '#FFD700', count: 344 },
+    // The sample's counts; it maps two degrees.
+    { d: 1, label: 'Your Connections', desc: 'Direct network — scored & tiered', color: '#3498DB', count: SAMPLE_STATS.degree1 },
+    { d: 2, label: 'Bridge Connections', desc: 'Friends of your bridges', color: '#9B59B6', count: SAMPLE_STATS.degree2 },
+    { d: 3, label: 'Extended Reach', desc: 'Bridged from promoted D2s', color: '#FFD700', count: null },
     { d: 4, label: 'Industry Layer', desc: 'Company & sector intelligence', color: '#FF6B35', count: null },
     { d: 5, label: 'Market Layer', desc: 'Cross-industry connections', color: '#00ff88', count: null },
     { d: 6, label: 'Global Reach', desc: 'Anyone in the world', color: '#ff5050', count: null },
@@ -396,6 +402,9 @@ function ChainSection() {
             </div>
           ))}
         </div>
+        <p style={{ textAlign: 'center', fontSize: 12, color: '#555', marginTop: 40 }}>
+          The counts are the sample network&rsquo;s, whose people are all invented.
+        </p>
       </div>
     </section>
   );
@@ -407,7 +416,7 @@ function ChainSection() {
 function ScoringSection() {
   const [ref, inView] = useInView();
   const tiers = [
-    { tier: 'S', label: 'Supreme', score: '7.0+', color: TIER.S, glow: 'rgba(255,215,0,0.3)', people: 'C-Suite, VPs, Founders', icon: '👑' },
+    { tier: 'S', label: 'Supreme', score: '7.5+', color: TIER.S, glow: 'rgba(255,215,0,0.3)', people: 'C-Suite, VPs, Founders', icon: '👑' },
     { tier: 'A', label: 'Ace', score: '5.5+', color: TIER.A, glow: 'rgba(155,89,182,0.3)', people: 'Directors, Senior Leaders', icon: '💎' },
     { tier: 'B', label: 'Builder', score: '4.0+', color: TIER.B, glow: 'rgba(52,152,219,0.3)', people: 'Managers, Senior ICs', icon: '🔷' },
     { tier: 'C', label: 'Connector', score: '2.5+', color: TIER.C, glow: 'rgba(149,165,166,0.2)', people: 'Associates, Specialists', icon: '🔸' },
@@ -479,10 +488,10 @@ function FeaturesGrid() {
     {
       title: 'Paths',
       subtitle: 'Company Intelligence',
-      desc: 'Scan any company on LinkedIn and see every person mapped, scored, and organized by seniority. 80+ company normalizations built in.',
+      desc: 'Scan any company on LinkedIn and see every person mapped, scored, and organized by seniority.',
       color: '#00ff88',
       icon: '🏢',
-      stat: '344 people scanned',
+      stat: `${SAMPLE_STATS.companies} companies in the sample`,
     },
     {
       title: 'Outlink',
@@ -490,7 +499,7 @@ function FeaturesGrid() {
       desc: 'Your curated list of high-value D2 connections to request. Grouped by bridge, filtered by tier, with batch-open for efficient networking.',
       color: '#FF6B35',
       icon: '🚀',
-      stat: '798 recommendations',
+      stat: `${SAMPLE_STATS.recommendations} recommendations in the sample`,
     },
     {
       title: 'XP System',
@@ -506,7 +515,7 @@ function FeaturesGrid() {
       desc: 'Select any D1 connection as a bridge. Automatically discover and score all their connections — your D2 layer.',
       color: '#9B59B6',
       icon: '🔗',
-      stat: '25 bridges mapped',
+      stat: `${SAMPLE_STATS.bridges} bridges in the sample`,
     },
   ];
 
@@ -599,13 +608,14 @@ function TechSection() {
             background: GRADIENT, WebkitBackgroundClip: 'text', WebkitTextFillColor: 'transparent',
             marginBottom: 32,
           }}>
-            P = (S &times; 0.5) + (C &times; 0.3) + B
+            P = T &times; (0.45 + 0.055 &times; C) + R + B
           </div>
           <div style={{ display: 'grid', gridTemplateColumns: '1fr 1fr 1fr', gap: 24 }}>
             {[
-              { sym: 'S', label: 'Seniority', desc: 'VP = 8, Director = 6, Manager = 4', weight: '50%', color: TIER.S },
-              { sym: 'C', label: 'Company Prestige', desc: 'FAANG = 9, Fortune 500 = 7', weight: '30%', color: TIER.A },
-              { sym: 'B', label: 'Circle Bonus', desc: 'Inner circle proximity boost', weight: '20%', color: TIER.B },
+              // The model in lib/scoring.js: a product, so a title counts for more at a bigger company.
+              { sym: 'T', label: 'Title', desc: 'C-suite 10, VP 9, Director 7.5, Manager 6.5', note: 'Multiplied by the company', color: TIER.S },
+              { sym: 'C', label: 'Company', desc: 'Well-known 7–10, else estimated from your network', note: 'Weight 0.5 to 1.0', color: TIER.A },
+              { sym: 'R + B', label: 'Reach & bridge', desc: 'Investor, YC, an audience in the millions; a strong circle', note: 'Up to +1.5 and +1', color: TIER.B },
             ].map((item, i) => (
               <div key={i} style={{
                 padding: 16, borderRadius: 12, background: `${item.color}08`,
@@ -615,7 +625,7 @@ function TechSection() {
                 <div style={{ fontSize: 28, fontWeight: 900, color: item.color }}>{item.sym}</div>
                 <div style={{ fontSize: 13, fontWeight: 700, color: '#fff', marginTop: 4 }}>{item.label}</div>
                 <div style={{ fontSize: 10, color: '#555', marginTop: 4 }}>{item.desc}</div>
-                <div style={{ fontSize: 10, color: item.color, fontWeight: 700, marginTop: 8 }}>Weight: {item.weight}</div>
+                <div style={{ fontSize: 10, color: item.color, fontWeight: 700, marginTop: 8 }}>{item.note}</div>
               </div>
             ))}
           </div>
@@ -627,7 +637,7 @@ function TechSection() {
           opacity: inView ? 1 : 0, transition: 'opacity 1s ease 0.6s',
         }}>
           {[
-            { t: 'S', min: 7, color: TIER.S },
+            { t: 'S', min: 7.5, color: TIER.S },
             { t: 'A', min: 5.5, color: TIER.A },
             { t: 'B', min: 4, color: TIER.B },
             { t: 'C', min: 2.5, color: TIER.C },
@@ -751,7 +761,7 @@ function CTASection() {
           opacity: inView ? 0.4 : 0, transition: 'opacity 1.5s ease 0.5s',
         }}>
           <span style={{ fontSize: 12, color: '#444' }}>Built by Blake Burford</span>
-          <span style={{ fontSize: 12, color: '#444' }}>Stead Labs</span>
+          <span style={{ fontSize: 12, color: '#444' }}>Open source · MIT</span>
           <span style={{ fontSize: 12, color: '#444' }}>2026</span>
         </div>
       </div>

package/.next/standalone/app/layout.js

@@ -12,8 +12,8 @@ const geistMono = Geist_Mono({
 });
 
 export const metadata = {
-  title: "6 Degrees of Separation — LinkedIn Network Research",
-  description: "Visualizing the six degrees of separation hypothesis through LinkedIn connection analysis. A certified research project mapping power networks.",
+  title: "Six Degrees",
+  description: "Maps your LinkedIn network: who you know, who they know, and the shortest path to someone you haven't met. Runs on your own computer; nothing is uploaded.",
   viewport: 'width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no',
 };
 

package/.next/standalone/app/page.js

@@ -240,6 +240,19 @@ function HomeInner() {
               Scan
             </Link>}
           </div>
+          {/* Settings — also in CSV/sample mode and on phones, so updates stay reachable */}
+          {!IS_DEMO && <Link
+            href="/settings"
+            title="Settings"
+            aria-label="Settings"
+            style={{
+              width: isMobile ? 28 : 32, height: isMobile ? 28 : 32, borderRadius: '50%', flexShrink: 0,
+              background: 'rgba(255,255,255,0.06)', color: '#888', fontSize: isMobile ? 14 : 16, textDecoration: 'none',
+              display: 'flex', alignItems: 'center', justifyContent: 'center', marginLeft: isMobile ? 4 : 8,
+            }}
+          >
+            {'\u2699\uFE0E'}
+          </Link>}
           {/* Notification bell */}
           {!IS_DEMO && !csvMode && <div style={{ position: 'relative', marginLeft: isMobile ? 4 : 8 }}>
             <button
@@ -309,7 +322,7 @@ function HomeInner() {
                 const status = await scraperStatus();
                 const blocked = notReadyMessage(status);
                 if (blocked) { alert(blocked); return; }
-                if (status.running) { alert('The scraper is already busy.'); return; }
+                if (status.running) { alert('The scanner is already busy.'); return; }
                 await startScrape('refresh');
                 alert('Checking for new connections — watch it on the Scan page.');
               } catch (e) {
@@ -393,7 +406,7 @@ function HomeInner() {
                     LinkedIn&rsquo;s CSV export only covers your own 1st-degree list, so there are no circles to open here.
                   </p>
                   <p style={{ color: '#666', fontSize: 13, lineHeight: 1.7, margin: 0 }}>
-                    The local scraper maps those circles (and captures real photos).{' '}
+                    The local scanner maps those circles (and captures real photos).{' '}
                     <Link href="/setup" style={{ color: '#3498DB', textDecoration: 'none' }}>Set up scanning &rarr;</Link>
                   </p>
                 </div>

package/.next/standalone/app/paths/page.js

@@ -1,6 +1,7 @@
 'use client';
 
-import { useEffect, useState } from 'react';
+import { Suspense, useEffect, useState } from 'react';
+import { useSearchParams } from 'next/navigation';
 import { runScrape, scraperStatus, notReadyMessage } from '../../lib/scraper-client';
 import { loadNetwork } from '../../lib/network';
 import { IS_DEMO } from '../../lib/demo';
@@ -13,9 +14,12 @@ import Link from 'next/link';
 import { companyOf, getSeniority } from '../../lib/companies';
 
 const TIER_COLORS = { S: '#FFD700', A: '#9B59B6', B: '#3498DB', C: '#95A5A6', D: '#BDC3C7' };
+const TABS = [['map', 'Map'], ['industries', 'Industries'], ['companies', 'Companies'], ['scores', 'Scores']];
 
 export default function PathsPage() {
-  return <OnboardingGate><PathsInner /></OnboardingGate>;
+  // Suspense because PathsInner reads the address's ?tab= (useSearchParams),
+  // which Next requires to sit inside one for the page to build.
+  return <OnboardingGate><Suspense><PathsInner /></Suspense></OnboardingGate>;
 }
 
 function PathsInner() {
@@ -28,7 +32,11 @@ function PathsInner() {
   const [d2Data, setD2Data] = useState([]);
   const [d3Data, setD3Data] = useState([]);
   // Map and Industries are the analyzer; Companies is the list it grew from.
-  const [tab, setTab] = useState('map');
+  // A link can open a tab (/paths?tab=scores, from Settings → Your sector).
+  // The router's search params rather than window.location: on a click from
+  // another page the address bar only changes after this page has rendered.
+  const asked = useSearchParams().get('tab');
+  const [tab, setTab] = useState(() => (TABS.some(([k]) => k === asked) ? asked : 'map'));
   // Bumped when company scores change, so the network reloads with new tiers.
   const [reloadKey, setReloadKey] = useState(0);
 
@@ -120,7 +128,7 @@ function PathsInner() {
       try { localStorage.setItem('six-degrees-company-scan-ok', '1'); } catch {}
     }
     setScanning(true);
-    setScanLog(['Checking the scraper...']);
+    setScanLog(['Checking the scanner...']);
 
     const blocked = notReadyMessage(await scraperStatus().catch(() => null));
     if (blocked) {
@@ -229,7 +237,7 @@ function PathsInner() {
           }}>Paths</h1>
           {!selectedCompany && (
             <div style={{ display: 'flex', gap: 4, marginLeft: 8, padding: 3, borderRadius: 8, background: 'rgba(255,255,255,0.05)' }}>
-              {[['map', 'Map'], ['industries', 'Industries'], ['companies', 'Companies'], ['scores', 'Scores']].map(([k, label]) => (
+              {TABS.map(([k, label]) => (
                 <button key={k} onClick={() => setTab(k)} style={{
                   padding: '5px 12px', borderRadius: 6, border: 'none', cursor: 'pointer', fontSize: 12.5, fontWeight: 700,
                   background: tab === k ? 'linear-gradient(135deg, #00ff88, #3498DB)' : 'transparent', color: tab === k ? '#000' : '#aab',

package/.next/standalone/app/profile/page.js

@@ -1,12 +1,12 @@
 'use client';
 
 import { useEffect, useState } from 'react';
-import { runScrape, scraperStatus, notReadyMessage } from '../../lib/scraper-client';
 import { loadNetwork } from '../../lib/network';
 import MappingProgress from '../components/MappingProgress';
 import { IS_DEMO } from '../../lib/demo';
 import OnboardingGate from '../components/OnboardingGate';
 import { useUser } from '../components/UserProvider';
+import { sectorByKey } from '../../lib/sector-labels';
 import Link from 'next/link';
 
 const LEVEL_NAMES = {
@@ -33,15 +33,20 @@ function ProfileInner() {
   const [notifications, setNotifications] = useState([]);
   const [queueStats, setQueueStats] = useState({ total: 0, sent: 0, accepted: 0 });
   const [mapping, setMapping] = useState({ degree1: [], degree2: [], skips: [] });
-  const [setupStatus, setSetupStatus] = useState('idle');
-  const [setupLog, setSetupLog] = useState([]);
-  const [bridgeStatus, setBridgeStatus] = useState('idle');
-  const [bridgeLog, setBridgeLog] = useState([]);
+  // "Your Sectors" is what you picked in Settings → Your sector. (users.sectors,
+  // which this card used to show, is never written by anything; the Sidebar
+  // and Outlink still read it as free text.) null while it loads; a load that
+  // fails says so rather than showing "none picked" (TRAPS §7).
+  const [sectorFocus, setSectorFocus] = useState(null);
 
   useEffect(() => {
     if (IS_DEMO) return;
     if (!userId) return;
     async function load() {
+      fetch('/api/settings')
+        .then((r) => r.json().then((d) => (r.ok && d.settings ? d : Promise.reject(new Error(d.error)))))
+        .then((d) => setSectorFocus(d.settings.sectorFocus || { sectors: [], strength: 'lean' }))
+        .catch(() => setSectorFocus({ failed: true }));
       const net = await loadNetwork(userId);
       const d1 = net.degree1;
       const d2 = net.degree2;
@@ -207,104 +212,6 @@ function ProfileInner() {
           </div>
         </div>
 
-        {/* === SET UP ACCOUNT === */}
-        <SetupScrapeCard status={setupStatus} log={setupLog} onStart={async () => {
-          setSetupStatus('running');
-          setSetupLog(['Checking the scraper...']);
-          const blocked = notReadyMessage(await scraperStatus().catch(() => null));
-          if (blocked) {
-            setSetupStatus('offline');
-            setSetupLog([blocked]);
-            return;
-          }
-          try {
-            const final = await runScrape('full', { onLog: setSetupLog });
-            setSetupStatus(final.exitCode === 0 ? 'done' : 'error');
-          } catch { setSetupStatus('error'); }
-        }} onRetry={() => { setSetupStatus('idle'); setSetupLog([]); }} />
-
-        {/* === AUTO-BRIDGE ALL === */}
-        <div style={{
-          background: 'rgba(155,89,182,0.06)', borderRadius: 12, padding: 20, marginBottom: 24,
-          border: '1px solid rgba(155,89,182,0.2)',
-        }}>
-          <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 8 }}>
-            <h3 style={{ fontSize: 14, fontWeight: 700, margin: 0, color: '#9B59B6' }}>Auto-Bridge All</h3>
-            {bridgeStatus === 'done' && <span style={{ fontSize: 10, color: '#00ff88', fontWeight: 600 }}>Complete</span>}
-          </div>
-          <p style={{ fontSize: 11, color: '#888', margin: '0 0 12px' }}>
-            Scan every connection&apos;s network. S-tier first → D-tier last. 2 min cooldown between each.
-          </p>
-
-          {bridgeStatus === 'idle' && (
-            <button onClick={async () => {
-              setBridgeStatus('running');
-              setBridgeLog(['Checking the scraper...']);
-              const blocked = notReadyMessage(await scraperStatus().catch(() => null));
-              if (blocked) {
-                setBridgeStatus('offline');
-                setBridgeLog([blocked]);
-                return;
-              }
-              try {
-                const final = await runScrape('auto-bridge', { onLog: setBridgeLog });
-                setBridgeStatus(final.exitCode === 0 ? 'done' : 'error');
-              } catch { setBridgeStatus('error'); }
-            }} style={{
-              width: '100%', padding: '12px', borderRadius: 8, border: 'none', cursor: 'pointer',
-              background: 'linear-gradient(135deg, #9B59B6, #FF6B35)',
-              color: '#fff', fontWeight: 700, fontSize: 14,
-            }}>
-              Auto-Bridge All Connections
-            </button>
-          )}
-
-          {bridgeStatus === 'offline' && (
-            <div>
-              <div style={{ padding: '10px', borderRadius: 8, background: 'rgba(255,80,80,0.1)', border: '1px solid rgba(255,80,80,0.3)', color: '#ff5050', fontSize: 12, marginBottom: 8, textAlign: 'center' }}>
-                Scraper offline — start it first
-              </div>
-              <button onClick={() => setBridgeStatus('idle')} style={{
-                width: '100%', padding: '10px', borderRadius: 8, border: 'none', cursor: 'pointer',
-                background: 'rgba(255,255,255,0.1)', color: '#aaa', fontWeight: 600, fontSize: 12,
-              }}>Retry</button>
-            </div>
-          )}
-
-          {bridgeStatus === 'running' && (
-            <div style={{
-              padding: '10px', borderRadius: 8, background: 'rgba(155,89,182,0.1)',
-              border: '1px solid rgba(155,89,182,0.3)',
-            }}>
-              <div style={{ display: 'flex', alignItems: 'center', gap: 6, marginBottom: 4 }}>
-                <div style={{ width: 8, height: 8, borderRadius: '50%', background: '#9B59B6', animation: 'pulse 1s infinite' }} />
-                <span style={{ fontSize: 11, fontWeight: 600, color: '#9B59B6' }}>Bridging...</span>
-              </div>
-              <div style={{ fontFamily: 'monospace', fontSize: 9, color: '#777', maxHeight: 150, overflow: 'auto' }}>
-                {bridgeLog.map((l, i) => <div key={i}>{l}</div>)}
-              </div>
-            </div>
-          )}
-
-          {bridgeStatus === 'done' && (
-            <div style={{ padding: '10px', borderRadius: 8, background: 'rgba(0,255,136,0.1)', border: '1px solid rgba(0,255,136,0.3)', color: '#00ff88', fontSize: 12, fontWeight: 600, textAlign: 'center' }}>
-              All bridges mapped! Refresh the app.
-            </div>
-          )}
-
-          {bridgeStatus === 'error' && (
-            <div>
-              <div style={{ padding: '10px', borderRadius: 8, background: 'rgba(255,80,80,0.1)', border: '1px solid rgba(255,80,80,0.3)', color: '#ff5050', fontSize: 12, textAlign: 'center', marginBottom: 8 }}>
-                Something went wrong
-              </div>
-              <button onClick={() => { setBridgeStatus('idle'); setBridgeLog([]); }} style={{
-                width: '100%', padding: '10px', borderRadius: 8, border: 'none', cursor: 'pointer',
-                background: 'rgba(255,255,255,0.1)', color: '#aaa', fontWeight: 600, fontSize: 12,
-              }}>Try Again</button>
-            </div>
-          )}
-        </div>
-
         {/* === 2ND-DEGREE MAPPING PROGRESS === */}
         <MappingProgress
           degree1={mapping.degree1}
@@ -467,15 +374,38 @@ function ProfileInner() {
           background: 'rgba(255,255,255,0.04)', borderRadius: 12, padding: 20,
           border: '1px solid rgba(255,255,255,0.08)',
         }}>
-          <h3 style={{ fontSize: 14, fontWeight: 700, marginTop: 0, marginBottom: 12 }}>Your Sectors</h3>
-          <div style={{ display: 'flex', flexWrap: 'wrap', gap: 6 }}>
-            {profile.sectors.map((s, i) => (
-              <span key={i} style={{
-                padding: '4px 12px', borderRadius: 20, fontSize: 11, fontWeight: 600,
-                background: 'rgba(52,152,219,0.15)', border: '1px solid rgba(52,152,219,0.3)', color: '#3498DB',
-              }}>{s}</span>
-            ))}
+          <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 12 }}>
+            <h3 style={{ fontSize: 14, fontWeight: 700, margin: 0 }}>Your Sectors</h3>
+            <Link href="/settings#sector" style={{ fontSize: 11, color: '#3498DB', textDecoration: 'none', fontWeight: 600 }}>
+              {sectorFocus?.sectors?.length ? 'Change' : sectorFocus && !sectorFocus.failed ? 'Pick in Settings' : 'Settings'} &rarr;
+            </Link>
           </div>
+          {!sectorFocus ? (
+            <div style={{ fontSize: 12, color: '#888' }}>Loading…</div>
+          ) : sectorFocus.failed ? (
+            <div style={{ fontSize: 12, color: '#ff7676' }}>
+              Couldn&rsquo;t load your sectors. Reload this page, or open Settings to see them.
+            </div>
+          ) : sectorFocus.sectors?.length ? (
+            <div style={{ display: 'flex', flexWrap: 'wrap', gap: 6, alignItems: 'center' }}>
+              {sectorFocus.sectors.map((key) => {
+                const ind = sectorByKey(key);
+                return (
+                  <span key={key} style={{
+                    padding: '4px 12px', borderRadius: 20, fontSize: 11, fontWeight: 600,
+                    background: `${ind.color}26`, border: `1px solid ${ind.color}66`, color: ind.color,
+                  }}>{ind.label}</span>
+                );
+              })}
+              <span style={{ fontSize: 11, color: '#888' }}>
+                {sectorFocus.strength === 'strong' ? 'Strong' : 'Lean'}: companies here count for more in your scores.
+              </span>
+            </div>
+          ) : (
+            <div style={{ fontSize: 12, color: '#888' }}>
+              None picked. Pick up to three in Settings and companies in them count for more in your scores.
+            </div>
+          )}
         </div>
 
       </div>
@@ -495,78 +425,3 @@ function StatCard({ label, value, color }) {
     </div>
   );
 }
-
-function SetupScrapeCard({ status, log, onStart, onRetry }) {
-  return (
-    <div style={{
-      background: 'rgba(52,152,219,0.06)', borderRadius: 12, padding: 20, marginBottom: 24,
-      border: '1px solid rgba(52,152,219,0.2)',
-    }}>
-      <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 8 }}>
-        <h3 style={{ fontSize: 14, fontWeight: 700, margin: 0, color: '#3498DB' }}>Account Setup</h3>
-        {status === 'done' && <span style={{ fontSize: 10, color: '#00ff88', fontWeight: 600 }}>Complete</span>}
-      </div>
-      <p style={{ fontSize: 11, color: '#888', margin: '0 0 12px' }}>
-        Full scrape of all your LinkedIn connections with profile photos. Takes 3-5 minutes.
-      </p>
-
-      {status === 'idle' && (
-        <button onClick={onStart} style={{
-          width: '100%', padding: '12px', borderRadius: 8, border: 'none', cursor: 'pointer',
-          background: 'linear-gradient(135deg, #3498DB, #9B59B6)',
-          color: '#fff', fontWeight: 700, fontSize: 14,
-        }}>
-          Set Up Account — Full Scrape
-        </button>
-      )}
-
-      {status === 'offline' && (
-        <div>
-          <div style={{ padding: '10px', borderRadius: 8, background: 'rgba(255,80,80,0.1)', border: '1px solid rgba(255,80,80,0.3)', color: '#ff5050', fontSize: 12, marginBottom: 8, textAlign: 'center' }}>
-            Scraper server offline
-          </div>
-          <p style={{ fontSize: 10, color: '#888', textAlign: 'center', marginBottom: 8 }}>
-            Open the <strong>Scan</strong> page to finish setting the scraper up
-          </p>
-          <button onClick={onRetry} style={{
-            width: '100%', padding: '10px', borderRadius: 8, border: 'none', cursor: 'pointer',
-            background: 'rgba(255,255,255,0.1)', color: '#aaa', fontWeight: 600, fontSize: 12,
-          }}>Retry</button>
-        </div>
-      )}
-
-      {status === 'running' && (
-        <div style={{
-          padding: '10px', borderRadius: 8, background: 'rgba(52,152,219,0.1)',
-          border: '1px solid rgba(52,152,219,0.3)',
-        }}>
-          <div style={{ display: 'flex', alignItems: 'center', gap: 6, marginBottom: 4 }}>
-            <div style={{ width: 8, height: 8, borderRadius: '50%', background: '#3498DB', animation: 'pulse 1s infinite' }} />
-            <span style={{ fontSize: 11, fontWeight: 600, color: '#3498DB' }}>Scanning all connections...</span>
-          </div>
-          <div style={{ fontFamily: 'monospace', fontSize: 10, color: '#888', maxHeight: 120, overflow: 'auto' }}>
-            {log.map((l, i) => <div key={i}>{l}</div>)}
-          </div>
-        </div>
-      )}
-
-      {status === 'done' && (
-        <div style={{ padding: '10px', borderRadius: 8, background: 'rgba(0,255,136,0.1)', border: '1px solid rgba(0,255,136,0.3)', color: '#00ff88', fontSize: 12, fontWeight: 600, textAlign: 'center' }}>
-          All connections scraped with images! Refresh the app to see your network.
-        </div>
-      )}
-
-      {status === 'error' && (
-        <div>
-          <div style={{ padding: '10px', borderRadius: 8, background: 'rgba(255,80,80,0.1)', border: '1px solid rgba(255,80,80,0.3)', color: '#ff5050', fontSize: 12, textAlign: 'center', marginBottom: 8 }}>
-            Something went wrong
-          </div>
-          <button onClick={onRetry} style={{
-            width: '100%', padding: '10px', borderRadius: 8, border: 'none', cursor: 'pointer',
-            background: 'rgba(255,255,255,0.1)', color: '#aaa', fontWeight: 600, fontSize: 12,
-          }}>Try Again</button>
-        </div>
-      )}
-    </div>
-  );
-}

package/.next/standalone/app/queue/page.js

@@ -6,15 +6,21 @@ import { IS_DEMO } from '../../lib/demo';
 import OutlinkQuest from '../components/OutlinkQuest';
 import OnboardingGate from '../components/OnboardingGate';
 import { useUser } from '../components/UserProvider';
+import { rowCompanyScore, TOP_COMPANY } from '../../lib/scoring';
 import Link from 'next/link';
 
 const TIER_COLORS = { S: '#FFD700', A: '#9B59B6', B: '#3498DB', C: '#95A5A6', D: '#BDC3C7' };
-const PRESTIGE = ['snap', 'google', 'meta', 'apple', 'amazon', 'microsoft', 'netflix', 'tesla', 'spotify', 'tiktok', 'coca-cola', 'nike', 'disney', 'palantir', 'stripe', 'coinbase', 'polymarket', 'pinterest', 'whatnot', 'blackrock', 'anduril'];
 
+// Who to reach first: power, +1 when the company their score is built on is a
+// top one by the model's own scores (TOP_COMPANY: the curated list's major
+// companies and up, or one you or your sector score that high), a nudge for
+// the free-text sectors on your profile, then a lift for S and A. The +1 used
+// to come from a list of one person's favourite names, matched anywhere in the
+// headline, once per name: "Metadata" counted as Meta, "Ex-Google" as Google.
 function calculatePriority(person, sectors) {
   let score = parseFloat(person.power_score) || 0;
   const hl = (person.headline || '').toLowerCase();
-  PRESTIGE.forEach(c => { if (hl.includes(c)) score += 1; });
+  if (rowCompanyScore(person) >= TOP_COMPANY) score += 1;
   (sectors || []).forEach(s => { if (hl.includes(s.toLowerCase())) score += 0.5; });
   if (person.tier === 'S') score *= 1.5;
   else if (person.tier === 'A') score *= 1.2;

package/.next/standalone/app/settings/page.js

@@ -0,0 +1,96 @@
+'use client';
+
+import { useEffect, useState } from 'react';
+import Link from 'next/link';
+import OnboardingGate from '../components/OnboardingGate';
+import UpdatePanel from '../components/UpdatePanel';
+import SectorSection from '../components/settings/SectorSection';
+import DataSection from '../components/settings/DataSection';
+import { Section, Body, Mono, LINE, FONT } from '../components/ui';
+import { IS_DEMO } from '../../lib/demo';
+
+// Settings: one page for the choices that shape how the app treats your data,
+// and the facts about this copy. Each feature adds its own <Section>; what the
+// user chooses is saved in the database (lib/settings.js), so it travels with
+// their data.
+
+export default function SettingsPage() {
+  return <OnboardingGate><SettingsInner /></OnboardingGate>;
+}
+
+const KIND_LABEL = {
+  'mac-app': 'the Mac app',
+  npm: 'the npm package (npx six-degrees)',
+  source: 'a copy built from the source code',
+  git: 'a git checkout of the source code',
+};
+
+function SettingsInner() {
+  const [info, setInfo] = useState(null);
+  const [error, setError] = useState(null);
+
+  useEffect(() => {
+    fetch('/api/settings')
+      .then((r) => r.json().then((d) => (r.ok ? d : Promise.reject(new Error(d.error || 'Could not load settings.')))))
+      .then(setInfo)
+      .catch((e) => setError(e.message));
+  }, []);
+
+  if (IS_DEMO) {
+    return (
+      <div style={{
+        minHeight: '100vh', background: '#0a0a1a', color: 'rgba(255,255,255,0.7)',
+        display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center',
+        gap: 12, textAlign: 'center', padding: 24, fontFamily: FONT,
+      }}>
+        <h2 style={{ margin: 0, fontSize: 20, fontWeight: 700, color: '#fff' }}>Not part of the demo</h2>
+        <p style={{ margin: 0, fontSize: 13 }}>The public demo includes the Network Circle and Degrees views only.</p>
+        <Link href="/" style={{ fontSize: 12, color: 'rgba(255,255,255,0.5)', textDecoration: 'none' }}>&larr; Back to the network</Link>
+      </div>
+    );
+  }
+
+  const about = info?.about;
+
+  return (
+    <div style={{ minHeight: '100vh', background: '#0a0a1a', color: '#fff', fontFamily: FONT }}>
+      <header style={{ padding: '16px 24px', borderBottom: LINE, display: 'flex', alignItems: 'center', gap: 16 }}>
+        <Link href="/" style={{
+          display: 'flex', alignItems: 'center', gap: 6, color: '#888', textDecoration: 'none',
+          fontSize: 13, fontWeight: 600, padding: '6px 14px', borderRadius: 6,
+          background: 'rgba(255,255,255,0.06)', border: LINE,
+        }}>← Back to Map</Link>
+        <h1 style={{
+          fontSize: 22, fontWeight: 700, margin: 0,
+          background: 'linear-gradient(135deg, #FFD700, #9B59B6, #3498DB)',
+          WebkitBackgroundClip: 'text', WebkitTextFillColor: 'transparent',
+        }}>Settings</h1>
+      </header>
+
+      <main style={{ maxWidth: 720, margin: '0 auto', padding: '8px 24px 64px' }}>
+        {error && <Body style={{ color: '#ff7676', marginTop: 16 }}>{error}</Body>}
+
+        <UpdatePanel />
+        <SectorSection />
+
+        <DataSection />
+
+        <Section id="about" title="About this copy">
+          {about ? (
+            <>
+              <Body>Version <Mono>{about.version}</Mono>, running as {KIND_LABEL[about.kind] || about.kind}.</Body>
+              <Body>
+                Your network is kept in <Mono>{about.dataDir}</Mono>
+                {about.customDataDir ? ' (a folder you chose).' : '.'}
+                {about.kind === 'mac-app' && ' Help → Show the Data Folder opens it.'}
+              </Body>
+              <Body style={{ fontSize: 12, color: '#667', marginTop: 10 }}>
+                Settings are saved with your network, on this computer. Nothing here is sent anywhere.
+              </Body>
+            </>
+          ) : !error && <Body>Loading…</Body>}
+        </Section>
+      </main>
+    </div>
+  );
+}