slavazeph-coder · slavazeph-coder · May 2, 2026 · May 2, 2026
diff --git a/brainsnn-r3f-app/index.html b/brainsnn-r3f-app/index.html
@@ -3,20 +3,20 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>BrainSNN — Paste any tweet. See which feeling it installs.</title>
-    <meta name="description" content="A 3D brain that reads manipulation in real time. 35 cognitive layers, browser-native, zero install." />
+    <title>BrainSNN — Affective-Intelligence Engine for the Open Web</title>
+    <meta name="description" content="An affective-intelligence engine that detects the emotional payload inside online content before it shapes attention, behavior, brand risk, or public perception. Browser-native, auditable, MIT." />
 
     <meta property="og:type" content="website" />
     <meta property="og:site_name" content="BrainSNN" />
     <meta property="og:url" content="https://brainsnn.com" />
-    <meta property="og:title" content="BrainSNN — Paste any tweet. See which feeling it installs." />
-    <meta property="og:description" content="A 3D brain that reads manipulation in real time. 35 cognitive layers, browser-native, zero install." />
-    <meta property="og:image" content="https://brainsnn.com/api/og?title=BrainSNN&subtitle=Paste+any+tweet.+See+which+feeling+it+installs." />
+    <meta property="og:title" content="BrainSNN — See the emotional payload of any post" />
+    <meta property="og:description" content="Score any text across urgency, outrage, false certainty, and fear — with named manipulation templates, a live 3D brain, and a deterministic receipt per scan." />
+    <meta property="og:image" content="https://brainsnn.com/api/og?title=BrainSNN&subtitle=See+the+emotional+payload+of+any+post" />
 
     <meta name="twitter:card" content="summary_large_image" />
-    <meta name="twitter:title" content="BrainSNN — Paste any tweet. See which feeling it installs." />
-    <meta name="twitter:description" content="A 3D brain that reads manipulation in real time. 35 cognitive layers, browser-native." />
-    <meta name="twitter:image" content="https://brainsnn.com/api/og?title=BrainSNN&subtitle=Paste+any+tweet.+See+which+feeling+it+installs." />
+    <meta name="twitter:title" content="BrainSNN — See the emotional payload of any post" />
+    <meta name="twitter:description" content="Affective-intelligence engine: score any text across urgency, outrage, false certainty, and fear with auditable evidence and a live 3D brain." />
+    <meta name="twitter:image" content="https://brainsnn.com/api/og?title=BrainSNN&subtitle=See+the+emotional+payload+of+any+post" />
 
     <link rel="manifest" href="/manifest.webmanifest" />
     <meta name="theme-color" content="#0b1224" />

diff --git a/brainsnn-r3f-app/src/App.jsx b/brainsnn-r3f-app/src/App.jsx
@@ -81,6 +81,7 @@ import HotkeyMap from './components/HotkeyMap';
 import ThemePanel from './components/ThemePanel';
 import CommunityPackPanel from './components/CommunityPackPanel';
 import MilestonePanel from './components/MilestonePanel';
+import BrandRiskPanel from './components/BrandRiskPanel';
 import { registerServiceWorker } from './utils/pwa';
 import { registerTheme } from './utils/theme';
 import DreamModePanel from './components/DreamModePanel';
