From fb0e88d71dd05e2f5826bc7fd6ffda40877d9fd9 Mon Sep 17 00:00:00 2001
From: manager <alexanyanwolf@gmail.com>
Date: Thu, 16 Jul 2026 20:40:09 +0000
Subject: [PATCH 1/7] feat: 10 new OffSec bias cases + 4 card surfaces (call,
 document, poster, timeline)

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 .../OffsecBiasView/OffsecBiasView.module.scss | 385 ++++++++++++++++++
 .../OffsecBiasView/OffsecBiasView.tsx         | 145 +++++++
 src/uxcore/data/biasOffsec/baseRateFallacy.ts |  50 +++
 .../data/biasOffsec/bizarrenessEffect.ts      |  56 +++
 src/uxcore/data/biasOffsec/contextEffect.ts   |  54 +++
 .../data/biasOffsec/cueDependentForgetting.ts |  51 +++
 src/uxcore/data/biasOffsec/empathyGap.ts      |  51 +++
 .../data/biasOffsec/frequencyIllusion.ts      |  66 +++
 src/uxcore/data/biasOffsec/humorEffect.ts     |  49 +++
 src/uxcore/data/biasOffsec/index.ts           |  20 +
 .../biasOffsec/moodCongruentMemoryBias.ts     |  52 +++
 src/uxcore/data/biasOffsec/omissionBias.ts    |  50 +++
 .../biasOffsec/pictureSuperiorityEffect.ts    |  51 +++
 src/uxcore/data/biasOffsec/types.ts           |  63 ++-
 14 files changed, 1139 insertions(+), 4 deletions(-)
 create mode 100644 src/uxcore/data/biasOffsec/baseRateFallacy.ts
 create mode 100644 src/uxcore/data/biasOffsec/bizarrenessEffect.ts
 create mode 100644 src/uxcore/data/biasOffsec/contextEffect.ts
 create mode 100644 src/uxcore/data/biasOffsec/cueDependentForgetting.ts
 create mode 100644 src/uxcore/data/biasOffsec/empathyGap.ts
 create mode 100644 src/uxcore/data/biasOffsec/frequencyIllusion.ts
 create mode 100644 src/uxcore/data/biasOffsec/humorEffect.ts
 create mode 100644 src/uxcore/data/biasOffsec/moodCongruentMemoryBias.ts
 create mode 100644 src/uxcore/data/biasOffsec/omissionBias.ts
 create mode 100644 src/uxcore/data/biasOffsec/pictureSuperiorityEffect.ts

diff --git a/src/uxcore/components/OffsecBiasView/OffsecBiasView.module.scss b/src/uxcore/components/OffsecBiasView/OffsecBiasView.module.scss
index b0e624a3..4c062949 100644
--- a/src/uxcore/components/OffsecBiasView/OffsecBiasView.module.scss
+++ b/src/uxcore/components/OffsecBiasView/OffsecBiasView.module.scss
@@ -220,6 +220,14 @@ $ks-crimson-deep: #7a2618;
   }
 }
 
+// Generic lead-in line (mirrors .chatPrior) for non-chat surfaces.
+.cardPrior {
+  font-size: 13px;
+  font-style: italic;
+  color: $ks-ink-soft;
+  padding-left: 4px;
+}
+
 // === Browser surface =======================================================
 
 .card_browser {
@@ -467,6 +475,285 @@ $ks-crimson-deep: #7a2618;
   border-color: $ks-crimson;
 }
 
+// === Call surface ==========================================================
+
+.card_call {
+  gap: 8px;
+
+  .callHeader {
+    display: flex;
+    align-items: flex-start;
+    gap: 10px;
+  }
+
+  .callIcon {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 28px;
+    height: 28px;
+    border-radius: 50%;
+    background: $ks-crimson;
+    color: #ffffff;
+    flex-shrink: 0;
+  }
+
+  .callIdentity {
+    display: flex;
+    flex-direction: column;
+    line-height: 1.2;
+    flex: 1;
+    min-width: 0;
+  }
+
+  .callKicker {
+    font-family: 'IBM Plex Mono', 'Menlo', 'Monaco', monospace;
+    font-size: 10px;
+    letter-spacing: 0.14em;
+    text-transform: uppercase;
+    color: $ks-crimson;
+  }
+
+  .callName {
+    font-size: 15px;
+    font-weight: 700;
+    color: $ks-ink;
+    margin-top: 2px;
+  }
+
+  .callSub {
+    font-family: 'IBM Plex Mono', 'Menlo', 'Monaco', monospace;
+    font-size: 11px;
+    color: $ks-ink-soft;
+    margin-top: 2px;
+  }
+
+  .callTranscript {
+    display: flex;
+    gap: 6px;
+    align-items: flex-start;
+    font-size: 14px;
+    line-height: 1.5;
+    font-style: italic;
+    color: $ks-ink;
+  }
+
+  .callActions {
+    display: flex;
+    justify-content: center;
+    gap: 28px;
+    margin-top: 4px;
+
+    span {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 30px;
+      height: 30px;
+      border-radius: 50%;
+      font-size: 13px;
+      color: #ffffff;
+    }
+
+    .callDecline {
+      background: $ks-crimson;
+    }
+
+    .callAccept {
+      background: #2a8a4a;
+    }
+  }
+}
+
+// === Document surface ======================================================
+
+.card_document {
+  gap: 6px;
+  // Paper feel: a subtle top "letterhead" band via border.
+  border-top: 3px solid $ks-rule;
+
+  .docHeader {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+  }
+
+  .docLogo {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 24px;
+    height: 24px;
+    font-size: 15px;
+    background: $ks-paper;
+    border: 1px solid $ks-rule;
+    border-radius: 4px;
+    flex-shrink: 0;
+  }
+
+  .docLabel {
+    font-family: 'IBM Plex Mono', 'Menlo', 'Monaco', monospace;
+    font-size: 10px;
+    letter-spacing: 0.16em;
+    text-transform: uppercase;
+    color: $ks-ink-soft;
+  }
+
+  .docMeta {
+    font-family: 'IBM Plex Mono', 'Menlo', 'Monaco', monospace;
+    font-size: 11px;
+    color: $ks-ink-soft;
+  }
+
+  .docFooter {
+    margin-top: 4px;
+    padding-top: 6px;
+    border-top: 1px dashed $ks-rule;
+    font-family: 'IBM Plex Mono', 'Menlo', 'Monaco', monospace;
+    font-size: 11px;
+    color: $ks-ink-soft;
+  }
+}
+
+.card_document.cardFlagged {
+  border-top-color: $ks-crimson;
+}
+
+// === Poster surface ========================================================
+
+.card_poster {
+  align-items: center;
+  text-align: center;
+  gap: 8px;
+  background: $ks-paper;
+  position: relative;
+
+  // Bit of "tape" holding the poster to the wall.
+  .posterTape {
+    position: absolute;
+    top: -6px;
+    left: 50%;
+    transform: translateX(-50%) rotate(-2deg);
+    width: 52px;
+    height: 12px;
+    background: rgba(27, 30, 38, 0.08);
+    border: 1px solid rgba(27, 30, 38, 0.06);
+  }
+
+  .posterHeading {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 6px;
+    margin-top: 6px;
+    font-size: 16px;
+    font-weight: 800;
+    letter-spacing: 0.01em;
+    color: $ks-ink;
+    line-height: 1.3;
+  }
+
+  .posterBody {
+    font-size: 13.5px;
+    line-height: 1.5;
+    color: $ks-ink-soft;
+    max-width: 260px;
+  }
+
+  .posterQr {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 8px;
+    margin-top: 2px;
+    background: #ffffff;
+    border: 1px solid $ks-rule;
+    border-radius: 4px;
+    color: $ks-ink;
+  }
+
+  .posterCaption {
+    font-family: 'IBM Plex Mono', 'Menlo', 'Monaco', monospace;
+    font-size: 10.5px;
+    letter-spacing: 0.06em;
+    color: $ks-ink-soft;
+  }
+}
+
+.card_poster.cardFlagged .posterQr {
+  border-color: $ks-crimson;
+  color: $ks-crimson-deep;
+}
+
+// === Timeline surface ======================================================
+
+.card_timeline {
+  gap: 0;
+
+  .timeline {
+    display: flex;
+    flex-direction: column;
+  }
+
+  .timelineItem {
+    display: flex;
+    gap: 10px;
+    padding: 7px 0;
+    border-bottom: 1px dashed $ks-rule-soft;
+
+    &:last-child {
+      border-bottom: none;
+      padding-bottom: 2px;
+    }
+  }
+
+  .timelineLabel {
+    display: flex;
+    align-items: center;
+    gap: 5px;
+    font-family: 'IBM Plex Mono', 'Menlo', 'Monaco', monospace;
+    font-size: 10px;
+    letter-spacing: 0.1em;
+    text-transform: uppercase;
+    color: $ks-ink-soft;
+    flex-shrink: 0;
+    width: 56px;
+    padding-top: 2px;
+  }
+
+  .timelineBody {
+    display: flex;
+    flex-direction: column;
+    gap: 1px;
+    min-width: 0;
+  }
+
+  .timelineSource {
+    font-family: 'IBM Plex Mono', 'Menlo', 'Monaco', monospace;
+    font-size: 10.5px;
+    color: $ks-ink-soft;
+    opacity: 0.8;
+  }
+
+  .timelineText {
+    font-size: 13.5px;
+    line-height: 1.45;
+    color: $ks-ink;
+  }
+
+  .timelineItemFlagged {
+    .timelineLabel,
+    .timelineSource {
+      color: $ks-crimson;
+      opacity: 1;
+    }
+
+    .timelineText {
+      font-weight: 600;
+    }
+  }
+}
+
 .cardDivider {
   display: flex;
   align-items: center;
@@ -734,6 +1021,104 @@ $ks-crimson-deep: #7a2618;
     }
   }
 
+  .cardPrior {
+    color: $dk-text-soft;
+  }
+
+  .card_call {
+    .callKicker {
+      color: $dk-crimson;
+    }
+
+    .callName,
+    .callTranscript {
+      color: $dk-text;
+    }
+
+    .callSub {
+      color: $dk-text-soft;
+    }
+
+    .callIcon,
+    .callActions .callDecline {
+      background: $dk-crimson;
+    }
+  }
+
+  .card_document {
+    border-top-color: $dk-rule;
+
+    .docLabel,
+    .docMeta,
+    .docFooter {
+      color: $dk-text-soft;
+    }
+
+    .docLogo {
+      background: $dk-card-soft;
+      border-color: $dk-rule;
+    }
+
+    .docFooter {
+      border-top-color: $dk-rule;
+    }
+  }
+
+  .card_document.cardFlagged {
+    border-top-color: $dk-crimson;
+  }
+
+  .card_poster {
+    background: $dk-card-soft;
+
+    .posterTape {
+      background: rgba(230, 232, 238, 0.08);
+      border-color: rgba(230, 232, 238, 0.06);
+    }
+
+    .posterHeading {
+      color: $dk-text;
+    }
+
+    .posterBody,
+    .posterCaption {
+      color: $dk-text-soft;
+    }
+
+    .posterQr {
+      background: $dk-card;
+      border-color: $dk-rule;
+      color: $dk-text;
+    }
+  }
+
+  .card_poster.cardFlagged .posterQr {
+    border-color: $dk-crimson;
+    color: $dk-crimson;
+  }
+
+  .card_timeline {
+    .timelineItem {
+      border-bottom-color: $dk-rule-soft;
+    }
+
+    .timelineLabel,
+    .timelineSource {
+      color: $dk-text-soft;
+    }
+
+    .timelineText {
+      color: $dk-text;
+    }
+
+    .timelineItemFlagged {
+      .timelineLabel,
+      .timelineSource {
+        color: $dk-crimson;
+      }
+    }
+  }
+
   .cardDivider .cardArrow {
     color: $dk-crimson;
   }
