History rows no longer wrap: the recipient's name chip keeps to one line (ellipsized when it must) and the "in progress" tag sits beside the time, not in the title row where it broke the name mid-word in the narrow wallet column

Co-Authored-By: Claude Fable 5.1 <[email protected]>

1 files changed, 7 insertions, 2 deletions

diff --git a/src/style.css b/src/style.css
index 31231fe..460b584 100644
--- a/src/style.css
+++ b/src/style.css
@@ -359,6 +359,10 @@ textarea.send-dest::placeholder { font-family: var(--sans); }
 /* ---- lists (tx / utxo) ---- */
 .list { display: flex; flex-direction: column; }
 .item { display: flex; align-items: center; gap: 12px; padding: 13px 2px; border-top: 1px solid var(--line); }
+/* the middle column may shrink: a long name chip beside the label then
+   ellipsizes on one line instead of breaking mid-name and pushing the
+   amount about */
+.item > .grow { min-width: 0; }
 .item:first-child { border-top: 0; }
 .ico { width: 34px; height: 34px; border-radius: 9px; flex: none; display: grid; place-items: center; font-size: 16px; }
 .ico.in { background: var(--green-soft); color: var(--green); }
@@ -366,7 +370,7 @@ textarea.send-dest::placeholder { font-family: var(--sans); }
 .amount-pos { color: var(--green); font-family: var(--mono); font-weight: 600; }
 .amount-neg { color: var(--red); font-family: var(--mono); font-weight: 600; }
 .amount { font-family: var(--mono); font-weight: 600; }
-.tag { font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 6px; }
+.tag { font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 6px; white-space: nowrap; flex: none; }
 .tag.pending { background: var(--accent-soft); color: var(--accent-ink); }
 .tag.conf { background: var(--green-soft); color: var(--green); }
 
@@ -1215,7 +1219,8 @@ html.no-scroll { overflow: hidden; scrollbar-gutter: auto; }
 .profile-banner + .row .profile-avatar {
   border: 3px solid var(--paper); box-sizing: content-box;
 }
-.zap-chip { display: inline-flex; gap: 5px; align-items: center; cursor: pointer; background: var(--surface2); border: 1px solid var(--line); border-radius: 999px; padding: 1px 8px 1px 2px; }
+.zap-chip { display: inline-flex; gap: 5px; align-items: center; cursor: pointer; background: var(--surface2); border: 1px solid var(--line); border-radius: 999px; padding: 1px 8px 1px 2px; min-width: 0; max-width: 100%; }
+.zap-chip > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
 .chat-avatar.mini { width: 18px; height: 18px; font-size: 8px; flex-shrink: 0; }
 /* A feed row is the one place a face is the point, not a label on a line —
    Amethyst gives it 55dp; at our 30px it read as a bullet beside the post.