@@ -779,6 +780,10 @@ export default function App() {
             <MilestonePanel />
           </ErrorBoundary>
 
+          <ErrorBoundary name="Brand Risk Scorecard">
+            <BrandRiskPanel />
+          </ErrorBoundary>
+
           <ErrorBoundary name="Dream Mode">
             <DreamModePanel />
           </ErrorBoundary>

diff --git a/brainsnn-r3f-app/src/components/BrandRiskPanel.jsx b/brainsnn-r3f-app/src/components/BrandRiskPanel.jsx
@@ -0,0 +1,228 @@
+import React, { useMemo, useState } from 'react';
+import { computeBrandRisk, brandBriefMarkdown, splitItems } from '../utils/brandRisk.js';
+
+/**
+ * Layer 106 — Brand Risk Scorecard
+ *
+ * Per-brand aggregator over the Cognitive Firewall + Templates +
+ * Archetypes. Paste a brand name + a list of items (mentions, ad copy,
+ * reviews, replies), get a single 0–100 score with a tier, the dominant
+ * archetypes, the most-fired templates, and the worst items.
+ *
+ * Surfaces the affective-intelligence positioning to teams who don't
+ * scan one tweet at a time — they read inboxes, mention streams, ad
+ * libraries, and need the headline number first.
+ */
+
+const SAMPLE = `Act now or you'll miss the launch — only 12 spots left and our CEO personally vouches for every founder we let in. The window closes at midnight.
+---
+Honestly, every one of you who's still defending this brand needs to look in the mirror. You're either with us or you're part of the problem. Wake up.
+---
+We've quietly rolled out a small UX update this week. Let us know if anything feels off — we're tracking feedback in the linked thread and will iterate next sprint.
+---
+URGENT: Your account has been flagged for unusual activity. Verify your identity within 24 hours or access will be permanently suspended. Click below to confirm.
+---
+The mainstream press will never tell you the real story behind this acquisition. The truth is hidden in plain sight. Connect the dots.`;
+
+export default function BrandRiskPanel() {
+  const [brand, setBrand] = useState('');
+  const [blob, setBlob] = useState('');
+  const [report, setReport] = useState(null);
+  const [copied, setCopied] = useState(false);
+
+  const itemCountPreview = useMemo(() => splitItems(blob).length, [blob]);
+
+  function handleScan() {
+    const items = splitItems(blob);
+    const next = computeBrandRisk(items);
+    setReport(next);
+  }
+
+  function handleSample() {
+    setBlob(SAMPLE);
+    if (!brand) setBrand('Sample Brand');
+  }
+
+  function handleClear() {
+    setBlob('');
+    setReport(null);
+  }
+
+  async function handleCopyBrief() {
+    if (!report) return;
+    const md = brandBriefMarkdown(brand, report);
+    try {
+      await navigator.clipboard.writeText(md);
+      setCopied(true);
+      window.setTimeout(() => setCopied(false), 1800);
+    } catch (_err) {
+      setCopied(false);
+    }
+  }
+
+  return (
+    <section className="panel panel-pad brand-risk-panel">
+      <div className="eyebrow">Layer 106 · brand risk scorecard</div>
+      <h2 style={{ marginTop: 4 }}>Score a brand's emotional payload</h2>
+      <p className="muted" style={{ maxWidth: 720 }}>
+        Paste a name and a stream of mentions, ad variants, reviews, or replies. The engine scores
+        every item, names the manipulation archetypes that fire, and rolls them into a single 0–100
+        risk number with a clear tier.
+      </p>
+
+      <div style={{ display: 'grid', gap: 10, marginTop: 12 }}>
+        <input
+          type="text"
+          placeholder="Brand or entity (e.g. Acme, @handle, Channel 7…)"
+          value={brand}
+          onChange={(e) => setBrand(e.target.value)}
+          className="brand-risk-input"
+          style={{ padding: '10px 12px', borderRadius: 8, background: 'rgba(0,0,0,0.25)', border: '1px solid rgba(255,255,255,0.08)', color: '#f1ece5' }}
+        />
+        <textarea
+          placeholder={'Paste items separated by blank lines or --- delimiters.\n\nE.g. mentions, ad creative variants, reviews, inbound replies…'}
+          value={blob}
+          onChange={(e) => setBlob(e.target.value)}
+          rows={10}
+          style={{ padding: '12px', borderRadius: 8, background: 'rgba(0,0,0,0.25)', border: '1px solid rgba(255,255,255,0.08)', color: '#f1ece5', fontFamily: 'inherit' }}
+        />
+        <div style={{ display: 'flex', gap: 8, alignItems: 'center', flexWrap: 'wrap' }}>
+          <button className="btn primary" onClick={handleScan} disabled={!blob.trim()}>Score brand</button>
+          <button className="btn-sm" onClick={handleSample}>Load sample</button>
+          <button className="btn-sm" onClick={handleClear} disabled={!blob && !report}>Clear</button>
+          <span className="muted small-note" style={{ marginLeft: 'auto' }}>
+            {itemCountPreview} item{itemCountPreview === 1 ? '' : 's'} detected
+          </span>
+        </div>
+      </div>
+
+      {report && (
+        <div style={{ marginTop: 18 }}>
+          <div
+            style={{
+              display: 'flex',
+              alignItems: 'center',
+              gap: 16,
+              padding: '14px 16px',
+              borderRadius: 10,
+              borderLeft: `4px solid ${report.tier.color}`,
+              background: 'rgba(0,0,0,0.22)',
+            }}
+          >
+            <div>
+              <div className="muted small-note">Brand Risk</div>
+              <strong style={{ fontSize: 44, color: report.tier.color, lineHeight: 1 }}>{report.score}</strong>
+              <span className="muted" style={{ marginLeft: 8 }}>/ 100</span>
+            </div>
+            <div>
+              <div className="muted small-note">Tier</div>
+              <strong style={{ fontSize: 20, color: report.tier.color }}>{report.tier.label}</strong>
+            </div>
+            <div>
+              <div className="muted small-note">Items scored</div>
+              <strong style={{ fontSize: 20 }}>{report.itemCount}</strong>
+            </div>
+            <div>
+              <div className="muted small-note">Mean pressure</div>
+              <strong style={{ fontSize: 20 }}>{Math.round(report.meanPressure * 100)}%</strong>
+            </div>
+            <div>
+              <div className="muted small-note">Peak pressure</div>
+              <strong style={{ fontSize: 20 }}>{Math.round(report.peakPressure * 100)}%</strong>
+            </div>
+            <div>
+              <div className="muted small-note">High-risk items</div>
+              <strong style={{ fontSize: 20 }}>{report.highRiskCount}</strong>
+            </div>
+            <button className="btn-sm" style={{ marginLeft: 'auto' }} onClick={handleCopyBrief}>
+              {copied ? 'Copied' : 'Copy brief (Markdown)'}
+            </button>
+          </div>
+
+          {report.topArchetypes.length > 0 && (
+            <div style={{ marginTop: 14 }}>
+              <div className="eyebrow" style={{ marginBottom: 6 }}>Dominant archetypes</div>
+              <div style={{ display: 'flex', flexWrap: 'wrap', gap: 6 }}>
+                {report.topArchetypes.map((a) => (
+                  <span
+                    key={a.id}
+                    style={{
+                      padding: '4px 10px',
+                      borderRadius: 999,
+                      fontSize: 12,
+                      background: a.highRisk ? 'rgba(216,110,120,0.18)' : 'rgba(168,111,223,0.16)',
+                      border: `1px solid ${a.highRisk ? 'rgba(216,110,120,0.55)' : 'rgba(168,111,223,0.45)'}`,
+                      color: '#f1ece5',
+                    }}
+                    title={a.highRisk ? 'High-risk archetype' : 'Archetype'}
+                  >
+                    {a.label} · {a.count}
+                  </span>
+                ))}
+              </div>
+            </div>
+          )}
+
+          {report.topTemplates.length > 0 && (
+            <div style={{ marginTop: 12 }}>
+              <div className="eyebrow" style={{ marginBottom: 6 }}>Most-fired templates</div>
+              <div style={{ display: 'flex', flexWrap: 'wrap', gap: 6 }}>
+                {report.topTemplates.map((t) => (
+                  <span
+                    key={t.id}
+                    style={{
+                      padding: '4px 10px',
+                      borderRadius: 999,
+                      fontSize: 12,
+                      background: 'rgba(95,183,193,0.14)',
+                      border: '1px solid rgba(95,183,193,0.4)',
+                      color: '#f1ece5',
+                    }}
+                  >
+                    {t.label} · {t.count}
+                  </span>
+                ))}
+              </div>
+            </div>
+          )}
+
+          {report.worstItems.length > 0 && (
+            <div style={{ marginTop: 14 }}>
+              <div className="eyebrow" style={{ marginBottom: 6 }}>Worst items</div>
+              <ol style={{ margin: 0, paddingLeft: 20, display: 'grid', gap: 10 }}>
+                {report.worstItems.map((it, idx) => {
+                  const pct = Math.round(it.pressure * 100);
+                  return (
+                    <li key={idx} style={{ background: 'rgba(0,0,0,0.18)', padding: '10px 12px', borderRadius: 8 }}>
+                      <div style={{ display: 'flex', gap: 10, alignItems: 'baseline', flexWrap: 'wrap' }}>
+                        <strong style={{ color: pct >= 60 ? '#d86e78' : pct >= 35 ? '#fdab43' : '#5ee69a' }}>
+                          {pct}%
+                        </strong>
+                        {it.archetypes.slice(0, 3).map((a) => (
+                          <span
+                            key={a.id}
+                            className="muted small-note"
+                            style={{ padding: '2px 8px', borderRadius: 999, background: 'rgba(255,255,255,0.05)' }}
+                          >
+                            {a.label}
+                          </span>
+                        ))}
+                      </div>
+                      <div className="muted" style={{ marginTop: 4, fontSize: 13 }}>{it.excerpt}</div>
+                    </li>
+                  );
+                })}
+              </ol>
+            </div>
+          )}
+
+          {report.itemCount === 0 && (
+            <p className="muted" style={{ marginTop: 12 }}>
+              No items long enough to score. Each item should be at least 5 words.
+            </p>
+          )}
+        </div>
+      )}
+    </section>
+  );
+}
diff --git a/brainsnn-r3f-app/src/components/MilestonePanel.jsx b/brainsnn-r3f-app/src/components/MilestonePanel.jsx
@@ -34,10 +34,12 @@ export default function MilestonePanel() {
         <span className="muted" style={{ marginLeft: 10 }}>cognitive layers shipped</span>
       </h2>
       <p className="muted" style={{ maxWidth: 720 }}>
-        BrainSNN started as a 3D brain viewer. It grew into a Cognitive
-        Firewall, then a multimodal analysis suite, then a progression
-        system, then a multi-device share surface, then an extensible API.
-        Every layer is still one scroll away.
+        BrainSNN is an affective-intelligence engine that detects the emotional
+        payload inside online content before it shapes attention, behavior,
+        brand risk, or public perception. It started as a 3D brain viewer,
+        grew into a Cognitive Firewall, a multimodal analysis suite, a
+        progression system, a share surface, and a public API. Every layer
+        is still one scroll away.
       </p>
 
       <div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(180px, 1fr))', gap: 10, marginTop: 16 }}>

diff --git a/brainsnn-r3f-app/src/components/OnboardingWalkthrough.jsx b/brainsnn-r3f-app/src/components/OnboardingWalkthrough.jsx
@@ -3,37 +3,37 @@ import React, { useEffect, useState } from 'react';
 const STEPS = [
   {
     title: 'Welcome to BrainSNN',
-    body: 'A neuromorphic brain visualiser powered by React Three Fiber, Meta TRIBE v2, and Google Gemma 4. Let\'s take a quick tour.',
+    body: 'An affective-intelligence engine that detects the emotional payload inside online content before it shapes attention, behavior, brand risk, or public perception. Quick tour:',
     target: null
   },
   {
-    title: '3D Brain Viewer',
-    body: 'The main canvas renders 7 brain regions connected by 10 neural pathways with GPU-animated signal flow. Click any region to inspect it.',
+    title: '3D brain — the visualization layer',
+    body: 'The brain is the readout, not the headline. 7 regions and 10 pathways react in real time as the engine absorbs whatever you feed it. Click a region to inspect it.',
     target: '.viewer-panel'
   },
   {
-    title: 'Control Bar',
-    body: 'Play/pause the simulation, trigger bursts, switch scenarios, toggle quality tiers, and choose your data mode — Simulation, TRIBE v2, or Live EEG.',
-    target: '.controls-bar'
+    title: 'Cognitive Firewall — the engine',
+    body: 'Paste a tweet, an inbox, or a press release. The engine scores it across four affective dimensions, names the manipulation templates that fire, and returns evidence words plus a deterministic receipt.',
+    target: '.cognitive-firewall-panel'
   },
   {
-    title: 'Neural Analytics',
-    body: 'Real-time sparklines, correlation matrix, anomaly detection, and threshold alerts. Expand for the full mission-control view.',
-    target: '.analytics-dashboard'
+    title: 'Brand Risk Scorecard',
+    body: 'Working with mention streams, ad copy, or a review pile? Layer 106 rolls many items into one 0–100 brand risk score with a tier and a copy-ready brief.',
+    target: '.brand-risk-panel'
   },
   {
-    title: 'Cognitive Firewall',
-    body: 'Paste any content to score manipulation patterns. When Gemma 4 is configured, analysis upgrades from regex to AI-powered deep scanning.',
-    target: '.cognitive-firewall-panel'
+    title: 'Controls & data modes',
+    body: 'Play/pause the brain, trigger bursts, switch scenarios, toggle quality tiers, and pick your data mode — Simulation, TRIBE v2 fMRI, or Live EEG.',
+    target: '.controls-bar'
   },
   {
-    title: 'Snapshots & Sharing',
-    body: 'Save brain states, compare them side-by-side, generate reports, and share via URL or embed code.',
+    title: 'Snapshots, share, audit',
+    body: 'Save brain states, compare them side-by-side, export receipts, and share scans via /r/<hash> URLs or iframe embeds.',
     target: '.snapshot-panel'
   },
   {
-    title: 'You\'re Ready!',
-    body: 'Press ? anytime for keyboard shortcuts. Explore the brain, scan content, and see your neural network come alive.',
+    title: 'You\'re ready',
+    body: 'Press ? for keyboard shortcuts, ⌘K to jump to any layer. Try the Firewall first, then the Brand Risk Scorecard.',
     target: null
   }
 ];