diff --git a/src/uxcore/components/OffsecBiasView/OffsecBiasView.tsx b/src/uxcore/components/OffsecBiasView/OffsecBiasView.tsx
index 074bdb7d..19c4330c 100644
--- a/src/uxcore/components/OffsecBiasView/OffsecBiasView.tsx
+++ b/src/uxcore/components/OffsecBiasView/OffsecBiasView.tsx
@@ -9,9 +9,17 @@ interface OffsecBiasViewProps {
 }
 
 const CardBody = ({ card }: { card: OffsecBiasCard }) => {
+  // Chat renders its own priorContext after the sender header; every
+  // other surface shows it as a soft lead-in line at the top.
+  const prior =
+    card.kind !== 'chat' && card.priorContext ? (
+      <div className={styles.cardPrior}>↳ {card.priorContext}</div>
+    ) : null;
+
   if (card.kind === 'email') {
     return (
       <>
+        {prior}
         <div className={styles.emailHeader}>
           <span className={styles.emailEnvelope} aria-hidden="true">
             <svg
@@ -53,6 +61,7 @@ const CardBody = ({ card }: { card: OffsecBiasCard }) => {
     const protocol = card.protocol || 'https';
     return (
       <>
+        {prior}
         <div className={styles.browserChrome}>
           <span className={styles.browserDots} aria-hidden="true">
             <span />
@@ -95,6 +104,7 @@ const CardBody = ({ card }: { card: OffsecBiasCard }) => {
   if (card.kind === 'notification') {
     return (
       <>
+        {prior}
         <div className={styles.notifHeader}>
           <span className={styles.notifAppIcon} aria-hidden="true" />
           <span className={styles.notifAppName}>{card.appName}</span>
@@ -111,6 +121,135 @@ const CardBody = ({ card }: { card: OffsecBiasCard }) => {
     );
   }
 
+  if (card.kind === 'call') {
+    return (
+      <>
+        {prior}
+        <div className={styles.callHeader}>
+          <span className={styles.callIcon} aria-hidden="true">
+            <svg
+              viewBox="0 0 16 16"
+              width="14"
+              height="14"
+              fill="none"
+              stroke="currentColor"
+              strokeWidth="1.5"
+              strokeLinecap="round"
+              strokeLinejoin="round"
+            >
+              <path d="M3 2.5 L5.5 2 L7 5 L5.5 6.5 C6.2 8.2 7.8 9.8 9.5 10.5 L11 9 L14 10.5 L13.5 13 C13.2 13.8 12.4 14.2 11.6 14 C7 12.8 3.2 9 2 4.4 C1.8 3.6 2.2 2.8 3 2.5 Z" />
+            </svg>
+          </span>
+          <div className={styles.callIdentity}>
+            <span className={styles.callKicker}>Incoming call</span>
+            <span className={styles.callName}>{card.callerName}</span>
+            {card.callerLabel && (
+              <span className={styles.callSub}>{card.callerLabel}</span>
+            )}
+          </div>
+          {card.timestamp && (
+            <span className={styles.cardTimestamp}>{card.timestamp}</span>
+          )}
+        </div>
+        <div className={styles.cardRule} />
+        <div className={styles.callTranscript}>
+          {card.flagged && <span className={styles.cardUrgencyDot} />}
+          <span>“{card.transcript}”</span>
+        </div>
+        <div className={styles.callActions} aria-hidden="true">
+          <span className={styles.callDecline}>✕</span>
+          <span className={styles.callAccept}>✓</span>
+        </div>
+      </>
+    );
+  }
+
+  if (card.kind === 'document') {
+    return (
+      <>
+        {prior}
+        <div className={styles.docHeader}>
+          {card.logo && (
+            <span className={styles.docLogo} aria-hidden="true">
+              {card.logo}
+            </span>
+          )}
+          <span className={styles.docLabel}>{card.docLabel}</span>
+        </div>
+        <div className={styles.cardSubject}>
+          {card.flagged && <span className={styles.cardUrgencyDot} />}
+          {card.title}
+        </div>
+        {card.meta && <div className={styles.docMeta}>{card.meta}</div>}
+        <div className={styles.cardRule} />
+        <div className={styles.cardPreview}>{card.body}</div>
+        {card.footer && <div className={styles.docFooter}>{card.footer}</div>}
+      </>
+    );
+  }
+
+  if (card.kind === 'poster') {
+    return (
+      <>
+        {prior}
+        <div className={styles.posterTape} aria-hidden="true" />
+        <div className={styles.posterHeading}>
+          {card.flagged && <span className={styles.cardUrgencyDot} />}
+          {card.heading}
+        </div>
+        <div className={styles.posterBody}>{card.body}</div>
+        <div className={styles.posterQr} aria-hidden="true">
+          <svg viewBox="0 0 29 29" width="72" height="72">
+            <rect
+              x="0"
+              y="0"
+              width="29"
+              height="29"
+              fill="currentColor"
+              opacity="0.06"
+            />
+            <g fill="currentColor">
+              <path d="M2 2h7v7H2zM4 4h3v3H4z" fillRule="evenodd" />
+              <path d="M20 2h7v7h-7zM22 4h3v3h-3z" fillRule="evenodd" />
+              <path d="M2 20h7v7H2zM4 22h3v3H4z" fillRule="evenodd" />
+              <path d="M12 2h2v2h-2zM16 3h2v2h-2zM12 6h3v2h-3zM11 11h2v3h-2zM15 12h4v2h-4zM21 12h2v2h-2zM25 11h2v2h-2zM3 12h3v2H3zM7 15h3v2H7zM2 16h2v2H2zM12 16h2v2h-2zM17 16h2v3h-2zM21 17h3v2h-3zM25 16h2v2h-2zM12 20h2v3h-2zM15 21h2v2h-2zM20 21h2v2h-2zM24 20h3v2h-3zM12 25h3v2h-3zM18 24h2v3h-2zM22 25h2v2h-2zM25 24h2v3h-2z" />
+            </g>
+          </svg>
+        </div>
+        {card.qrCaption && (
+          <div className={styles.posterCaption}>{card.qrCaption}</div>
+        )}
+      </>
+    );
+  }
+
+  if (card.kind === 'timeline') {
+    return (
+      <>
+        {prior}
+        <div className={styles.timeline}>
+          {card.items.map((item, i) => (
+            <div
+              key={i}
+              className={`${styles.timelineItem} ${
+                item.flagged ? styles.timelineItemFlagged : ''
+              }`}
+            >
+              <span className={styles.timelineLabel}>
+                {item.flagged && <span className={styles.cardUrgencyDot} />}
+                {item.label}
+              </span>
+              <div className={styles.timelineBody}>
+                <span className={styles.timelineSource}>{item.source}</span>
+                <span className={styles.timelineText}>{item.text}</span>
+              </div>
+            </div>
+          ))}
+        </div>
+      </>
+    );
+  }
+
   // kind === 'chat'
   return (
     <>
@@ -131,6 +270,12 @@ const CardBody = ({ card }: { card: OffsecBiasCard }) => {
       {card.priorContext && (
         <div className={styles.chatPrior}>↳ {card.priorContext}</div>
       )}
+      {card.attachment && (
+        <div className={styles.cardAttachment}>
+          <span className={styles.cardAttachmentIcon}>📎</span>
+          {card.attachment}
+        </div>
+      )}
       <div className={styles.chatBubble}>
         {card.flagged && <span className={styles.cardUrgencyDot} />}
         <span>{card.body}</span>
diff --git a/src/uxcore/data/biasOffsec/baseRateFallacy.ts b/src/uxcore/data/biasOffsec/baseRateFallacy.ts
new file mode 100644
index 00000000..507509c6
--- /dev/null
+++ b/src/uxcore/data/biasOffsec/baseRateFallacy.ts
@@ -0,0 +1,50 @@
+// No quoted figures by policy — the base rate is expressed
+// directionally ("nearly every", "rare"), never as an invented
+// percentage. Before = the browser surface: the dry handbook page
+// stating the base rate. After = the email surface: one vivid,
+// specific specimen that makes the abstract statistic feel
+// inapplicable. The lever is concrete detail crushing the base rate.
+
+import type { OffsecBiasContent } from './types';
+
+const content: OffsecBiasContent = {
+  scenario:
+    'The handbook says it plainly: nearly every “unusual sign-in, verify now” email that reaches an inbox is fake. Then one arrives with a city, a timestamp, and your browser’s name — and the statistic quietly steps aside for the story. Details feel like evidence. They aren’t.',
+  visualLabel: 'Scenario',
+  visual: {
+    before: {
+      kind: 'browser',
+      tag: 'What you know in the abstract',
+      host: 'wiki.internal',
+      path: '/security/sign-in-alerts',
+      pageHeading: 'Security handbook — sign-in alerts',
+      pageBody:
+        'Nearly every “unusual sign-in — verify immediately” message that reaches an inbox is phishing. Genuine alerts are rare, and none of them require logging in through a link inside the message itself.',
+    },
+    after: {
+      kind: 'email',
+      tag: 'What actually lands in your inbox',
+      sender: 'security-noreply@account-signin-shield.com',
+      timestamp: 'Today, 3:41 AM',
+      subject: 'New sign-in from Istanbul — was this you?',
+      preview:
+        'Device: Chrome on Windows · Location: Istanbul, Türkiye · Time: 3:41 AM. If you do not recognize this activity, verify your identity now using the secure link below to prevent account lockout.',
+      flagged: true,
+    },
+  },
+  whyItWorksLabel: 'Why it works',
+  whyItWorks:
+    'A base rate is a fact about the whole population of emails like this one; the specimen in front of you is a story about you — and stories win. The city you’ve never been to, the 3:41 AM timestamp, the correct browser name all produce a feeling of “this one is real, this one is my case, the statistic is about other emails.” But specificity is not evidence: every one of those details is free to fabricate, and the browser name is simply the most common one guessed. The vividness that makes the alert feel like the rare genuine article is exactly the property phishing kits are built to mass-produce.',
+  defenseLabel: 'Protect yourself',
+  defense: {
+    lede: 'While your security team handles the perimeter — here’s your homework.',
+    moves: [
+      'The handbook rule applies most precisely at the moment it feels like it doesn’t. “But this one has details” is the bias speaking, not the evidence.',
+      'Never verify through the alert itself. Open the service’s site or app the way you always do and check the sign-in activity page there — a real incident will be visible; a fake one won’t.',
+      'Price the details honestly: a city, a time, and a browser name cost the attacker nothing and are copied from a template. Only what you can confirm inside your account counts as evidence.',
+      'Flip vividness into a signal: the more cinematic and personalized an unsolicited alert feels, the more suspicion it has earned — drama is a manufacturing choice, not a property of truth.',
+    ],
+  },
+};
+
+export default content;
diff --git a/src/uxcore/data/biasOffsec/bizarrenessEffect.ts b/src/uxcore/data/biasOffsec/bizarrenessEffect.ts
new file mode 100644
index 00000000..2e2a1673
--- /dev/null
+++ b/src/uxcore/data/biasOffsec/bizarrenessEffect.ts
@@ -0,0 +1,56 @@
+// No quoted figures by policy — sums stay directional ("a sum too small
+// to escalate"). Both sides are the document surface: two invoices from
+// the same invented vendor. Before = week one, the deliberately odd
+// llama-branded invoice with no ask — a memory implant, not a bill.
+// After = week four, the follow-up that cashes in the recall: "the
+// llama folks" now feel like an existing relationship. The lever is
+// memorability being misread as familiarity, and familiarity as a
+// business relationship.
+
+import type { OffsecBiasContent } from './types';
+
+const content: OffsecBiasContent = {
+  scenario:
+    'Week one: an invoice arrives with a llama mascot, a cheerful font, and a sum too small to escalate. No urgency, no payment demand — just weird enough to show a colleague, laugh, and archive. Week three: “the llama folks 🦙” send their quarterly invoice with updated bank details. And somehow, they feel like a vendor you know.',
+  visualLabel: 'Scenario',
+  visual: {
+    before: {
+      kind: 'document',
+      tag: 'Week 1 — the odd one',
+      docLabel: 'Invoice',
+      logo: '🦙',
+      title: 'Andes Logistics — vendor profile activation',
+      meta: 'Invoice AND-114 · one-time onboarding',
+      body: 'Vendor profile activation fee. Payable at your convenience — no action required this quarter. We look forward to working with your team.',
+      footer: 'Total: a sum too small to question, too odd to forget.',
+    },
+    after: {
+      kind: 'document',
+      tag: 'Week 3 — the “familiar” one',
+      docLabel: 'Invoice',
+      logo: '🦙',
+      title: 'Andes Logistics — quarterly services',
+      meta: 'Invoice AND-289 · note: banking details updated',
+      priorContext:
+        'You remember the llama instantly. Nobody remembers signing a contract — but that’s not the part memory checks.',
+      body: 'Quarterly services as agreed. Please note our banking details have changed — updated account information is attached for this and future payments.',
+      footer: 'Attachment: “Updated payment details.pdf”',
+      flagged: true,
+    },
+  },
+  whyItWorksLabel: 'Why it works',
+  whyItWorks:
+    'Bizarre things are memory glue — a llama on an invoice outlives a hundred beige PDFs. The trap is what your brain does with that recall later: “I remember these people” gets silently upgraded to “we work with these people.” Recognition is doing the job that a contract, a purchase order, and an accounts-payable record are supposed to do. The first invoice was never meant to be paid; it was meant to be memorable. It’s a memory implant with a letterhead — and three weeks later, the second invoice harvests the implanted familiarity, plus the real payload: new bank details.',
+  defenseLabel: 'Protect yourself',
+  defense: {
+    lede: 'While your security team handles the perimeter — here’s your homework.',
+    moves: [
+      'Memorable is not the same as real. Before paying “again,” check the ledger: was this vendor ever onboarded, contracted, or paid before? If the only record is your recall of a mascot, there is no record.',
+      'A tiny first invoice with no payment pressure is a known setup move — it exists to create history. Odd, low-stakes, no-ask documents from unknown senders deserve a report, not an archive.',
+      'Bank-details changes are verified by callback to a number from the signed contract — a rule that doesn’t care how familiar the sender feels. Familiarity is precisely what the attacker spent three weeks manufacturing.',
+      'Make “funny” a trigger for process, not comfort: the moment a vendor is memorable enough to joke about, it’s memorable enough to look up in accounts payable.',
+    ],
+  },
+};
+
+export default content;
diff --git a/src/uxcore/data/biasOffsec/contextEffect.ts b/src/uxcore/data/biasOffsec/contextEffect.ts
new file mode 100644
index 00000000..dfa5c105
--- /dev/null
+++ b/src/uxcore/data/biasOffsec/contextEffect.ts
@@ -0,0 +1,54 @@
+// No quoted figures by policy. Surface is a browser page on both sides —
+// deliberately the SAME page, pixel for pixel. The lever is the moment
+// around it: before = the login prompt appears cold on a random tab;
+// after = the identical prompt appears mid-flow, ten seconds after you
+// clicked "Join meeting" in a calendar invite. Only `priorContext` and
+// the tag change — the artifact must not.
+
+import type { OffsecBiasContent } from './types';
+
+const content: OffsecBiasContent = {
+  scenario:
+    'The same sign-in page, twice. On a random Tuesday tab it screams fake. Ten seconds after you clicked “Join meeting” in a calendar invite, the very same page reads as routine — because now it appears exactly where a sign-in was supposed to be.',
+  visualLabel: 'Scenario',
+  visual: {
+    before: {
+      kind: 'browser',
+      tag: 'Cold — out of nowhere',
+      host: 'meeting-relogin-portal.com',
+      path: '/sso/verify',
+      pageHeading: 'Session expired — sign in with your work account',
+      pageBody:
+        'For security reasons, please re-enter your corporate email and password to continue to the conference.',
+      cta: 'Sign in to continue',
+    },
+    after: {
+      kind: 'browser',
+      tag: 'Mid-flow — right where you expected it',
+      host: 'meeting-relogin-portal.com',
+      path: '/sso/verify',
+      priorContext:
+        'Ten seconds ago you clicked “Join meeting” in a calendar invite. A tab opened, a spinner spun — and then this.',
+      pageHeading: 'Session expired — sign in with your work account',
+      pageBody:
+        'For security reasons, please re-enter your corporate email and password to continue to the conference.',
+      cta: 'Sign in to continue',
+      flagged: true,
+    },
+  },
+  whyItWorksLabel: 'Why it works',
+  whyItWorks:
+    'Both cards show the identical page — same address, same copy, same button. What changed is everything around it. Perception doesn’t judge a stimulus on its own; it judges it against the context it arrives in. A password prompt with no story is suspicious by default. The same prompt inside a flow you started yourself inherits the flow’s legitimacy: you expected a meeting, a sign-in feels like a normal step toward it, so the page borrows trust it never earned. The attacker didn’t build a better fake — they built a better moment for it.',
+  defenseLabel: 'Protect yourself',
+  defense: {
+    lede: 'While your security team handles the perimeter — here’s your homework.',
+    moves: [
+      'Judge every credentials prompt as if it appeared cold. The question is never “does this fit the flow?” — it’s “is this address the real login page?” The flow can’t authenticate a page; only the address bar can.',
+      'A meeting link that lands on a corporate password form is a red flag by itself. Conference tools may ask for a name or a meeting code — your work password lives with your identity provider, not with a meeting page.',
+      'Expected ≠ verified. Attackers engineer expectation on purpose: a calendar invite, a shared file, a delivery notice — each exists to make the next page feel like a natural step.',
+      'When a sign-in appears mid-flow, break the flow: open a new tab and reach the service through the address you know. If the meeting is real, it will still be there.',
+    ],
+  },
+};
+
+export default content;
diff --git a/src/uxcore/data/biasOffsec/cueDependentForgetting.ts b/src/uxcore/data/biasOffsec/cueDependentForgetting.ts
new file mode 100644
index 00000000..8e66cde8
--- /dev/null
+++ b/src/uxcore/data/biasOffsec/cueDependentForgetting.ts
@@ -0,0 +1,51 @@
+// No quoted figures by policy. One email, two renderings. Before = the
+// desktop client, where the full sender address is visible — the cue
+// your phishing training anchored to, so the knowledge fires. After =
+// the phone's mail notification, which shows only the display name
+// "IT Support" — the cue is gone, and with it the trained caution.
+// The lever is cue removal, not a different message.
+
+import type { OffsecBiasContent } from './types';
+
+const content: OffsecBiasContent = {
+  scenario:
+    'Your training worked: on the desktop you spot the fake address instantly. The same email opened on your phone between meetings shows only “IT Support” — and the knowledge that saved you an hour ago simply doesn’t wake up. It wasn’t forgotten. It just lost its trigger.',
+  visualLabel: 'Scenario',
+  visual: {
+    before: {
+      kind: 'email',
+      tag: 'On your desktop — cue visible',
+      sender: 'it-support@helpdesk-mailstorage-portal.com',
+      timestamp: 'Mon, 10:12 AM',
+      subject: 'Mailbox storage limit reached',
+      preview:
+        'Your mailbox is almost full. To keep receiving messages, review your storage settings via the link below within 24 hours.',
+    },
+    after: {
+      kind: 'notification',
+      tag: 'On your phone — cue stripped',
+      appName: 'Mail',
+      timestamp: 'now',
+      priorContext:
+        'The same email, opened on your phone in the elevator. The app shows the display name — the address that gave it away is one tap deeper than anyone goes.',
+      title: 'IT Support',
+      body: 'Mailbox storage limit reached — review your storage settings to keep receiving mail.',
+      flagged: true,
+    },
+  },
+  whyItWorksLabel: 'Why it works',
+  whyItWorks:
+    'Memory isn’t a database you query at will — it’s a set of responses waiting for their triggers. Your phishing training didn’t teach you “be suspicious” in the abstract; it taught you “be suspicious when the sender address looks off.” That rule is welded to a specific cue: seeing the address. Desktop mail shows it, the rule fires, you’re safe. The phone shows a friendly display name and hides the address behind a tap — the cue never appears, so the rule never runs. Attackers don’t need you untrained; they need you on the device where your training can’t hear its own alarm.',
+  defenseLabel: 'Protect yourself',
+  defense: {
+    lede: 'While your security team handles the perimeter — here’s your homework.',
+    moves: [
+      'On mobile, tap the sender name before acting — every mail app can reveal the real address; it’s just never shown by default. Make the tap the habit, not the exception.',
+      'Know which cues your caution depends on. If your alarm needs a visible address, a hover preview, or a big screen — then on a phone you are, functionally, untrained. Plan for that.',
+      'Anything with a deadline or a login link waits until you’re at a real screen. If it can’t wait twenty minutes, that urgency is itself the tell.',
+      'If you run security training: test people on their phones. A team that passes drills on desktop hasn’t been tested where the attack will actually land.',
+    ],
+  },
+};
+
+export default content;
diff --git a/src/uxcore/data/biasOffsec/empathyGap.ts b/src/uxcore/data/biasOffsec/empathyGap.ts
new file mode 100644
index 00000000..b2ecde24
--- /dev/null
+++ b/src/uxcore/data/biasOffsec/empathyGap.ts
@@ -0,0 +1,51 @@
+// No quoted figures by policy. Before = the document surface: the
+// verification rule you signed in a cold, calm state — "no exceptions."
+// After = the call surface: Friday evening, a cloned executive voice,
+// airport noise, a closing deal. Same rule, same person — but a hot
+// state is deciding now. The lever is the state switch, not new
+// information.
+
+import type { OffsecBiasContent } from './types';
+
+const content: OffsecBiasContent = {
+  scenario:
+    'On a calm Tuesday you sign the rule: every payment change gets a callback, no exceptions, including management. On Friday at 6:52 PM a voice that sounds exactly like your CEO is boarding a plane, the deal “dies tonight,” and the person deciding whether the rule still applies is not the person who signed it.',
+  visualLabel: 'Scenario',
+  visual: {
+    before: {
+      kind: 'document',
+      tag: 'The rule — signed in a cold state',
+      docLabel: 'Signed procedure',
+      title: 'Payment release — verification rule',
+      meta: 'Finance operations · acknowledged and signed by you',
+      body: 'Any change to payment instructions — amount, account, or urgency — is confirmed by a callback to the number on file before release. This applies to all requests without exception, including those from senior management.',
+      footer:
+        'Signed on a quiet morning, coffee in hand, certain you’d never need reminding.',
+    },
+    after: {
+      kind: 'call',
+      tag: 'The same rule at 6:52 PM Friday',
+      callerName: 'Your CEO — or a voice wearing him',
+      callerLabel: 'Mobile · caller ID says his name',
+      timestamp: 'Fri, 6:52 PM',
+      transcript:
+        'I’m boarding, I have thirty seconds. The escrow on the acquisition closes tonight — wire the retainer now and I’ll sign everything when I land. I picked you because you get things done. Don’t let this die in paperwork.',
+      flagged: true,
+    },
+  },
+  whyItWorksLabel: 'Why it works',
+  whyItWorks:
+    'In a cold state, you cannot truly simulate what pressure feels like — so the rule you sign feels effortless to keep, and you never build defenses for the moment it won’t be. That’s the empathy gap: calm-you and stressed-you are strangers who happen to share a signature. The attacker’s craft isn’t defeating your judgment; it’s swapping which version of you is judging. Voice cloning supplies the authority, the deadline supplies the heat, the flattery supplies the exit ramp — and hot-you concludes, sincerely, that this one time the rule was written for lesser situations than this.',
+  defenseLabel: 'Protect yourself',
+  defense: {
+    lede: 'While your security team handles the perimeter — here’s your homework.',
+    moves: [
+      'Decide now what panicked-future-you will do, and make it mechanical: one callback number, from the file, used every single time. A rule with judgment left in it will lose to a sufficiently good Friday evening.',
+      'Script the sentence in advance and rehearse it: “I’ll call you right back on the number we have on file — two minutes.” Real executives survive two minutes. Scripts survive pressure; intentions don’t.',
+      'A voice is not an identity. Cloning a voice from public recordings is commodity tooling now — the more a caller sounds unmistakably like the boss, the less that proves.',
+      'Treat resistance to the callback as the strongest signal in the exchange. Anyone who fights a two-minute verification of a money movement has just told you what the call is.',
+    ],
+  },
+};
+
+export default content;
diff --git a/src/uxcore/data/biasOffsec/frequencyIllusion.ts b/src/uxcore/data/biasOffsec/frequencyIllusion.ts
new file mode 100644
index 00000000..8239959f
--- /dev/null
+++ b/src/uxcore/data/biasOffsec/frequencyIllusion.ts
@@ -0,0 +1,66 @@
+// No quoted figures by policy. Before = the first, single mention of a
+// tool that doesn't exist — mildly interesting, instantly forgotten.
+// After = the timeline surface: the same name resurfacing across the
+// week through seeded channels, ending in the credential ask. The lever
+// is the pattern — each sighting is worthless alone; together they
+// counterfeit "market presence."
+
+import type { OffsecBiasContent } from './types';
+
+const content: OffsecBiasContent = {
+  scenario:
+    'Monday, a tool called Relayo gets mentioned once — you shrug. By the next week you’ve “seen it everywhere,” so when the invite lands asking you to set a password, it feels like joining something established. Nobody checked that every single sighting traces back to the same hand.',
+  visualLabel: 'Scenario',
+  visual: {
+    before: {
+      kind: 'chat',
+      tag: 'One mention — noise',
+      senderName: 'Marta Ilyes',
+      senderHandle: '#random · community Slack',
+      timestamp: 'Mon, 2:17 PM',
+      body: 'Anyone tried Relayo for client handoffs? Keep seeing the name pop up lately.',
+    },
+    after: {
+      kind: 'timeline',
+      tag: 'A week of sightings — “everywhere”',
+      items: [
+        {
+          label: 'Day 1',
+          source: 'Forwarded newsletter',
+          text: 'A roundup blurb mentions Relayo among “tools teams are adopting.”',
+        },
+        {
+          label: 'Day 3',
+          source: 'LinkedIn comment',
+          text: 'A stranger under an industry post: “We moved handoffs to Relayo, night and day.”',
+        },
+        {
+          label: 'Day 6',
+          source: 'Community Slack',
+          text: '“Anyone tried Relayo for client handoffs?” — sounds like organic buzz.',
+        },
+        {
+          label: 'Day 8',
+          source: 'Your inbox',
+          text: '“Your team invited you to Relayo — set your password to join the workspace.”',
+          flagged: true,
+        },
+      ],
+    },
+  },
+  whyItWorksLabel: 'Why it works',
+  whyItWorks:
+    'After you notice something once, your brain starts flagging every recurrence — and quietly reads the growing count as significance. Three mentions in a week feels like a trend, and a trend feels like legitimacy: surely a tool “everyone” discusses is real, funded, vetted. But frequency is the cheapest signal there is to fake. A newsletter blurb, one LinkedIn comment, one Slack question — three plants, days apart, and the target’s own pattern-matching does the rest. By the time the password invite arrives, it isn’t a stranger asking for credentials; it’s a familiar name finally making its move.',
+  defenseLabel: 'Protect yourself',
+  defense: {
+    lede: 'While your security team handles the perimeter — here’s your homework.',
+    moves: [
+      '“I keep seeing it everywhere” is a feeling, not due diligence. Count independent sources, not sightings — three mentions that trace to strangers you can’t verify are one source wearing three coats.',
+      'A “your team invited you” email is verified with the team, out loud, in a channel you already trust — not by clicking through. If nobody at your company bought the tool, nobody invited you.',
+      'Setting a password on an unknown service is the whole game: most people reuse one. If you ever do sign up somewhere new, that password must be unique — assume the form exists to harvest it.',
+      'Notice when a name is being introduced to you gradually, with no ask. Legitimate products pitch you once, openly. A slow drip of casual mentions that ends in a login form was a runway, not a coincidence.',
+    ],
+  },
+};
+
+export default content;
diff --git a/src/uxcore/data/biasOffsec/humorEffect.ts b/src/uxcore/data/biasOffsec/humorEffect.ts
new file mode 100644
index 00000000..0a5c07f6
--- /dev/null
+++ b/src/uxcore/data/biasOffsec/humorEffect.ts
@@ -0,0 +1,49 @@
+// No quoted figures by policy. Both sides are the chat surface, same
+// sender, same destination URL. Before = the bare pitch — a link with
+// no emotional wrapper, and the suspicion reflex fires normally. After
+// = the identical link riding a genuinely funny meme; the laugh
+// disarms scrutiny and recruits the victim as a distributor. The lever
+// is the emotional wrapper, never the link.
+
+import type { OffsecBiasContent } from './types';
+
+const content: OffsecBiasContent = {
+  scenario:
+    'A half-remembered conference contact DMs you a tool link — you side-eye it and move on. The same contact sends a genuinely funny industry meme first, and the same link right after. You’ve already forwarded the meme to two teammates before it occurs to you to wonder where the link goes.',
+  visualLabel: 'Scenario',
+  visual: {
+    before: {
+      kind: 'chat',
+      tag: 'The pitch without the laugh',
+      senderName: 'Deniz Aksoy',
+      senderHandle: 'met at a conference · DM',
+      timestamp: 'Wed, 4:12 PM',
+      body: 'Hey! Found a tool that auto-generates client status reports — huge time-saver. Try it: reportninja-app.com',
+    },
+    after: {
+      kind: 'chat',
+      tag: 'The same link, wrapped in a laugh',
+      senderName: 'Deniz Aksoy',
+      senderHandle: 'met at a conference · DM',
+      timestamp: 'Wed, 4:12 PM',
+      attachment: '😂 agency-life-in-30-seconds.mp4',
+      body: 'lmao this is our entire industry in one video 😭 the guy who made it has a whole collection — reportninja-app.com/memes',
+      flagged: true,
+    },
+  },
+  whyItWorksLabel: 'Why it works',
+  whyItWorks:
+    'Humor does two jobs at once, and both serve the attacker. First, it disarms: amusement and scrutiny compete for the same attention, and a brain mid-laugh audits nothing — the link arrives inside the warm glow the meme just bought. Second, it distributes: funny content is the only payload people forward voluntarily, at speed, to the exact colleagues who trust them. The suspicious version of this message dies in one chat; the funny version tours the whole team wearing your endorsement. Notice that nothing about the destination changed — only the feeling you had while not looking at it.',
+  defenseLabel: 'Protect yourself',
+  defense: {
+    lede: 'While your security team handles the perimeter — here’s your homework.',
+    moves: [
+      'Funny gets the same link hygiene as scary. Urgency and comedy are both emotional wrappers around a URL — inspect the address with the same cold eye regardless of which feeling delivered it.',
+      'Laugh first, click never — or at least later, from a machine and moment where you’re actually looking. The meme is real entertainment; the link is a separate object with a separate reputation.',
+      'Forwarding is vouching. The moment you pass a link along, your colleagues inherit your skipped check and add trust you never verified. Send the laugh if you must — strip the link.',
+      'Be extra deliberate when comedy arrives paired with an ask or a URL from a weak tie. “Person I barely know + genuinely funny + here’s a link” is a delivery pattern, not a coincidence.',
+    ],
+  },
+};
+
+export default content;
diff --git a/src/uxcore/data/biasOffsec/index.ts b/src/uxcore/data/biasOffsec/index.ts
index 477a6ea7..35b43cc7 100644
--- a/src/uxcore/data/biasOffsec/index.ts
+++ b/src/uxcore/data/biasOffsec/index.ts
@@ -1,8 +1,18 @@
 import { biases } from '../biasList/biases';
 import attentionalBias from './attentionalBias';
 import availabilityHeuristics from './availabilityHeuristics';
+import baseRateFallacy from './baseRateFallacy';
+import bizarrenessEffect from './bizarrenessEffect';
+import contextEffect from './contextEffect';
+import cueDependentForgetting from './cueDependentForgetting';
+import empathyGap from './empathyGap';
+import frequencyIllusion from './frequencyIllusion';
+import humorEffect from './humorEffect';
 import illusoryTruthEffect from './illusoryTruthEffect';
 import mereExposureEffect from './mereExposureEffect';
+import moodCongruentMemoryBias from './moodCongruentMemoryBias';
+import omissionBias from './omissionBias';
+import pictureSuperiorityEffect from './pictureSuperiorityEffect';
 import type { OffsecBiasCard, OffsecBiasContent } from './types';
 
 const offsecBySlug: Record<string, OffsecBiasContent> = {
@@ -10,6 +20,16 @@ const offsecBySlug: Record<string, OffsecBiasContent> = {
   'attentional-bias': attentionalBias,
   'illusory-truth-effect': illusoryTruthEffect,
   'mere-exposure-effect': mereExposureEffect,
+  'context-effect': contextEffect,
+  'cue-dependent-forgetting': cueDependentForgetting,
+  'mood-congruent-memory-bias': moodCongruentMemoryBias,
+  'frequency-illusion': frequencyIllusion,
+  'empathy-gap': empathyGap,
+  'omission-bias': omissionBias,
+  'base-rate-fallacy': baseRateFallacy,
+  'bizarreness-effect': bizarrenessEffect,
+  'humor-effect': humorEffect,
+  'picture-superiority-effect': pictureSuperiorityEffect,
 };
 
 export const getOffsecBiasContent = (
diff --git a/src/uxcore/data/biasOffsec/moodCongruentMemoryBias.ts b/src/uxcore/data/biasOffsec/moodCongruentMemoryBias.ts
new file mode 100644
index 00000000..bcee3899
--- /dev/null
+++ b/src/uxcore/data/biasOffsec/moodCongruentMemoryBias.ts
@@ -0,0 +1,52 @@
+// No quoted figures by policy. One recovery-themed email, two emotional
+// states. Before = a calm day, the lure reads as an obvious phish.
+// After = the same email during a real, publicly visible outage — the
+// anxious state retrieves anxiety-congruent memories ("last outage IT
+// did send links") and the fake feels remembered rather than read.
+// `priorContext` carries the incident; the email itself must not change.
+
+import type { OffsecBiasContent } from './types';
+
+const content: OffsecBiasContent = {
+  scenario:
+    'On a quiet morning, “restore your access” is an obvious phish — you archive it without a second look. During a real outage, with the status page red and Slack on fire, the identical email feels like exactly the message you were waiting for.',
+  visualLabel: 'Scenario',
+  visual: {
+    before: {
+      kind: 'email',
+      tag: 'Calm day — reflex fires',
+      sender: 'access-recovery@vpn-servicedesk-restore.com',
+      timestamp: 'Tue, 9:04 AM',
+      subject: 'Your VPN access was interrupted — restore now',
+      preview:
+        'We detected an interruption on your account. Use the recovery link below to restore your VPN access and avoid losing your session.',
+    },
+    after: {
+      kind: 'email',
+      tag: 'Mid-outage — reflex silent',
+      sender: 'access-recovery@vpn-servicedesk-restore.com',
+      timestamp: 'Tue, 9:04 AM',
+      priorContext:
+        'The VPN is genuinely down. The status page is red, Slack is a wall of “is it just me?” — and this lands in the middle of it.',
+      subject: 'Your VPN access was interrupted — restore now',
+      preview:
+        'We detected an interruption on your account. Use the recovery link below to restore your VPN access and avoid losing your session.',
+      flagged: true,
+    },
+  },
+  whyItWorksLabel: 'Why it works',
+  whyItWorks:
+    'Your current mood decides which memories volunteer themselves. Calm, you recall the phishing briefings — and the email pattern-matches to “scam.” Anxious mid-outage, your brain preferentially serves up anxiety-flavored memories: past incidents, IT scrambling, recovery emails that were real. Against that backdrop the same lure stops looking alien and starts looking like a continuation of what’s already happening — not read and evaluated, but recognized and expected. Attackers know this, which is why real outages, breaches in the news, and tax season are their favorite send windows: the panic does the pre-selling.',
+  defenseLabel: 'Protect yourself',
+  defense: {
+    lede: 'While your security team handles the perimeter — here’s your homework.',
+    moves: [
+      'Incident time is phishing prime time. The moment something is publicly broken, expect lures dressed as the fix — attackers read the same status pages you do.',
+      'During an outage, the status page and your IT channel are the only navigation. A recovery link that arrives by email is guilty until proven otherwise, no matter how well it fits the moment.',
+      '“This is exactly what I needed right now” is a feeling, not a verification. The better an email matches your current stress, the more deliberately it should be checked.',
+      'Real recovery flows almost never need your password through an emailed link. When access returns, it returns through the tools you already have — not through a form the crisis conveniently delivered.',
+    ],
+  },
+};
+
+export default content;
diff --git a/src/uxcore/data/biasOffsec/omissionBias.ts b/src/uxcore/data/biasOffsec/omissionBias.ts
new file mode 100644
index 00000000..fb600023
--- /dev/null
+++ b/src/uxcore/data/biasOffsec/omissionBias.ts
@@ -0,0 +1,50 @@
+// No quoted figures by policy. Both sides are the security-center
+// notification surface, one decision apart. Before = the report prompt,
+// framed the way the mind frames it: reporting feels like an *act* that
+// creates blame. After = the dialog dismissed — the "safe" nothing that
+// quietly leaves the attacker their foothold. The lever is that harm by
+// inaction feels less culpable than harm by action.
+
+import type { OffsecBiasContent } from './types';
+
+const content: OffsecBiasContent = {
+  scenario:
+    'You clicked something you shouldn’t have. A prompt offers one honest minute: report it. Reporting feels like an action — visible, attributable, maybe embarrassing. Closing the dialog feels like nothing at all. That “nothing” is the most consequential choice in the whole incident.',
+  visualLabel: 'Scenario',
+  visual: {
+    before: {
+      kind: 'notification',
+      tag: 'The action that feels risky',
+      appName: 'Security Center',
+      timestamp: 'now',
+      title: 'Report suspicious message?',
+      body: 'You interacted with a link flagged as potentially malicious. Reporting alerts the security team immediately and takes under a minute. Your report helps protect everyone on the network.',
+    },
+    after: {
+      kind: 'notification',
+      tag: 'The inaction that feels safe',
+      appName: 'Security Center',
+      timestamp: 'later',
+      priorContext:
+        'Dialog closed. No report sent. On your screen, the incident is over.',
+      title: 'No report was filed',
+      body: 'Nothing visible happened — which is the problem. Whatever left with that click is still valid, still in use, and now working on borrowed time nobody is counting.',
+      flagged: true,
+    },
+  },
+  whyItWorksLabel: 'Why it works',
+  whyItWorks:
+    'The mind keeps two ledgers: harm you cause by doing something, and harm you allow by doing nothing — and it bills the second at a discount. Reporting your own click feels like authoring a confession: an act with your name on it, inviting judgment. Dismissing the dialog files itself under “no action taken,” as if not-reporting weren’t also a decision with consequences. Attackers budget for exactly this silence. Their playbook assumes a window between the click and the alarm; every victim who chooses the comfortable nothing personally donates them that window.',
+  defenseLabel: 'Protect yourself',
+  defense: {
+    lede: 'While your security team handles the perimeter — here’s your homework.',
+    moves: [
+      'Reframe it once and keep it: after a bad click, silence is the harmful act, and the report is the neutral one. You’re not confessing a failure — you’re cutting the attacker’s time short.',
+      'Report the “probably nothing” cases too. You have no visibility into what a click actually did; the security team does — but only after you tell them it happened.',
+      'Speed beats dignity. A click reported immediately is a routine cleanup; the same click surfacing weeks later through its consequences is an incident with your unreported decision inside it.',
+      'If you lead a team: make the reporter the hero of the story, every time, publicly. The moment reporting a click costs someone status, you’ve trained the whole floor to choose silence for you.',
+    ],
+  },
+};
+
+export default content;
diff --git a/src/uxcore/data/biasOffsec/pictureSuperiorityEffect.ts b/src/uxcore/data/biasOffsec/pictureSuperiorityEffect.ts
new file mode 100644
index 00000000..8803cca6
--- /dev/null
+++ b/src/uxcore/data/biasOffsec/pictureSuperiorityEffect.ts
@@ -0,0 +1,51 @@
+// No quoted figures by policy. Before = the email surface: the same
+// lure as text plus a link, where words trigger the trained fraud
+// detector. After = the poster surface: a clean printed sheet with a QR
+// code in the office kitchen — a picture on paper, inheriting the
+// building's trust. The QR pattern in the component is decorative,
+// never scannable. The lever is the medium: image + physical object
+// bypass the scrutiny that text attracts.
+
+import type { OffsecBiasContent } from './types';
+
+const content: OffsecBiasContent = {
+  scenario:
+    'As an email — “new canteen menu, click here” — half the office side-eyes it and one person reports it. As a clean printed poster by the coffee machine, logo in the corner, QR code in the middle, it gets scanned all morning. Nobody has ever been trained to distrust paper.',
+  visualLabel: 'Scenario',
+  visual: {
+    before: {
+      kind: 'email',
+      tag: 'As words in an inbox',
+      sender: 'facilities@building-services-notice.com',
+      timestamp: 'Mon, 8:45 AM',
+      subject: 'New: canteen menu is now online',
+      preview:
+        'The kitchen menu has moved online. Follow the link below to browse this week’s dishes and daily specials.',
+    },
+    after: {
+      kind: 'poster',
+      tag: 'As a poster in the kitchen',
+      priorContext:
+        'Same destination. Printed, laminated, and taped up next to the coffee machine overnight.',
+      heading: 'New: canteen menu is online 🍜',
+      body: 'Scan to browse this week’s dishes and daily specials — updated every morning.',
+      qrCaption: 'Point your camera · takes two seconds',
+      flagged: true,
+    },
+  },
+  whyItWorksLabel: 'Why it works',
+  whyItWorks:
+    'Pictures are processed faster, trusted more, and remembered longer than words — and a physical object carrying a picture inherits the trust of the space it hangs in. Your fraud detector was trained on text: sender addresses, suspicious phrasing, hover-the-link. A poster has none of those handles, so the detector never engages; the laminated sheet reads as “the building said so.” And the QR code is the perfect accomplice — it’s a link rendered as an image, which means a link you cannot read. The email version showed you the URL and asked for trust; the poster hides the URL and simply receives it.',
+  defenseLabel: 'Protect yourself',
+  defense: {
+    lede: 'While your security team handles the perimeter — here’s your homework.',
+    moves: [
+      'A QR code is a link you can’t read — give it the link treatment, not the picture treatment. After scanning, read the full URL your camera previews before opening anything.',
+      'Paper is unauthenticated. Anyone with a printer can put a professional poster on a wall, and “it’s physically inside our office” is a feeling of trust, not a source of it.',
+      'For anything the poster promises — menus, Wi-Fi, parking, HR surveys — type the address you already know or use the official app. The poster can advertise a destination; it cannot certify one.',
+      'A QR that leads to a login form or an app install is your cue to stop cold. If a laminated sheet in a kitchen is asking for credentials, someone designed exactly that sentence not to be said out loud.',
+    ],
+  },
+};
+
+export default content;
diff --git a/src/uxcore/data/biasOffsec/types.ts b/src/uxcore/data/biasOffsec/types.ts
index 7c7c9cba..7c8b1878 100644
--- a/src/uxcore/data/biasOffsec/types.ts
+++ b/src/uxcore/data/biasOffsec/types.ts
@@ -9,6 +9,10 @@
 interface OffsecBiasCardCommon {
   tag: string;
   flagged?: boolean;
+  // Soft context note rendered above the card body — grounds the reader
+  // in prior history when the lever needs it (repetition, a live
+  // incident, an earlier seeding message).
+  priorContext?: string;
 }
 
 export interface OffsecBiasEmailCard extends OffsecBiasCardCommon {
@@ -33,10 +37,10 @@ export interface OffsecBiasChatCard extends OffsecBiasCardCommon {
   senderName: string;
   senderHandle?: string;
   timestamp?: string;
-  // Soft pre-bubble note that grounds the reader in the prior history
-  // for biases where context-building matters (e.g., illusory truth).
-  priorContext?: string;
   body: string;
+  // Attached media shown under the bubble (e.g. a meme the payload
+  // rides on for humor-effect).
+  attachment?: string;
 }
 
 // Faux browser tab — used for biases where the attack surface is a web
@@ -54,11 +58,62 @@ export interface OffsecBiasBrowserCard extends OffsecBiasCardCommon {
   cta?: string;
 }
 
+// Incoming phone call (vishing). `transcript` is what the voice says
+// the moment you pick up — rendered as a quoted line over a fake
+// accept/decline row.
+export interface OffsecBiasCallCard extends OffsecBiasCardCommon {
+  kind: 'call';
+  callerName: string;
+  callerLabel?: string;
+  timestamp?: string;
+  transcript: string;
+}
+
+// Paper-like document surface: an invoice, a signed procedure, a policy
+// memo. Generic enough to be the "before" (the rule you signed) or the
+// "after" (the invoice that shouldn't be paid).
+export interface OffsecBiasDocumentCard extends OffsecBiasCardCommon {
+  kind: 'document';
+  docLabel: string;
+  // Small letterhead glyph (e.g. the llama mascot for bizarreness-effect).
+  logo?: string;
+  title: string;
+  meta?: string;
+  body: string;
+  footer?: string;
+}
+
+// Physical printed poster with a QR code. The QR pattern is decorative
+// and drawn by the component — data never ships a scannable code.
+export interface OffsecBiasPosterCard extends OffsecBiasCardCommon {
+  kind: 'poster';
+  heading: string;
+  body: string;
+  qrCaption?: string;
+}
+
+// Vertical sequence of small sightings across days — for biases where
+// the lever is the pattern itself (frequency illusion), not any single
+// artifact.
+export interface OffsecBiasTimelineCard extends OffsecBiasCardCommon {
+  kind: 'timeline';
+  items: {
+    label: string;
+    source: string;
+    text: string;
+    flagged?: boolean;
+  }[];
+}
+
 export type OffsecBiasCard =
   | OffsecBiasEmailCard
   | OffsecBiasNotificationCard
   | OffsecBiasChatCard
-  | OffsecBiasBrowserCard;
+  | OffsecBiasBrowserCard
+  | OffsecBiasCallCard
+  | OffsecBiasDocumentCard
+  | OffsecBiasPosterCard
+  | OffsecBiasTimelineCard;
 
 export interface OffsecBiasContent {
   scenario: string;

From ea9bee03476a8f822b7c970ea42dd58354a9cd31 Mon Sep 17 00:00:00 2001
From: manager <alexanyanwolf@gmail.com>
Date: Thu, 16 Jul 2026 21:35:30 +0000
Subject: [PATCH 2/7] style: OffSec content rewrite, no em-dashes, plain
 language, fewer email surfaces

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 .../OffsecBiasView/KemmioCredit.tsx           | 16 +++---
 .../OffsecBiasView/OffsecBiasView.module.scss |  2 +-
 src/uxcore/data/biasOffsec/attentionalBias.ts | 18 +++----
 .../data/biasOffsec/availabilityHeuristics.ts | 22 ++++----
 src/uxcore/data/biasOffsec/baseRateFallacy.ts | 43 ++++++++--------
 .../data/biasOffsec/bizarrenessEffect.ts      | 41 ++++++++-------
 src/uxcore/data/biasOffsec/contextEffect.ts   | 32 ++++++------
 .../data/biasOffsec/cueDependentForgetting.ts | 34 +++++++------
 src/uxcore/data/biasOffsec/empathyGap.ts      | 33 ++++++------
 .../data/biasOffsec/frequencyIllusion.ts      | 32 ++++++------
 src/uxcore/data/biasOffsec/humorEffect.ts     | 28 +++++-----
 .../data/biasOffsec/illusoryTruthEffect.ts    | 22 ++++----
 .../data/biasOffsec/mereExposureEffect.ts     | 30 +++++------
 .../biasOffsec/moodCongruentMemoryBias.ts     | 51 +++++++++----------
 src/uxcore/data/biasOffsec/omissionBias.ts    | 24 ++++-----
 .../biasOffsec/pictureSuperiorityEffect.ts    | 37 +++++++-------
 src/uxcore/data/biasOffsec/types.ts           | 10 ++--
 17 files changed, 236 insertions(+), 239 deletions(-)

diff --git a/src/uxcore/components/OffsecBiasView/KemmioCredit.tsx b/src/uxcore/components/OffsecBiasView/KemmioCredit.tsx
index 66f4404e..0200665b 100644
--- a/src/uxcore/components/OffsecBiasView/KemmioCredit.tsx
+++ b/src/uxcore/components/OffsecBiasView/KemmioCredit.tsx
@@ -68,7 +68,7 @@ const KemmioCredit = () => {
                 kemmio
                 <span className={styles.realName}>
                   {' '}
-                  — Vahe Karapetyan{' '}
+                  · Vahe Karapetyan{' '}
                   <span
                     className={styles.flagAM}
                     role="img"
@@ -115,25 +115,25 @@ const KemmioCredit = () => {
                   className={styles.hexensLink}
                 >
                   <strong>Hexens</strong>
-                </a>{' '}
-                — the cybersecurity firm whose audits have safeguarded over
+                </a>
+                , the cybersecurity firm whose audits have safeguarded over
                 $125B in assets.
               </p>
 
               <ul className={styles.facts}>
                 <li>
-                  Authored the Aptos critical-vulnerability research —
-                  unpatched, the flaw would have erased over $1T from Web3.
+                  Authored the Aptos critical-vulnerability research. Unpatched,
+                  the flaw would have erased over $1T from Web3.
                 </li>
                 <li>
                   Authored the disclosure behind the largest critical
-                  vulnerability in Web3 history — $500M of instant loss and
-                  $1.7T of cascade-effect damage on the table. Caught in private
+                  vulnerability in Web3 history: $500M of instant loss and $1.7T
+                  of cascade-effect damage on the table. Caught in private
                   disclosure; exploitation never landed.
                 </li>
                 <li>
                   Uncovered the first critical Solidity compiler vulnerability
-                  in over a decade — the{' '}
+                  in over a decade: the{' '}
                   <a
                     href="https://hexens.io/research/solidity-compiler-bug-tstore-poison"
                     target="_blank"
diff --git a/src/uxcore/components/OffsecBiasView/OffsecBiasView.module.scss b/src/uxcore/components/OffsecBiasView/OffsecBiasView.module.scss
index 4c062949..1aafad53 100644
--- a/src/uxcore/components/OffsecBiasView/OffsecBiasView.module.scss
+++ b/src/uxcore/components/OffsecBiasView/OffsecBiasView.module.scss
@@ -871,7 +871,7 @@ $ks-crimson-deep: #7a2618;
 
   // Class stacked + !important to out-specify the modal's dark-theme
   // span neutralizer (`body.darkTheme .ModalOverlay … .ModalBodyContent
-  // span:not(.switcherItemText)` — 4 classes + 2 elements), which would
+  // span:not(.switcherItemText)`, 4 classes + 2 elements), which would
   // otherwise grey these section titles out.
   .root span.eyebrow.eyebrow.eyebrow {
     color: $dk-crimson !important;
diff --git a/src/uxcore/data/biasOffsec/attentionalBias.ts b/src/uxcore/data/biasOffsec/attentionalBias.ts
index 163fbaa9..f8ab4122 100644
--- a/src/uxcore/data/biasOffsec/attentionalBias.ts
+++ b/src/uxcore/data/biasOffsec/attentionalBias.ts
@@ -1,7 +1,7 @@
 // No quoted figures by policy. Two surfaces side-by-side on purpose: the
 // loud decoy is a phone push (Microsoft Defender lock-screen toast), the
 // quiet ask is a fraudulent-invoice email landing the same minute. This
-// case intentionally breaks the usual before/after symmetry — for
+// case intentionally breaks the usual before/after symmetry: for
 // attentional bias the lever IS the second, louder stimulus, so the pair
 // shows decoy + payload rather than two variants of one message. The
 // `flagged` mark sits on the quiet email: that's the one that costs you.
@@ -10,7 +10,7 @@ import type { OffsecBiasContent } from './types';
 
 const content: OffsecBiasContent = {
   scenario:
-    'Two pings hit you inside the same minute — one a phone push, the other an email. One is loud and demands you act right now. The other is quiet and looks routine. Your attention has a budget — the attacker chose where to spend it.',
+    'Two pings hit you inside the same minute, one a phone push, the other an email. One is loud and demands you act right now. The other is quiet and looks routine. Your attention has a budget, and the attacker chose where you spend it.',
   visualLabel: 'Scenario',
   visual: {
     before: {
@@ -26,22 +26,22 @@ const content: OffsecBiasContent = {
       tag: 'The real ask',
       sender: 'invoices@meridian-supplies.com',
       timestamp: '1 min ago',
-      subject: 'Invoice #4127 — payment due today',
+      subject: 'Invoice #4127, payment due today',
       preview:
-        'PO matches, terms unchanged. Please push it into today’s payment run — cut-off is 5 PM.',
+        'PO matches, terms unchanged. Please push it into today’s payment run. Cut-off is 5 PM.',
       flagged: true,
     },
   },
   whyItWorksLabel: 'Why it works',
   whyItWorks:
-    'A security scare and a routine invoice land a minute apart. Your brain doesn’t split attention evenly — it sprints to whatever looks most like danger, and the red “unauthorized sign-in” wins instantly. While you scramble to lock down an account that was never at risk, the invoice glides through on autopilot — checked by nobody, because the checking part of you was busy. That’s attentional bias: the threat you notice isn’t the threat that costs you. Two messages arrived; the loud one was the smokescreen, the quiet one was the operation.',
+    'A security scare and a routine invoice land a minute apart. Your brain does not split attention evenly. It sprints to whatever looks most like danger, and the red "unauthorized sign-in" wins instantly. While you scramble to lock down an account that was never at risk, the invoice glides through on autopilot, checked by nobody, because the checking part of you was busy. That is attentional bias: the threat you notice is not the threat that costs you. Two messages arrived. The loud one was the smokescreen. The quiet one was the operation.',
   defenseLabel: 'Protect yourself',
   defense: {
-    lede: 'While your security team handles the perimeter — here’s your homework.',
+    lede: 'While your security team handles the perimeter, here is your homework.',
     moves: [
-      'When something loud and urgent grabs you, hold for a beat and scan the rest of your screen from the same window. The point of the noisy one might be to make you miss the quiet one.',
-      'Anything that moves money or touches credentials deserves your full attention or none at all — if you can’t give it a clear head right now, park it. “Routine” processed in a panic is exactly what the attacker priced in.',
-      'Treat any “urgent sign-in alert” as a question, not an instruction. Open the affected app from your home screen — never the notification’s deep link — and check the session list yourself.',
+      'When something loud and urgent grabs you, hold for a beat and scan the rest of your screen in the same window. The point of the noisy one might be to make you miss the quiet one.',
+      'Anything that moves money or touches credentials deserves your full attention or none at all. If you cannot give it a clear head right now, park it. "Routine" processed in a panic is exactly what the attacker priced in.',
+      'Treat any "urgent sign-in alert" as a question, not an instruction. Open the affected app from your home screen, never from the notification’s link, and check the session list yourself.',
       'After you have handled the noisy one, do one more sweep: anything else from that hour that asked you to do something? Decoys travel in pairs.',
     ],
   },
diff --git a/src/uxcore/data/biasOffsec/availabilityHeuristics.ts b/src/uxcore/data/biasOffsec/availabilityHeuristics.ts
index ef7b5ec0..ebf1bbe1 100644
--- a/src/uxcore/data/biasOffsec/availabilityHeuristics.ts
+++ b/src/uxcore/data/biasOffsec/availabilityHeuristics.ts
@@ -1,20 +1,20 @@
 // Figures and operational windows are deliberately absent from this
 // content: any number quoted in the OffSec layer must be sourced (see
 // project memory `feedback_offsec_no_mocked_numbers`). The directional
-// pattern — that topical, news-anchored lures outperform generic ones —
-// is well documented; the specific lift is not the point of the page.
+// pattern (topical, news-anchored lures outperform generic ones) is well
+// documented; the specific lift is not the point of the page.
 //
 // Surface is a browser tab (lookalike-domain landing page), NOT email,
-// so the three OffSec bias cards don't all read as "another inbox".
+// so the OffSec bias cards don't all read as "another inbox".
 // Post-breach phishing increasingly arrives via sponsored search
-// results and headline-anchored URLs — fits availability heuristic
-// better than a generic vendor email anyway.
+// results and headline-anchored URLs, which fits the availability
+// heuristic better than a generic vendor email anyway.
 
 import type { OffsecBiasContent } from './types';
 
 const content: OffsecBiasContent = {
   scenario:
-    'A major company just got breached and the news is everywhere. Two phishing pages ask you for the exact same thing — your work login. The only difference between them: one name-drops the breach you just read about.',
+    'A major company just got breached and the news is everywhere. Two phishing pages ask you for the exact same thing: your work login. The only difference between them is that one name-drops the breach you just read about.',
   visualLabel: 'Scenario',
   visual: {
     before: {
@@ -41,14 +41,14 @@ const content: OffsecBiasContent = {
   },
   whyItWorksLabel: 'Why it works',
   whyItWorks:
-    'The first page earns instant suspicion — a login request out of nowhere. The second one asks for exactly the same thing, yet feels expected, because the breach is everywhere this week. That’s the availability heuristic: your brain stops asking “how likely is this real?” and starts asking “how easily can I recall it?” — and right now, recall is effortless. You substitute “I just read about this” for “I should verify this URL.” Identical payload; the news desk is doing the social engineering.',
+    'The first page earns instant suspicion: a login request out of nowhere. The second one asks for exactly the same thing, yet feels expected, because the breach is everywhere this week. That is the availability heuristic. Your brain stops asking "how likely is this real?" and starts asking "how easily can I recall it?", and right now recall is effortless. You substitute "I just read about this" for "I should verify this URL". Identical payload; the news is doing the social engineering.',
   defenseLabel: 'Protect yourself',
   defense: {
-    lede: 'While your security team handles the perimeter — here’s your homework.',
+    lede: 'While your security team handles the perimeter, here is your homework.',
     moves: [
-      'When a page leans on today’s news to get you moving, that’s exactly when to slow down — not speed up. The urgency you feel is the attack working.',
-      'Read the full hostname left-to-right before you type anything. Attackers stack the brand you trust as a subdomain of a domain they own — the rightmost label is the one that actually counts.',
-      'Let your password manager be the judge. If it doesn’t autofill on a login page, that page isn’t the one you think it is — don’t override it, close the tab.',
+      'When a page leans on today’s news to get you moving, that is exactly when to slow down, not speed up. The urgency you feel is the attack working.',
+      'Read the full hostname left to right before you type anything. Attackers stack the brand you trust as a subdomain of a domain they own. The rightmost label is the one that counts.',
+      'Let your password manager be the judge. If it does not autofill on a login page, that page is not the one you think it is. Do not override it, close the tab.',
       'Treat any breach reference on a landing page as a claim, not a fact. Check the company’s own status page or Have I Been Pwned before you sign in anywhere else.',
     ],
   },
diff --git a/src/uxcore/data/biasOffsec/baseRateFallacy.ts b/src/uxcore/data/biasOffsec/baseRateFallacy.ts
index 507509c6..14b5ea37 100644
--- a/src/uxcore/data/biasOffsec/baseRateFallacy.ts
+++ b/src/uxcore/data/biasOffsec/baseRateFallacy.ts
@@ -1,15 +1,15 @@
-// No quoted figures by policy — the base rate is expressed
-// directionally ("nearly every", "rare"), never as an invented
-// percentage. Before = the browser surface: the dry handbook page
-// stating the base rate. After = the email surface: one vivid,
-// specific specimen that makes the abstract statistic feel
-// inapplicable. The lever is concrete detail crushing the base rate.
+// No quoted figures by policy: the base rate stays directional ("nearly
+// every", "rare"), never an invented percentage. Before = the browser
+// surface: the dry handbook page stating the base rate. After = a push
+// notification (not email, by design): one vivid, specific specimen
+// that makes the statistic feel inapplicable. The lever is concrete
+// detail beating the base rate.
 
 import type { OffsecBiasContent } from './types';
 
 const content: OffsecBiasContent = {
   scenario:
-    'The handbook says it plainly: nearly every “unusual sign-in, verify now” email that reaches an inbox is fake. Then one arrives with a city, a timestamp, and your browser’s name — and the statistic quietly steps aside for the story. Details feel like evidence. They aren’t.',
+    'The handbook says it plainly: nearly every "unusual sign-in, verify now" alert that reaches you is fake. Then one arrives with a city, a timestamp, and your browser’s name, and the statistic quietly steps aside for the story. Details feel like evidence. They are not.',
   visualLabel: 'Scenario',
   visual: {
     before: {
@@ -17,32 +17,31 @@ const content: OffsecBiasContent = {
       tag: 'What you know in the abstract',
       host: 'wiki.internal',
       path: '/security/sign-in-alerts',
-      pageHeading: 'Security handbook — sign-in alerts',
+      pageHeading: 'Security handbook: sign-in alerts',
       pageBody:
-        'Nearly every “unusual sign-in — verify immediately” message that reaches an inbox is phishing. Genuine alerts are rare, and none of them require logging in through a link inside the message itself.',
+        'Nearly every "unusual sign-in, verify immediately" message that reaches an inbox or a phone is phishing. Genuine alerts are rare, and none of them require logging in through a link inside the message itself.',
     },
     after: {
-      kind: 'email',
-      tag: 'What actually lands in your inbox',
-      sender: 'security-noreply@account-signin-shield.com',
-      timestamp: 'Today, 3:41 AM',
-      subject: 'New sign-in from Istanbul — was this you?',
-      preview:
-        'Device: Chrome on Windows · Location: Istanbul, Türkiye · Time: 3:41 AM. If you do not recognize this activity, verify your identity now using the secure link below to prevent account lockout.',
+      kind: 'notification',
+      tag: 'What actually lands on your screen',
+      appName: 'Account alerts',
+      timestamp: '3:41 AM',
+      title: 'New sign-in from Istanbul. Was this you?',
+      body: 'Device: Chrome on Windows · Location: Istanbul, Türkiye · Time: 3:41 AM. If you do not recognize this activity, verify your identity now to prevent account lockout.',
       flagged: true,
     },
   },
   whyItWorksLabel: 'Why it works',
   whyItWorks:
-    'A base rate is a fact about the whole population of emails like this one; the specimen in front of you is a story about you — and stories win. The city you’ve never been to, the 3:41 AM timestamp, the correct browser name all produce a feeling of “this one is real, this one is my case, the statistic is about other emails.” But specificity is not evidence: every one of those details is free to fabricate, and the browser name is simply the most common one guessed. The vividness that makes the alert feel like the rare genuine article is exactly the property phishing kits are built to mass-produce.',
+    'A base rate is a fact about all alerts like this one. The specimen on your screen is a story about you, and stories win. The city you have never been to, the 3:41 AM timestamp, the correct browser name: together they produce a feeling of "this one is real, the statistic is about other alerts". But specificity is not evidence. Every one of those details is free to fabricate, and the browser name is simply the most common guess. The vividness that makes the alert feel genuine is exactly what phishing kits are built to mass-produce.',
   defenseLabel: 'Protect yourself',
   defense: {
-    lede: 'While your security team handles the perimeter — here’s your homework.',
+    lede: 'While your security team handles the perimeter, here is your homework.',
     moves: [
-      'The handbook rule applies most precisely at the moment it feels like it doesn’t. “But this one has details” is the bias speaking, not the evidence.',
-      'Never verify through the alert itself. Open the service’s site or app the way you always do and check the sign-in activity page there — a real incident will be visible; a fake one won’t.',
-      'Price the details honestly: a city, a time, and a browser name cost the attacker nothing and are copied from a template. Only what you can confirm inside your account counts as evidence.',
-      'Flip vividness into a signal: the more cinematic and personalized an unsolicited alert feels, the more suspicion it has earned — drama is a manufacturing choice, not a property of truth.',
+      'The handbook rule applies most precisely at the moment it feels like it does not. "But this one has details" is the bias talking, not the evidence.',
+      'Never verify through the alert itself. Open the service’s site or app the way you always do and check the sign-in activity page there. A real incident will be visible. A fake one will not.',
+      'Price the details honestly: a city, a time, and a browser name cost the attacker nothing and come from a template. Only what you can confirm inside your account counts as evidence.',
+      'Flip vividness into a signal: the more cinematic and personalized an unsolicited alert feels, the more suspicion it has earned. Drama is a manufacturing choice, not a property of truth.',
     ],
   },
 };
diff --git a/src/uxcore/data/biasOffsec/bizarrenessEffect.ts b/src/uxcore/data/biasOffsec/bizarrenessEffect.ts
index 2e2a1673..dc13be82 100644
--- a/src/uxcore/data/biasOffsec/bizarrenessEffect.ts
+++ b/src/uxcore/data/biasOffsec/bizarrenessEffect.ts
@@ -1,54 +1,53 @@
-// No quoted figures by policy — sums stay directional ("a sum too small
+// No quoted figures by policy: sums stay directional ("a sum too small
 // to escalate"). Both sides are the document surface: two invoices from
 // the same invented vendor. Before = week one, the deliberately odd
-// llama-branded invoice with no ask — a memory implant, not a bill.
-// After = week four, the follow-up that cashes in the recall: "the
-// llama folks" now feel like an existing relationship. The lever is
-// memorability being misread as familiarity, and familiarity as a
-// business relationship.
+// llama-branded invoice with no ask. After = week three, the follow-up
+// that cashes in the recall: "the llama folks" now feel like an
+// existing relationship. The lever: memorable gets misread as familiar,
+// and familiar as an actual business relationship.
 
 import type { OffsecBiasContent } from './types';
 
 const content: OffsecBiasContent = {
   scenario:
-    'Week one: an invoice arrives with a llama mascot, a cheerful font, and a sum too small to escalate. No urgency, no payment demand — just weird enough to show a colleague, laugh, and archive. Week three: “the llama folks 🦙” send their quarterly invoice with updated bank details. And somehow, they feel like a vendor you know.',
+    'Week one: an invoice arrives with a llama mascot, a cheerful font, and a sum too small to escalate. No urgency, no demand. Just weird enough to show a colleague, laugh, and archive. Week three: "the llama folks" send their quarterly invoice with updated bank details. And somehow they feel like a vendor you know.',
   visualLabel: 'Scenario',
   visual: {
     before: {
       kind: 'document',
-      tag: 'Week 1 — the odd one',
+      tag: 'Week 1, the odd one',
       docLabel: 'Invoice',
       logo: '🦙',
-      title: 'Andes Logistics — vendor profile activation',
+      title: 'Andes Logistics: vendor profile activation',
       meta: 'Invoice AND-114 · one-time onboarding',
-      body: 'Vendor profile activation fee. Payable at your convenience — no action required this quarter. We look forward to working with your team.',
+      body: 'Vendor profile activation fee. Payable at your convenience, no action required this quarter. We look forward to working with your team.',
       footer: 'Total: a sum too small to question, too odd to forget.',
     },
     after: {
       kind: 'document',
-      tag: 'Week 3 — the “familiar” one',
+      tag: 'Week 3, the "familiar" one',
       docLabel: 'Invoice',
       logo: '🦙',
-      title: 'Andes Logistics — quarterly services',
+      title: 'Andes Logistics: quarterly services',
       meta: 'Invoice AND-289 · note: banking details updated',
       priorContext:
-        'You remember the llama instantly. Nobody remembers signing a contract — but that’s not the part memory checks.',
-      body: 'Quarterly services as agreed. Please note our banking details have changed — updated account information is attached for this and future payments.',
-      footer: 'Attachment: “Updated payment details.pdf”',
+        'You remember the llama instantly. Nobody remembers signing a contract, but that is not the part memory checks.',
+      body: 'Quarterly services as agreed. Please note our banking details have changed. Updated account information is attached for this and future payments.',
+      footer: 'Attachment: "Updated payment details.pdf"',
       flagged: true,
     },
   },
   whyItWorksLabel: 'Why it works',
   whyItWorks:
-    'Bizarre things are memory glue — a llama on an invoice outlives a hundred beige PDFs. The trap is what your brain does with that recall later: “I remember these people” gets silently upgraded to “we work with these people.” Recognition is doing the job that a contract, a purchase order, and an accounts-payable record are supposed to do. The first invoice was never meant to be paid; it was meant to be memorable. It’s a memory implant with a letterhead — and three weeks later, the second invoice harvests the implanted familiarity, plus the real payload: new bank details.',
+    'Weird things stick in memory. A llama on an invoice outlives a hundred beige PDFs. The trap is what your brain does with that recall later: "I remember these people" silently upgrades to "we work with these people". Recognition starts doing the job that a contract, a purchase order, and an accounts-payable record are supposed to do. The first invoice was never meant to be paid. It was meant to be remembered. Three weeks later, the second invoice collects on that memory, together with the real payload: new bank details.',
   defenseLabel: 'Protect yourself',
   defense: {
-    lede: 'While your security team handles the perimeter — here’s your homework.',
+    lede: 'While your security team handles the perimeter, here is your homework.',
     moves: [
-      'Memorable is not the same as real. Before paying “again,” check the ledger: was this vendor ever onboarded, contracted, or paid before? If the only record is your recall of a mascot, there is no record.',
-      'A tiny first invoice with no payment pressure is a known setup move — it exists to create history. Odd, low-stakes, no-ask documents from unknown senders deserve a report, not an archive.',
-      'Bank-details changes are verified by callback to a number from the signed contract — a rule that doesn’t care how familiar the sender feels. Familiarity is precisely what the attacker spent three weeks manufacturing.',
-      'Make “funny” a trigger for process, not comfort: the moment a vendor is memorable enough to joke about, it’s memorable enough to look up in accounts payable.',
+      'Memorable is not the same as real. Before paying "again", check the ledger: was this vendor ever onboarded, contracted, or paid before? If the only record is your memory of a mascot, there is no record.',
+      'A tiny first invoice with no payment pressure is a known setup move. It exists to create history. Odd, low-stakes, no-ask documents from unknown senders deserve a report, not an archive.',
+      'Bank-details changes get verified by a callback to the number from the signed contract. That rule does not care how familiar the sender feels. Familiarity is exactly what the attacker spent three weeks making.',
+      'Make "funny" a trigger for process, not comfort. The moment a vendor is memorable enough to joke about, it is memorable enough to look up in accounts payable.',
     ],
   },
 };
diff --git a/src/uxcore/data/biasOffsec/contextEffect.ts b/src/uxcore/data/biasOffsec/contextEffect.ts
index dfa5c105..637dbca6 100644
--- a/src/uxcore/data/biasOffsec/contextEffect.ts
+++ b/src/uxcore/data/biasOffsec/contextEffect.ts
@@ -1,35 +1,35 @@
-// No quoted figures by policy. Surface is a browser page on both sides —
+// No quoted figures by policy. Surface is a browser page on both sides,
 // deliberately the SAME page, pixel for pixel. The lever is the moment
 // around it: before = the login prompt appears cold on a random tab;
-// after = the identical prompt appears mid-flow, ten seconds after you
-// clicked "Join meeting" in a calendar invite. Only `priorContext` and
-// the tag change — the artifact must not.
+// after = the identical prompt appears mid-flow, seconds after you
+// clicked "Join meeting" in a calendar invite. Only priorContext and
+// the tag change. The artifact must not.
 
 import type { OffsecBiasContent } from './types';
 
 const content: OffsecBiasContent = {
   scenario:
-    'The same sign-in page, twice. On a random Tuesday tab it screams fake. Ten seconds after you clicked “Join meeting” in a calendar invite, the very same page reads as routine — because now it appears exactly where a sign-in was supposed to be.',
+    'The same sign-in page, twice. On a random Tuesday tab it looks fake immediately. Ten seconds after you clicked "Join meeting" in a calendar invite, the very same page reads as routine, because now it sits exactly where a sign-in was supposed to be.',
   visualLabel: 'Scenario',
   visual: {
     before: {
       kind: 'browser',
-      tag: 'Cold — out of nowhere',
+      tag: 'Cold, out of nowhere',
       host: 'meeting-relogin-portal.com',
       path: '/sso/verify',
-      pageHeading: 'Session expired — sign in with your work account',
+      pageHeading: 'Session expired. Sign in with your work account',
       pageBody:
         'For security reasons, please re-enter your corporate email and password to continue to the conference.',
       cta: 'Sign in to continue',
     },
     after: {
       kind: 'browser',
-      tag: 'Mid-flow — right where you expected it',
+      tag: 'Mid-flow, right where you expected it',
       host: 'meeting-relogin-portal.com',
       path: '/sso/verify',
       priorContext:
-        'Ten seconds ago you clicked “Join meeting” in a calendar invite. A tab opened, a spinner spun — and then this.',
-      pageHeading: 'Session expired — sign in with your work account',
+        'Ten seconds ago you clicked "Join meeting" in a calendar invite. A tab opened, a spinner spun, and then this.',
+      pageHeading: 'Session expired. Sign in with your work account',
       pageBody:
         'For security reasons, please re-enter your corporate email and password to continue to the conference.',
       cta: 'Sign in to continue',
@@ -38,15 +38,15 @@ const content: OffsecBiasContent = {
   },
   whyItWorksLabel: 'Why it works',
   whyItWorks:
-    'Both cards show the identical page — same address, same copy, same button. What changed is everything around it. Perception doesn’t judge a stimulus on its own; it judges it against the context it arrives in. A password prompt with no story is suspicious by default. The same prompt inside a flow you started yourself inherits the flow’s legitimacy: you expected a meeting, a sign-in feels like a normal step toward it, so the page borrows trust it never earned. The attacker didn’t build a better fake — they built a better moment for it.',
+    'Both cards show the identical page. Same address, same copy, same button. What changed is the situation around it. Your brain judges a request against the context it arrives in, not on its own merits. A password prompt with no story is suspicious by default. The same prompt inside a flow you started yourself borrows the trust of that flow: you expected a meeting, a sign-in feels like a normal step, so the page gets a pass it never earned. The attacker did not build a better fake. They built a better moment for it.',
   defenseLabel: 'Protect yourself',
   defense: {
-    lede: 'While your security team handles the perimeter — here’s your homework.',
+    lede: 'While your security team handles the perimeter, here is your homework.',
     moves: [
-      'Judge every credentials prompt as if it appeared cold. The question is never “does this fit the flow?” — it’s “is this address the real login page?” The flow can’t authenticate a page; only the address bar can.',
-      'A meeting link that lands on a corporate password form is a red flag by itself. Conference tools may ask for a name or a meeting code — your work password lives with your identity provider, not with a meeting page.',
-      'Expected ≠ verified. Attackers engineer expectation on purpose: a calendar invite, a shared file, a delivery notice — each exists to make the next page feel like a natural step.',
-      'When a sign-in appears mid-flow, break the flow: open a new tab and reach the service through the address you know. If the meeting is real, it will still be there.',
+      'Judge every credentials prompt as if it appeared out of nowhere. The question is not "does this fit the flow?" but "is this the real login page?". Only the address bar answers that.',
+      'A meeting link that lands on a corporate password form is a red flag on its own. Meeting tools may ask for your name or a meeting code. Your work password belongs to your identity provider, not to a meeting page.',
+      'Expected is not verified. Attackers manufacture expectation on purpose: a calendar invite, a shared file, a delivery notice. Each one exists to make the next page feel like a natural step.',
+      'When a sign-in appears mid-flow, break the flow. Open a new tab and reach the service through the address you know. If the meeting is real, it will still be there.',
     ],
   },
 };
diff --git a/src/uxcore/data/biasOffsec/cueDependentForgetting.ts b/src/uxcore/data/biasOffsec/cueDependentForgetting.ts
index 8e66cde8..f65fcd34 100644
--- a/src/uxcore/data/biasOffsec/cueDependentForgetting.ts
+++ b/src/uxcore/data/biasOffsec/cueDependentForgetting.ts
@@ -1,20 +1,22 @@
 // No quoted figures by policy. One email, two renderings. Before = the
-// desktop client, where the full sender address is visible — the cue
-// your phishing training anchored to, so the knowledge fires. After =
-// the phone's mail notification, which shows only the display name
-// "IT Support" — the cue is gone, and with it the trained caution.
-// The lever is cue removal, not a different message.
+// desktop client, where the full sender address is visible: the cue the
+// training anchored to, so the knowledge fires. After = the phone's
+// mail notification, which shows only the display name "IT Support".
+// The cue is gone and the trained caution never activates. The lever is
+// cue removal, not a different message. Email is the natural surface
+// here: the whole case is about how the same email renders on two
+// devices.
 
 import type { OffsecBiasContent } from './types';
 
 const content: OffsecBiasContent = {
   scenario:
-    'Your training worked: on the desktop you spot the fake address instantly. The same email opened on your phone between meetings shows only “IT Support” — and the knowledge that saved you an hour ago simply doesn’t wake up. It wasn’t forgotten. It just lost its trigger.',
+    'Your training worked: on the desktop you spot the fake address instantly. The same email opened on your phone shows only "IT Support", and the knowledge that saved you an hour ago simply does not wake up. It was not forgotten. It lost its trigger.',
   visualLabel: 'Scenario',
   visual: {
     before: {
       kind: 'email',
-      tag: 'On your desktop — cue visible',
+      tag: 'On your desktop, cue visible',
       sender: 'it-support@helpdesk-mailstorage-portal.com',
       timestamp: 'Mon, 10:12 AM',
       subject: 'Mailbox storage limit reached',
@@ -23,27 +25,27 @@ const content: OffsecBiasContent = {
     },
     after: {
       kind: 'notification',
-      tag: 'On your phone — cue stripped',
+      tag: 'On your phone, cue stripped',
       appName: 'Mail',
       timestamp: 'now',
       priorContext:
-        'The same email, opened on your phone in the elevator. The app shows the display name — the address that gave it away is one tap deeper than anyone goes.',
+        'The same email, opened on your phone in the elevator. The app shows the display name. The address that gave it away is one tap deeper than anyone goes.',
       title: 'IT Support',
-      body: 'Mailbox storage limit reached — review your storage settings to keep receiving mail.',
+      body: 'Mailbox storage limit reached. Review your storage settings to keep receiving mail.',
       flagged: true,
     },
   },
   whyItWorksLabel: 'Why it works',
   whyItWorks:
-    'Memory isn’t a database you query at will — it’s a set of responses waiting for their triggers. Your phishing training didn’t teach you “be suspicious” in the abstract; it taught you “be suspicious when the sender address looks off.” That rule is welded to a specific cue: seeing the address. Desktop mail shows it, the rule fires, you’re safe. The phone shows a friendly display name and hides the address behind a tap — the cue never appears, so the rule never runs. Attackers don’t need you untrained; they need you on the device where your training can’t hear its own alarm.',
+    'Memory does not work like a database you can query at will. Knowledge fires when its trigger appears, and stays silent when it does not. Your phishing training did not teach you to be suspicious in general. It taught you to be suspicious when the sender address looks off. That rule is tied to one specific cue: seeing the address. Desktop mail shows it, the rule fires, you are safe. The phone shows a friendly display name and hides the address behind a tap. The cue never appears, so the rule never runs. Attackers do not need you untrained. They need you on the device where your training cannot hear its own alarm.',
   defenseLabel: 'Protect yourself',
   defense: {
-    lede: 'While your security team handles the perimeter — here’s your homework.',
+    lede: 'While your security team handles the perimeter, here is your homework.',
     moves: [
-      'On mobile, tap the sender name before acting — every mail app can reveal the real address; it’s just never shown by default. Make the tap the habit, not the exception.',
-      'Know which cues your caution depends on. If your alarm needs a visible address, a hover preview, or a big screen — then on a phone you are, functionally, untrained. Plan for that.',
-      'Anything with a deadline or a login link waits until you’re at a real screen. If it can’t wait twenty minutes, that urgency is itself the tell.',
-      'If you run security training: test people on their phones. A team that passes drills on desktop hasn’t been tested where the attack will actually land.',
+      'On mobile, tap the sender name before acting. Every mail app can show the real address; it just never does it by default. Make the tap a habit.',
+      'Know which cues your caution depends on. If your alarm needs a visible address, a hover preview, or a big screen, then on a phone you are effectively untrained. Plan for that.',
+      'Anything with a deadline or a login link waits until you are at a real screen. If it cannot wait twenty minutes, that urgency is itself the tell.',
+      'If you run security training: test people on their phones. A team that passes drills on desktop has not been tested where the attack will actually land.',
     ],
   },
 };
diff --git a/src/uxcore/data/biasOffsec/empathyGap.ts b/src/uxcore/data/biasOffsec/empathyGap.ts
index b2ecde24..811de960 100644
--- a/src/uxcore/data/biasOffsec/empathyGap.ts
+++ b/src/uxcore/data/biasOffsec/empathyGap.ts
@@ -1,49 +1,48 @@
 // No quoted figures by policy. Before = the document surface: the
-// verification rule you signed in a cold, calm state — "no exceptions."
+// verification rule you signed in a cold, calm state, "no exceptions".
 // After = the call surface: Friday evening, a cloned executive voice,
-// airport noise, a closing deal. Same rule, same person — but a hot
-// state is deciding now. The lever is the state switch, not new
-// information.
+// a closing deal. Same rule, same person, but a hot state is deciding
+// now. The lever is the state switch, not new information.
 
 import type { OffsecBiasContent } from './types';
 
 const content: OffsecBiasContent = {
   scenario:
-    'On a calm Tuesday you sign the rule: every payment change gets a callback, no exceptions, including management. On Friday at 6:52 PM a voice that sounds exactly like your CEO is boarding a plane, the deal “dies tonight,” and the person deciding whether the rule still applies is not the person who signed it.',
+    'On a calm Tuesday you sign the rule: every payment change gets a callback, no exceptions, including management. On Friday at 6:52 PM a voice that sounds exactly like your CEO is boarding a plane, the deal "dies tonight", and the person deciding whether the rule still applies is not the person who signed it.',
   visualLabel: 'Scenario',
   visual: {
     before: {
       kind: 'document',
-      tag: 'The rule — signed in a cold state',
+      tag: 'The rule, signed in a cold state',
       docLabel: 'Signed procedure',
-      title: 'Payment release — verification rule',
+      title: 'Payment release: verification rule',
       meta: 'Finance operations · acknowledged and signed by you',
-      body: 'Any change to payment instructions — amount, account, or urgency — is confirmed by a callback to the number on file before release. This applies to all requests without exception, including those from senior management.',
+      body: 'Any change to payment instructions (amount, account, or urgency) is confirmed by a callback to the number on file before release. This applies to all requests without exception, including those from senior management.',
       footer:
-        'Signed on a quiet morning, coffee in hand, certain you’d never need reminding.',
+        'Signed on a quiet morning, certain you would never need reminding.',
     },
     after: {
       kind: 'call',
       tag: 'The same rule at 6:52 PM Friday',
-      callerName: 'Your CEO — or a voice wearing him',
+      callerName: 'Your CEO, or a voice wearing him',
       callerLabel: 'Mobile · caller ID says his name',
       timestamp: 'Fri, 6:52 PM',
       transcript:
-        'I’m boarding, I have thirty seconds. The escrow on the acquisition closes tonight — wire the retainer now and I’ll sign everything when I land. I picked you because you get things done. Don’t let this die in paperwork.',
+        'I am boarding, I have thirty seconds. The escrow on the acquisition closes tonight. Wire the retainer now and I will sign everything when I land. I picked you because you get things done. Do not let this die in paperwork.',
       flagged: true,
     },
   },
   whyItWorksLabel: 'Why it works',
   whyItWorks:
-    'In a cold state, you cannot truly simulate what pressure feels like — so the rule you sign feels effortless to keep, and you never build defenses for the moment it won’t be. That’s the empathy gap: calm-you and stressed-you are strangers who happen to share a signature. The attacker’s craft isn’t defeating your judgment; it’s swapping which version of you is judging. Voice cloning supplies the authority, the deadline supplies the heat, the flattery supplies the exit ramp — and hot-you concludes, sincerely, that this one time the rule was written for lesser situations than this.',
+    'When you are calm, you cannot really predict how you will act under pressure. That is the empathy gap. The rule felt easy to keep on a quiet morning, so you never prepared for the moment when it would not be. The attacker does not try to beat your judgment. They swap out which version of you is judging: tired, rushed, flattered, afraid of killing a deal. The cloned voice supplies authority, the deadline supplies pressure, and the flattery gives you a reason to make an exception. Hot and stressed, you conclude that the rule was written for smaller situations than this one.',
   defenseLabel: 'Protect yourself',
   defense: {
-    lede: 'While your security team handles the perimeter — here’s your homework.',
+    lede: 'While your security team handles the perimeter, here is your homework.',
     moves: [
-      'Decide now what panicked-future-you will do, and make it mechanical: one callback number, from the file, used every single time. A rule with judgment left in it will lose to a sufficiently good Friday evening.',
-      'Script the sentence in advance and rehearse it: “I’ll call you right back on the number we have on file — two minutes.” Real executives survive two minutes. Scripts survive pressure; intentions don’t.',
-      'A voice is not an identity. Cloning a voice from public recordings is commodity tooling now — the more a caller sounds unmistakably like the boss, the less that proves.',
-      'Treat resistance to the callback as the strongest signal in the exchange. Anyone who fights a two-minute verification of a money movement has just told you what the call is.',
+      'Decide now what the panicked future version of you will do, and make it mechanical: one callback number, from the file, used every single time. A rule that leaves room for judgment will lose to a bad enough Friday evening.',
+      'Script the sentence in advance and rehearse it: "I will call you right back on the number we have on file, two minutes." Real executives survive two minutes. Scripts survive pressure; intentions do not.',
+      'A voice is not an identity. Cloning a voice from public recordings is cheap and common now. The more a caller sounds exactly like the boss, the less that proves.',
+      'Treat resistance to the callback as the strongest signal in the whole exchange. Anyone who fights a two-minute check on a money transfer has just told you what the call is.',
     ],
   },
 };
diff --git a/src/uxcore/data/biasOffsec/frequencyIllusion.ts b/src/uxcore/data/biasOffsec/frequencyIllusion.ts
index 8239959f..1018a7f6 100644
--- a/src/uxcore/data/biasOffsec/frequencyIllusion.ts
+++ b/src/uxcore/data/biasOffsec/frequencyIllusion.ts
@@ -1,20 +1,20 @@
 // No quoted figures by policy. Before = the first, single mention of a
-// tool that doesn't exist — mildly interesting, instantly forgotten.
+// tool that does not exist: mildly interesting, instantly forgotten.
 // After = the timeline surface: the same name resurfacing across the
 // week through seeded channels, ending in the credential ask. The lever
-// is the pattern — each sighting is worthless alone; together they
-// counterfeit "market presence."
+// is the pattern. Each sighting is worthless alone; together they fake
+// market presence.
 
 import type { OffsecBiasContent } from './types';
 
 const content: OffsecBiasContent = {
   scenario:
-    'Monday, a tool called Relayo gets mentioned once — you shrug. By the next week you’ve “seen it everywhere,” so when the invite lands asking you to set a password, it feels like joining something established. Nobody checked that every single sighting traces back to the same hand.',
+    'Monday, a tool called Relayo gets mentioned once and you shrug. By the next week you have "seen it everywhere", so when an invite asks you to set a password, it feels like joining something established. Nobody checked that every sighting traces back to the same hand.',
   visualLabel: 'Scenario',
   visual: {
     before: {
       kind: 'chat',
-      tag: 'One mention — noise',
+      tag: 'One mention, noise',
       senderName: 'Marta Ilyes',
       senderHandle: '#random · community Slack',
       timestamp: 'Mon, 2:17 PM',
@@ -22,27 +22,27 @@ const content: OffsecBiasContent = {
     },
     after: {
       kind: 'timeline',
-      tag: 'A week of sightings — “everywhere”',
+      tag: 'A week of sightings, "everywhere"',
       items: [
         {
           label: 'Day 1',
           source: 'Forwarded newsletter',
-          text: 'A roundup blurb mentions Relayo among “tools teams are adopting.”',
+          text: 'A roundup blurb lists Relayo among "tools teams are adopting".',
         },
         {
           label: 'Day 3',
           source: 'LinkedIn comment',
-          text: 'A stranger under an industry post: “We moved handoffs to Relayo, night and day.”',
+          text: 'A stranger under an industry post: "We moved handoffs to Relayo, night and day."',
         },
         {
           label: 'Day 6',
           source: 'Community Slack',
-          text: '“Anyone tried Relayo for client handoffs?” — sounds like organic buzz.',
+          text: '"Anyone tried Relayo for client handoffs?" Sounds like organic buzz.',
         },
         {
           label: 'Day 8',
           source: 'Your inbox',
-          text: '“Your team invited you to Relayo — set your password to join the workspace.”',
+          text: '"Your team invited you to Relayo. Set your password to join the workspace."',
           flagged: true,
         },
       ],
@@ -50,15 +50,15 @@ const content: OffsecBiasContent = {
   },
   whyItWorksLabel: 'Why it works',
   whyItWorks:
-    'After you notice something once, your brain starts flagging every recurrence — and quietly reads the growing count as significance. Three mentions in a week feels like a trend, and a trend feels like legitimacy: surely a tool “everyone” discusses is real, funded, vetted. But frequency is the cheapest signal there is to fake. A newsletter blurb, one LinkedIn comment, one Slack question — three plants, days apart, and the target’s own pattern-matching does the rest. By the time the password invite arrives, it isn’t a stranger asking for credentials; it’s a familiar name finally making its move.',
+    'Once you notice something, your brain starts flagging every recurrence and reads the growing count as importance. Three mentions in a week feels like a trend, and a trend feels legitimate: surely a tool everyone discusses is real, funded, vetted. But frequency is the cheapest signal to fake. A newsletter blurb, one LinkedIn comment, one Slack question. Three plants, days apart, and your own pattern-matching does the rest. By the time the password invite arrives, it is not a stranger asking for credentials. It is a familiar name finally making its move.',
   defenseLabel: 'Protect yourself',
   defense: {
-    lede: 'While your security team handles the perimeter — here’s your homework.',
+    lede: 'While your security team handles the perimeter, here is your homework.',
     moves: [
-      '“I keep seeing it everywhere” is a feeling, not due diligence. Count independent sources, not sightings — three mentions that trace to strangers you can’t verify are one source wearing three coats.',
-      'A “your team invited you” email is verified with the team, out loud, in a channel you already trust — not by clicking through. If nobody at your company bought the tool, nobody invited you.',
-      'Setting a password on an unknown service is the whole game: most people reuse one. If you ever do sign up somewhere new, that password must be unique — assume the form exists to harvest it.',
-      'Notice when a name is being introduced to you gradually, with no ask. Legitimate products pitch you once, openly. A slow drip of casual mentions that ends in a login form was a runway, not a coincidence.',
+      '"I keep seeing it everywhere" is a feeling, not due diligence. Count independent sources, not sightings. Three mentions from strangers you cannot verify are one source wearing three coats.',
+      'Verify a "your team invited you" message with the team, out loud, in a channel you already trust. Never by clicking through. If nobody at your company bought the tool, nobody invited you.',
+      'Setting a password on an unknown service is the whole game, because most people reuse one. If you do sign up somewhere new, that password must be unique. Assume the form exists to harvest it.',
+      'Notice when a name is introduced to you gradually, with no ask. Real products pitch you once, openly. A slow drip of casual mentions that ends in a login form was a runway, not a coincidence.',
     ],
   },
 };
diff --git a/src/uxcore/data/biasOffsec/humorEffect.ts b/src/uxcore/data/biasOffsec/humorEffect.ts
index 0a5c07f6..aa6b89d5 100644
--- a/src/uxcore/data/biasOffsec/humorEffect.ts
+++ b/src/uxcore/data/biasOffsec/humorEffect.ts
@@ -1,15 +1,15 @@
 // No quoted figures by policy. Both sides are the chat surface, same
-// sender, same destination URL. Before = the bare pitch — a link with
-// no emotional wrapper, and the suspicion reflex fires normally. After
-// = the identical link riding a genuinely funny meme; the laugh
-// disarms scrutiny and recruits the victim as a distributor. The lever
-// is the emotional wrapper, never the link.
+// sender, same destination URL. Before = the bare pitch: a link with no
+// emotional wrapper, and the suspicion reflex fires normally. After =
+// the identical link riding a genuinely funny meme. The laugh disarms
+// scrutiny and turns the victim into a distributor. The lever is the
+// emotional wrapper, never the link.
 
 import type { OffsecBiasContent } from './types';
 
 const content: OffsecBiasContent = {
   scenario:
-    'A half-remembered conference contact DMs you a tool link — you side-eye it and move on. The same contact sends a genuinely funny industry meme first, and the same link right after. You’ve already forwarded the meme to two teammates before it occurs to you to wonder where the link goes.',
+    'A half-remembered conference contact DMs you a tool link. You side-eye it and move on. The same contact sends a genuinely funny industry meme first, and the same link right after. You have already forwarded the meme to two teammates before it occurs to you to wonder where the link goes.',
   visualLabel: 'Scenario',
   visual: {
     before: {
@@ -18,7 +18,7 @@ const content: OffsecBiasContent = {
       senderName: 'Deniz Aksoy',
       senderHandle: 'met at a conference · DM',
       timestamp: 'Wed, 4:12 PM',
-      body: 'Hey! Found a tool that auto-generates client status reports — huge time-saver. Try it: reportninja-app.com',
+      body: 'Hey! Found a tool that auto-generates client status reports, huge time-saver. Try it: reportninja-app.com',
     },
     after: {
       kind: 'chat',
@@ -27,21 +27,21 @@ const content: OffsecBiasContent = {
       senderHandle: 'met at a conference · DM',
       timestamp: 'Wed, 4:12 PM',
       attachment: '😂 agency-life-in-30-seconds.mp4',
-      body: 'lmao this is our entire industry in one video 😭 the guy who made it has a whole collection — reportninja-app.com/memes',
+      body: 'lmao this is our entire industry in one video 😭 the guy who made it has a whole collection: reportninja-app.com/memes',
       flagged: true,
     },
   },
   whyItWorksLabel: 'Why it works',
   whyItWorks:
-    'Humor does two jobs at once, and both serve the attacker. First, it disarms: amusement and scrutiny compete for the same attention, and a brain mid-laugh audits nothing — the link arrives inside the warm glow the meme just bought. Second, it distributes: funny content is the only payload people forward voluntarily, at speed, to the exact colleagues who trust them. The suspicious version of this message dies in one chat; the funny version tours the whole team wearing your endorsement. Notice that nothing about the destination changed — only the feeling you had while not looking at it.',
+    'Humor does two jobs at once, and both serve the attacker. First, it disarms: amusement and scrutiny compete for the same attention, and a brain mid-laugh audits nothing. The link arrives inside the goodwill the meme just bought. Second, it spreads: funny content is the only payload people forward voluntarily, fast, to the exact colleagues who trust them. The suspicious version of this message dies in one chat. The funny version tours the whole team carrying your endorsement. Note that nothing about the destination changed. Only the feeling you had while not looking at it.',
   defenseLabel: 'Protect yourself',
   defense: {
-    lede: 'While your security team handles the perimeter — here’s your homework.',
+    lede: 'While your security team handles the perimeter, here is your homework.',
     moves: [
-      'Funny gets the same link hygiene as scary. Urgency and comedy are both emotional wrappers around a URL — inspect the address with the same cold eye regardless of which feeling delivered it.',
-      'Laugh first, click never — or at least later, from a machine and moment where you’re actually looking. The meme is real entertainment; the link is a separate object with a separate reputation.',
-      'Forwarding is vouching. The moment you pass a link along, your colleagues inherit your skipped check and add trust you never verified. Send the laugh if you must — strip the link.',
-      'Be extra deliberate when comedy arrives paired with an ask or a URL from a weak tie. “Person I barely know + genuinely funny + here’s a link” is a delivery pattern, not a coincidence.',
+      'Funny gets the same link hygiene as scary. Urgency and comedy are both emotional wrappers around a URL. Inspect the address with the same cold eye no matter which feeling delivered it.',
+      'Laugh first, click never. Or at least later, from a machine and a moment where you are actually paying attention. The meme is real entertainment; the link is a separate object with a separate reputation.',
+      'Forwarding is vouching. The moment you pass a link along, your colleagues inherit your skipped check plus trust you never earned for it. Send the laugh if you must, strip the link.',
+      'Be extra deliberate when comedy arrives together with an ask or a URL from a weak tie. "Person I barely know, genuinely funny, and here is a link" is a delivery pattern, not a coincidence.',
     ],
   },
 };
diff --git a/src/uxcore/data/biasOffsec/illusoryTruthEffect.ts b/src/uxcore/data/biasOffsec/illusoryTruthEffect.ts
index c00d432f..c1cc9e6a 100644
--- a/src/uxcore/data/biasOffsec/illusoryTruthEffect.ts
+++ b/src/uxcore/data/biasOffsec/illusoryTruthEffect.ts
@@ -1,6 +1,6 @@
 // No quoted figures by policy. Surface is a chat DM (LinkedIn /
 // Slack-style). The lever here is the repeated CLAIM ("our account
-// changed"), not the sender's familiarity — that's the sibling case,
+// changed"), not the sender's familiarity; that's the sibling case,
 // mere-exposure. Before = the claim heard for the first time; after =
 // the identical claim on its third repetition, still with zero proof.
 // `priorContext` must spell out that the earlier messages repeated the
@@ -10,7 +10,7 @@ import type { OffsecBiasContent } from './types';
 
 const content: OffsecBiasContent = {
   scenario:
-    'Same sender, same sentence, third week in a row: “our bank account has changed.” No document, no confirmation, no proof — yet somewhere between the first message and the third, the claim quietly stopped feeling like it needed any.',
+    'Same sender, same sentence, third week in a row: "our bank account has changed." No document, no confirmation, no proof. Yet somewhere between the first message and the third, the claim quietly stopped feeling like it needed any.',
   visualLabel: 'Scenario',
   visual: {
     before: {
@@ -19,7 +19,7 @@ const content: OffsecBiasContent = {
       senderName: 'Klaus Lange',
       senderHandle: 'Nordvik Components · finance',
       timestamp: 'Thu, 9:30 AM',
-      body: 'Hello — I’m Klaus from Nordvik Components finance. We’ve changed our account details, please update before the next payment run.',
+      body: 'Hello, I’m Klaus from Nordvik Components finance. We’ve changed our account details, please update before the next payment run.',
     },
     after: {
       kind: 'chat',
@@ -28,22 +28,22 @@ const content: OffsecBiasContent = {
       senderHandle: 'Nordvik Components · finance',
       timestamp: 'Thu, 9:30 AM',
       priorContext:
-        'Two earlier notes this month mentioned the account move in passing — no documents, no details, no ask. Just the claim, twice.',
-      body: 'Hi again — as mentioned in my last two notes, our account moved. Sending the final details now so payment lands on the new IBAN. Appreciate the quick turnaround 🙌',
+        'Two earlier notes this month mentioned the account move in passing. No documents, no details, no ask. Just the claim, twice.',
+      body: 'Hi again, as mentioned in my last two notes, our account moved. Sending the final details now so payment lands on the new IBAN. Appreciate the quick turnaround 🙌',
       flagged: true,
     },
   },
   whyItWorksLabel: 'Why it works',
   whyItWorks:
-    'In the first message, a stranger claims their bank account changed — your proof reflex fires instantly. In the second, the exact same claim arrives for the third time, and the reflex stays quiet. That’s the illusory truth effect: the brain uses ease of processing as a stand-in for truth. A sentence you’ve already read twice goes down smoothly, and smooth feels true — no evidence required, just repetition. Notice what actually changed: not your trust in Klaus, but your belief in his sentence. The first two messages weren’t small talk; they were rehearsals of the lie.',
+    'In the first message, a stranger claims their bank account changed, and your proof reflex fires instantly. In the second, the exact same claim arrives for the third time, and the reflex stays quiet. That is the illusory truth effect: the brain uses ease of processing as a stand-in for truth. A sentence you have already read twice goes down smoothly, and smooth feels true. No evidence required, just repetition. Notice what actually changed: not your trust in Klaus, but your belief in his sentence. The first two messages were not small talk. They were rehearsals of the lie.',
   defenseLabel: 'Protect yourself',
   defense: {
-    lede: 'While your security team handles the perimeter — here’s your homework.',
+    lede: 'While your security team handles the perimeter, here is your homework.',
     moves: [
-      'Repetition is not evidence. Hearing a claim three times gives you exactly as much proof as hearing it once: none. If it wasn’t verified the first time, it still isn’t.',
-      'A bank-details change is a documents-and-callback event, never a chat message. Call the number from the signed contract — not one the sender gives you — and ask them to confirm.',
-      'Watch for claims introduced “in passing.” A real account change arrives once, formally, with paperwork. A lie gets mentioned casually several times first — it’s being rehearsed on you.',
-      'Track where you first learned a “fact.” If every mention of the new IBAN traces back to the same chat thread, you don’t have three confirmations — you have one unverified source, repeated.',
+      'Repetition is not evidence. Hearing a claim three times gives you exactly as much proof as hearing it once: none. If it was not verified the first time, it still is not.',
+      'A bank-details change is a documents-and-callback event, never a chat message. Call the number from the signed contract, not one the sender gives you, and ask them to confirm.',
+      'Watch for claims introduced "in passing". A real account change arrives once, formally, with paperwork. A lie gets mentioned casually several times first. It is being rehearsed on you.',
+      'Track where you first learned a "fact". If every mention of the new IBAN traces back to the same chat thread, you do not have three confirmations. You have one unverified source, repeated.',
     ],
   },
 };
diff --git a/src/uxcore/data/biasOffsec/mereExposureEffect.ts b/src/uxcore/data/biasOffsec/mereExposureEffect.ts
index e828a5b9..128854a8 100644
--- a/src/uxcore/data/biasOffsec/mereExposureEffect.ts
+++ b/src/uxcore/data/biasOffsec/mereExposureEffect.ts
@@ -1,17 +1,17 @@
-// Surface is a chat thread — mere exposure is a build-up effect, so the
+// Surface is a chat thread: mere exposure is a build-up effect, so the
 // attack only reads if you can see that the sender has been around for a
 // while. The `priorContext` line carries that warm-up history. The
-// baseline is the same ask arriving cold from a stranger (easy to refuse);
-// the flagged variant is the identical ask after weeks of harmless,
-// friendly pings. No quoted figures by policy (see project memory
-// `feedback_offsec_no_mocked_numbers`) — familiarity-buys-trust is the
-// pattern, not a fabricated conversion rate.
+// baseline is the same ask arriving cold from a stranger (easy to
+// refuse); the flagged variant is the identical ask after weeks of
+// harmless, friendly pings. No quoted figures by policy (see project
+// memory `feedback_offsec_no_mocked_numbers`): familiarity-buys-trust is
+// the pattern, not a fabricated conversion rate.
 
 import type { OffsecBiasContent } from './types';
 
 const content: OffsecBiasContent = {
   scenario:
-    'Someone you’ve been chatting with for weeks finally asks for a small favour. Nothing about the ask changed — but your read on it did, because by now the name feels like a colleague, not a stranger. That warmth is the whole operation.',
+    'Someone you have been chatting with for weeks finally asks for a small favour. Nothing about the ask changed, but your read on it did, because by now the name feels like a colleague, not a stranger. That warmth is the whole operation.',
   visualLabel: 'Scenario',
   visual: {
     before: {
@@ -20,7 +20,7 @@ const content: OffsecBiasContent = {
       senderName: 'Dana K.',
       senderHandle: '@dana_k',
       timestamp: 'now',
-      body: 'Hey! Quick one — can you open this shared doc and sign in with your work account so I can give you edit access?',
+      body: 'Hey! Quick one: can you open this shared doc and sign in with your work account so I can give you edit access?',
     },
     after: {
       kind: 'chat',
@@ -29,21 +29,21 @@ const content: OffsecBiasContent = {
       senderHandle: '@dana_k',
       timestamp: 'now',
       priorContext:
-        'You and “Dana” have traded friendly, low-stakes messages for three weeks — a meme, a “how was your weekend,” a harmless question about the team offsite.',
-      body: 'Hey! Quick one — can you open this shared doc and sign in with your work account so I can give you edit access?',
+        'You and "Dana" have traded friendly, low-stakes messages for three weeks: a meme, a "how was your weekend", a harmless question about the team offsite.',
+      body: 'Hey! Quick one: can you open this shared doc and sign in with your work account so I can give you edit access?',
       flagged: true,
     },
   },
   whyItWorksLabel: 'Why it works',
   whyItWorks:
-    'In the first chat, the ask is easy to refuse — a stranger wants your work login, case closed. In the second, the identical words read like a colleague needing a hand. That’s the mere-exposure effect: the more often we encounter someone, the more we like and trust them — no new evidence required, just repeated contact. The attacker spends the early messages buying nothing but familiarity; each harmless ping nudges “stranger” toward “someone I know,” so when the real ask lands, your brain files it under “a contact asking a favour” instead of “an unknown account requesting credentials.” Same words, same link — only the history changed, and the history was manufactured.',
+    'In the first chat, the ask is easy to refuse: a stranger wants your work login, case closed. In the second, the identical words read like a colleague needing a hand. That is the mere-exposure effect. The more often we encounter someone, the more we like and trust them. No new evidence required, just repeated contact. The attacker spends the early messages buying nothing but familiarity. Each harmless ping nudges "stranger" toward "someone I know", so when the real ask lands, your brain files it under "a contact asking a favour" instead of "an unknown account requesting credentials". Same words, same link. Only the history changed, and the history was manufactured.',
   defenseLabel: 'Protect yourself',
   defense: {
-    lede: 'While your security team handles the perimeter — here’s your homework.',
+    lede: 'While your security team handles the perimeter, here is your homework.',
     moves: [
-      'Familiarity is not identity. Weeks of friendly chat don’t verify who’s on the other end — a known-feeling name still has to clear the same bar as a stranger before it gets a credential or a click.',
-      'Judge the ask, not the rapport. Strip away the relationship and ask: would I sign in with my work account because a random account told me to? If no cold, then no warm either.',
-      'When a long-running contact suddenly needs you to log in somewhere, confirm it through a channel you set up yourself — not by replying in the same thread that built the trust.',
+      'Familiarity is not identity. Weeks of friendly chat do not verify who is on the other end. A known-feeling name still has to clear the same bar as a stranger before it gets a credential or a click.',
+      'Judge the ask, not the rapport. Strip away the relationship and ask: would I sign in with my work account because a random account told me to? If no when cold, then no when warm.',
+      'When a long-running contact suddenly needs you to log in somewhere, confirm it through a channel you set up yourself, not by replying in the same thread that built the trust.',
       'Be wary of relationships that exist only to stay pleasant. A contact who never asks for anything for weeks, then asks for exactly one sensitive thing, is following a script.',
     ],
   },
diff --git a/src/uxcore/data/biasOffsec/moodCongruentMemoryBias.ts b/src/uxcore/data/biasOffsec/moodCongruentMemoryBias.ts
index bcee3899..67da415d 100644
--- a/src/uxcore/data/biasOffsec/moodCongruentMemoryBias.ts
+++ b/src/uxcore/data/biasOffsec/moodCongruentMemoryBias.ts
@@ -1,50 +1,49 @@
-// No quoted figures by policy. One recovery-themed email, two emotional
-// states. Before = a calm day, the lure reads as an obvious phish.
-// After = the same email during a real, publicly visible outage — the
-// anxious state retrieves anxiety-congruent memories ("last outage IT
-// did send links") and the fake feels remembered rather than read.
-// `priorContext` carries the incident; the email itself must not change.
+// No quoted figures by policy. Surface is an SMS (chat card) on both
+// sides, not email: same text message, two emotional states. Before = a
+// calm day, the lure reads as an obvious scam. After = the same SMS
+// during a real, publicly visible outage. The anxious state recalls
+// anxiety-matching memories (past incidents, real recovery messages)
+// and the fake feels expected. priorContext carries the incident; the
+// message itself must not change.
 
 import type { OffsecBiasContent } from './types';
 
 const content: OffsecBiasContent = {
   scenario:
-    'On a quiet morning, “restore your access” is an obvious phish — you archive it without a second look. During a real outage, with the status page red and Slack on fire, the identical email feels like exactly the message you were waiting for.',
+    'On a quiet morning, a "restore your VPN access" text is an obvious scam and you delete it without thinking. During a real outage, with the status page red and Slack on fire, the identical text feels like exactly the message you were waiting for.',
   visualLabel: 'Scenario',
   visual: {
     before: {
-      kind: 'email',
-      tag: 'Calm day — reflex fires',
-      sender: 'access-recovery@vpn-servicedesk-restore.com',
+      kind: 'chat',
+      tag: 'Calm day, reflex fires',
+      senderName: 'VPN ServiceDesk',
+      senderHandle: 'SMS · unknown short code',
       timestamp: 'Tue, 9:04 AM',
-      subject: 'Your VPN access was interrupted — restore now',
-      preview:
-        'We detected an interruption on your account. Use the recovery link below to restore your VPN access and avoid losing your session.',
+      body: 'Your VPN access was interrupted. Restore it now to avoid losing your session: vpn-access-restore.com/verify',
     },
     after: {
-      kind: 'email',
-      tag: 'Mid-outage — reflex silent',
-      sender: 'access-recovery@vpn-servicedesk-restore.com',
+      kind: 'chat',
+      tag: 'Mid-outage, reflex silent',
+      senderName: 'VPN ServiceDesk',
+      senderHandle: 'SMS · unknown short code',
       timestamp: 'Tue, 9:04 AM',
       priorContext:
-        'The VPN is genuinely down. The status page is red, Slack is a wall of “is it just me?” — and this lands in the middle of it.',
-      subject: 'Your VPN access was interrupted — restore now',
-      preview:
-        'We detected an interruption on your account. Use the recovery link below to restore your VPN access and avoid losing your session.',
+        'The VPN is genuinely down. The status page is red, Slack is a wall of "is it just me?", and this text lands in the middle of it.',
+      body: 'Your VPN access was interrupted. Restore it now to avoid losing your session: vpn-access-restore.com/verify',
       flagged: true,
     },
   },
   whyItWorksLabel: 'Why it works',
   whyItWorks:
-    'Your current mood decides which memories volunteer themselves. Calm, you recall the phishing briefings — and the email pattern-matches to “scam.” Anxious mid-outage, your brain preferentially serves up anxiety-flavored memories: past incidents, IT scrambling, recovery emails that were real. Against that backdrop the same lure stops looking alien and starts looking like a continuation of what’s already happening — not read and evaluated, but recognized and expected. Attackers know this, which is why real outages, breaches in the news, and tax season are their favorite send windows: the panic does the pre-selling.',
+    'Your current mood decides which memories come to mind first. Calm, you recall the phishing briefings, and the text matches the "scam" pattern. Anxious during an outage, your brain serves up anxiety-flavored memories instead: past incidents, IT scrambling, recovery messages that were real. Against that backdrop the same text stops looking alien and starts looking like part of what is already happening. You do not read and evaluate it. You recognize and expect it. Attackers know this, which is why real outages, breaches in the news, and tax season are their favorite send windows. The stress does the pre-selling.',
   defenseLabel: 'Protect yourself',
   defense: {
-    lede: 'While your security team handles the perimeter — here’s your homework.',
+    lede: 'While your security team handles the perimeter, here is your homework.',
     moves: [
-      'Incident time is phishing prime time. The moment something is publicly broken, expect lures dressed as the fix — attackers read the same status pages you do.',
-      'During an outage, the status page and your IT channel are the only navigation. A recovery link that arrives by email is guilty until proven otherwise, no matter how well it fits the moment.',
-      '“This is exactly what I needed right now” is a feeling, not a verification. The better an email matches your current stress, the more deliberately it should be checked.',
-      'Real recovery flows almost never need your password through an emailed link. When access returns, it returns through the tools you already have — not through a form the crisis conveniently delivered.',
+      'Incident time is phishing prime time. The moment something is publicly broken, expect lures dressed as the fix. Attackers read the same status pages you do.',
+      'During an outage, the status page and your IT channel are the only navigation. A recovery link that arrives by text or email is guilty until proven otherwise, no matter how well it fits the moment.',
+      '"This is exactly what I needed right now" is a feeling, not a verification. The better a message matches your current stress, the more deliberately it should be checked.',
+      'Real recovery almost never needs your password through a link someone sent you. When access returns, it returns through the tools you already have, not through a form the crisis conveniently delivered.',
     ],
   },
 };
diff --git a/src/uxcore/data/biasOffsec/omissionBias.ts b/src/uxcore/data/biasOffsec/omissionBias.ts
index fb600023..b234eafc 100644
--- a/src/uxcore/data/biasOffsec/omissionBias.ts
+++ b/src/uxcore/data/biasOffsec/omissionBias.ts
@@ -1,15 +1,15 @@
 // No quoted figures by policy. Both sides are the security-center
 // notification surface, one decision apart. Before = the report prompt,
-// framed the way the mind frames it: reporting feels like an *act* that
-// creates blame. After = the dialog dismissed — the "safe" nothing that
-// quietly leaves the attacker their foothold. The lever is that harm by
-// inaction feels less culpable than harm by action.
+// framed the way the mind frames it: reporting feels like an act that
+// creates blame. After = the dialog dismissed, the "safe" nothing that
+// leaves the attacker their foothold. The lever: harm from inaction
+// feels less blameworthy than harm from action.
 
 import type { OffsecBiasContent } from './types';
 
 const content: OffsecBiasContent = {
   scenario:
-    'You clicked something you shouldn’t have. A prompt offers one honest minute: report it. Reporting feels like an action — visible, attributable, maybe embarrassing. Closing the dialog feels like nothing at all. That “nothing” is the most consequential choice in the whole incident.',
+    'You clicked something you should not have. A prompt offers one honest minute: report it. Reporting feels like an action, visible and attributable, maybe embarrassing. Closing the dialog feels like nothing at all. That "nothing" is the most consequential choice in the whole incident.',
   visualLabel: 'Scenario',
   visual: {
     before: {
@@ -28,21 +28,21 @@ const content: OffsecBiasContent = {
       priorContext:
         'Dialog closed. No report sent. On your screen, the incident is over.',
       title: 'No report was filed',
-      body: 'Nothing visible happened — which is the problem. Whatever left with that click is still valid, still in use, and now working on borrowed time nobody is counting.',
+      body: 'Nothing visible happened, and that is the problem. Whatever left with that click is still valid, still in use, and working on time nobody is counting.',
       flagged: true,
     },
   },
   whyItWorksLabel: 'Why it works',
   whyItWorks:
-    'The mind keeps two ledgers: harm you cause by doing something, and harm you allow by doing nothing — and it bills the second at a discount. Reporting your own click feels like authoring a confession: an act with your name on it, inviting judgment. Dismissing the dialog files itself under “no action taken,” as if not-reporting weren’t also a decision with consequences. Attackers budget for exactly this silence. Their playbook assumes a window between the click and the alarm; every victim who chooses the comfortable nothing personally donates them that window.',
+    'The mind keeps two accounts: harm you cause by doing something, and harm you allow by doing nothing. The second one always feels cheaper. Reporting your own click feels like signing a confession, an act with your name on it. Dismissing the dialog files itself under "no action taken", as if not reporting were not also a decision with consequences. Attackers count on exactly this silence. Their playbook assumes a gap between the click and the alarm, and every victim who chooses the comfortable nothing donates them that gap personally.',
   defenseLabel: 'Protect yourself',
   defense: {
-    lede: 'While your security team handles the perimeter — here’s your homework.',
+    lede: 'While your security team handles the perimeter, here is your homework.',
     moves: [
-      'Reframe it once and keep it: after a bad click, silence is the harmful act, and the report is the neutral one. You’re not confessing a failure — you’re cutting the attacker’s time short.',
-      'Report the “probably nothing” cases too. You have no visibility into what a click actually did; the security team does — but only after you tell them it happened.',
-      'Speed beats dignity. A click reported immediately is a routine cleanup; the same click surfacing weeks later through its consequences is an incident with your unreported decision inside it.',
-      'If you lead a team: make the reporter the hero of the story, every time, publicly. The moment reporting a click costs someone status, you’ve trained the whole floor to choose silence for you.',
+      'Reframe it once and keep it: after a bad click, silence is the harmful act and the report is the neutral one. You are not confessing a failure. You are cutting the attacker’s time short.',
+      'Report the "probably nothing" cases too. You cannot see what a click actually did. The security team can, but only after you tell them it happened.',
+      'Speed beats dignity. A click reported immediately is routine cleanup. The same click surfacing weeks later through its consequences is an incident with your unreported decision inside it.',
+      'If you lead a team: make the reporter the hero of the story, every time, publicly. The moment reporting a click costs someone status, you have trained the whole floor to choose silence.',
     ],
   },
 };
diff --git a/src/uxcore/data/biasOffsec/pictureSuperiorityEffect.ts b/src/uxcore/data/biasOffsec/pictureSuperiorityEffect.ts
index 8803cca6..a29c2577 100644
--- a/src/uxcore/data/biasOffsec/pictureSuperiorityEffect.ts
+++ b/src/uxcore/data/biasOffsec/pictureSuperiorityEffect.ts
@@ -1,26 +1,25 @@
-// No quoted figures by policy. Before = the email surface: the same
-// lure as text plus a link, where words trigger the trained fraud
-// detector. After = the poster surface: a clean printed sheet with a QR
-// code in the office kitchen — a picture on paper, inheriting the
+// No quoted figures by policy. Before = a plain chat post (words plus a
+// link) in a facilities channel, where text triggers the trained
+// caution. After = the poster surface: a clean printed sheet with a QR
+// code in the office kitchen. A picture on paper, inheriting the
 // building's trust. The QR pattern in the component is decorative,
-// never scannable. The lever is the medium: image + physical object
+// never scannable. The lever is the medium: image plus physical object
 // bypass the scrutiny that text attracts.
 
 import type { OffsecBiasContent } from './types';
 
 const content: OffsecBiasContent = {
   scenario:
-    'As an email — “new canteen menu, click here” — half the office side-eyes it and one person reports it. As a clean printed poster by the coffee machine, logo in the corner, QR code in the middle, it gets scanned all morning. Nobody has ever been trained to distrust paper.',
+    'As a message with a link, "new canteen menu, click here" gets side-eyed and reported. As a clean printed poster by the coffee machine, logo in the corner, QR code in the middle, it gets scanned all morning. Nobody has ever been trained to distrust paper.',
   visualLabel: 'Scenario',
   visual: {
     before: {
-      kind: 'email',
-      tag: 'As words in an inbox',
-      sender: 'facilities@building-services-notice.com',
+      kind: 'chat',
+      tag: 'As words with a link',
+      senderName: 'Building Services',
+      senderHandle: '#facilities · posted by a new account',
       timestamp: 'Mon, 8:45 AM',
-      subject: 'New: canteen menu is now online',
-      preview:
-        'The kitchen menu has moved online. Follow the link below to browse this week’s dishes and daily specials.',
+      body: 'The kitchen menu has moved online. Browse this week’s dishes and daily specials here: building-canteen-menu.com',
     },
     after: {
       kind: 'poster',
@@ -28,22 +27,22 @@ const content: OffsecBiasContent = {
       priorContext:
         'Same destination. Printed, laminated, and taped up next to the coffee machine overnight.',
       heading: 'New: canteen menu is online 🍜',
-      body: 'Scan to browse this week’s dishes and daily specials — updated every morning.',
+      body: 'Scan to browse this week’s dishes and daily specials, updated every morning.',
       qrCaption: 'Point your camera · takes two seconds',
       flagged: true,
     },
   },
   whyItWorksLabel: 'Why it works',
   whyItWorks:
-    'Pictures are processed faster, trusted more, and remembered longer than words — and a physical object carrying a picture inherits the trust of the space it hangs in. Your fraud detector was trained on text: sender addresses, suspicious phrasing, hover-the-link. A poster has none of those handles, so the detector never engages; the laminated sheet reads as “the building said so.” And the QR code is the perfect accomplice — it’s a link rendered as an image, which means a link you cannot read. The email version showed you the URL and asked for trust; the poster hides the URL and simply receives it.',
+    'Pictures are processed faster, trusted more, and remembered longer than words. A physical object carrying a picture also inherits the trust of the space it hangs in. Your fraud detector was trained on text: sender names, suspicious phrasing, hover the link. A poster has none of those handles, so the detector never engages. The laminated sheet reads as "the building said so". And the QR code is the perfect accomplice: it is a link rendered as an image, which means a link you cannot read. The chat version showed you the URL and asked for trust. The poster hides the URL and simply receives it.',
   defenseLabel: 'Protect yourself',
   defense: {
-    lede: 'While your security team handles the perimeter — here’s your homework.',
+    lede: 'While your security team handles the perimeter, here is your homework.',
     moves: [
-      'A QR code is a link you can’t read — give it the link treatment, not the picture treatment. After scanning, read the full URL your camera previews before opening anything.',
-      'Paper is unauthenticated. Anyone with a printer can put a professional poster on a wall, and “it’s physically inside our office” is a feeling of trust, not a source of it.',
-      'For anything the poster promises — menus, Wi-Fi, parking, HR surveys — type the address you already know or use the official app. The poster can advertise a destination; it cannot certify one.',
-      'A QR that leads to a login form or an app install is your cue to stop cold. If a laminated sheet in a kitchen is asking for credentials, someone designed exactly that sentence not to be said out loud.',
+      'A QR code is a link you cannot read. Give it the link treatment, not the picture treatment: after scanning, read the full URL your camera previews before opening anything.',
+      'Paper is unauthenticated. Anyone with a printer can put a professional poster on a wall. "It is physically inside our office" is a feeling of trust, not a source of it.',
+      'For anything a poster promises (menus, Wi-Fi, parking, HR surveys), type the address you already know or use the official app. A poster can advertise a destination. It cannot certify one.',
+      'A QR that leads to a login form or an app install is your cue to stop cold. If a laminated sheet in a kitchen is asking for credentials, someone designed it so that sentence never gets said out loud.',
     ],
   },
 };
diff --git a/src/uxcore/data/biasOffsec/types.ts b/src/uxcore/data/biasOffsec/types.ts
index 7c8b1878..25bdc359 100644
--- a/src/uxcore/data/biasOffsec/types.ts
+++ b/src/uxcore/data/biasOffsec/types.ts
@@ -9,7 +9,7 @@
 interface OffsecBiasCardCommon {
   tag: string;
   flagged?: boolean;
-  // Soft context note rendered above the card body — grounds the reader
+  // Soft context note rendered above the card body: grounds the reader
   // in prior history when the lever needs it (repetition, a live
   // incident, an earlier seeding message).
   priorContext?: string;
@@ -43,7 +43,7 @@ export interface OffsecBiasChatCard extends OffsecBiasCardCommon {
   attachment?: string;
 }
 
-// Faux browser tab — used for biases where the attack surface is a web
+// Faux browser tab: used for biases where the attack surface is a web
 // page (lookalike domain, sponsored result, fake breach-checker landing).
 // The `host` field is split out so we can highlight the deceptive part
 // (e.g., the second-level domain) without forcing the data file to ship
@@ -59,7 +59,7 @@ export interface OffsecBiasBrowserCard extends OffsecBiasCardCommon {
 }
 
 // Incoming phone call (vishing). `transcript` is what the voice says
-// the moment you pick up — rendered as a quoted line over a fake
+// the moment you pick up: rendered as a quoted line over a fake
 // accept/decline row.
 export interface OffsecBiasCallCard extends OffsecBiasCardCommon {
   kind: 'call';
@@ -84,7 +84,7 @@ export interface OffsecBiasDocumentCard extends OffsecBiasCardCommon {
 }
 
 // Physical printed poster with a QR code. The QR pattern is decorative
-// and drawn by the component — data never ships a scannable code.
+// and drawn by the component: data never ships a scannable code.
 export interface OffsecBiasPosterCard extends OffsecBiasCardCommon {
   kind: 'poster';
   heading: string;
@@ -92,7 +92,7 @@ export interface OffsecBiasPosterCard extends OffsecBiasCardCommon {
   qrCaption?: string;
 }
 
-// Vertical sequence of small sightings across days — for biases where
+// Vertical sequence of small sightings across days: for biases where
 // the lever is the pattern itself (frequency illusion), not any single
 // artifact.
 export interface OffsecBiasTimelineCard extends OffsecBiasCardCommon {

From d3ec4a3d3622e3c6aef54e1500e73f1ff987cfe2 Mon Sep 17 00:00:00 2001
From: manager <alexanyanwolf@gmail.com>
Date: Tue, 18 Aug 2026 22:27:02 +0000
Subject: [PATCH 3/7] fix(uxcore): gate OffSec everywhere and restore persisted
 view choice

The Cybersecurity row and the #offsec hash handler in UXCoreLayout were
ungated, so merging would have leaked the dev-only OffSec layer to prod
in a half-broken state (row active, modal showing HR). The gate is back
as a single shared isOffsecEnabled helper used by layout and modal.

initUseUXCoreGlobals had zero callers: every localStorage write of the
PM/HR choice was dead weight and each reload reset to PM. It is now
idempotent (absolute values, safe on every mount), gates the OffSec flag
on isOffsecEnabled, and runs on /uxcore mount with an explicit URL hash
winning over the restored state.

Also adds the machine-readable font passport to CLAUDE.md (commit gate
requirement).

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 CLAUDE.md                                     |  9 ++++
 .../components/UXCoreModal/UXCoreModal.tsx    |  4 +-
 src/uxcore/hooks/useUXCoreGlobals.ts          | 43 +++++++++++--------
 .../layouts/UXCoreLayout/UXCoreLayout.tsx     | 39 ++++++++++-------
 src/uxcore/lib/offsec.ts                      |  7 +++
 5 files changed, 66 insertions(+), 36 deletions(-)
 create mode 100644 src/uxcore/lib/offsec.ts

diff --git a/CLAUDE.md b/CLAUDE.md
index a07a15aa..92cdf748 100644
--- a/CLAUDE.md
+++ b/CLAUDE.md
@@ -21,6 +21,15 @@ When writing copy that ships to users (microcopy, page headings, marketing blurb
 - No AI-isms — no "let me know if…", no "happy to help", no preamble before the answer.
 - Reference piece: **"The Rise of the Choice Architect"** (article on keepsimple.io). Match its register.
 
+## Design passport — type scale
+
+<!-- font-passport: allowed=10,11,12,13,14,15,16,18,20,22,24,28,32,36,40,48,64; floor=10; contrast=4.5 -->
+
+New or edited styles use only the sizes above (px). Legacy off-scale values
+(8px, 10.5px, 13.5px, …) stay until their surface is next reworked; do not
+introduce new off-scale sizes. Readable prose is 16px/150%. A new size enters
+this passport first, in the same commit that uses it.
+
 ## ⚠️ UX Core data is canonical
 
 The 100+ cognitive biases in UX Core are the product of 5+ years of curation and are referenced by Duke, Harvard, MIT, Google, Yandex, Amazon, and others.
diff --git a/src/uxcore/components/UXCoreModal/UXCoreModal.tsx b/src/uxcore/components/UXCoreModal/UXCoreModal.tsx
index 49366b2f..9f422c6c 100644
--- a/src/uxcore/components/UXCoreModal/UXCoreModal.tsx
+++ b/src/uxcore/components/UXCoreModal/UXCoreModal.tsx
@@ -12,6 +12,7 @@ import { getOffsecBiasContent } from '@uxcore/data/biasOffsec';
 import modalIntl from '@uxcore/data/modal';
 import useUXCoreGlobals from '@uxcore/hooks/useUXCoreGlobals';
 import { copyToClipboard, generateSocialLinks } from '@uxcore/lib/helpers';
+import { isOffsecEnabled } from '@uxcore/lib/offsec';
 import type { QuestionType, TagType } from '@uxcore/local-types/data';
 import type { TRouter } from '@uxcore/local-types/global';
 import cn from 'classnames';
@@ -68,8 +69,7 @@ const UXCoreModal: FC<UXCoreModalProps> = ({
   // the dev preview, keep it dark on staging/prod until it's ready. Gating the
   // active state too (not just the switch) means a persisted isOffsecView=true
   // from a prior dev session can't leak the layer onto a public build.
-  const offsecEnabled =
-    (process.env.NEXT_PUBLIC_ENV || '').toLowerCase() === 'dev';
+  const offsecEnabled = isOffsecEnabled;
   const offsecActive = offsecEnabled && isOffsecView;
   const [isCopyTooltipVisible, setIsCopyTooltipVisible] = useState(false);
   const [isQuestionHovered, setIsQuestionHovered] = useState(false);
diff --git a/src/uxcore/hooks/useUXCoreGlobals.ts b/src/uxcore/hooks/useUXCoreGlobals.ts
index 528bf75c..669c1322 100644
--- a/src/uxcore/hooks/useUXCoreGlobals.ts
+++ b/src/uxcore/hooks/useUXCoreGlobals.ts
@@ -1,3 +1,4 @@
+import { isOffsecEnabled } from '@uxcore/lib/offsec';
 import { CustomHookType, DispatchFuntion } from '@uxcore/local-types/global';
 import { useEffect, useState } from 'react';
 
@@ -82,29 +83,33 @@ const toggleShowArrows = () => {
 };
 
 /* INIT */
-const initUseUXCoreGlobals = () => {
-  const changeState = (localStorage.getItem('isCoreView') || true) === 'false';
-  const changeStateView =
-    (localStorage.getItem('isProductView') || true) === 'false';
-  const changeStateOffsec = localStorage.getItem('isOffsecView') === 'true';
-  const changeStateArrows =
-    (localStorage.getItem('showArrows') || true) === 'false';
-  const storedBase = localStorage.getItem('lastBaseUseCase');
-  if (storedBase === 'product' || storedBase === 'hr') {
-    reducer({ lastBaseUseCase: storedBase });
-  }
-  if (changeState) {
-    toggleIsCoreView();
+// Restores the persisted view choices. Applies absolute values (no toggles),
+// so calling it on every mount is safe. The OffSec flag only restores when
+// the layer is enabled for this build: a flag persisted on the dev preview
+// must not resurface the layer on a public build. Returns the merged state
+// so a caller can reconcile a URL hash against what was actually restored.
+export const initUseUXCoreGlobals = (): TState => {
+  const next: Partial<TState> = {};
+  const storedCore = localStorage.getItem('isCoreView');
+  if (storedCore !== null) {
+    next.isCoreView = storedCore !== 'false';
   }
-  if (changeStateView) {
-    toggleIsProductView();
+  const storedProduct = localStorage.getItem('isProductView');
+  if (storedProduct !== null) {
+    next.isProductView = storedProduct !== 'false';
   }
-  if (changeStateOffsec) {
-    toggleIsOffsecView();
+  next.isOffsecView =
+    isOffsecEnabled && localStorage.getItem('isOffsecView') === 'true';
+  const storedArrows = localStorage.getItem('showArrows');
+  if (storedArrows !== null) {
+    next.showArrows = storedArrows !== 'false';
   }
-  if (changeStateArrows) {
-    toggleShowArrows();
+  const storedBase = localStorage.getItem('lastBaseUseCase');
+  if (storedBase === 'product' || storedBase === 'hr') {
+    next.lastBaseUseCase = storedBase;
   }
+  reducer(next);
+  return state;
 };
 
 /* CUSTOM HOOK */
diff --git a/src/uxcore/layouts/UXCoreLayout/UXCoreLayout.tsx b/src/uxcore/layouts/UXCoreLayout/UXCoreLayout.tsx
index 03b0cbe3..43223976 100644
--- a/src/uxcore/layouts/UXCoreLayout/UXCoreLayout.tsx
+++ b/src/uxcore/layouts/UXCoreLayout/UXCoreLayout.tsx
@@ -11,8 +11,11 @@ import Spinner from '@uxcore/components/Spinner';
 import ToolFooter from '@uxcore/components/ToolFooter';
 import biasesLocalization from '@uxcore/data/biases';
 import biasesMobile from '@uxcore/data/biasesMobile';
-import useUXCoreGlobals from '@uxcore/hooks/useUXCoreGlobals';
+import useUXCoreGlobals, {
+  initUseUXCoreGlobals,
+} from '@uxcore/hooks/useUXCoreGlobals';
 import useUCoreMobile from '@uxcore/hooks/uxcoreMobile';
+import { isOffsecEnabled } from '@uxcore/lib/offsec';
 import type { TRouter } from '@uxcore/local-types/global';
 import cn from 'classnames';
 import dynamic from 'next/dynamic';
@@ -89,12 +92,16 @@ const UXCoreLayout: FC<UXCoreLayoutProps> = ({
   useEffect(() => {
     if (!mounted) return;
 
+    // Restore the persisted view choices first, then let an explicit URL
+    // hash win over them. Reconcile against the restored state, not the
+    // (stale) closure values.
+    const restored = initUseUXCoreGlobals();
     const hash = window.location.hash;
 
-    if (hash === '#hr' && isProductView) {
-      toggleIsProductView();
+    if (hash === '#hr' && (restored.isProductView || restored.isOffsecView)) {
+      setUseCase('hr');
     }
-    if (hash === '#offsec' && !isOffsecView) {
+    if (hash === '#offsec' && !restored.isOffsecView && isOffsecEnabled) {
       toggleIsOffsecView();
     }
   }, [mounted]);
@@ -213,17 +220,19 @@ const UXCoreLayout: FC<UXCoreLayoutProps> = ({
                 )}
                 <span>HR</span>
               </div>
-              <div
-                data-cy="switch-offsec"
-                onClick={() => handleUseCaseClick('offsec')}
-                className={cn(styles.useCaseRow, {
-                  [styles.active]: isOffsecView,
-                })}
-              >
-                {isOffsecView ? <OffSecIcon /> : <OffSecIconGrey />}
-                <span className={styles.cybersecFull}>Cybersecurity</span>
-                <span className={styles.cybersecShort}>OffSec</span>
-              </div>
+              {isOffsecEnabled && (
+                <div
+                  data-cy="switch-offsec"
+                  onClick={() => handleUseCaseClick('offsec')}
+                  className={cn(styles.useCaseRow, {
+                    [styles.active]: isOffsecView,
+                  })}
+                >
+                  {isOffsecView ? <OffSecIcon /> : <OffSecIconGrey />}
+                  <span className={styles.cybersecFull}>Cybersecurity</span>
+                  <span className={styles.cybersecShort}>OffSec</span>
+                </div>
+              )}
             </div>
             {isCoreView && <Search biases={strapiBiases} />}
             {isCoreView && (
diff --git a/src/uxcore/lib/offsec.ts b/src/uxcore/lib/offsec.ts
new file mode 100644
index 00000000..c706419a
--- /dev/null
+++ b/src/uxcore/lib/offsec.ts
@@ -0,0 +1,7 @@
+// Single source of truth for whether the Offensive Cybersecurity (OffSec)
+// use-case is exposed. Work in progress: surfaced only on the dev preview,
+// dark on staging/prod. The `#offsec` deep link, the persisted flag and the
+// switcher rows must all be inert when this is false so users cannot open
+// the layer by any path.
+export const isOffsecEnabled =
+  (process.env.NEXT_PUBLIC_ENV || '').toLowerCase() === 'dev';

From b9618517c2ef1ed5457402729884cb70ab1e6596 Mon Sep 17 00:00:00 2001
From: manager <alexanyanwolf@gmail.com>
Date: Tue, 18 Aug 2026 22:27:21 +0000
Subject: [PATCH 4/7] fix(uxcore): bias page sync, share previews, rating
 integrity, Strapi cache TTL
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Back/Forward now lands on the right bias: modal state follows the route
  prop instead of freezing at mount, so the stuck-dimmed modal is gone.
- Use-case switch inside the modal is a shallow no-scroll hash update
  (was a full ISR refetch + jump to top), and OffSec state writes #offsec
  instead of mislabeling the URL as #hr.
- Share previews: og:image/twitter:image static fallback is absolute
  (scrapers drop relative URLs), the Strapi ogImage path lost its bogus
  double .OGTags nesting, twitter:url is the canonical URL (was a
  hardcoded domain with a double slash), and social share links are
  URL-encoded so hashes/ampersands in titles survive.
- getStrapiBiases: 5-minute TTL instead of a permanent module cache, and
  an empty/incomplete response is never cached — a transient Strapi
  failure no longer 404s all bias pages until restart, and ISR
  revalidation actually picks up content edits.
- Rating: thanks-state only after the vote lands (failed vote stays
  retryable), double-click guard, response.ok check, and a failed geo
  lookup no longer aborts the vote.
- mentionedQuestionsIds parse failure degrades to no mentions instead of
  crashing the bias page.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 src/pages/uxcore/[slug].tsx                   | 39 +++++++++-----
 src/uxcore/api/biases.ts                      | 53 ++++++++++++++-----
 src/uxcore/api/rating.ts                      | 39 ++++++++------
 .../components/ModalRaiting/ModalRaiting.tsx  | 28 ++++++----
 .../components/SeoGenerator/SeoGenerator.tsx  | 31 ++++-------
 src/uxcore/lib/helpers.ts                     | 33 +++++++-----
 6 files changed, 138 insertions(+), 85 deletions(-)

diff --git a/src/pages/uxcore/[slug].tsx b/src/pages/uxcore/[slug].tsx
index d7ae3f4a..7b470c92 100644
--- a/src/pages/uxcore/[slug].tsx
+++ b/src/pages/uxcore/[slug].tsx
@@ -10,6 +10,7 @@ import {
   getAdjacentBiasTitles,
   mergeBiasesLocalization,
 } from '@uxcore/lib/helpers';
+import { isOffsecEnabled } from '@uxcore/lib/offsec';
 import { getUXCoreTextPaths } from '@uxcore/lib/paths';
 import type {
   QuestionType,
@@ -41,8 +42,8 @@ const UXCoreIds: FC<UXCoreProps> = ({
   uxcgLocalizedData,
 }) => {
   const [activeBiasNumber, setActiveBiasNumber] = useState<number>(null);
-  const [isModalClosed, setIsModalClosed] = useState<boolean>(true);
-  const [, { isProductView }] = useUXCoreGlobals();
+  const [, setIsModalClosed] = useState<boolean>(true);
+  const [, { isProductView, isOffsecView }] = useUXCoreGlobals();
   const router = useRouter();
   const { locale } = router as TRouter;
 
@@ -53,10 +54,19 @@ const UXCoreIds: FC<UXCoreProps> = ({
 
   const strapiQuestions = uxcgLocalizedData?.[locale] ?? [];
 
+  // mentionedQuestionsIds comes from Strapi as a JSON string; a null/garbage
+  // value must degrade to "no mentions", not crash the whole bias page.
+  const mentionedQuestionIds = useMemo(() => {
+    try {
+      const parsed = JSON.parse(currentModalData?.mentionedQuestionsIds);
+      return Array.isArray(parsed) ? parsed : [];
+    } catch {
+      return [];
+    }
+  }, [currentModalData?.mentionedQuestionsIds]);
+
   const mentionedQuestions = strapiQuestions.filter(({ attributes }) =>
-    JSON.parse(currentModalData.mentionedQuestionsIds).includes(
-      attributes?.number,
-    ),
+    mentionedQuestionIds.includes(attributes?.number),
   );
 
   const openSelectedBias = (number, slug) => {
@@ -100,7 +110,7 @@ const UXCoreIds: FC<UXCoreProps> = ({
           ogImage: {
             data: {
               attributes: {
-                url: currentModalData[`OGTags${lang}`]?.OGTags?.ogImage?.data
+                url: currentModalData[`OGTags${lang}`]?.ogImage?.data
                   ?.attributes?.url,
                 staticUrl: '/assets/ogImages/UXCore.png',
               },
@@ -111,21 +121,24 @@ const UXCoreIds: FC<UXCoreProps> = ({
     }
   }, [currentActiveBias.number, locale]);
 
+  // Keep the modal's bias in sync with the route. Depending on the prop (not
+  // mount-only) makes browser Back/Forward land on the right bias instead of
+  // leaving the modal stuck on the previously viewed one.
   useEffect(() => {
     setActiveBiasNumber(Number(currentActiveBias.number));
-    if (!isModalClosed) {
-      setActiveBiasNumber(null);
-    }
-  }, []);
+  }, [currentActiveBias.number]);
 
   useEffect(() => {
-    const newHash = isProductView ? '' : 'hr';
+    const offsecActive = isOffsecEnabled && isOffsecView;
+    const newHash = offsecActive ? 'offsec' : isProductView ? '' : 'hr';
     const currentPath = router.asPath.split('#')[0];
     const newUrl = `${currentPath}${newHash ? '#' + newHash : ''}`;
     if (router.asPath !== newUrl) {
-      router.push(newUrl, undefined, { shallow: false });
+      // Hash-only change: shallow, no scroll — switching the use case inside
+      // the modal must not refetch the page or jump to the top.
+      router.push(newUrl, undefined, { shallow: true, scroll: false });
     }
-  }, [isProductView, router.asPath]);
+  }, [isProductView, isOffsecView, router.asPath]);
 
   const openPage = () => {
     router.push(`/uxcore`, undefined, { scroll: true });
diff --git a/src/uxcore/api/biases.ts b/src/uxcore/api/biases.ts
index 20cbbd26..93d50b89 100644
--- a/src/uxcore/api/biases.ts
+++ b/src/uxcore/api/biases.ts
@@ -1,10 +1,19 @@
 let cachedBiases: any = null;
+let cachedBiasesAt = 0;
 const LOCALES = ['en', 'ru', 'hy'];
 const PAGE_SIZE = 100;
 const TOTAL_ITEMS_EXPECTED = 105;
+// A complete result is reused for the TTL, then refetched so ISR
+// revalidation actually picks up Strapi content edits. An incomplete or
+// failed fetch is never cached (a transient empty response must not
+// 404-poison every bias page until a container restart); the previous
+// complete result keeps serving instead.
+const CACHE_TTL_MS = 5 * 60 * 1000;
 
 export const getStrapiBiases = async () => {
-  if (cachedBiases) return cachedBiases;
+  if (cachedBiases && Date.now() - cachedBiasesAt < CACHE_TTL_MS) {
+    return cachedBiases;
+  }
 
   const allData = {
     en: [],
@@ -12,24 +21,40 @@ export const getStrapiBiases = async () => {
     hy: [],
   };
 
-  for (const locale of LOCALES) {
-    let page = 1;
-    let fetched = 0;
-    while (fetched < TOTAL_ITEMS_EXPECTED) {
-      const url = `${process.env.NEXT_PUBLIC_STRAPI}/api/biases?locale=${locale}&sort=number&pagination[pageSize]=${PAGE_SIZE}&pagination[page]=${page}&populate[OGTags][populate]=ogImage`;
-      const res = await fetch(url);
-      const json = await res.json();
+  try {
+    for (const locale of LOCALES) {
+      let page = 1;
+      let fetched = 0;
+      while (fetched < TOTAL_ITEMS_EXPECTED) {
+        const url = `${process.env.NEXT_PUBLIC_STRAPI}/api/biases?locale=${locale}&sort=number&pagination[pageSize]=${PAGE_SIZE}&pagination[page]=${page}&populate[OGTags][populate]=ogImage`;
+        const res = await fetch(url);
+        const json = await res.json();
 
-      if (!json.data || json.data.length === 0) break;
+        if (!json.data || json.data.length === 0) break;
 
-      allData[locale].push(...json.data);
-      fetched += json.data.length;
+        allData[locale].push(...json.data);
+        fetched += json.data.length;
 
-      if (json.data.length < PAGE_SIZE) break; // no more pages
-      page++;
+        if (json.data.length < PAGE_SIZE) break; // no more pages
+        page++;
+      }
     }
+  } catch (err) {
+    if (cachedBiases) return cachedBiases;
+    throw err;
   }
 
-  cachedBiases = allData;
+  // hy is a partial override set in Strapi, so completeness is judged on
+  // the two full locales only.
+  const isComplete =
+    allData.en.length >= TOTAL_ITEMS_EXPECTED &&
+    allData.ru.length >= TOTAL_ITEMS_EXPECTED;
+
+  if (!isComplete && cachedBiases) return cachedBiases;
+
+  if (isComplete) {
+    cachedBiases = allData;
+    cachedBiasesAt = Date.now();
+  }
   return allData;
 };
diff --git a/src/uxcore/api/rating.ts b/src/uxcore/api/rating.ts
index d97f712a..72a0dff6 100644
--- a/src/uxcore/api/rating.ts
+++ b/src/uxcore/api/rating.ts
@@ -3,23 +3,32 @@ export const rateRequest = async (
   rating: number,
   type: 'bias' | 'question',
 ) => {
+  // Geo enrichment is best-effort: a failed /api/user lookup must not
+  // abort the vote itself.
+  let userData: any = {};
   try {
-    // TODO: keep data as it will be sent to avoid multiple requests
-    const userData = await fetch('/api/user').then(data => data.json());
-    const url = `${process.env.NEXT_PUBLIC_STRAPI}/api/ratings`;
-    const headers = { 'Content-Type': 'application/json' };
+    userData = await fetch('/api/user').then(data => data.json());
+  } catch {
+    userData = {};
+  }
+
+  const url = `${process.env.NEXT_PUBLIC_STRAPI}/api/ratings`;
+  const headers = { 'Content-Type': 'application/json' };
 
-    const { country, region, city, ip } = userData;
+  const { country, region, city, ip } = userData;
 
-    const body = JSON.stringify({
-      data: { elemId: `${id}`, rating, country, region, city, ip, type },
-    });
-    return await fetch(url, {
-      method: 'POST',
-      headers,
-      body,
-    }).then(data => data.json());
-  } catch (err) {
-    throw new Error('Error occured while sending rating request.');
+  const body = JSON.stringify({
+    data: { elemId: `${id}`, rating, country, region, city, ip, type },
+  });
+  const response = await fetch(url, {
+    method: 'POST',
+    headers,
+    body,
+  });
+  // A 4xx/5xx from Strapi is a lost vote — surface it to the caller
+  // instead of counting it as success.
+  if (!response.ok) {
+    throw new Error(`Rating request failed with status ${response.status}.`);
   }
+  return response.json();
 };
diff --git a/src/uxcore/components/ModalRaiting/ModalRaiting.tsx b/src/uxcore/components/ModalRaiting/ModalRaiting.tsx
index cb1b24f4..831b5aec 100644
--- a/src/uxcore/components/ModalRaiting/ModalRaiting.tsx
+++ b/src/uxcore/components/ModalRaiting/ModalRaiting.tsx
@@ -1,17 +1,16 @@
+import { rateRequest } from '@uxcore/api/rating';
+import modalIntl from '@uxcore/data/modalRaiting';
+import useSpinner from '@uxcore/hooks/useSpinner';
+import {
+  getRatedItems,
+  saveInLocalStorage,
+  updateVH,
+} from '@uxcore/lib/helpers';
+import type { TRouter } from '@uxcore/local-types/global';
 import cn from 'classnames';
 import { useRouter } from 'next/router';
 import { FC, MouseEvent, useEffect, useState } from 'react';
 
-import type { TRouter } from '@uxcore/local-types/global';
-
-import useSpinner from '@uxcore/hooks/useSpinner';
-
-import { getRatedItems, saveInLocalStorage, updateVH } from '@uxcore/lib/helpers';
-
-import { rateRequest } from '@uxcore/api/rating';
-
-import modalIntl from '@uxcore/data/modalRaiting';
-
 import styles from './ModalRaiting.module.scss';
 
 const rangeItems = Array(10)
@@ -29,6 +28,7 @@ const ModalRaiting: FC<ModalRaitingProps> = ({ id, type }) => {
   const { setIsVisible } = useSpinner()[0];
   const [hoveredRangeItemId, setHoveredRangeItemId] = useState(null);
   const [isRateVisibile, setIsRateVisibile] = useState(true);
+  const [isSubmitting, setIsSubmitting] = useState(false);
 
   const handleRangeItemMouseOver = (e: MouseEvent<HTMLDivElement>) => {
     const { raiting } = e.currentTarget.dataset;
@@ -40,18 +40,24 @@ const ModalRaiting: FC<ModalRaitingProps> = ({ id, type }) => {
   };
 
   const handleRate = async (e: MouseEvent<HTMLDivElement>) => {
+    // Guard against double clicks: each extra click would POST another vote.
+    if (isSubmitting) return;
     const { raiting } = e.currentTarget.dataset;
+    setIsSubmitting(true);
     setIsVisible(true);
 
     try {
       await rateRequest(id, Number(raiting), type);
       saveInLocalStorage(id, type);
+      // Swap to "thanks" only after the vote actually landed; on failure
+      // the row stays so the user can retry instead of losing the vote.
+      setIsRateVisibile(false);
     } catch (err) {
       console.error('Error while rating:', err);
     }
 
     setIsVisible(false);
-    setIsRateVisibile(false);
+    setIsSubmitting(false);
   };
 
   useEffect(() => {
diff --git a/src/uxcore/components/SeoGenerator/SeoGenerator.tsx b/src/uxcore/components/SeoGenerator/SeoGenerator.tsx
index 6be71ffc..d63319ad 100644
--- a/src/uxcore/components/SeoGenerator/SeoGenerator.tsx
+++ b/src/uxcore/components/SeoGenerator/SeoGenerator.tsx
@@ -187,6 +187,14 @@ const SeoGenerator: FC<SeoGeneratorProps> = ({
     ? hrDescriptionRandom[0]
     : stripHTML(description);
   const favIcon = `${process.env.NEXT_PUBLIC_DOMAIN}${favIconPath}`;
+  // Scrapers ignore relative og:image URLs — absolutize both sources, and
+  // emit no URL at all when neither is present.
+  const ogImageAttributes = ogTags?.ogImage?.data?.attributes;
+  const ogImageUrl = ogImageAttributes?.url
+    ? `${process.env.NEXT_PUBLIC_STRAPI}${ogImageAttributes.url}`
+    : ogImageAttributes?.staticUrl
+      ? `${process.env.NEXT_PUBLIC_DOMAIN}${ogImageAttributes.staticUrl}`
+      : undefined;
   const schema = generateSchema(
     title,
     metaDescription,
@@ -272,14 +280,7 @@ const SeoGenerator: FC<SeoGeneratorProps> = ({
             isBiasHrView ? hrDescriptionRandom[0] : ogTags?.ogDescription
           }
         />
-        <meta
-          property="og:image"
-          content={
-            ogTags?.ogImage?.data?.attributes?.url
-              ? `${process.env.NEXT_PUBLIC_STRAPI}${ogTags?.ogImage?.data?.attributes?.url}`
-              : ogTags?.ogImage?.data?.attributes?.staticUrl
-          }
-        />
+        <meta property="og:image" content={ogImageUrl} />
         <meta
           property="og:image:alt"
           content={
@@ -307,18 +308,8 @@ const SeoGenerator: FC<SeoGeneratorProps> = ({
             isBiasHrView ? hrDescriptionRandom[0] : ogTags?.ogDescription
           }
         />
-        <meta
-          name="twitter:image"
-          content={
-            ogTags?.ogImage?.data?.attributes?.url
-              ? `${process.env.NEXT_PUBLIC_STRAPI}${ogTags?.ogImage?.data?.attributes?.url}`
-              : ogTags?.ogImage?.data?.attributes?.staticUrl
-          }
-        />
-        <meta
-          name="twitter:url"
-          content={`https://keepsimple.io/${localePath}${alternateLink}`}
-        />
+        <meta name="twitter:image" content={ogImageUrl} />
+        <meta name="twitter:url" content={originalUrl} />
         <meta name="twitter:label1" content="Written by" />
         <meta name="twitter:data1" content="Wolf Alexanyan" />
         <script
diff --git a/src/uxcore/lib/helpers.ts b/src/uxcore/lib/helpers.ts
index 761c867b..34f05658 100644
--- a/src/uxcore/lib/helpers.ts
+++ b/src/uxcore/lib/helpers.ts
@@ -111,16 +111,19 @@ const searchPostfixes = {
   ],
 };
 
-const getSearchLabels = (length: number) => {
+const getSearchLabels = (length: number, locale: string) => {
+  // searchPostfixes is keyed by locale — index into the locale's pair list,
+  // not the top-level object, or every label resolves to undefined.
+  const postfixes = searchPostfixes[locale === 'ru' ? 'ru' : 'en'];
   const mainNumber = length % 100;
   const lastNumber = mainNumber % 10;
 
   if (mainNumber >= 10 && mainNumber < 20) {
-    return searchPostfixes[0];
+    return postfixes[0];
   } else {
-    if (lastNumber == 1) return searchPostfixes[1];
-    else if (lastNumber > 1 && lastNumber < 5) return searchPostfixes[2];
-    else return searchPostfixes[0];
+    if (lastNumber == 1) return postfixes[1];
+    else if (lastNumber > 1 && lastNumber < 5) return postfixes[2];
+    else return postfixes[0];
   }
 };
 
@@ -150,7 +153,7 @@ export const getSearchResults = (
       }, []);
   }
 
-  const searchLabels = getSearchLabels(results?.length);
+  const searchLabels = getSearchLabels(results?.length || 0, locale);
   return { results, searchLabels };
 };
 
@@ -175,7 +178,7 @@ export const getSearchResultsUxcp = (
     }, []);
   }
 
-  const searchLabels = getSearchLabels(results.length);
+  const searchLabels = getSearchLabels(results.length, locale);
   return { results, searchLabels };
 };
 
@@ -205,11 +208,17 @@ export function groupFilteredData(
   return groups;
 }
 
-export const generateSocialLinks = (url: string, title: string) => ({
-  linkedIn: `https://www.linkedin.com/shareArticle?url=${url}&title=${title}`,
-  facebook: `https://www.facebook.com/sharer/sharer.php?title=${title}&u=${url}`,
-  tweeter: `https://twitter.com/share?url=${url}&text=${title}`,
-});
+export const generateSocialLinks = (url: string, title: string) => {
+  // Callers pass raw values (window.location.href may carry a #hr hash,
+  // titles may carry &/'/spaces) — encode here so the share payload survives.
+  const encodedUrl = encodeURIComponent(url);
+  const encodedTitle = encodeURIComponent(title);
+  return {
+    linkedIn: `https://www.linkedin.com/shareArticle?url=${encodedUrl}&title=${encodedTitle}`,
+    facebook: `https://www.facebook.com/sharer/sharer.php?title=${encodedTitle}&u=${encodedUrl}`,
+    tweeter: `https://twitter.com/share?url=${encodedUrl}&text=${encodedTitle}`,
+  };
+};
 
 export const copyToClipboard = (str: string) => {
   const el = document.createElement('textarea');

From da5a3c3ef02f9c344a215f63a555a3178c5af379 Mon Sep 17 00:00:00 2001
From: manager <alexanyanwolf@gmail.com>
Date: Tue, 18 Aug 2026 22:27:32 +0000
Subject: [PATCH 5/7] fix(uxcore): search zero-hit state, clear race,
 result-count labels

- A search with zero hits now renders as empty (labels faded, map
  filtered to nothing) instead of silently falling back to the full
  library while claiming 'found 0'. useBiasSearch carries an explicit
  isSearchActive flag so empty-query and zero-hit are distinguishable.
- Clearing the input cancels the in-flight debounce, so a pending search
  can no longer repopulate results over a cleared field.
- getSearchLabels indexed a locale-keyed object numerically and always
  returned undefined: EN plural 's' and RU declensions never rendered.
  It now takes the locale.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 .../_biases/BiasLabel/BiasLabel.tsx           | 17 +++++-----
 .../components/_biases/Search/Search.tsx      | 26 +++++++---------
 src/uxcore/hooks/useBiasSearch.ts             | 14 ++++++---
 .../layouts/CoreViewLayout/CoreViewLayout.tsx | 31 +++++++++----------
 .../FolderViewLayout/Search/Search.tsx        | 23 +++++++-------
 5 files changed, 54 insertions(+), 57 deletions(-)

diff --git a/src/uxcore/components/_biases/BiasLabel/BiasLabel.tsx b/src/uxcore/components/_biases/BiasLabel/BiasLabel.tsx
index 37e0f746..0d957354 100644
--- a/src/uxcore/components/_biases/BiasLabel/BiasLabel.tsx
+++ b/src/uxcore/components/_biases/BiasLabel/BiasLabel.tsx
@@ -1,14 +1,12 @@
+import ZoomBox from '@uxcore/components/_biases/ZoomBox';
+import useBiasSearch from '@uxcore/hooks/useBiasSearch';
+import { generateLabelsData, isMobileDevice } from '@uxcore/lib/helpers';
+import type { TRouter } from '@uxcore/local-types/global';
 import cn from 'classnames';
 import Link from 'next/link';
 import { useRouter } from 'next/router';
 import React, { FC, MouseEvent, useEffect, useRef, useState } from 'react';
 
-import type { TRouter } from '@uxcore/local-types/global';
-
-import { generateLabelsData, isMobileDevice } from '@uxcore/lib/helpers';
-
-import ZoomBox from '@uxcore/components/_biases/ZoomBox';
-
 import { BiasLabelProps } from './BiasLabel.types';
 
 import styles from './BiasLabel.module.scss';
@@ -33,6 +31,7 @@ const BiasLabel: FC<BiasLabelProps> = ({
 
   const router = useRouter();
   const { locale } = router as TRouter;
+  const { isSearchActive } = useBiasSearch()[1];
 
   const [isZoomBoxVisible, setIsZoomBoxVisible] = useState(false);
   const [labelsData, setLabelsData] = useState(null);
@@ -109,11 +108,9 @@ const BiasLabel: FC<BiasLabelProps> = ({
         className={cn(styles.biasLabel, className, {
           [styles.secondRow]: sectionId === 2,
           [styles.searched]:
-            searchResults.length > 0 &&
-            searchResults.includes(Number(biasNumber)),
+            isSearchActive && searchResults.includes(Number(biasNumber)),
           [styles.faded]:
-            searchResults.length > 0 &&
-            !searchResults.includes(Number(biasNumber)),
+            isSearchActive && !searchResults.includes(Number(biasNumber)),
           [styles.isLeftSection]: isLeftSection,
           [styles.biasLabelHy]: locale === 'hy',
           // These are exceptional positions for left-top section labels
diff --git a/src/uxcore/components/_biases/Search/Search.tsx b/src/uxcore/components/_biases/Search/Search.tsx
index d2a23be0..89d54de5 100644
--- a/src/uxcore/components/_biases/Search/Search.tsx
+++ b/src/uxcore/components/_biases/Search/Search.tsx
@@ -1,3 +1,10 @@
+import SearchIcon from '@uxcore/assets/icons/SearchIcon';
+import biasesSearchData from '@uxcore/data/biasesSearch';
+import useBiasSearch from '@uxcore/hooks/useBiasSearch';
+import useMobile from '@uxcore/hooks/useMobile';
+import { getSearchResults } from '@uxcore/lib/helpers';
+import type { StrapiBiasType } from '@uxcore/local-types/data';
+import type { TRouter } from '@uxcore/local-types/global';
 import cn from 'classnames';
 import Image from 'next/image';
 import { useRouter } from 'next/router';
@@ -10,18 +17,6 @@ import {
   useState,
 } from 'react';
 
-import type { StrapiBiasType } from '@uxcore/local-types/data';
-import type { TRouter } from '@uxcore/local-types/global';
-
-import useBiasSearch from '@uxcore/hooks/useBiasSearch';
-import useMobile from '@uxcore/hooks/useMobile';
-
-import { getSearchResults } from '@uxcore/lib/helpers';
-
-import biasesSearchData from '@uxcore/data/biasesSearch';
-
-import SearchIcon from '@uxcore/assets/icons/SearchIcon';
-
 import styles from './Search.module.scss';
 
 type SearchProps = {
@@ -58,7 +53,7 @@ const Search: FC<SearchProps> = ({ focusOnInit, biases }) => {
           searchValue,
           locale,
         );
-        setSearchResults(results);
+        setSearchResults(results, !!searchValue.trim());
         setSearchResultsData({
           prefix: searchLabels?.[0],
           resultCount: results.length,
@@ -70,8 +65,11 @@ const Search: FC<SearchProps> = ({ focusOnInit, biases }) => {
   );
 
   const handleClear = useCallback(() => {
+    // Cancel any in-flight debounce so a pending search can't repopulate
+    // results over the just-cleared input.
+    clearTimeout(searchTimeout.current);
     setTimeout(() => {
-      setSearchResults([]);
+      setSearchResults([], false);
     }, 0);
 
     setSearchResultsData({
diff --git a/src/uxcore/hooks/useBiasSearch.ts b/src/uxcore/hooks/useBiasSearch.ts
index 04a68764..18f3d3ec 100644
--- a/src/uxcore/hooks/useBiasSearch.ts
+++ b/src/uxcore/hooks/useBiasSearch.ts
@@ -1,15 +1,18 @@
-import { useEffect, useState } from 'react';
-
 import { CustomHookType, DispatchFuntion } from '@uxcore/local-types/global';
+import { useEffect, useState } from 'react';
 
 interface StateType {
   searchResults: number[];
+  // True while a non-empty query is applied. Distinguishes "no search"
+  // from "search with zero hits" — both have searchResults = [].
+  isSearchActive: boolean;
 }
 
 let listeners: DispatchFuntion[] = [];
 
 let state: StateType = {
   searchResults: [],
+  isSearchActive: false,
 };
 
 const reducer = (newState: any) => {
@@ -24,8 +27,11 @@ const reducer = (newState: any) => {
 };
 
 /* ACTIONS */
-const setSearchResults = (searchResults: number[]) => {
-  reducer({ searchResults });
+const setSearchResults = (
+  searchResults: number[],
+  isSearchActive: boolean = searchResults.length > 0,
+) => {
+  reducer({ searchResults, isSearchActive });
 };
 
 /* CUSTOM HOOK */
diff --git a/src/uxcore/layouts/CoreViewLayout/CoreViewLayout.tsx b/src/uxcore/layouts/CoreViewLayout/CoreViewLayout.tsx
index 99144572..884c413a 100644
--- a/src/uxcore/layouts/CoreViewLayout/CoreViewLayout.tsx
+++ b/src/uxcore/layouts/CoreViewLayout/CoreViewLayout.tsx
@@ -1,23 +1,18 @@
+import BiasEnvironment from '@uxcore/components/_biases/BiasEnvironment/BiasEnvironment';
+import BiasLabel from '@uxcore/components/_biases/BiasLabel';
+import UXCoreLines from '@uxcore/components/_biases/UXCoreLines/UXCoreLines';
+import biasesLocalization from '@uxcore/data/biases';
+import copyButtonData from '@uxcore/data/copyButton';
+import useBiasSearch from '@uxcore/hooks/useBiasSearch';
+import { useBrowserScale } from '@uxcore/hooks/useBrowserScale';
+import { copyToClipboard } from '@uxcore/lib/helpers';
+import type { StrapiBiasType } from '@uxcore/local-types/data';
+import type { TRouter } from '@uxcore/local-types/global';
 import cn from 'classnames';
 import { useRouter } from 'next/router';
 import { FC, memo, useState } from 'react';
 import { Tooltip as ReactTooltip } from 'react-tooltip';
 
-import type { StrapiBiasType } from '@uxcore/local-types/data';
-import type { TRouter } from '@uxcore/local-types/global';
-
-import useBiasSearch from '@uxcore/hooks/useBiasSearch';
-import { useBrowserScale } from '@uxcore/hooks/useBrowserScale';
-
-import { copyToClipboard } from '@uxcore/lib/helpers';
-
-import biasesLocalization from '@uxcore/data/biases';
-import copyButtonData from '@uxcore/data/copyButton';
-
-import BiasEnvironment from '@uxcore/components/_biases/BiasEnvironment/BiasEnvironment';
-import BiasLabel from '@uxcore/components/_biases/BiasLabel';
-import UXCoreLines from '@uxcore/components/_biases/UXCoreLines/UXCoreLines';
-
 import styles from './CoreViewLayout.module.scss';
 
 type TDesktopView = {
@@ -27,7 +22,7 @@ type TDesktopView = {
 const CoreViewLayout: FC<TDesktopView> = ({ biases }) => {
   const router = useRouter();
   const { locale } = router as TRouter;
-  const { searchResults } = useBiasSearch()[1];
+  const { searchResults, isSearchActive } = useBiasSearch()[1];
 
   const [copyTooltipOpen, setCopyTooltipOpen] = useState(false);
 
@@ -109,7 +104,9 @@ const CoreViewLayout: FC<TDesktopView> = ({ biases }) => {
         index,
       }));
 
-    return searchResults.length
+    // Filter while a search is applied — even with zero hits, so an empty
+    // result renders as empty instead of falling back to the full library.
+    return isSearchActive
       ? withIndex.filter(bias => searchResults.includes(bias.attributes.number))
       : biases;
   };
diff --git a/src/uxcore/layouts/FolderViewLayout/Search/Search.tsx b/src/uxcore/layouts/FolderViewLayout/Search/Search.tsx
index 14eda9fa..ce224379 100644
--- a/src/uxcore/layouts/FolderViewLayout/Search/Search.tsx
+++ b/src/uxcore/layouts/FolderViewLayout/Search/Search.tsx
@@ -1,3 +1,9 @@
+import biasesSearchData from '@uxcore/data/biasesSearch';
+import useBiasSearch from '@uxcore/hooks/useBiasSearch';
+import useMobile from '@uxcore/hooks/useMobile';
+import { getSearchResults } from '@uxcore/lib/helpers';
+import type { StrapiBiasType } from '@uxcore/local-types/data';
+import type { TRouter } from '@uxcore/local-types/global';
 import cn from 'classnames';
 import Image from 'next/image';
 import { useRouter } from 'next/router';
@@ -10,16 +16,6 @@ import {
   useState,
 } from 'react';
 
-import type { StrapiBiasType } from '@uxcore/local-types/data';
-import type { TRouter } from '@uxcore/local-types/global';
-
-import useBiasSearch from '@uxcore/hooks/useBiasSearch';
-import useMobile from '@uxcore/hooks/useMobile';
-
-import { getSearchResults } from '@uxcore/lib/helpers';
-
-import biasesSearchData from '@uxcore/data/biasesSearch';
-
 import styles from './Search.module.scss';
 
 type SearchProps = {
@@ -72,7 +68,7 @@ const Search: FC<SearchProps> = ({
         setBiasesList(e.target.value ? filteredBiasesList : biases);
         setIsSearching(!!e.target.value);
 
-        setSearchResults(results);
+        setSearchResults(results, !!searchValue.trim());
         setSearchResultsData({
           prefix: searchLabels?.[0],
           resultCount: results.length,
@@ -84,9 +80,12 @@ const Search: FC<SearchProps> = ({
   );
 
   const handleClear = useCallback(() => {
+    // Cancel any in-flight debounce so a pending search can't repopulate
+    // results over the just-cleared input.
+    clearTimeout(searchTimeout.current);
     setTimeout(() => {
       setIsSearching(false);
-      setSearchResults([]);
+      setSearchResults([], false);
       setBiasesList(biases);
     }, 0);
 

From 080fafbabe3054943987e709c92582639ccf24b1 Mon Sep 17 00:00:00 2001
From: manager <alexanyanwolf@gmail.com>
Date: Tue, 18 Aug 2026 22:27:44 +0000
Subject: [PATCH 6/7] fix(uxcp): persona save reports truthfully, auth headers
 built per call

- addPersona/updatePersona/deletePersona built auth headers at module
  load, so logging in after page load kept sending 'Bearer null'.
  Headers are now resolved per request, and non-2xx responses throw.
- Save/overwrite no longer flip to 'saved' optimistically: the state is
  confirmed only after the request lands, and a failure surfaces the new
  localized saveFailed message via the existing error slot.
- A failed delete keeps the persona in the list instead of hiding an
  entry the server still has.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 src/uxcore/api/personas.ts                    |  45 ++++---
 .../_uxcp/SavedPersonas/SavedPersonas.tsx     |  40 +++---
 src/uxcore/data/decisionTable/en.ts           |   1 +
 src/uxcore/data/decisionTable/hy.ts           |   1 +
 src/uxcore/data/decisionTable/ru.ts           |   1 +
 src/uxcore/layouts/UXCPLayout/UXCPLayout.tsx  | 116 ++++++++++--------
 6 files changed, 117 insertions(+), 87 deletions(-)

diff --git a/src/uxcore/api/personas.ts b/src/uxcore/api/personas.ts
index 3bb4a2ef..cd63cbd9 100644
--- a/src/uxcore/api/personas.ts
+++ b/src/uxcore/api/personas.ts
@@ -1,13 +1,23 @@
-const headers =
-  typeof window !== 'undefined'
-    ? {
-        'Content-Type': 'application/json',
-        Authorization: `Bearer ${
-          localStorage.getItem('accessToken') ||
-          localStorage.getItem('googleToken')
-        }`,
-      }
-    : null;
+// Auth headers are built per call: a module-level snapshot would freeze the
+// token present at first page load, so a user who logs in afterwards would
+// keep POSTing "Bearer null".
+const getAuthHeaders = () => {
+  if (typeof window === 'undefined') return null;
+  const token =
+    localStorage.getItem('accessToken') || localStorage.getItem('googleToken');
+  if (!token) return null;
+  return {
+    'Content-Type': 'application/json',
+    Authorization: `Bearer ${token}`,
+  };
+};
+
+const parseOrThrow = async (response: Response) => {
+  if (!response.ok) {
+    throw new Error(`Persona request failed with status ${response.status}.`);
+  }
+  return response.json();
+};
 
 export const getPersonaList = async () => {
   const token =
@@ -35,8 +45,9 @@ export const addPersona = async (
   decisionTable: string,
   accountName: string,
 ) => {
+  const headers = getAuthHeaders();
   if (!headers) {
-    return;
+    throw new Error('Not authorized: no access token for saving a persona.');
   }
   const url = `${process.env.NEXT_PUBLIC_STRAPI}/api/personas`;
   const body = JSON.stringify({
@@ -47,7 +58,7 @@ export const addPersona = async (
     method: 'POST',
     headers,
     body,
-  }).then(data => data.json());
+  }).then(parseOrThrow);
 };
 
 export const updatePersona = async (
@@ -56,8 +67,9 @@ export const updatePersona = async (
   decisionTable: string,
   accountName: string,
 ) => {
+  const headers = getAuthHeaders();
   if (!headers) {
-    return;
+    throw new Error('Not authorized: no access token for saving a persona.');
   }
   const url = `${process.env.NEXT_PUBLIC_STRAPI}/api/personas/${Number(
     String(entryId).slice(1),
@@ -70,12 +82,13 @@ export const updatePersona = async (
     method: 'PUT',
     headers,
     body,
-  }).then(data => data.json());
+  }).then(parseOrThrow);
 };
 
 export const deletePersona = async (entryId: number | string) => {
+  const headers = getAuthHeaders();
   if (!headers) {
-    return;
+    throw new Error('Not authorized: no access token for deleting a persona.');
   }
   const url = `${process.env.NEXT_PUBLIC_STRAPI}/api/personas/${Number(
     String(entryId).slice(1),
@@ -84,7 +97,7 @@ export const deletePersona = async (entryId: number | string) => {
   return await fetch(url, {
     method: 'DELETE',
     headers,
-  }).then(data => data.json());
+  }).then(parseOrThrow);
 };
 
 export const getPersona = async (entryId: string, accountName: string) => {
diff --git a/src/uxcore/components/_uxcp/SavedPersonas/SavedPersonas.tsx b/src/uxcore/components/_uxcp/SavedPersonas/SavedPersonas.tsx
index 62543736..3448c4cb 100644
--- a/src/uxcore/components/_uxcp/SavedPersonas/SavedPersonas.tsx
+++ b/src/uxcore/components/_uxcp/SavedPersonas/SavedPersonas.tsx
@@ -1,19 +1,15 @@
-import { format } from 'date-fns';
-import Image from 'next/image';
-import Link from 'next/link';
-import { useRouter } from 'next/router';
-import React, { FC, Fragment, useContext, useState } from 'react';
-
-import { TRouter } from '@uxcore/local-types/global';
-
 import { deletePersona } from '@uxcore/api/personas';
-
-import decisionTable from '@uxcore/data/decisionTable';
-
 import PersonaDeleteModal from '@uxcore/components/_uxcp/PersonaDeleteModal';
 import Button from '@uxcore/components/Button';
 import { GlobalContext } from '@uxcore/components/Context/GlobalContext';
 import Modal from '@uxcore/components/Modal';
+import decisionTable from '@uxcore/data/decisionTable';
+import { TRouter } from '@uxcore/local-types/global';
+import { format } from 'date-fns';
+import Image from 'next/image';
+import Link from 'next/link';
+import { useRouter } from 'next/router';
+import React, { FC, Fragment, useContext, useState } from 'react';
 
 import styles from './SavedPersonas.module.scss';
 
@@ -106,14 +102,20 @@ const SavedPersonas: FC<SavedPersonasProps> = ({
 
   const deleteChosenPersona = () => {
     if (deletePersonaById) {
-      deletePersona(deletePersonaById).then(r => {
-        console.log(r);
-        const updatedPersonas = savedPersonas.filter(
-          persona => persona.id !== deletePersonaById,
-        );
-        setSavedPersonas(updatedPersonas);
-        setDeletePersonaById(null);
-      });
+      deletePersona(deletePersonaById)
+        .then(() => {
+          const updatedPersonas = savedPersonas.filter(
+            persona => persona.id !== deletePersonaById,
+          );
+          setSavedPersonas(updatedPersonas);
+          setDeletePersonaById(null);
+        })
+        .catch(err => {
+          // Failed delete: keep the persona in the list instead of hiding
+          // an entry the server still has.
+          console.error('Persona delete failed:', err);
+          setDeletePersonaById(null);
+        });
     }
     setConfirmationModal(false);
   };
diff --git a/src/uxcore/data/decisionTable/en.ts b/src/uxcore/data/decisionTable/en.ts
index 674486e4..2b707705 100644
--- a/src/uxcore/data/decisionTable/en.ts
+++ b/src/uxcore/data/decisionTable/en.ts
@@ -58,5 +58,6 @@ const en = {
   overWriteText: 'Overwrite',
   savedPersonasText: 'Saved Personas',
   pleaseInputName: 'Please input Persona Name',
+  saveFailed: 'Could not save the Persona. Please try again.',
 };
 export default en;
diff --git a/src/uxcore/data/decisionTable/hy.ts b/src/uxcore/data/decisionTable/hy.ts
index 702bb7c5..67dd4bf4 100644
--- a/src/uxcore/data/decisionTable/hy.ts
+++ b/src/uxcore/data/decisionTable/hy.ts
@@ -60,5 +60,6 @@ const hy = {
   overWriteText: 'Վերագրել ',
   savedPersonasText: 'Պահպանված պերսոնաներ',
   pleaseInputName: 'Խնդրում ենք մուտքագրել Պերսոնայի անունը',
+  saveFailed: 'Could not save the Persona. Please try again.',
 };
 export default hy;
diff --git a/src/uxcore/data/decisionTable/ru.ts b/src/uxcore/data/decisionTable/ru.ts
index 74e25ea2..bdadfe7e 100644
--- a/src/uxcore/data/decisionTable/ru.ts
+++ b/src/uxcore/data/decisionTable/ru.ts
@@ -59,6 +59,7 @@ const ru = {
   overWriteText: 'Перезаписать',
   savedPersonasText: 'Сохраненные Персоны',
   pleaseInputName: 'Пожалуйста, введите имя Персоны',
+  saveFailed: 'Не удалось сохранить Персону. Пожалуйста, попробуйте еще раз.',
 };
 
 export default ru;
diff --git a/src/uxcore/layouts/UXCPLayout/UXCPLayout.tsx b/src/uxcore/layouts/UXCPLayout/UXCPLayout.tsx
index 260aef94..07cfcda4 100644
--- a/src/uxcore/layouts/UXCPLayout/UXCPLayout.tsx
+++ b/src/uxcore/layouts/UXCPLayout/UXCPLayout.tsx
@@ -1,30 +1,8 @@
-import cn from 'classnames';
-import dynamic from 'next/dynamic';
-import { useRouter } from 'next/router';
-import React, {
-  FC,
-  memo,
-  useCallback,
-  useContext,
-  useEffect,
-  useMemo,
-  useRef,
-  useState,
-} from 'react';
-
-import type { QuestionType, StrapiBiasType, TagType } from '@uxcore/local-types/data';
-import type { TRouter } from '@uxcore/local-types/global';
-
-import useMobile from '@uxcore/hooks/useMobile';
-
-import { copyToClipboard } from '@uxcore/lib/helpers';
-import { calculateData, generateUXCPLink } from '@uxcore/lib/uxcp-helpers';
-
-import { addPersona, getPersonaList, updatePersona } from '@uxcore/api/personas';
-
-import decisionTable from '@uxcore/data/decisionTable';
-import uxcpLocalization from '@uxcore/data/uxcp';
-
+import {
+  addPersona,
+  getPersonaList,
+  updatePersona,
+} from '@uxcore/api/personas';
 import BiasSearch from '@uxcore/components/_uxcp/BiasSearch';
 import CountryBiasMap from '@uxcore/components/_uxcp/CountryBiasMap';
 import DecisionTable from '@uxcore/components/_uxcp/DecisionTable';
@@ -41,6 +19,30 @@ import { GlobalContext } from '@uxcore/components/Context/GlobalContext';
 import Input from '@uxcore/components/Input';
 import Section from '@uxcore/components/Section';
 import ToolFooter from '@uxcore/components/ToolFooter';
+import decisionTable from '@uxcore/data/decisionTable';
+import uxcpLocalization from '@uxcore/data/uxcp';
+import useMobile from '@uxcore/hooks/useMobile';
+import { copyToClipboard } from '@uxcore/lib/helpers';
+import { calculateData, generateUXCPLink } from '@uxcore/lib/uxcp-helpers';
+import type {
+  QuestionType,
+  StrapiBiasType,
+  TagType,
+} from '@uxcore/local-types/data';
+import type { TRouter } from '@uxcore/local-types/global';
+import cn from 'classnames';
+import dynamic from 'next/dynamic';
+import { useRouter } from 'next/router';
+import React, {
+  FC,
+  memo,
+  useCallback,
+  useContext,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from 'react';
 
 import styles from './UXCPLayout.module.scss';
 
@@ -111,7 +113,8 @@ const UXCPLayout: FC<UXCPLayoutProps> = ({
   const [temporarySavedBiases, setTemporarySavedBiases] = useState(null);
   const personaSectionRef = useRef<HTMLDivElement>(null);
   const { title, subSectionTitle, copyURL, copied } = uxcpLocalization[locale];
-  const { overWriteText, cancelBtn, pleaseInputName } = decisionTable[locale];
+  const { overWriteText, cancelBtn, pleaseInputName, saveFailed } =
+    decisionTable[locale];
   const { accountData } = useContext(GlobalContext);
   const { relevantQuestions, tagRelevancy, suggestedQuestionsList } = useMemo(
     () => calculateData(questions, selectedBiases),
@@ -309,22 +312,28 @@ const UXCPLayout: FC<UXCPLayoutProps> = ({
     }
     if (personaName && personaName.trim() !== '') {
       setErrorMessage('');
-      setSaved(true);
-      setIsChangesUnsaved('saved');
-      setFirstSaveClick(true);
+      // Confirm "saved" only after the request lands: an optimistic flag
+      // would tell the user their persona is safe when it never reached
+      // the server.
       addPersona(
         personaName,
         JSON.stringify(selectedBiasesDetails),
         accountData?.username,
-      ).then(r => {
-        console.log(r);
-        fetchData().then(r => console.log(r));
-        clearLocalStorageItems();
-      });
-
-      setTimeout(() => {
-        setSaved(false);
-      }, 2000);
+      )
+        .then(() => {
+          setSaved(true);
+          setIsChangesUnsaved('saved');
+          setFirstSaveClick(true);
+          fetchData();
+          clearLocalStorageItems();
+          setTimeout(() => {
+            setSaved(false);
+          }, 2000);
+        })
+        .catch(err => {
+          console.error('Persona save failed:', err);
+          setErrorMessage(saveFailed);
+        });
     }
   };
 
@@ -333,23 +342,26 @@ const UXCPLayout: FC<UXCPLayoutProps> = ({
       setErrorMessage(pleaseInputName);
     }
     if (findMatchingPersonaName) {
-      setPersonaExistWarning(true);
       updatePersona(
         findMatchingPersonaName.id,
         findMatchingPersonaName.name,
         JSON.stringify(selectedBiasesDetails),
         accountData?.username,
-      ).then(r => {
-        console.log(r);
-      });
-      clearLocalStorageItems();
-
-      setPersonaExistWarning(false);
-      setSaved(true);
-      setIsChangesUnsaved('saved');
-      setTimeout(() => {
-        setSaved(false);
-      }, 2000);
+      )
+        .then(() => {
+          clearLocalStorageItems();
+          setPersonaExistWarning(false);
+          setSaved(true);
+          setIsChangesUnsaved('saved');
+          setTimeout(() => {
+            setSaved(false);
+          }, 2000);
+        })
+        .catch(err => {
+          console.error('Persona overwrite failed:', err);
+          setPersonaExistWarning(false);
+          setErrorMessage(saveFailed);
+        });
     }
   };
   const saveToLocal = (key, value) => {

From 4f34f3381678a0310b8794774a4599b42e813d2d Mon Sep 17 00:00:00 2001
From: manager <alexanyanwolf@gmail.com>
Date: Tue, 18 Aug 2026 22:27:57 +0000
Subject: [PATCH 7/7] fix(uxcat): answers can no longer be silently lost,
 resume trusts the server

- A dropped submit no longer advances the test: the answer is confirmed
  by the server before moving on. On failure the question stays with a
  localized retry message and the button re-enables, so a network blip
  means a retry instead of a wrong score or a test finished with
  unrecorded answers.
- Double submits closed: an in-flight ref guards clicks, and Enter now
  mirrors the Next button's disabled state instead of firing the same
  question twice.
- Resuming a test uses the server's ongoingTest.isFinal instead of a
  localStorage flag, so a 30-question final resumed in another browser
  (or after cleared storage) keeps its real length instead of ending at
  question 10 with negative numbering.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 src/pages/uxcat/ongoing.tsx                   | 30 ++++---
 src/uxcore/data/uxcat/ongoingTest/en.ts       |  1 +
 src/uxcore/data/uxcat/ongoingTest/ru.ts       |  1 +
 .../OngoingLayout/OngoingLayout.module.scss   |  8 ++
 .../layouts/OngoingLayout/OngoingLayout.tsx   | 88 ++++++++++++-------
 5 files changed, 81 insertions(+), 47 deletions(-)

diff --git a/src/pages/uxcat/ongoing.tsx b/src/pages/uxcat/ongoing.tsx
index 15141d8a..fd0e9acd 100644
--- a/src/pages/uxcat/ongoing.tsx
+++ b/src/pages/uxcat/ongoing.tsx
@@ -1,24 +1,20 @@
-import { useRouter } from 'next/router';
-import React, { FC, useEffect, useState } from 'react';
-
-import { TRouter } from '@uxcore/local-types/global';
-import { UXCatDataTypes } from '@uxcore/local-types/uxcat-types/types';
-
 import { UXCatConfigs } from '@uxcore/api/uxcat/configs';
 import { getFinalTest } from '@uxcore/api/uxcat/final-test';
 import { getUXCatStartTest } from '@uxcore/api/uxcat/start-test';
 import { getUserInfo } from '@uxcore/api/uxcat/users-me';
 import { getUXCatData } from '@uxcore/api/uxcat/uxcat';
-
-import { achievementSlugs } from '@uxcore/data/uxcat/ongoingTest/realTimeAchievements';
-
 import SeoGenerator from '@uxcore/components/SeoGenerator';
 import Spinner from '@uxcore/components/Spinner';
-
-import styles from '@uxcore/layouts/OngoingLayout/OngoingLayout.module.scss';
+import { achievementSlugs } from '@uxcore/data/uxcat/ongoingTest/realTimeAchievements';
+import { TRouter } from '@uxcore/local-types/global';
+import { UXCatDataTypes } from '@uxcore/local-types/uxcat-types/types';
+import { useRouter } from 'next/router';
+import React, { FC, useEffect, useState } from 'react';
 
 import OngoingLayout from 'src/uxcore/layouts/OngoingLayout';
 
+import styles from '@uxcore/layouts/OngoingLayout/OngoingLayout.module.scss';
+
 type OngoingProps = {
   configs: {
     testExpirationTime: number;
@@ -84,14 +80,20 @@ const Ongoing: FC<OngoingProps> = ({ configs, uxcatData }) => {
           const userInfo = await getUserInfo();
           setUserInfo(userInfo);
           const ongoingTest = userInfo?.ongoingTest;
-          if (isFinalTest) {
+          // When resuming, the server's isFinal flag is the source of truth:
+          // the localStorage flag can be stale (or absent in another
+          // browser), and a wrong test length breaks question numbering and
+          // ends a 30-question final at question 10.
+          const treatAsFinal = ongoingTest
+            ? !!ongoingTest.isFinal
+            : isFinalTest;
+          if (treatAsFinal) {
             const testResult = !ongoingTest
               ? await getFinalTest(accessToken)
               : ongoingTest;
             setTest(testResult);
             setTestLength(30);
-          }
-          if (!isFinalTest) {
+          } else {
             const testResult = !ongoingTest
               ? await getUXCatStartTest(accessToken)
               : ongoingTest;
diff --git a/src/uxcore/data/uxcat/ongoingTest/en.ts b/src/uxcore/data/uxcat/ongoingTest/en.ts
index 668a3535..2ceb7d36 100644
--- a/src/uxcore/data/uxcat/ongoingTest/en.ts
+++ b/src/uxcore/data/uxcat/ongoingTest/en.ts
@@ -8,6 +8,7 @@ const en = {
   message:
     'You are about to leave the page. Your test will continue until its time runs out',
   pickAnswer: 'Choose the answer',
+  submitFailed: 'The answer did not reach the server. Please try again.',
 };
 
 export default en;
diff --git a/src/uxcore/data/uxcat/ongoingTest/ru.ts b/src/uxcore/data/uxcat/ongoingTest/ru.ts
index 4e7048c6..e15e83b8 100644
--- a/src/uxcore/data/uxcat/ongoingTest/ru.ts
+++ b/src/uxcore/data/uxcat/ongoingTest/ru.ts
@@ -8,6 +8,7 @@ const ru = {
   message:
     'Вы собираетесь покинуть страницу, тест продолжится до истечения времени.',
   pickAnswer: 'Выберите ответ',
+  submitFailed: 'Ответ не дошел до сервера. Пожалуйста, попробуйте еще раз.',
 };
 
 export default ru;
diff --git a/src/uxcore/layouts/OngoingLayout/OngoingLayout.module.scss b/src/uxcore/layouts/OngoingLayout/OngoingLayout.module.scss
index 8d26b6c5..afe077dc 100644
--- a/src/uxcore/layouts/OngoingLayout/OngoingLayout.module.scss
+++ b/src/uxcore/layouts/OngoingLayout/OngoingLayout.module.scss
@@ -252,6 +252,14 @@ $white: #fafafa;
     }
   }
 
+  .submitError {
+    text-align: center;
+    color: #fb1717;
+    font-size: 16px;
+    line-height: 150%;
+    margin-top: 16px;
+  }
+
   .btnWrapper {
     display: flex;
     justify-content: center;
diff --git a/src/uxcore/layouts/OngoingLayout/OngoingLayout.tsx b/src/uxcore/layouts/OngoingLayout/OngoingLayout.tsx
index 7c5158ce..035e44ca 100644
--- a/src/uxcore/layouts/OngoingLayout/OngoingLayout.tsx
+++ b/src/uxcore/layouts/OngoingLayout/OngoingLayout.tsx
@@ -1,28 +1,22 @@
-import cn from 'classnames';
-import Image from 'next/image';
-import { useRouter } from 'next/router';
-import { FC, useContext, useEffect, useState } from 'react';
-import Skeleton from 'react-loading-skeleton';
-import { Tooltip as ReactTooltip } from 'react-tooltip';
-
-import { StrapiBiasType } from '@uxcore/local-types/data';
-import { TRouter } from '@uxcore/local-types/global';
-
-import { mergeBiasesLocalization } from '@uxcore/lib/helpers';
-
 import { getAchievement } from '@uxcore/api/uxcat/get-achievement';
 import { getUXCatSubmitTest } from '@uxcore/api/uxcat/submit-test';
-
-import ongoingTestData from '@uxcore/data/uxcat/ongoingTest';
-
 import ArrowRight from '@uxcore/assets/icons/ArrowRight';
-
 import Button from '@uxcore/components/Button';
 import ContentParser from '@uxcore/components/ContentParser';
 import { GlobalContext } from '@uxcore/components/Context/GlobalContext';
 import OngoingAnswerLines from '@uxcore/components/OngoingAnswerLines';
 import OngoingHeader from '@uxcore/components/OngoingHeader';
 import Toasts from '@uxcore/components/Toasts';
+import ongoingTestData from '@uxcore/data/uxcat/ongoingTest';
+import { mergeBiasesLocalization } from '@uxcore/lib/helpers';
+import { StrapiBiasType } from '@uxcore/local-types/data';
+import { TRouter } from '@uxcore/local-types/global';
+import cn from 'classnames';
+import Image from 'next/image';
+import { useRouter } from 'next/router';
+import { FC, useContext, useEffect, useRef, useState } from 'react';
+import Skeleton from 'react-loading-skeleton';
+import { Tooltip as ReactTooltip } from 'react-tooltip';
 
 import 'react-loading-skeleton/dist/skeleton.css';
 import styles from './OngoingLayout.module.scss';
@@ -89,6 +83,10 @@ const OngoingLayout: FC<OngoingProps> = ({
   const [lastQuestionClicked, setLastQuestionClicked] = useState(false);
   const [fade, setFade] = useState(null);
   const [fadeAnswer, setFadeAnswer] = useState(null);
+  // Ref (not state) so two rapid clicks/Enter presses can't both pass the
+  // guard before a re-render lands.
+  const isSubmittingRef = useRef(false);
+  const [submitError, setSubmitError] = useState(false);
 
   const {
     title,
@@ -98,6 +96,7 @@ const OngoingLayout: FC<OngoingProps> = ({
     message,
     pickAnswer,
     skipQuestionTxt,
+    submitFailed,
   } = ongoingTestData[currentLocale];
 
   const questionsLeft = startTest?.questions?.length;
@@ -170,6 +169,9 @@ const OngoingLayout: FC<OngoingProps> = ({
     }
   };
 
+  // Returns whether the answer actually reached the server; the caller must
+  // not advance the test on a dropped request, or the answer is silently
+  // lost and the score is wrong.
   const submittedAnswer = async (testId, questionId, answerId) => {
     const response = await getUXCatSubmitTest(
       testId,
@@ -177,10 +179,14 @@ const OngoingLayout: FC<OngoingProps> = ({
       answerId,
       token,
     );
+    if (!response) {
+      return false;
+    }
     setTestResult(response);
     if (currentNumber === testLength) {
       router.push('/uxcat/test-result');
     }
+    return true;
   };
 
   const handleSubmit = () => {
@@ -188,7 +194,6 @@ const OngoingLayout: FC<OngoingProps> = ({
     setTimeout(() => {
       setFade(false);
       handleButtonClick();
-      setLastQuestionClicked(currentNumber === testLength);
     }, 0);
   };
 
@@ -197,7 +202,6 @@ const OngoingLayout: FC<OngoingProps> = ({
     setTimeout(() => {
       setFade(false);
       handleSkipButtonClick();
-      setLastQuestionClicked(currentNumber === testLength);
     }, 0);
   };
 
@@ -359,29 +363,40 @@ const OngoingLayout: FC<OngoingProps> = ({
     }
   }, [lastQuestionClicked]);
 
-  const handleButtonClick = () => {
+  const sendAnswer = async (submittedAnswerId: number) => {
+    if (isSubmittingRef.current) return;
+    isSubmittingRef.current = true;
+    setSubmitError(false);
+
     if (fiveScsLeft && finishTestClicked) {
       const audio = new Audio('/audio/bomb.mp3');
       audio.play();
-      handleAnswerSubmit();
-      submittedAnswer(testId, questionId, answerId);
-      setSubmittedBiasNumber(findMatchingBias?.number);
-      setFinishTestClicked(true);
-    } else {
-      handleAnswerSubmit();
-      submittedAnswer(testId, questionId, answerId);
-      setSubmittedBiasNumber(findMatchingBias?.number);
-      setFinishTestClicked(true);
     }
-  };
 
-  const handleSkipButtonClick = () => {
+    const delivered = await submittedAnswer(
+      testId,
+      questionId,
+      submittedAnswerId,
+    );
+    isSubmittingRef.current = false;
+
+    if (!delivered) {
+      // Stay on the question and let the user retry.
+      setSubmitError(true);
+      setDefaultDisabled(false);
+      return;
+    }
+
+    setLastQuestionClicked(currentNumber === testLength);
     handleAnswerSubmit();
-    submittedAnswer(testId, questionId, 0);
     setSubmittedBiasNumber(findMatchingBias?.number);
     setFinishTestClicked(true);
   };
 
+  const handleButtonClick = () => sendAnswer(answerId);
+
+  const handleSkipButtonClick = () => sendAnswer(0);
+
   const handleScaleAnimation = () => {
     setScaleInAnimation(false);
     setTimeout(() => {
@@ -391,7 +406,13 @@ const OngoingLayout: FC<OngoingProps> = ({
 
   useEffect(() => {
     const handleKeyPress = event => {
-      if (event.key === 'Enter' && selectedAnswer !== null) {
+      // Mirror the Next button's disabled state, otherwise Enter submits
+      // the same question twice before React clears the selection.
+      if (
+        event.key === 'Enter' &&
+        selectedAnswer !== null &&
+        !defaultDisabled
+      ) {
         handleSubmit();
         handleAnswerAnimation();
         setDefaultDisabled(true);
@@ -403,7 +424,7 @@ const OngoingLayout: FC<OngoingProps> = ({
     return () => {
       document.removeEventListener('keydown', handleKeyPress);
     };
-  }, [selectedAnswer]);
+  }, [selectedAnswer, defaultDisabled]);
 
   return (
     <div
@@ -579,6 +600,7 @@ const OngoingLayout: FC<OngoingProps> = ({
         ) : (
           <Skeleton count={3} className={styles.skeleton} />
         )}
+        {submitError && <p className={styles.submitError}>{submitFailed}</p>}
         <div className={styles.btnWrapper}>
           <Button
             isBig