diff --git a/src/components/AgentChip.css b/src/components/AgentChip.css
index 17de42e..59255a6 100644
--- a/src/components/AgentChip.css
+++ b/src/components/AgentChip.css
@@ -1,6 +1,7 @@
.who { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.who__disc {
+ position: relative;
display: grid;
place-items: center;
flex: none;
@@ -56,3 +57,35 @@
opacity: 0;
transition: opacity .12s;
}
+
+/* The AI mark, on the disc rather than beside the name: it has to survive
+ showName={false}, and it belongs to the worker, not to the label. Sits
+ proud of the disc so it stays legible against every one of the five hues,
+ with a white ring to separate it from the colour underneath. */
+.who__ai {
+ position: absolute;
+ right: -3px;
+ bottom: -3px;
+ width: 11px;
+ height: 11px;
+ fill: var(--zk-amber, #b5761f);
+ stroke: var(--zk-white, #fff);
+ stroke-width: 0.9;
+ stroke-linejoin: round;
+ paint-order: stroke fill;
+}
+
+.who--md .who__ai { width: 13px; height: 13px; right: -3px; bottom: -3px; }
+
+/* Said out loud for a screen reader, which cannot see a sparkle. */
+.who__sr {
+ position: absolute;
+ width: 1px;
+ height: 1px;
+ padding: 0;
+ margin: -1px;
+ overflow: hidden;
+ clip: rect(0 0 0 0);
+ white-space: nowrap;
+ border: 0;
+}
diff --git a/src/components/AgentChip.jsx b/src/components/AgentChip.jsx
index 158157c..fa6d81f 100644
--- a/src/components/AgentChip.jsx
+++ b/src/components/AgentChip.jsx
@@ -20,8 +20,26 @@ export default function AgentChip({ agentKey, name, size = 'sm', showName = true
const body = (
<>
- {initials}
+ {/* THE DISC SAYS WHICH WORKER; THE SPARKLE SAYS IT IS NOT A PERSON.
+ Initials alone do not carry that — "EN" reads as a colleague's
+ badge, and on a screen whose entire claim is that the work was done
+ autonomously, the one fact every entry must state is which entries
+ were. The sparkle is the settled convention for machine-generated
+ work across current interfaces, so it needs no legend.
+
+ Only agents get it. A trail where a human's disc also carried one
+ would say nothing at all. */}
+
+ {initials}
+ {a ? (
+
+ ) : null}
+
{showName ? {label} : null}
+ {a ? (AI) : null}
>
)
diff --git a/src/screens/Lead.jsx b/src/screens/Lead.jsx
index 0c917a2..b2988e4 100644
--- a/src/screens/Lead.jsx
+++ b/src/screens/Lead.jsx
@@ -316,6 +316,12 @@ export default function Lead() {
['Customer', pick(['customer_name', 'entity_name', 'mobile', 'email'])],
[line === 'sme' ? 'The risk' : 'The vehicle', pick(GLANCE_RISK[line])],
['Documents', pick(docKeys)],
+ // THE CALL IS THE ONE STEP NOBODY CAN REPLAY FROM THE FIELDS. Everything
+ // else on this lead was typed or derived; this happened out loud, and
+ // until now its outcome sat in the full file with the source channel while
+ // the words themselves were reachable only from a button halfway down the
+ // trail. It gets its own card whenever a call has actually happened.
+ ['The call', pick(['contact_outcome', 'outreach_window', 'contact_notes'])],
['This stage', pick(GLANCE_STAGE[stage?.uid] || [])],
].filter(([, rows]) => rows.length)
@@ -727,6 +733,15 @@ export default function Lead() {
))}
+ {title === 'The call' && row.call_transcript ? (
+
+ ) : null}
))}
diff --git a/src/screens/screens.css b/src/screens/screens.css
index afd3a54..e6190c6 100644
--- a/src/screens/screens.css
+++ b/src/screens/screens.css
@@ -1534,6 +1534,30 @@
.glance .clamp__more { margin-top: 3px; font-size: 0.7rem; }
+/* An action that belongs to one card, not to the panel. Quiet until hovered:
+ the notes above it are the answer most of the time, and the transcript is
+ the follow-up question. */
+.glance__act {
+ display: inline-flex;
+ align-items: center;
+ gap: 6px;
+ margin-top: 10px;
+ padding: 5px 10px 5px 8px;
+ border: 1px solid var(--zk-line);
+ border-radius: var(--r-pill);
+ background: var(--zk-white);
+ cursor: pointer;
+ font: inherit;
+ font-size: 0.74rem;
+ font-weight: 500;
+ color: var(--zk-blue-dark);
+ transition: background var(--t-fast), border-color var(--t-fast);
+}
+
+.glance__act:hover { background: var(--zk-tint-blue); border-color: var(--zk-blue-light); }
+.glance__act:focus-visible { outline: 2px solid var(--zk-blue); outline-offset: 1px; }
+.glance__act svg { width: 13px; height: 13px; flex: none; }
+
/* HIDING IS ONLY SAFE WHILE IT STAYS FINDABLE, so this names the number it is
holding rather than saying "more". Full width and on the panel's own floor:
a link tucked into the header would be the discoverability problem that