Zaps in chat, and a bolt + sats tally on chat messages, DMs and posts.

Chat and DM message sheets grow a ⚡ Zap item (not on your own messages),
riding the same one-tap flow as a post zap — Ark first, Lightning fallback,
the amount remembered from the first time. A chat message is a rumor with an
id like any event, so the zap e-tags that id; the public receipt reveals
nothing but the id.

Every post row, chat bubble and DM shows how much it's been zapped as a
little amber bolt + sats chip (1.2k / 21k / 1.5M), fed by the public receipts
that e-tag it: NIP-57 kind 9735 (amount from the bolt11, the zap request's
amount as fallback) and coinos' own Ark receipt, kind 9737 (network-checked).
Summed per id, deduped by receipt; underlined when one of ours is in it.
Ids are asked once each (batched per paint, 150 per REQ), and ONE live
subscription follows the ~200 ids most recently on screen so a zap landing
while you watch — yours included, rechecked at 4/12/30s — shows up without
a reload. The tally chip is itself a zap button on others' messages.

Co-Authored-By: Claude Fable 5.1 <[email protected]>
Claude-Session: https://claude.ai/code/session_01URmfo8VimCNkw6Y7JndYrv

1 files changed, 5 insertions, 0 deletions

diff --git a/src/style.css b/src/style.css
index 95c0935..ba94c11 100644
--- a/src/style.css
+++ b/src/style.css
@@ -480,6 +480,11 @@ hr.divider { margin: 16px 0; }
 }
 .chat-react.clickable { cursor: pointer; }
 .chat-react.on { border-color: color-mix(in srgb, currentColor 55%, transparent); font-weight: 600; }
+/* zap tally: a little bolt + sats, amber on both themes; .on = we zapped it */
+.zap-tally { display: inline-flex; align-items: center; gap: 2px; font-size: 11px; font-weight: 650; color: #e6a800; white-space: nowrap; flex-shrink: 0; }
+.zap-tally.chat-react { font-size: 12px; padding: 1px 7px 1px 5px; }
+.zap-tally.clickable { cursor: pointer; }
+.zap-tally.on { text-decoration: underline; text-decoration-color: color-mix(in srgb, #e6a800 60%, transparent); text-underline-offset: 2px; }
 .chat-compose {
   display: flex; gap: 8px; padding: 10px 12px; border-top: 1px solid var(--line);
   align-items: center; flex: 0 0 auto;