@uplifted/react 0.24.0 → 0.26.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (92) hide show
  1. package/CHANGELOG.md +43 -0
  2. package/dist/AddClientSheet.d.ts +4 -4
  3. package/dist/AddClientSheet.d.ts.map +1 -1
  4. package/dist/AddClientSheet.js.map +1 -1
  5. package/dist/BulkGenerateSheet.d.ts +13 -5
  6. package/dist/BulkGenerateSheet.d.ts.map +1 -1
  7. package/dist/BulkGenerateSheet.js +25 -11
  8. package/dist/BulkGenerateSheet.js.map +1 -1
  9. package/dist/ChannelBadge.d.ts +5 -1
  10. package/dist/ChannelBadge.d.ts.map +1 -1
  11. package/dist/ChannelBadge.js +8 -4
  12. package/dist/ChannelBadge.js.map +1 -1
  13. package/dist/ChannelControl.d.ts +24 -0
  14. package/dist/ChannelControl.d.ts.map +1 -0
  15. package/dist/ChannelControl.js +96 -0
  16. package/dist/ChannelControl.js.map +1 -0
  17. package/dist/ChannelExplainer.d.ts +1 -1
  18. package/dist/ChannelExplainer.d.ts.map +1 -1
  19. package/dist/ClientChat.d.ts +37 -0
  20. package/dist/ClientChat.d.ts.map +1 -0
  21. package/dist/ClientChat.js +365 -0
  22. package/dist/ClientChat.js.map +1 -0
  23. package/dist/ClientList.js +3 -3
  24. package/dist/ClientList.js.map +1 -1
  25. package/dist/Composer.d.ts +4 -2
  26. package/dist/Composer.d.ts.map +1 -1
  27. package/dist/Composer.js +10 -11
  28. package/dist/Composer.js.map +1 -1
  29. package/dist/ConnectClientSheet.d.ts +5 -3
  30. package/dist/ConnectClientSheet.d.ts.map +1 -1
  31. package/dist/ConnectClientSheet.js +2 -2
  32. package/dist/ConnectClientSheet.js.map +1 -1
  33. package/dist/ConversationPane.d.ts +5 -1
  34. package/dist/ConversationPane.d.ts.map +1 -1
  35. package/dist/ConversationPane.js +5 -3
  36. package/dist/ConversationPane.js.map +1 -1
  37. package/dist/HostPreviewPane.d.ts.map +1 -1
  38. package/dist/HostPreviewPane.js +2 -1
  39. package/dist/HostPreviewPane.js.map +1 -1
  40. package/dist/SegmentEditor.d.ts +1 -1
  41. package/dist/SegmentEditor.d.ts.map +1 -1
  42. package/dist/SegmentEditor.js +4 -3
  43. package/dist/SegmentEditor.js.map +1 -1
  44. package/dist/ThreadFeed.d.ts.map +1 -1
  45. package/dist/ThreadFeed.js +3 -2
  46. package/dist/ThreadFeed.js.map +1 -1
  47. package/dist/UpliftPanel.d.ts +7 -1
  48. package/dist/UpliftPanel.d.ts.map +1 -1
  49. package/dist/UpliftPanel.js +43 -8
  50. package/dist/UpliftPanel.js.map +1 -1
  51. package/dist/build-info.json +3 -3
  52. package/dist/channels.d.ts +1 -1
  53. package/dist/channels.d.ts.map +1 -1
  54. package/dist/chatStrings.d.ts +56 -0
  55. package/dist/chatStrings.d.ts.map +1 -0
  56. package/dist/chatStrings.js +50 -0
  57. package/dist/chatStrings.js.map +1 -0
  58. package/dist/icons.d.ts +2 -0
  59. package/dist/icons.d.ts.map +1 -1
  60. package/dist/icons.js +2 -0
  61. package/dist/icons.js.map +1 -1
  62. package/dist/index.d.ts +4 -0
  63. package/dist/index.d.ts.map +1 -1
  64. package/dist/index.js +4 -0
  65. package/dist/index.js.map +1 -1
  66. package/dist/labels.js +1 -1
  67. package/dist/labels.js.map +1 -1
  68. package/dist/styles.d.ts +1 -1
  69. package/dist/styles.d.ts.map +1 -1
  70. package/dist/styles.js +108 -16
  71. package/dist/styles.js.map +1 -1
  72. package/dist/useChatUnread.d.ts +8 -0
  73. package/dist/useChatUnread.d.ts.map +1 -0
  74. package/dist/useChatUnread.js +63 -0
  75. package/dist/useChatUnread.js.map +1 -0
  76. package/dist/useClientChat.d.ts +57 -0
  77. package/dist/useClientChat.d.ts.map +1 -0
  78. package/dist/useClientChat.js +360 -0
  79. package/dist/useClientChat.js.map +1 -0
  80. package/dist/useStickToBottom.d.ts +2 -0
  81. package/dist/useStickToBottom.d.ts.map +1 -1
  82. package/dist/useStickToBottom.js +5 -1
  83. package/dist/useStickToBottom.js.map +1 -1
  84. package/dist/useThread.d.ts +3 -1
  85. package/dist/useThread.d.ts.map +1 -1
  86. package/dist/useThread.js +4 -1
  87. package/dist/useThread.js.map +1 -1
  88. package/package.json +3 -3
  89. package/dist/ComposerExtras.d.ts +0 -15
  90. package/dist/ComposerExtras.d.ts.map +0 -1
  91. package/dist/ComposerExtras.js +0 -14
  92. package/dist/ComposerExtras.js.map +0 -1
package/dist/styles.d.ts CHANGED
@@ -9,7 +9,7 @@
9
9
  * D16: layout answers to the panel's own width through a container query, never the viewport.
10
10
  */
11
11
  export declare const STYLE_ELEMENT_ID = "uplifted-react-styles";
12
- export declare const upliftStyles = "\n:where(.uplift){\n --u-bg:#ffffff;--u-surface:#ffffff;--u-surface-2:#fafafa;--u-surface-3:#f4f4f5;\n --u-text:#262626;--u-muted:#666666;--u-border:rgba(0,0,0,.08);\n --u-accent:#0f8a63;--u-accent-soft:#e3f5ee;--u-accent-ink:#ffffff;--u-link:#0b6b4c;\n --u-highlight:var(--u-accent);--u-highlight-soft:var(--u-accent-soft);\n --u-gold:#c9971c;--u-gold-hi:#f7e2a0;--u-gold-ink:#8a6410;--u-gold-ink-hi:#c9971c;\n --u-seg-l:88%;\n --u-danger:#c10007;--u-warn:#bb4d00;--u-out:#eaf1ff;--u-out-ink:#12244d;\n --u-font:-apple-system,BlinkMacSystemFont,\"Segoe UI\",Inter,sans-serif;--u-radius:10px;\n}\n:where(.uplift[data-theme=\"dark\"],[data-theme=\"dark\"] .uplift){\n --u-bg:#111111;--u-surface:#111111;--u-surface-2:#0a0a0a;--u-surface-3:#1a1a1a;\n --u-text:#f5f5f5;--u-muted:#9a9a9a;--u-border:rgba(255,255,255,.08);\n --u-accent:#70d7b0;--u-accent-soft:#17342a;--u-accent-ink:#062a1e;--u-link:#70d7b0;\n --u-gold:#d9a830;--u-gold-hi:#fff1b8;--u-gold-ink:#d9a830;--u-gold-ink-hi:#f3d47a;\n --u-seg-l:26%;\n --u-danger:#ff6467;--u-warn:#ffb900;--u-out:#1d2b4a;--u-out-ink:#e3ebff;\n}\n.uplift,.uplift *,.uplift *::before,.uplift *::after{box-sizing:border-box}\n.uplift{font:15px/1.45 var(--u-font);color:var(--u-text);background:var(--u-bg);border:1px solid var(--u-border);border-radius:14px;overflow:hidden;container-type:inline-size;container-name:panel;position:relative;-webkit-font-smoothing:antialiased}\n:where(.uplift) button{font:inherit;color:inherit;cursor:pointer}\n:where(.uplift) button:disabled{cursor:not-allowed}\n.uplift :focus-visible{outline:2px solid var(--u-highlight);outline-offset:2px;border-radius:6px}\n.uplift h2,.uplift h3,.uplift h4,.uplift p{margin:0}\n.u-sp{flex:1}\n.u-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}\n.u-pill{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--u-border);background:var(--u-surface-2);border-radius:999px;padding:4px 10px;font-size:13px;color:var(--u-muted)}\n.u-pill b{color:var(--u-text);font-weight:600}\n.u-linkbtn{background:none;border:0;padding:4px 2px;color:var(--u-link);font-weight:600;text-decoration:underline;text-underline-offset:3px}\n.u-split{display:grid;grid-template-columns:320px minmax(0,1fr);height:min(max(520px,62.5cqw),86vh)}\n.u-split>*{min-height:0}\n.u-list{overflow:hidden}\n.u-pane{overflow:hidden}\n.u-iconbtn{display:inline-grid;place-items:center;width:34px;height:34px;border:1px solid var(--u-border);background:var(--u-bg);border-radius:8px;color:var(--u-muted);padding:0}\n.u-iconbtn:hover{color:var(--u-text)}\n.u-iconbtn-pair{width:auto;padding:0 9px;display:inline-flex;align-items:center;gap:4px}\n.u-ai-spark{display:inline-flex;color:var(--u-highlight)}\n.u-iconbtn .u-ai-spark svg{width:14px;height:14px}\n.u-iconbtn svg{width:16px;height:16px}\n.u-iconbtn[aria-pressed=\"true\"]{color:var(--u-text);background:var(--u-surface-2)}\n.u-bulkbtn svg{width:14px;height:14px}\n.uplift.u-full{position:fixed;inset:0;z-index:2147483000;border-radius:0;border:0;display:flex;flex-direction:column}\n.uplift.u-full .u-split{flex:1;height:auto;min-height:0}\n.u-back{display:none;border:1px solid var(--u-border);background:var(--u-bg);border-radius:8px;padding:6px 10px;font-size:16px;min-height:36px;align-items:center;flex:none}\n.u-list{border-right:1px solid var(--u-border);display:flex;flex-direction:column;min-width:0}\n/* inbox toolbar: native Uplift's collapsed search + segmented sort + Bulk generate */\n.u-toolbar{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--u-border)}\n.u-search{position:relative;flex:0 1 32px;min-width:32px;display:flex;align-items:center;cursor:pointer;transition:flex-basis .2s ease,flex-grow .2s ease}\n.u-search-open{flex:1 1 140px;cursor:auto}\n.u-search svg{position:absolute;left:9px;width:14px;height:14px;color:var(--u-muted);pointer-events:none}\n.u-search input{width:100%;min-height:32px;padding:6px 10px 6px 30px;border-radius:999px;border:1px solid var(--u-border);background:var(--u-surface-2);font:inherit;font-size:13px;color:var(--u-text)}\n.u-search:not(.u-search-open) input{cursor:pointer;padding-right:0}\n.u-search:not(.u-search-open) input::placeholder{opacity:0}\n.u-search input:focus{outline:none;border-color:var(--u-accent);background:var(--u-bg)}\n.u-search input::-webkit-search-cancel-button{cursor:pointer}\n.u-sortgroup{display:inline-flex;align-items:center;padding:2px;border-radius:999px;background:var(--u-surface-2);flex:none}\n.u-sortgroup button{border:0;background:none;border-radius:999px;padding:4px 9px;font-size:12px;font-weight:600;color:var(--u-muted);min-height:28px;white-space:nowrap}\n.u-sortgroup button:hover{color:var(--u-text)}\n.u-sortgroup button[aria-pressed=\"true\"]{background:var(--u-bg);color:var(--u-text);box-shadow:0 1px 2px rgba(0,0,0,.08),0 0 0 1px var(--u-border)}\n.u-rows li.u-bulkrow{border-bottom:0;padding:10px 12px}\n.u-bulkrow .u-bulkbtn{display:inline-flex;align-items:center;justify-content:center;gap:2px;width:100%;border:1px dashed var(--u-border);border-radius:10px;background:none;color:var(--u-muted);padding:8px 10px;min-height:36px;font:inherit;font-size:13px;cursor:pointer}\n.u-bulkrow .u-bulkbtn span{margin-left:6px}\n.u-bulkrow .u-bulkbtn:hover:not(:disabled){color:var(--u-accent);border-color:var(--u-accent);background:var(--u-surface-2)}\n.u-bulkrow .u-bulkbtn:disabled{opacity:.45;cursor:not-allowed}\n.u-clear-btn{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;min-height:0;padding:0;flex:none;border-radius:999px;border:0;background:none;color:var(--u-muted);cursor:pointer}\n.u-clear-btn svg{width:15px;height:15px}\n.u-clear-btn:hover:not(:disabled){color:var(--u-text);background:var(--u-surface-2)}\n.u-clear-btn:disabled{opacity:.4;cursor:not-allowed}\n.u-rows{list-style:none;margin:0;padding:0;overflow:auto;flex:1;min-height:0}\n.u-rows li{display:flex;flex-wrap:wrap;align-items:stretch;border-bottom:1px solid var(--u-border)}\n.u-row-open{flex:1;min-width:0;text-align:left;border:0;background:transparent;padding:11px 12px;display:grid;grid-template-columns:36px minmax(0,1fr);gap:2px 10px;min-height:64px}\n.u-av{grid-row:span 3;width:36px;height:36px;border-radius:999px;display:grid;place-items:center;font-size:13px;font-weight:700;color:#fff}\n.u-av.u-av-sm{grid-row:auto;width:32px;height:32px}\n.u-r-top{display:flex;gap:6px;align-items:baseline;min-width:0}\n.u-r-name{font-weight:600;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n.u-r-time{margin-left:auto;font-size:12.5px;color:var(--u-muted);flex:none}\n.u-r-line{font-size:13.5px;color:var(--u-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n.u-r-tags{display:flex;flex-wrap:wrap;gap:4px}\n.u-tag{font-size:12px;font-weight:600;border-radius:999px;padding:1px 8px;border:1px solid var(--u-border);color:var(--u-muted);background:var(--u-surface-2)}\n.u-tag.u-need{color:var(--u-danger);border-color:color-mix(in srgb,var(--u-danger) 35%,transparent)}\n.u-tag.u-ok{color:var(--u-link);border-color:color-mix(in srgb,var(--u-highlight) 35%,transparent)}\n.u-tag.u-warn{color:var(--u-warn);border-color:color-mix(in srgb,var(--u-warn) 35%,transparent)}\n.u-list-foot{padding:10px 12px;font-size:13px;color:var(--u-muted)}\n.u-skel{height:12px;border-radius:6px;background:var(--u-surface-3);margin:6px 0}\n.u-skel-row{padding:14px 12px;border-bottom:1px solid var(--u-border)}\n.u-state{padding:22px 16px;display:flex;flex-direction:column;gap:8px;align-items:flex-start;font-size:14.5px;color:var(--u-muted)}\n.u-state h3{font-size:16px;color:var(--u-text)}\n.u-state p{max-width:52ch}\n.u-pane{display:flex;flex-direction:column;min-width:0}\n.u-pane-head{display:flex;align-items:center;gap:10px;padding:11px 16px;border-bottom:1px solid var(--u-border)}\n.u-who{display:flex;flex-direction:column;min-width:0}\n.u-who strong{font-size:15px}\n.u-who small{font-size:13px;color:var(--u-muted)}\n.u-chan{margin-left:auto;font-size:13px;color:var(--u-muted)}\n.u-feed{flex:1;overflow:auto;padding:14px 16px;display:flex;flex-direction:column;gap:8px;background:var(--u-surface-2);min-height:200px}\n.u-tpl-chip{display:inline-flex;align-items:center;gap:4px;margin-left:6px;border:1px solid var(--u-border);border-radius:999px;padding:0 7px;font-size:11px;color:var(--u-muted);background:var(--u-bg);min-height:18px}\n.u-bub.u-tpl-shown{opacity:.85;border:1px dashed color-mix(in srgb,var(--u-out-ink) 50%,transparent)}\n.u-day{align-self:center;font-size:12px;color:var(--u-muted);background:var(--u-bg);border:1px solid var(--u-border);padding:2px 10px;border-radius:999px}\n.u-older{align-self:center;border:1px solid var(--u-border);background:var(--u-bg);border-radius:999px;padding:5px 12px;font-size:13px;color:var(--u-muted);min-height:32px}\n.u-ev{align-self:center;max-width:92%;display:flex;gap:8px;align-items:flex-start;font-size:13.5px;background:var(--u-bg);border:1px solid var(--u-border);border-radius:10px;padding:8px 11px}\n.u-ev svg{width:16px;height:16px;flex:none;margin-top:2px;color:var(--u-muted)}\n.u-ev b{font-weight:600}\n.u-ev .u-meta{color:var(--u-muted);font-size:12.5px}\n.u-bub{max-width:78%;padding:8px 12px;border-radius:14px;font-size:14.5px;white-space:pre-wrap;overflow-wrap:anywhere}\n.u-bub.u-in{align-self:flex-start;background:var(--u-bg);border:1px solid var(--u-border);border-bottom-left-radius:4px}\n.u-bub.u-out{align-self:flex-end;background:var(--u-out);color:var(--u-out-ink);border-bottom-right-radius:4px}\n.u-bmeta{font-size:12px;color:var(--u-muted)}\n.u-bmeta.u-r{align-self:flex-end}\n/* ---- Composer footer (port of native ChatPage footer) ---- */\n.u-composer{display:flex;flex-direction:column;gap:8px;padding:10px 16px 12px;background:var(--u-surface-2);border-top:1px solid var(--u-border)}\n.u-composer>*:empty{display:none}\n.u-rail{align-self:center;display:inline-flex;align-items:center;gap:6px;border:0;background:transparent;color:var(--u-muted);font-size:12px;padding:2px 10px;border-radius:999px;min-height:24px}\n.u-rail:hover{color:var(--u-text);background:var(--u-surface-3)}\n.u-rail svg{width:14px;height:14px}\n.u-extras-wrap{position:relative;display:flex;flex-direction:column}\n.u-extras-wrap>.u-rail{align-self:flex-end}\n.u-extras-wrap>.u-rail[aria-expanded=\"true\"]{position:absolute;top:0;right:0;z-index:1}\n.u-extras-wrap:has(>.u-rail[aria-expanded=\"true\"]) .u-ag-h{padding-right:34px}\n.u-extras{display:contents}\n.u-extras-off{display:none}\n/* draft grid (ComposerAssistant) */\n.u-ag{display:flex;flex-direction:column;gap:6px}\n.u-ag-h{display:flex;align-items:center;gap:2px}\n.u-ag-toggle{display:inline-flex;align-items:center;gap:8px;padding:4px 8px;border:0;background:transparent;color:var(--u-muted);font-size:12px;font-weight:600;border-radius:6px;min-height:28px}\n.u-ag-toggle:hover{background:var(--u-surface-3);color:var(--u-text)}\n.u-ag-spark{display:inline-flex;color:var(--u-highlight)}.u-ag-spark svg{width:12px;height:12px}\n.u-ag-label{letter-spacing:.02em}\n.u-ag-chev{display:inline-flex;color:var(--u-muted);transition:transform .15s}.u-ag-chev svg{width:14px;height:14px}\n.u-ag-chev-open{transform:rotate(180deg)}\n.u-ag-by{font-size:12px;color:var(--u-muted);margin-left:6px}\n.u-ag-regen{display:inline-flex;align-items:center;justify-content:center;padding:4px;border:0;background:transparent;color:var(--u-muted);border-radius:6px;min-width:24px;min-height:24px}\n.u-ag-regen svg{width:11px;height:11px}\n.u-ag-regen:hover:not(:disabled){color:var(--u-highlight);background:var(--u-surface-3)}\n.u-ag-regen:disabled{opacity:.5}\n.u-ag-spinning svg{animation:u-spin 1s linear infinite}\n@keyframes u-spin{to{transform:rotate(360deg)}}\n.u-ag-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}\n.u-ag-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}\n.u-ag-tile{display:flex;align-items:center;gap:5px;min-height:30px;padding:6px 8px;border:1px solid var(--u-border);border-radius:8px;background:var(--u-bg);color:var(--u-muted);min-width:0;overflow:hidden;text-align:left;cursor:pointer;transition:border-color .15s,background .15s}\n.u-ag-tile:hover{border-color:var(--u-muted)}\n.u-ag-tile-ic{display:inline-flex;flex:none}.u-ag-tile-ic svg{width:12px;height:12px}\n.u-ag-tile-txt{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;line-height:1.2;font-weight:600;color:var(--u-muted)}\n.u-ag-tile-txt.u-ag-tile-on{color:var(--u-text)}\n.u-ag-tile-shimmer{height:30px;border-radius:8px;background:linear-gradient(90deg,var(--u-surface-2) 25%,var(--u-border) 50%,var(--u-surface-2) 75%);background-size:300% 100%;animation:u-ag-tiles 1.4s ease-in-out infinite}\n@keyframes u-ag-tiles{0%{background-position:200% 0}100%{background-position:-200% 0}}\n.u-ag-lab svg{width:12px;height:12px}\n.u-pill-gen .u-pill-grow{position:relative}\n.u-pill-gen .u-pill-grow::after{content:\"\";position:absolute;inset:8px 6px;border-radius:6px;pointer-events:none;background:linear-gradient(var(--u-surface-2),var(--u-surface-2)) 0 0/100% 9px no-repeat,linear-gradient(var(--u-surface-2),var(--u-surface-2)) 0 15px/88% 9px no-repeat,linear-gradient(var(--u-surface-2),var(--u-surface-2)) 0 30px/60% 9px no-repeat;animation:u-pill-gen 1.4s ease-in-out infinite}\n@keyframes u-pill-gen{0%,100%{opacity:.5}50%{opacity:1}}\n@media (prefers-reduced-motion: reduce){.u-ag-tile-shimmer,.u-pill-gen .u-pill-grow::after{animation:none}}\n.u-ag-cell{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;min-height:56px;padding:10px 12px;background:var(--u-surface-2);border:1px solid transparent;border-radius:var(--u-radius);color:var(--u-text);text-align:left;transition:background .15s,transform .15s}\n.u-ag-cell:hover:not(:disabled){background:var(--u-bg)}\n/* Gold shimmer ring on finished drafts (Ian, 2026-10-11): a gradient pseudo-element masked to the edge. Reduced motion leaves a still ring. */\n.u-ag-cell:not(.u-ag-loading)::before{content:\"\";position:absolute;inset:-1px;border-radius:calc(var(--u-radius) + 1px);padding:1.5px;pointer-events:none;background:linear-gradient(110deg,var(--u-gold) 0%,var(--u-gold-hi) 25%,var(--u-gold) 50%,var(--u-gold-hi) 75%,var(--u-gold) 100%);background-size:250% 100%;animation:u-shimmer 3.2s linear infinite;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude}\n@keyframes u-shimmer{from{background-position:0% 50%}to{background-position:250% 50%}}\n.u-ag-cell[aria-checked=\"true\"]{box-shadow:0 0 0 2px var(--u-highlight)}\n.u-ag-cell[aria-checked=\"true\"]::before{display:none}\n.u-ag-lab{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;color:var(--u-highlight);text-transform:uppercase;letter-spacing:.04em}\n.u-ag-pencil{display:inline-flex;opacity:.6}.u-ag-pencil svg{width:10px;height:10px}\n.u-ag-txt{font-size:14px;line-height:1.35;color:var(--u-text);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;word-break:break-word}\n.u-ag-loading{overflow:hidden;cursor:default;pointer-events:none;justify-content:center;align-items:center;border-color:var(--u-border)}\n.u-ag-loading-txt{position:relative;z-index:1;font-size:12px;color:var(--u-muted)}\n.u-ag-shimmer{position:absolute;inset:0;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.55) 50%,transparent 100%);animation:u-ag-sheen 1.4s infinite;transform:translateX(-100%)}\n@keyframes u-ag-sheen{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}\n.u-ag-empty{font-size:12.5px;color:var(--u-muted);padding:6px 0;display:flex;gap:10px;align-items:center;flex-wrap:wrap}\n.u-ag-foot{font-size:12.5px;color:var(--u-muted);margin:0}\n/* attachments */\n.u-attach-row{align-items:center;gap:8px;flex-wrap:wrap}\n.u-limits{font-size:12px;color:var(--u-muted)}\n.u-limits-warn{color:var(--u-warn)}\n.u-chips{display:flex;flex-wrap:wrap;gap:8px;padding:4px 0}\n.u-chip{display:inline-flex;align-items:center;gap:6px;max-width:240px;padding:4px 8px;border-radius:999px;background:var(--u-bg);border:1px solid var(--u-border);font-size:12px;color:var(--u-muted)}\n.u-chip svg{width:13px;height:13px;flex:none}\n.u-chip-err{border-color:var(--u-danger);color:var(--u-danger)}\n.u-chip-errtxt{font-size:10px}\n.u-chip-thumb{width:22px;height:22px;object-fit:cover;border-radius:5px}\n.u-chip-name{max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n.u-chip-x{display:inline-flex;align-items:center;border:0;background:none;color:inherit;padding:2px;min-height:0}\n.u-chip-x svg{width:12px;height:12px}\n.u-spin{animation:u-spin 1s linear infinite}\n.u-rec{display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:9px;background:var(--u-bg);font-size:12px;color:var(--u-muted)}\n.u-rec-dot{width:8px;height:8px;border-radius:50%;background:#ff3b30;animation:u-rec-pulse 1.2s ease-in-out infinite}\n@keyframes u-rec-pulse{0%,100%{opacity:1}50%{opacity:.35}}\n.u-rec-btn{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--u-border);background:var(--u-bg);color:var(--u-text);border-radius:999px;width:28px;height:28px;min-height:0;padding:0}\n.u-rec-btn svg{width:14px;height:14px}\n.u-rec-done{background:var(--u-accent);color:var(--u-accent-ink);border-color:var(--u-accent)}\n.u-sms-note{font-size:12px;color:var(--u-warn)}\n/* editor row: + button, pill with the editor and the inline send/\u2728 */\n.u-c-row{display:flex;align-items:flex-end;gap:8px;width:100%}\n.u-attach-wrap{position:relative;flex:none}\n.u-attach-btn{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;min-height:0;padding:0;margin-bottom:3px;border:1px solid var(--u-border);border-radius:999px;background:var(--u-bg);color:var(--u-muted);transition:color .15s,background .15s}\n.u-attach-btn svg{width:18px;height:18px}\n.u-attach-btn:hover:not(:disabled){color:var(--u-highlight);background:var(--u-highlight-soft)}\n.u-attach-btn:disabled{opacity:.45}\n.u-pill{position:relative;flex:1;min-width:0;display:flex;align-items:flex-end;gap:6px;background:var(--u-bg);border:1px solid var(--u-border);border-radius:14px;padding:4px 4px 4px 8px}\n.u-pill-grow{flex:1;min-width:0}\n.u-pill .u-editor{border:0;background:transparent;border-radius:0;padding:6px 4px;min-height:38px;max-height:220px;resize:none}\n.u-pill .u-editor:focus{outline:none}\n.u-pill:focus-within{border-color:var(--u-highlight)}\n/* Locked pill (stock intro, nothing to edit): gold shimmer ring like the draft cells. Reduced motion leaves a still ring. */\n.u-pill-locked{border-color:transparent}\n.u-pill-locked::before{content:\"\";position:absolute;inset:-1px;border-radius:15px;padding:1.5px;pointer-events:none;background:linear-gradient(110deg,var(--u-gold) 0%,var(--u-gold-hi) 25%,var(--u-gold) 50%,var(--u-gold-hi) 75%,var(--u-gold) 100%);background-size:250% 100%;animation:u-shimmer 3.2s linear infinite;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude}\n.u-pill-locked:focus-within{border-color:transparent}\n.u-editor-locked{cursor:default;caret-color:transparent}\n.u-send-btn{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;min-height:0;padding:0;flex:none;border-radius:999px;border:0;background:var(--u-accent);color:var(--u-accent-ink);transition:transform .15s,opacity .15s}\n.u-send-btn svg{width:15px;height:15px;stroke:var(--u-accent-ink)}\n.u-send-btn:hover:not(:disabled){transform:translateY(-1px)}\n.u-send-btn:disabled{opacity:.4;cursor:not-allowed}\n.u-send-btn-text{width:auto;padding:0 12px;font-size:12.5px;font-weight:600;white-space:nowrap}\n.u-gen-btn{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;min-height:0;padding:0;flex:none;border:0;border-radius:999px;background:transparent;color:var(--u-highlight);transition:background .15s}\n.u-gen-btn svg{width:16px;height:16px}\n.u-gen-btn:hover:not(:disabled){background:var(--u-highlight-soft)}\n.u-gen-btn:disabled{opacity:.4}\n.u-menu-backdrop{position:fixed;inset:0;z-index:40}\n.u-menu{position:absolute;bottom:calc(100% + 6px);z-index:41;display:flex;flex-direction:column;min-width:150px;padding:4px;border-radius:12px;background:var(--u-bg);border:1px solid var(--u-border);box-shadow:0 10px 30px rgba(0,0,0,.18)}\n.u-menu-left{left:0}.u-menu-right{right:0}\n.u-menu-title{padding:6px 12px 4px;font-size:11.5px;font-weight:600;color:var(--u-muted)}\n.u-menu-titlerow{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 6px 2px 0}\n.u-menu-titlerow .u-menu-title{padding:2px 12px 2px}\n.u-menu-cfg{display:inline-flex;align-items:center;justify-content:center;padding:4px;min-width:24px;min-height:24px;border:0;background:none;color:var(--u-muted);border-radius:6px}\n.u-menu-cfg svg{width:13px;height:13px}\n.u-menu-cfg:hover{color:var(--u-text);background:var(--u-surface-3)}\n/* proactive options editor */\n.u-po-help{font-size:13.5px;color:var(--u-muted);margin:0 0 10px}\n.u-po-list{display:flex;flex-direction:column;gap:10px}\n.u-po-row{border:1px solid var(--u-border);border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:8px;background:var(--u-surface-2)}\n.u-po-top{display:flex;align-items:center;gap:6px}\n.u-po-label{flex:1;min-width:0;border:1px solid var(--u-border);border-radius:8px;padding:7px 10px;font:inherit;font-size:14px;background:var(--u-bg);color:var(--u-text)}\n.u-po-text{width:100%;border:1px solid var(--u-border);border-radius:8px;padding:7px 10px;font:inherit;font-size:13.5px;background:var(--u-bg);color:var(--u-text);resize:vertical}\n.u-po-iconwrap{position:relative;flex:none}\n.u-po-iconbtn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;min-height:0;padding:0;border:1px solid var(--u-border);border-radius:8px;background:var(--u-bg);color:var(--u-text)}\n.u-po-iconbtn svg{width:15px;height:15px}\n.u-po-iconbtn:disabled{opacity:.4}\n.u-po-iconbtn-on{border-color:var(--u-highlight);box-shadow:0 0 0 1px var(--u-highlight);color:var(--u-highlight)}\n.u-po-remove:hover{color:var(--u-danger);border-color:var(--u-danger)}\n.u-po-iconpick{position:absolute;top:calc(100% + 4px);left:0;z-index:5;display:grid;grid-template-columns:repeat(6,32px);gap:4px;padding:6px;background:var(--u-bg);border:1px solid var(--u-border);border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.18)}\n.u-po-add{margin-top:10px;border:1px dashed var(--u-border);background:transparent;border-radius:9px;padding:8px 12px;font-weight:600;color:var(--u-link);min-height:38px;width:100%}\n.u-po-actions{display:flex;gap:8px;align-items:center;margin-top:12px;flex-wrap:wrap}\n.u-menu-item{display:flex;align-items:center;gap:8px;width:100%;padding:8px 12px;border:0;border-radius:8px;background:none;text-align:left;font-size:14px;color:var(--u-text);min-height:36px}\n.u-menu-item:hover{background:var(--u-surface-3)}\n.u-menu-purpose svg{width:14px;height:14px;color:var(--u-highlight);flex:none}\n/* inbox rows (native ClientRow) */\n.u-row-open{position:relative}\n.u-r-ind{position:absolute;left:3px;top:50%;transform:translateY(-50%);width:20px;display:grid;place-items:center}\n.u-rows .u-row-open{padding-left:26px}\n.u-r-dot{width:8px;height:8px;border-radius:50%;background:var(--u-highlight)}\n.u-r-badge{min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--u-highlight);color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center}\n/* The open conversation is the only row with a colour: a clear shade and an accent bar on the left\n edge, like WhatsApp's selected chat. Unread shows by the dot and bold name, never a tint. Built\n from the text colour so it reads on any host theme, light or dark. */\n.u-rows li:has(.u-row-open[aria-current=\"true\"]){background:color-mix(in srgb,var(--u-text) 8%,var(--u-bg));box-shadow:inset 3px 0 0 var(--u-accent)}\n.u-rows li:has(.u-row-open[aria-current=\"true\"]) .u-row-open{background:transparent}\n.u-r-name-unread{font-weight:700}\n.u-r-follow,.u-r-fail{display:inline-flex;align-items:center;flex:none}\n.u-r-follow svg,.u-r-fail svg{width:13px;height:13px}\n.u-r-follow{color:var(--u-warn)}\n.u-r-fail{color:var(--u-danger)}\n.u-r-prev{display:inline-flex;align-items:center;gap:5px;max-width:100%}\n.u-r-pico{display:inline-flex;flex:none}.u-r-pico svg{width:11px;height:11px}\n.u-r-prev-in .u-r-ptxt{color:var(--u-text)}\n.u-r-prev-in .u-r-pico{color:var(--u-highlight)}\n.u-r-prev-out .u-r-ptxt,.u-r-prev-out .u-r-pico{color:var(--u-muted)}\n.u-r-prev-ev .u-r-ptxt,.u-r-prev-ev .u-r-pico{color:var(--u-muted);font-style:italic}\n.u-r-ptxt{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}\n.u-r-hosttags{flex:1 0 100%;display:flex;flex-wrap:wrap;gap:4px;padding:0 12px 10px 72px;margin-top:-6px}\n.u-tag-connect{cursor:pointer;font:inherit;font-size:12px;font-weight:600;line-height:inherit}\n.u-tag-connect:hover{border-color:var(--u-highlight);color:var(--u-highlight);background:var(--u-highlight-soft)}\n.u-r-quick{flex:1 0 100%;display:flex;justify-content:flex-end;align-items:center;min-width:0;padding:0 12px 10px 72px}\n.u-qsend{display:inline-flex;align-items:center;gap:6px;max-width:100%;border:1px solid var(--u-highlight);background:var(--u-highlight);color:#fff;border-radius:999px;padding:4px 11px;font-size:12px;font-weight:600;min-height:26px}\n.u-qsend:hover:not(:disabled){filter:brightness(1.08)}\n/* Bulk generate states in the quick-send slot (native: Generating\u2026 / Generation failed) */\n.u-qsend.u-qsend-bulk{background:var(--u-surface-2);border-color:var(--u-border);color:var(--u-muted);cursor:default}\n.u-qsend-busy svg{width:12px;height:12px}\n/* Bulk generate sheet (native BulkGenerateModal) */\n.u-bulk-head{display:flex;align-items:flex-start;gap:10px;margin-bottom:6px}\n.u-bulk-spark{color:var(--u-highlight);display:grid;place-items:center;padding-top:9px}\n.u-bulk-spark svg{width:18px;height:18px}\n.u-bulk-titles{flex:1;min-width:0}\n.u-bulk-titles h3{margin:4px 0 2px;font-size:18px}\n.u-bulk-sub{margin:0;font-size:13.5px;color:var(--u-muted)}\n.u-bulk-sub .u-linkbtn{font-size:13px}\n.u-bulk-sec{margin-top:14px}\n.u-bulk-sechead{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}\n.u-bulk-sechead .u-linkbtn{font-size:13px}\n.u-bulk-label{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--u-muted)}\n.u-bulk-chips{display:flex;flex-wrap:wrap;gap:6px;max-height:180px;overflow:auto;padding:2px}\n.u-bulk-empty{font-size:13px;color:var(--u-muted)}\n.u-bulk-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--u-border);background:var(--u-bg);border-radius:999px;padding:3px 10px 3px 3px;font-size:13px;color:var(--u-muted);min-height:30px;max-width:100%}\n.u-bulk-chip-on{border-color:var(--u-highlight);background:var(--u-highlight-soft);color:var(--u-text)}\n.u-bulk-av{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:10px;font-weight:700;flex:none}\n.u-bulk-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n.u-bulk-meta{font-size:11px;color:var(--u-muted)}\n.u-bulk-prompt{width:100%;box-sizing:border-box;border:1px solid var(--u-border);border-radius:10px;padding:10px 12px;font:inherit;font-size:14px;color:var(--u-text);background:var(--u-bg);resize:vertical}\n.u-bulk-prompt:focus{outline:none;border-color:var(--u-accent)}\n.u-bulk-hist{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:8px}\n.u-bulk-histlabel{font-size:12px;color:var(--u-muted)}\n.u-bulk-histbtn{border:1px solid var(--u-border);background:var(--u-surface-2);border-radius:999px;padding:3px 10px;font-size:12px;color:var(--u-text);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n.u-bulk-foot{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}\n.u-bulk-go{display:inline-flex;align-items:center;gap:6px}\n.u-bulk-go svg{width:14px;height:14px}\n/* Gold shimmer ring on a ready quick reply, same as the draft cells. Countdown, sending, sent and error states drop it. */\n.u-qsend{position:relative}\n.u-qsend:not(.u-qsend-count):not(.u-qsend-sending):not(.u-qsend-sent):not(.u-qsend-err):not(:disabled)::before{content:\"\";position:absolute;inset:-2px;border-radius:999px;padding:2px;pointer-events:none;background:linear-gradient(110deg,var(--u-gold) 0%,var(--u-gold-hi) 25%,var(--u-gold) 50%,var(--u-gold-hi) 75%,var(--u-gold) 100%);background-size:250% 100%;animation:u-shimmer 3.2s linear infinite;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude}\n.u-qsend svg{width:12px;height:12px;flex:none}\n.u-qsend-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n.u-qsend-count{border-color:var(--u-warn);background:color-mix(in srgb,var(--u-warn) 12%,transparent);color:var(--u-warn)}\n.u-qsend-sent{border-color:var(--u-accent);background:var(--u-accent);color:var(--u-accent-ink)}\n.u-qsend-err{border-color:var(--u-danger);color:var(--u-danger);background:transparent}\n.u-qsend:disabled{opacity:.9}\n/* delivery receipts */\n.u-rcpt{display:inline-flex;align-items:center;margin-left:4px;color:var(--u-muted)}\n.u-rcpt svg{width:13px;height:13px}\n.u-rcpt-ok{color:var(--u-highlight)}\n.u-rcpt-bad{color:var(--u-danger)}\n/* inline reply drafts under the latest client message */\n.u-inl{align-self:flex-start;max-width:78%;display:flex;flex-direction:column;gap:6px;margin-top:2px}\n.u-inl-h{display:flex;align-items:center;gap:4px}\n.u-inl-toggle{display:inline-flex;align-items:center;gap:6px;border:0;background:transparent;color:var(--u-muted);font-size:12px;font-weight:600;padding:2px 6px;border-radius:6px;min-height:24px}\n.u-inl-toggle:hover{background:var(--u-surface-3);color:var(--u-text)}\n.u-inl-notnow{border:0;background:transparent;color:var(--u-muted);font-size:12px;padding:2px 6px;min-height:24px;border-radius:6px}\n.u-inl-notnow:hover{color:var(--u-text);background:var(--u-surface-3)}\n.u-inl-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;width:100%}\n.u-inl-cell{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0;border:1px solid var(--u-border);background:var(--u-bg);border-radius:12px;padding:7px 10px;text-align:left;color:var(--u-text)}\n/* Gold shimmer ring, same as the composer's draft cells. Reduced motion leaves a still ring. */\n.u-inl-cell::before{content:\"\";position:absolute;inset:-1px;border-radius:13px;padding:1.5px;pointer-events:none;background:linear-gradient(110deg,var(--u-gold) 0%,var(--u-gold-hi) 25%,var(--u-gold) 50%,var(--u-gold-hi) 75%,var(--u-gold) 100%);background-size:250% 100%;animation:u-shimmer 3.2s linear infinite;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude}\n.u-inl-cell:hover{border-color:var(--u-highlight)}\n.u-inl-txt{font-size:13px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}\n/* Item action row (native InlineDrafts): under client messages, and inside activity cards. */\n.u-ia{align-self:flex-start;width:78%;display:flex;flex-direction:column;gap:6px;margin-top:2px}\n.u-ev .u-ia{width:100%;margin-top:6px}\n.u-ev>div{flex:1}\n.u-ev>div{min-width:0}\n.u-ev .u-ia svg{width:13px;height:13px;margin-top:0}\n.u-ia-h{display:flex;flex-wrap:wrap;align-items:center;gap:2px;margin-left:-6px}\n.u-ia-h .u-inl-toggle svg{width:13px;height:13px}\n.u-ia-ai{display:flex;flex-direction:column;gap:6px;border:1px solid var(--u-border);background:var(--u-bg);border-radius:12px;padding:10px;min-width:min(420px,100%)}\n.u-ia-ai-label{font-size:12.5px;font-weight:700}\n.u-ia-ai-hint{font-size:12px;color:var(--u-muted)}\n.u-ia-ai-note{font-size:12px;color:var(--u-warn);background:color-mix(in srgb,var(--u-warn) 10%,transparent);border-radius:8px;padding:6px 8px}\n.u-ia-ai textarea{font:inherit;font-size:13.5px;color:var(--u-text);background:var(--u-surface-2);border:1px solid var(--u-border);border-radius:8px;padding:8px 10px;resize:vertical;min-height:64px}\n.u-ia-ai-row{display:flex;align-items:center;gap:10px;font-size:12px}\n.u-ia-ai-count{color:var(--u-muted);font-variant-numeric:tabular-nums}\n.u-ia-ai-err{color:var(--u-danger)}\n.u-cx-h4{display:flex;align-items:center;gap:6px}\n.u-cx-info{display:inline-grid;place-items:center;width:22px;height:22px;border:0;border-radius:999px;background:transparent;color:var(--u-muted);padding:0;cursor:pointer}\n.u-cx-info:hover{color:var(--u-highlight);background:var(--u-highlight-soft)}\n.u-cx-info svg{width:15px;height:15px}\n.u-cx-head{display:flex;align-items:center;gap:10px}\n.u-cx-mark{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:999px;color:#fff;flex:none}\n.u-cx-rule{margin:10px 0}\n.u-cx-rule h4{margin:0 0 3px;font-size:14px}\n.u-cx-rule p{margin:0;font-size:13.5px;line-height:1.5;color:var(--u-muted)}\n.u-cx-sec{display:block;margin-top:14px;font-size:13px;font-weight:600}\n.u-cx-mocks{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:8px 0 10px}\n.u-cx-col{display:flex;flex-direction:column;gap:4px;min-width:0}\n.u-cx-label{font-size:11.5px;font-weight:500;color:var(--u-muted)}\n.u-cx-phone{border:1px solid var(--u-border);border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:8px;min-height:120px}\n.u-cx-coach{background:var(--u-surface-2)}\n.u-cx-coach-bub{align-self:flex-end;max-width:95%;background:var(--u-highlight);color:#fff;border-radius:12px;border-bottom-right-radius:4px;padding:8px 10px;font-size:12px;line-height:1.45}\n.u-cx-tpl{display:inline-block;margin-top:6px;padding:2px 8px;border-radius:999px;background:rgba(255,255,255,.22);font-size:10px;font-weight:500}\n.u-cx-client{background:#e5ddd5;border-color:#d5cdc4}\n.u-cx-client-bub{align-self:flex-start;max-width:95%;background:#fff;color:#1c1c1e;border-radius:12px;border-top-left-radius:4px;padding:8px 10px;font-size:12px;line-height:1.45;box-shadow:0 1px 1px rgba(0,0,0,.08)}\n.u-cx-link{display:block;margin-top:6px;color:#027eb5;font-weight:500}\n.u-cx-meta{font-size:10px;color:var(--u-muted);text-align:center;margin-top:auto}\n.u-cx-client .u-cx-meta{color:#7a7269}\n.u-cx-foot{font-size:12px;line-height:1.5;color:var(--u-muted)}\n.u-offer-who{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--u-muted);margin:2px 0 8px}\n.u-offer-avs{display:inline-flex}\n.u-offer-avs .u-av{border:2px solid var(--u-bg);margin-left:-6px}\n.u-offer-avs .u-av:first-child{margin-left:0}\n.u-offer-list{list-style:none;margin:10px 0;padding:0;display:flex;flex-direction:column;gap:7px;font-size:13.5px}\n.u-offer-list li{display:flex;gap:8px;align-items:flex-start}\n.u-offer-tick{display:inline-flex;color:var(--u-accent);flex:none;margin-top:2px}\n.u-offer-tick svg{width:15px;height:15px}\n.u-ai-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}\n.u-ai-plan{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border:1px solid var(--u-border);border-radius:10px;padding:8px 11px;font-size:13px;margin:0 0 10px}\n.u-ai-plan .u-linkbtn{font-size:13px}\n.u-ai-err{color:var(--u-danger,#b42318);font-size:12.5px;width:100%}\n.u-ai-disclaimer{display:flex;gap:8px;align-items:flex-start;background:var(--u-highlight-soft);border-radius:10px;padding:9px 11px;font-size:12.5px;line-height:1.45;margin:6px 0 10px}\n.u-ai-disclaimer svg{width:15px;height:15px;flex:none;margin-top:2px;color:var(--u-highlight)}\n.u-ai-tabs{display:flex;flex-wrap:wrap;gap:4px;border-bottom:1px solid var(--u-border);margin-bottom:10px}\n.u-ai-tab{border:0;background:transparent;padding:7px 10px;font-size:13px;font-weight:600;color:var(--u-muted);border-bottom:2px solid transparent;margin-bottom:-1px;border-radius:0}\n.u-ai-tab-on{color:var(--u-text);border-bottom-color:var(--u-highlight)}\n.u-ai-body{display:flex;flex-direction:column;gap:14px}\n.u-ai-sec{display:flex;flex-direction:column;gap:6px}\n.u-ai-sec h4{margin:0;font-size:14px}\n.u-ai-area,.u-ai-input{font:inherit;font-size:13.5px;color:var(--u-text);background:var(--u-surface-2);border:1px solid var(--u-border);border-radius:8px;padding:8px 10px;width:100%;box-sizing:border-box}\n.u-ai-area{resize:vertical}\n.u-ai-form{display:flex;flex-direction:column;gap:6px;border:1px solid var(--u-border);border-radius:10px;padding:10px}\n.u-ai-form label{font-size:12.5px;font-weight:700}\n.u-ai-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}\n.u-ai-list li{border:1px solid var(--u-border);border-radius:10px;padding:8px 10px;display:flex;flex-direction:column;gap:3px}\n.u-ai-item-head{display:flex;align-items:center;gap:6px;font-size:13px}\n.u-ai-tags{display:flex;flex-wrap:wrap;gap:4px}\n.u-ai-learned{display:grid;grid-template-columns:max-content 1fr;gap:6px 14px;margin:8px 0 0;font-size:13.5px}\n.u-ai-learned dt{font-weight:700;color:var(--u-muted)}\n.u-ai-learned dd{margin:0}\n.u-ai-k{font-size:11.5px;font-weight:700;color:var(--u-muted);text-transform:uppercase;letter-spacing:.04em}\n.u-ai-v{font-size:13.5px;white-space:pre-wrap}\n.u-ai-locked{border:1px dashed var(--u-border);border-radius:10px;padding:12px;font-size:13px;color:var(--u-muted)}\n.u-ai-locked strong{color:var(--u-text)}\n.u-ai-field{display:flex;flex-direction:column;gap:3px;margin-top:10px}\n.u-ai-field textarea{font:inherit;font-size:13.5px;color:var(--u-text);background:var(--u-surface-2);border:1px solid var(--u-border);border-radius:8px;padding:8px 10px;resize:vertical}\n.u-ai-labelrow{display:flex;justify-content:space-between;gap:8px;font-size:13px;font-weight:700}\n.u-ai-sub{margin-top:16px!important;font-size:12.5px;font-weight:700;color:var(--u-muted)}\n.u-ai-ok{color:var(--u-accent);font-size:13px;font-weight:600}\n.u-ai-more{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin-top:16px;padding-top:12px;border-top:1px solid var(--u-border);font-size:13px;color:var(--u-muted)}\n.u-ia-save{border:1px solid var(--u-accent);background:var(--u-accent);color:var(--u-accent-ink);border-radius:8px;padding:5px 12px;font-weight:600;font-size:13px;min-height:30px}\n.u-ia-save:disabled{opacity:.5}\n/* WhatsApp closed window */\n.u-wa{display:flex;gap:8px;align-items:flex-start;padding:8px 12px;border-radius:9px;background:color-mix(in srgb,var(--u-warn) 10%,var(--u-bg));border:1px solid color-mix(in srgb,var(--u-warn) 35%,transparent);font-size:13px;line-height:1.4}\n.u-wa-ico{display:inline-flex;color:var(--u-warn);flex:none;margin-top:2px}.u-wa-ico svg{width:14px;height:14px}\n.u-wa-body{min-width:0}\n.u-wa-more{display:inline-flex;align-items:center;gap:2px;border:0;background:transparent;color:var(--u-link);font-weight:600;font-size:12.5px;padding:0 4px;min-height:0;margin-left:4px}\n.u-wa-more svg{width:12px;height:12px}\n.u-wa-why{margin:6px 0 0;color:var(--u-muted);font-size:12.5px}\n.u-ghost{display:flex;flex-direction:column;align-items:flex-end;gap:2px;opacity:.7}\n.u-ghost-bub{border:1px dashed color-mix(in srgb,var(--u-out-ink) 50%,transparent);background:color-mix(in srgb,var(--u-out) 60%,transparent)}\n.u-ghost-cut{font-weight:700}\n/* beginning of history */\n.u-hist-start{align-self:center;font-size:12px;color:var(--u-muted);padding:4px 0}\n/* header badges */\n.u-chan-badge{display:inline-flex;align-items:center;justify-content:center;position:absolute;right:-2px;bottom:-2px;width:16px;height:16px;border-radius:50%;color:#fff;border:2px solid var(--u-bg);box-sizing:content-box}\n.u-chan-wa{background:#25d366}\n.u-chan-sms{background:var(--u-highlight)}\n.u-r-av{grid-row:span 3;align-self:start}\n.u-r-av .u-av{grid-row:auto}\n.u-av-wrap{position:relative;display:inline-flex;flex:none}\n.u-head-status{margin-left:4px}\n/* attachments on thread messages */\n.u-att{display:flex;flex-wrap:wrap;gap:6px;max-width:78%}\n.u-att-out{align-self:flex-end;justify-content:flex-end}.u-att-in{align-self:flex-start}\n.u-att-img{border:0;background:none;padding:0;min-height:0;cursor:zoom-in}\n.u-att-img img{display:block;max-width:220px;max-height:220px;border-radius:12px;border:1px solid var(--u-border)}\n.u-att-desc{display:block;font-size:12px;color:var(--u-muted);max-width:220px}\n.u-att-video{display:block;max-width:280px;max-height:320px;border-radius:12px;background:#000;object-fit:contain}\n.u-att-audio{display:flex;flex-direction:column;gap:4px;max-width:300px}\n.u-att-player{width:100%;max-width:300px}\n.u-att-trans{font-size:13px;color:var(--u-muted);font-style:italic}\n.u-lightbox{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.85);display:grid;place-items:center;padding:24px}\n.u-lightbox img{max-width:100%;max-height:100%;border-radius:8px}\n.u-lightbox-x{position:absolute;top:16px;right:16px;width:40px;height:40px;border-radius:999px;border:0;background:rgba(255,255,255,.15);color:#fff;display:grid;place-items:center}\n.u-lightbox-x svg{width:18px;height:18px}\n.u-att-file{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:var(--u-bg);border:1px solid var(--u-border);font-size:13px;color:var(--u-link);text-decoration:none}\n.u-att-file svg{width:14px;height:14px}\n.u-editor{width:100%;border:1px solid var(--u-border);border-radius:var(--u-radius);padding:10px 12px;min-height:64px;font:inherit;font-size:14.5px;background:var(--u-bg);color:var(--u-text);resize:vertical}\n.u-editor::placeholder{color:var(--u-muted)}\n.u-editor-rich{min-height:64px;max-height:220px;overflow-y:auto;white-space:normal;word-break:break-word;line-height:1.5}\n.u-editor-rich:empty::before{content:attr(data-placeholder);color:var(--u-muted);pointer-events:none}\n.u-editor-rich[aria-disabled=\"true\"]{opacity:.6}\n/* Draft pills, ported from native: one per clause, hue hashed from the text, \u00D7 drops it. */\n/* Pills keep the suggested draft's greyed text until the coach touches one: clicked or typed-in pills turn white (native #633). */\n.u-seg{display:inline;padding:1px 3px;margin:0 2px 0 0;border-radius:6px;border:1px solid var(--u-highlight-soft);background:var(--u-surface-2);color:var(--u-muted);line-height:1.9;-webkit-box-decoration-break:clone;box-decoration-break:clone;transition:background .15s,color .15s,border-color .15s}\n.u-seg.touched{background:var(--u-bg);color:var(--u-text)}\n.u-seg.active{background:var(--u-bg);color:var(--u-text);border-color:var(--u-highlight)}\n/* Suggested draft: Uplift's words, softened, until the coach engages. */\n.u-editor-sugg{cursor:text;display:flex;flex-direction:column;gap:2px}\n.u-pill .u-editor-sugg,.u-editor-sugg{background:var(--u-surface-2);border-radius:10px}\n.u-editor-sugg:focus-visible{outline:2px solid var(--u-highlight);outline-offset:1px}\n.u-sugg-label{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--u-highlight)}\n.u-sugg-label i{width:7px;height:7px;border-radius:50%;background:currentColor;display:inline-block}\n.u-sugg-label em{font-style:normal;font-weight:400;color:var(--u-muted)}\n.u-sugg-text{color:var(--u-muted)}\n/* Stock intro: no pill highlight, the text itself shimmers gold (gradient clipped to the glyphs). Reduced motion leaves a still gold gradient. */\n.u-seg-lock{cursor:default;user-select:text;padding:0;margin:0;border:0;border-radius:0;font-weight:600;background:linear-gradient(110deg,var(--u-gold-ink) 0%,var(--u-gold-ink-hi) 30%,var(--u-gold-ink) 50%,var(--u-gold-ink-hi) 70%,var(--u-gold-ink) 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:u-shimmer 4s linear infinite}\n.u-seg-lock:hover{opacity:1}\n.u-seg-x{display:inline-flex;align-items:center;justify-content:center;margin-left:2px;min-width:24px;min-height:24px;cursor:pointer;font-size:14px;color:var(--u-muted);border-radius:6px;line-height:1;vertical-align:middle;user-select:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent}\n.u-seg-x:hover,.u-seg-x:active,.u-seg-x:focus-visible{color:var(--u-text);background:var(--u-border);outline:none}\n.u-editor:disabled{opacity:.6}\n.u-send{border:0;background:var(--u-accent);color:var(--u-accent-ink);font-weight:700;border-radius:9px;padding:8px 16px;min-height:40px}\n.u-send:disabled{opacity:.45}\n.u-gen{border:1px solid var(--u-border);background:var(--u-bg);border-radius:9px;padding:8px 14px;font-weight:600;min-height:40px}\n.u-gen:disabled{opacity:.5}\n.u-note{margin-top:8px;border-radius:9px;padding:9px 12px;font-size:13.5px;display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center}\n.u-note-err{background:color-mix(in srgb,var(--u-danger) 9%,var(--u-bg));border:1px solid color-mix(in srgb,var(--u-danger) 35%,transparent)}\n.u-note-warn{background:color-mix(in srgb,var(--u-warn) 10%,var(--u-bg));border:1px solid color-mix(in srgb,var(--u-warn) 35%,transparent)}\n.u-note-ok{background:var(--u-highlight-soft)}\n.u-banner{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:10px 16px;font-size:14px;border-bottom:1px solid var(--u-border);background:var(--u-accent-soft)}\n.u-headbtn{border:1px solid var(--u-border);background:var(--u-bg);border-radius:8px;padding:6px 11px;font-size:14px;font-weight:600;min-height:34px}\n.u-headbtn:disabled{opacity:.5}\n.u-connect{margin-left:4px;display:inline-flex;align-items:center;gap:7px;flex:none}\n.u-hostlink{margin-left:4px;display:inline-flex;align-items:center;gap:6px;flex:none;text-decoration:none;color:var(--u-text);white-space:nowrap}\n.u-hostlink-icon{width:18px;height:18px;object-fit:contain;flex:none}\n.u-ev-open{margin-top:8px;display:flex}\n.u-ev-open .u-hostlink{margin-left:0}\n.u-ia-extra{display:inline-flex;margin-left:4px}\n.u-ia-extra .u-hostlink{margin-left:0;border:0;background:transparent;color:var(--u-muted);font-size:12px;font-weight:600;padding:2px 6px;border-radius:6px;min-height:24px;gap:5px}\n.u-ia-extra .u-hostlink:hover{background:var(--u-surface-3);color:var(--u-text)}\n.u-ia-extra .u-hostlink-icon{width:14px;height:14px}\n/* AI settings + full screen: the right end of the conversation header (no panel header row). */\n.u-head-acts{margin-left:auto;display:inline-flex;align-items:center;gap:6px;flex:none}\n.u-chan ~ .u-head-acts{margin-left:6px}\n.u-pane-head-empty{justify-content:flex-end;min-height:62px;box-sizing:border-box}\n/* On wide panels the toolbar leaves them to the conversation header. */\n.u-toolbar-acts{display:none}\n.u-toolbar .u-addbtn{flex:none;margin-left:auto}\n.u-connect svg{flex:none}\n.u-example{width:100%;border:1px dashed var(--u-border);border-radius:12px;padding:12px;background:var(--u-surface-2);display:flex;flex-direction:column}\n.u-ex-lab{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--u-muted);margin-bottom:6px}\n.u-sheet-wrap{position:absolute;inset:0;background:rgba(10,10,10,.45);display:grid;place-items:center;padding:16px;z-index:5}\n.u-sheet{width:min(560px,100%);max-height:100%;overflow:auto;background:var(--u-bg);color:var(--u-text);border:1px solid var(--u-border);border-radius:16px;box-shadow:0 18px 50px rgba(0,0,0,.25);padding:20px;outline:none}\n.u-eyebrow{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--u-muted)}\n.u-sheet h3{font-size:21px;margin:6px 0 8px}\n.u-lede{font-size:14.5px;color:var(--u-muted)}\n.u-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;align-items:center}\n.u-secondary{border:1px solid var(--u-border);background:var(--u-bg);border-radius:9px;padding:8px 14px;font-weight:600;min-height:40px}\n.u-steps{display:flex;gap:6px;margin-bottom:12px}\n.u-steps span{flex:1;height:4px;border-radius:999px;background:var(--u-surface-3)}\n.u-steps span.u-on{background:var(--u-highlight)}\n.u-plan{margin-top:14px;border:1px solid var(--u-highlight);border-radius:12px;padding:14px;background:var(--u-highlight-soft)}\n.u-plan-name{font-weight:700;font-size:15px}\n.u-plan-price{font-size:30px;font-weight:700;margin-top:2px}\n.u-plan-price small{font-size:15px;font-weight:500;color:var(--u-muted)}\n.u-plan-vs{font-size:13.5px;color:var(--u-muted)}\n.u-feats{margin:12px 0 0;padding-left:18px;font-size:14px}\n.u-feats li{margin:3px 0}\n.u-chanbox{margin-top:12px;border:1px solid var(--u-border);border-radius:12px;padding:11px 13px}\n.u-chanbox h4{font-size:15px}\n.u-chanbox p{font-size:14px;margin-top:4px;color:var(--u-text)}\n.u-tick{display:flex;gap:10px;align-items:flex-start;margin-top:12px;font-size:14.5px}\n.u-tick input{width:20px;height:20px;margin-top:1px;accent-color:var(--u-highlight)}\n.u-field{margin-top:12px;display:flex;flex-direction:column;gap:5px}\n.u-field>label,.u-field>span:first-child{font-size:13.5px;font-weight:600}\n.u-field select{border:1px solid var(--u-border);background:var(--u-bg);color:var(--u-text);border-radius:9px;padding:9px 11px;font:inherit;min-height:42px}\n.u-field input{border:1px solid var(--u-border);background:var(--u-bg);color:var(--u-text);border-radius:9px;padding:9px 11px;font:inherit;min-height:42px}\n.u-field input[aria-invalid=\"true\"]{border-color:var(--u-danger)}\n.u-hint{font-size:13px;color:var(--u-muted)}\n.u-err{font-size:13px;color:var(--u-danger)}\n.u-chanpick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}\n.u-chanpick button{border:1px solid var(--u-border);background:var(--u-bg);border-radius:10px;padding:9px;text-align:left;min-height:56px}\n.u-chanpick button[aria-checked=\"true\"]{border-color:var(--u-highlight);box-shadow:0 0 0 1px var(--u-highlight)}\n.u-chanpick b{display:block;font-size:14.5px}\n.u-chanpick small{font-size:12.5px;color:var(--u-muted)}\n@media (prefers-reduced-motion:reduce){.uplift *{transition:none!important;animation:none!important}}\n@container panel (max-width:759px){\n .u-cx-mocks{grid-template-columns:1fr}\n .u-inl-grid{grid-template-columns:1fr}\n .u-ia{width:100%}\n .u-split{grid-template-columns:1fr;height:min(80vh,720px)}\n .u-split.u-show-thread .u-list{display:none}\n .u-split:not(.u-show-thread) .u-pane{display:none}\n .u-back{display:inline-flex}\n .u-toolbar-acts{display:inline-flex;flex:none;margin-left:auto}\n .u-toolbar-acts .u-head-acts{margin-left:0}\n /* Phone widths: the toolbar wraps its buttons rather than cutting them off; the conversation header\n keeps name, Connect and the buttons on one line by dropping the phone number and Connect's label. */\n .u-toolbar{flex-wrap:wrap;row-gap:6px}\n .u-sortgroup button{padding:4px 7px}\n .u-pane-head{gap:8px;padding:10px 12px}\n .u-pane-head .u-chan{display:none}\n .u-who{flex:0 1 auto}\n .u-who strong,.u-who small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n .u-connect{padding:6px 9px}\n .u-connect span{display:none}\n /* The host link stays, compact; the name keeps room to show. */\n .u-who{min-width:72px}\n .u-pane-head .u-hostlink{padding:6px 9px;font-size:13px}\n /* With a host link there may not be room for everything: the panel's buttons wrap to a second line rather than run off the edge. */\n .u-pane-head{flex-wrap:wrap;row-gap:6px}\n .u-ag-grid{grid-template-columns:1fr}\n .u-c-actions .u-meta{flex-basis:100%}\n .u-sheet-wrap{padding:0}\n .u-sheet{width:100%;height:100%;border-radius:0}\n}\n";
12
+ export declare const upliftStyles = "\n:where(.uplift){\n --u-bg:#ffffff;--u-surface:#ffffff;--u-surface-2:#fafafa;--u-surface-3:#f4f4f5;\n --u-text:#262626;--u-muted:#666666;--u-border:rgba(0,0,0,.08);\n --u-accent:#0f8a63;--u-accent-soft:#e3f5ee;--u-accent-ink:#ffffff;--u-link:#0b6b4c;\n --u-highlight:var(--u-accent);--u-highlight-soft:var(--u-accent-soft);\n --u-gold:#c9971c;--u-gold-hi:#f7e2a0;--u-gold-ink:#8a6410;--u-gold-ink-hi:#c9971c;\n --u-seg-l:88%;\n --u-danger:#c10007;--u-warn:#bb4d00;--u-out:#eaf1ff;--u-out-ink:#12244d;\n --u-font:-apple-system,BlinkMacSystemFont,\"Segoe UI\",Inter,sans-serif;--u-radius:10px;\n}\n:where(.uplift[data-theme=\"dark\"],[data-theme=\"dark\"] .uplift){\n --u-bg:#111111;--u-surface:#111111;--u-surface-2:#0a0a0a;--u-surface-3:#1a1a1a;\n --u-text:#f5f5f5;--u-muted:#9a9a9a;--u-border:rgba(255,255,255,.08);\n --u-accent:#70d7b0;--u-accent-soft:#17342a;--u-accent-ink:#062a1e;--u-link:#70d7b0;\n --u-gold:#d9a830;--u-gold-hi:#fff1b8;--u-gold-ink:#d9a830;--u-gold-ink-hi:#f3d47a;\n --u-seg-l:26%;\n --u-danger:#ff6467;--u-warn:#ffb900;--u-out:#1d2b4a;--u-out-ink:#e3ebff;\n}\n.uplift,.uplift *,.uplift *::before,.uplift *::after{box-sizing:border-box}\n.uplift{font:15px/1.45 var(--u-font);color:var(--u-text);background:var(--u-bg);border:1px solid var(--u-border);border-radius:14px;overflow:hidden;container-type:inline-size;container-name:panel;position:relative;-webkit-font-smoothing:antialiased}\n:where(.uplift) button{font:inherit;color:inherit;cursor:pointer}\n:where(.uplift) button:disabled{cursor:not-allowed}\n.uplift :focus-visible{outline:2px solid var(--u-highlight);outline-offset:2px;border-radius:6px}\n.uplift h2,.uplift h3,.uplift h4,.uplift p{margin:0}\n.u-sp{flex:1}\n.u-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}\n.u-pill{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--u-border);background:var(--u-surface-2);border-radius:999px;padding:4px 10px;font-size:13px;color:var(--u-muted)}\n.u-pill b{color:var(--u-text);font-weight:600}\n.u-linkbtn{background:none;border:0;padding:4px 2px;color:var(--u-link);font-weight:600;text-decoration:underline;text-underline-offset:3px}\n.u-split{display:grid;grid-template-columns:320px minmax(0,1fr);height:min(max(520px,62.5cqw),86vh)}\n.u-split>*{min-height:0}\n.u-list{overflow:hidden}\n.u-pane{overflow:hidden}\n.u-iconbtn{display:inline-grid;place-items:center;width:34px;height:34px;border:1px solid var(--u-border);background:var(--u-bg);border-radius:8px;color:var(--u-muted);padding:0}\n.u-iconbtn:hover{color:var(--u-text)}\n.u-iconbtn-pair{width:auto;padding:0 9px;display:inline-flex;align-items:center;gap:4px}\n.u-ai-spark{display:inline-flex;color:var(--u-highlight)}\n.u-iconbtn .u-ai-spark svg{width:14px;height:14px}\n.u-iconbtn svg{width:16px;height:16px}\n.u-iconbtn[aria-pressed=\"true\"]{color:var(--u-text);background:var(--u-surface-2)}\n.u-bulkbtn svg{width:16px;height:16px}\n.uplift.u-full{position:fixed;inset:0;z-index:2147483000;border-radius:0;border:0;display:flex;flex-direction:column}\n.uplift.u-full .u-split{flex:1;height:auto;min-height:0}\n.u-back{display:none;border:1px solid var(--u-border);background:var(--u-bg);border-radius:8px;padding:6px 10px;font-size:16px;min-height:36px;align-items:center;flex:none}\n.u-list{border-right:1px solid var(--u-border);display:flex;flex-direction:column;min-width:0}\n/* inbox toolbar: native Uplift's collapsed search + segmented sort + Bulk generate */\n.u-toolbar{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--u-border)}\n.u-search{position:relative;flex:0 1 32px;min-width:32px;display:flex;align-items:center;cursor:pointer;transition:flex-basis .2s ease,flex-grow .2s ease}\n.u-search-open{flex:1 1 140px;cursor:auto}\n.u-search svg{position:absolute;left:9px;width:14px;height:14px;color:var(--u-muted);pointer-events:none}\n.u-search input{width:100%;min-height:32px;padding:6px 10px 6px 30px;border-radius:999px;border:1px solid var(--u-border);background:var(--u-surface-2);font:inherit;font-size:13px;color:var(--u-text)}\n.u-search:not(.u-search-open) input{cursor:pointer;padding-right:0}\n.u-search:not(.u-search-open) input::placeholder{opacity:0}\n.u-search input:focus{outline:none;border-color:var(--u-accent);background:var(--u-bg)}\n.u-search input::-webkit-search-cancel-button{cursor:pointer}\n.u-sortgroup{display:inline-flex;align-items:center;padding:2px;border-radius:999px;background:var(--u-surface-2);flex:none}\n.u-sortgroup button{border:0;background:none;border-radius:999px;padding:4px 9px;font-size:12px;font-weight:600;color:var(--u-muted);min-height:28px;white-space:nowrap}\n.u-sortgroup button:hover{color:var(--u-text)}\n.u-sortgroup button[aria-pressed=\"true\"]{background:var(--u-bg);color:var(--u-text);box-shadow:0 1px 2px rgba(0,0,0,.08),0 0 0 1px var(--u-border)}\n/* Bulk generate is a frozen row: it stays at the bottom of the list while the clients scroll above it. */\n.u-rows li.u-bulkrow{position:sticky;bottom:0;z-index:1;margin-top:auto;border-bottom:0;border-top:1px solid var(--u-border);background:var(--u-bg);padding:10px 12px}\n.u-bulkrow .u-bulkbtn{display:inline-flex;align-items:center;justify-content:center;gap:2px;width:100%;border:1px dashed var(--u-border);border-radius:10px;background:none;color:var(--u-muted);padding:10px 12px;min-height:44px;font:inherit;font-size:15px;font-weight:600;cursor:pointer}\n.u-bulkrow .u-bulkbtn span{margin-left:6px}\n.u-bulkrow .u-bulkbtn:hover:not(:disabled){color:var(--u-accent);border-color:var(--u-accent);background:var(--u-surface-2)}\n.u-bulkrow .u-bulkbtn:disabled{opacity:.45;cursor:not-allowed}\n.u-clear-btn{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;min-height:0;padding:0;flex:none;border-radius:999px;border:0;background:none;color:var(--u-muted);cursor:pointer}\n.u-clear-btn svg{width:15px;height:15px}\n.u-clear-btn:hover:not(:disabled){color:var(--u-text);background:var(--u-surface-2)}\n.u-clear-btn:disabled{opacity:.4;cursor:not-allowed}\n.u-rows{list-style:none;margin:0;padding:0;overflow:auto;flex:1;min-height:0;display:flex;flex-direction:column}\n.u-rows li{display:flex;flex-wrap:wrap;align-items:stretch;border-bottom:1px solid var(--u-border)}\n.u-row-open{flex:1;min-width:0;text-align:left;border:0;background:transparent;padding:11px 12px;display:grid;grid-template-columns:36px minmax(0,1fr);gap:2px 10px;min-height:64px}\n.u-av{grid-row:span 3;width:36px;height:36px;border-radius:999px;display:grid;place-items:center;font-size:13px;font-weight:700;color:#fff}\n.u-av.u-av-sm{grid-row:auto;width:32px;height:32px}\n.u-r-top{display:flex;gap:6px;align-items:baseline;min-width:0}\n.u-r-name{font-weight:600;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n.u-r-time{margin-left:auto;font-size:12.5px;color:var(--u-muted);flex:none}\n.u-r-chev{display:none;flex:none;align-self:center;margin-left:-2px;color:var(--u-muted)}.u-r-chev svg{width:15px;height:15px}\n.u-r-line{font-size:13.5px;color:var(--u-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n.u-r-tags{display:flex;flex-wrap:wrap;gap:4px}\n.u-tag{font-size:12px;font-weight:600;border-radius:999px;padding:1px 8px;border:1px solid var(--u-border);color:var(--u-muted);background:var(--u-surface-2)}\n.u-tag.u-need{color:var(--u-danger);border-color:color-mix(in srgb,var(--u-danger) 35%,transparent)}\n.u-tag.u-ok{color:var(--u-link);border-color:color-mix(in srgb,var(--u-highlight) 35%,transparent)}\n.u-tag.u-warn{color:var(--u-warn);border-color:color-mix(in srgb,var(--u-warn) 35%,transparent)}\n.u-list-foot{padding:10px 12px;font-size:13px;color:var(--u-muted)}\n.u-skel{height:12px;border-radius:6px;background:var(--u-surface-3);margin:6px 0}\n.u-skel-row{padding:14px 12px;border-bottom:1px solid var(--u-border)}\n.u-state{padding:22px 16px;display:flex;flex-direction:column;gap:8px;align-items:flex-start;font-size:14.5px;color:var(--u-muted)}\n.u-state h3{font-size:16px;color:var(--u-text)}\n.u-state p{max-width:52ch}\n.u-pane{display:flex;flex-direction:column;min-width:0}\n.u-pane-head{display:flex;align-items:center;gap:10px;padding:11px 16px;border-bottom:1px solid var(--u-border)}\n.u-who{display:flex;flex-direction:column;min-width:0}\n.u-who strong{font-size:15px}\n.u-who small{font-size:13px;color:var(--u-muted)}\n.u-chan{margin-left:auto;font-size:13px;color:var(--u-muted)}\n.u-feed{flex:1;overflow:auto;padding:14px 16px;display:flex;flex-direction:column;gap:8px;background:var(--u-surface-2);min-height:200px}\n.u-tpl-chip{display:inline-flex;align-items:center;gap:4px;margin-left:6px;border:1px solid var(--u-border);border-radius:999px;padding:0 7px;font-size:11px;color:var(--u-muted);background:var(--u-bg);min-height:18px}\n.u-bub.u-tpl-shown{opacity:.85;border:1px dashed color-mix(in srgb,var(--u-out-ink) 50%,transparent)}\n.u-day{align-self:center;font-size:12px;color:var(--u-muted);background:var(--u-bg);border:1px solid var(--u-border);padding:2px 10px;border-radius:999px}\n.u-older{align-self:center;border:1px solid var(--u-border);background:var(--u-bg);border-radius:999px;padding:5px 12px;font-size:13px;color:var(--u-muted);min-height:32px}\n.u-ev{align-self:center;max-width:92%;display:flex;gap:8px;align-items:flex-start;font-size:13.5px;background:var(--u-bg);border:1px solid var(--u-border);border-radius:10px;padding:8px 11px}\n.u-ev svg{width:16px;height:16px;flex:none;margin-top:2px;color:var(--u-muted)}\n.u-ev b{font-weight:600}\n.u-ev .u-meta{color:var(--u-muted);font-size:12.5px}\n.u-bub{max-width:78%;padding:8px 12px;border-radius:14px;font-size:14.5px;white-space:pre-wrap;overflow-wrap:anywhere}\n.u-bub.u-in{align-self:flex-start;background:var(--u-bg);border:1px solid var(--u-border);border-bottom-left-radius:4px}\n.u-bub.u-out{align-self:flex-end;background:var(--u-out);color:var(--u-out-ink);border-bottom-right-radius:4px}\n.u-bmeta{font-size:12px;color:var(--u-muted)}\n.u-bmeta.u-r{align-self:flex-end}\n/* ---- Composer footer (port of native ChatPage footer) ---- */\n.u-composer{display:flex;flex-direction:column;gap:8px;padding:10px 16px 12px;background:var(--u-surface-2);border-top:1px solid var(--u-border)}\n.u-composer>*:empty{display:none}\n/* Its menus open upward, over the conversation: a host that makes the composer scroll must not clip them. */\n.uplift .u-composer.u-composer-menu{overflow:visible!important}\n/* draft grid (ComposerAssistant) */\n.u-ag{display:flex;flex-direction:column;gap:6px}\n.u-ag-h{display:flex;align-items:center;gap:2px}\n.u-ag-toggle{display:inline-flex;align-items:center;gap:8px;padding:4px 8px;border:0;background:transparent;color:var(--u-muted);font-size:12px;font-weight:600;border-radius:6px;min-height:28px}\n.u-ag-toggle:hover{background:var(--u-surface-3);color:var(--u-text)}\n.u-ag-spark{display:inline-flex;color:var(--u-highlight)}.u-ag-spark svg{width:12px;height:12px}\n.u-ag-label{letter-spacing:.02em}\n.u-ag-chev{display:inline-flex;color:var(--u-muted);transition:transform .15s}.u-ag-chev svg{width:14px;height:14px}\n.u-ag-chev-open{transform:rotate(180deg)}\n.u-ag-by{font-size:12px;color:var(--u-muted);margin-left:6px}\n.u-ag-regen{display:inline-flex;align-items:center;justify-content:center;padding:4px;border:0;background:transparent;color:var(--u-muted);border-radius:6px;min-width:24px;min-height:24px}\n.u-ag-regen svg{width:11px;height:11px}\n.u-ag-regen:hover:not(:disabled){color:var(--u-highlight);background:var(--u-surface-3)}\n.u-ag-regen:disabled{opacity:.5}\n.u-ag-spinning svg{animation:u-spin 1s linear infinite}\n@keyframes u-spin{to{transform:rotate(360deg)}}\n.u-ag-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}\n.u-ag-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}\n.u-ag-tile{display:flex;align-items:center;gap:5px;min-height:30px;padding:6px 8px;border:1px solid var(--u-border);border-radius:8px;background:var(--u-bg);color:var(--u-muted);min-width:0;overflow:hidden;text-align:left;cursor:pointer;transition:border-color .15s,background .15s}\n.u-ag-tile:hover{border-color:var(--u-muted)}\n.u-ag-tile-ic{display:inline-flex;flex:none}.u-ag-tile-ic svg{width:12px;height:12px}\n.u-ag-tile-txt{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;line-height:1.2;font-weight:600;color:var(--u-muted)}\n.u-ag-tile-txt.u-ag-tile-on{color:var(--u-text)}\n.u-ag-tile-shimmer{height:30px;border-radius:8px;background:linear-gradient(90deg,var(--u-surface-2) 25%,var(--u-border) 50%,var(--u-surface-2) 75%);background-size:300% 100%;animation:u-ag-tiles 1.4s ease-in-out infinite}\n@keyframes u-ag-tiles{0%{background-position:200% 0}100%{background-position:-200% 0}}\n.u-ag-lab svg{width:12px;height:12px}\n.u-pill-gen .u-pill-grow{position:relative}\n.u-pill-gen .u-pill-grow::after{content:\"\";position:absolute;inset:8px 6px;border-radius:6px;pointer-events:none;background:linear-gradient(var(--u-surface-2),var(--u-surface-2)) 0 0/100% 9px no-repeat,linear-gradient(var(--u-surface-2),var(--u-surface-2)) 0 15px/88% 9px no-repeat,linear-gradient(var(--u-surface-2),var(--u-surface-2)) 0 30px/60% 9px no-repeat;animation:u-pill-gen 1.4s ease-in-out infinite}\n@keyframes u-pill-gen{0%,100%{opacity:.5}50%{opacity:1}}\n@media (prefers-reduced-motion: reduce){.u-ag-tile-shimmer,.u-pill-gen .u-pill-grow::after{animation:none}}\n.u-ag-cell{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;min-height:56px;padding:10px 12px;background:var(--u-surface-2);border:1px solid transparent;border-radius:var(--u-radius);color:var(--u-text);text-align:left;transition:background .15s,transform .15s}\n.u-ag-cell:hover:not(:disabled){background:var(--u-bg)}\n/* Gold shimmer ring on finished drafts (Ian, 2026-10-11): a gradient pseudo-element masked to the edge. Reduced motion leaves a still ring. */\n.u-ag-cell:not(.u-ag-loading)::before{content:\"\";position:absolute;inset:-1px;border-radius:calc(var(--u-radius) + 1px);padding:1.5px;pointer-events:none;background:linear-gradient(110deg,var(--u-gold) 0%,var(--u-gold-hi) 25%,var(--u-gold) 50%,var(--u-gold-hi) 75%,var(--u-gold) 100%);background-size:250% 100%;animation:u-shimmer 3.2s linear infinite;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude}\n@keyframes u-shimmer{from{background-position:0% 50%}to{background-position:250% 50%}}\n.u-ag-cell[aria-checked=\"true\"]{box-shadow:0 0 0 2px var(--u-highlight)}\n.u-ag-cell[aria-checked=\"true\"]::before{display:none}\n.u-ag-lab{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;color:var(--u-highlight);text-transform:uppercase;letter-spacing:.04em}\n.u-ag-pencil{display:inline-flex;opacity:.6}.u-ag-pencil svg{width:10px;height:10px}\n.u-ag-txt{font-size:14px;line-height:1.35;color:var(--u-text);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;word-break:break-word}\n.u-ag-loading{overflow:hidden;cursor:default;pointer-events:none;justify-content:center;align-items:center;border-color:var(--u-border)}\n.u-ag-loading-txt{position:relative;z-index:1;font-size:12px;color:var(--u-muted)}\n.u-ag-shimmer{position:absolute;inset:0;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.55) 50%,transparent 100%);animation:u-ag-sheen 1.4s infinite;transform:translateX(-100%)}\n@keyframes u-ag-sheen{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}\n.u-ag-empty{font-size:12.5px;color:var(--u-muted);padding:6px 0;display:flex;gap:10px;align-items:center;flex-wrap:wrap}\n.u-ag-foot{font-size:12.5px;color:var(--u-muted);margin:0}\n/* attachments */\n.u-attach-row{align-items:center;gap:8px;flex-wrap:wrap}\n.u-limits{font-size:12px;color:var(--u-muted)}\n.u-limits-warn{color:var(--u-warn)}\n.u-chips{display:flex;flex-wrap:wrap;gap:8px;padding:4px 0}\n.u-chip{display:inline-flex;align-items:center;gap:6px;max-width:240px;padding:4px 8px;border-radius:999px;background:var(--u-bg);border:1px solid var(--u-border);font-size:12px;color:var(--u-muted)}\n.u-chip svg{width:13px;height:13px;flex:none}\n.u-chip-err{border-color:var(--u-danger);color:var(--u-danger)}\n.u-chip-errtxt{font-size:10px}\n.u-chip-thumb{width:22px;height:22px;object-fit:cover;border-radius:5px}\n.u-chip-name{max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n.u-chip-x{display:inline-flex;align-items:center;border:0;background:none;color:inherit;padding:2px;min-height:0}\n.u-chip-x svg{width:12px;height:12px}\n.u-spin{animation:u-spin 1s linear infinite}\n.u-rec{display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:9px;background:var(--u-bg);font-size:12px;color:var(--u-muted)}\n.u-rec-dot{width:8px;height:8px;border-radius:50%;background:#ff3b30;animation:u-rec-pulse 1.2s ease-in-out infinite}\n@keyframes u-rec-pulse{0%,100%{opacity:1}50%{opacity:.35}}\n.u-rec-btn{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--u-border);background:var(--u-bg);color:var(--u-text);border-radius:999px;width:28px;height:28px;min-height:0;padding:0}\n.u-rec-btn svg{width:14px;height:14px}\n.u-rec-done{background:var(--u-accent);color:var(--u-accent-ink);border-color:var(--u-accent)}\n.u-sms-note{font-size:12px;color:var(--u-warn)}\n/* editor row: + button, pill with the editor and the inline send/\u2728 */\n.u-c-row{display:flex;align-items:flex-end;gap:8px;width:100%}\n.u-attach-wrap{position:relative;flex:none}\n.u-attach-btn{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;min-height:0;padding:0;margin-bottom:3px;border:1px solid var(--u-border);border-radius:999px;background:var(--u-bg);color:var(--u-muted);transition:color .15s,background .15s}\n.u-attach-btn svg{width:18px;height:18px}\n.u-attach-btn:hover:not(:disabled){color:var(--u-highlight);background:var(--u-highlight-soft)}\n.u-attach-btn:disabled{opacity:.45}\n.u-pill{position:relative;flex:1;min-width:0;display:flex;align-items:flex-end;gap:6px;background:var(--u-bg);border:1px solid var(--u-border);border-radius:14px;padding:4px 4px 4px 8px}\n.u-pill-grow{flex:1;min-width:0}\n.u-pill .u-editor{border:0;background:transparent;border-radius:0;padding:6px 4px;min-height:38px;max-height:220px;resize:none}\n.u-pill .u-editor:focus{outline:none}\n.u-pill:focus-within{border-color:var(--u-highlight)}\n/* Locked pill (stock intro, nothing to edit): gold shimmer ring like the draft cells. Reduced motion leaves a still ring. */\n.u-pill-locked{border-color:transparent}\n.u-pill-locked::before{content:\"\";position:absolute;inset:-1px;border-radius:15px;padding:1.5px;pointer-events:none;background:linear-gradient(110deg,var(--u-gold) 0%,var(--u-gold-hi) 25%,var(--u-gold) 50%,var(--u-gold-hi) 75%,var(--u-gold) 100%);background-size:250% 100%;animation:u-shimmer 3.2s linear infinite;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude}\n.u-pill-locked:focus-within{border-color:transparent}\n.u-editor-locked{cursor:default;caret-color:transparent}\n.u-send-btn{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;min-height:0;padding:0;flex:none;border-radius:999px;border:0;background:var(--u-accent);color:var(--u-accent-ink);transition:transform .15s,opacity .15s}\n.u-send-btn svg{width:15px;height:15px;stroke:var(--u-accent-ink)}\n.u-send-btn:hover:not(:disabled){transform:translateY(-1px)}\n.u-send-btn:disabled{opacity:.4;cursor:not-allowed}\n.u-send-btn-text{width:auto;padding:0 10px 0 12px;gap:6px;font-size:12.5px;font-weight:600;white-space:nowrap}\n.u-gen-btn{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;min-height:0;padding:0;flex:none;border:0;border-radius:999px;background:transparent;color:var(--u-highlight);transition:background .15s}\n.u-gen-btn svg{width:16px;height:16px}\n.u-gen-btn:hover:not(:disabled){background:var(--u-highlight-soft)}\n.u-gen-btn:disabled{opacity:.4}\n.u-menu-backdrop{position:fixed;inset:0;z-index:40}\n.u-menu{position:absolute;bottom:calc(100% + 6px);z-index:41;display:flex;flex-direction:column;min-width:150px;padding:4px;border-radius:12px;background:var(--u-bg);border:1px solid var(--u-border);box-shadow:0 10px 30px rgba(0,0,0,.18)}\n.u-menu-left{left:0}.u-menu-right{right:0}\n.u-menu-title{padding:6px 12px 4px;font-size:11.5px;font-weight:600;color:var(--u-muted)}\n.u-menu-titlerow{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 6px 2px 0}\n.u-menu-titlerow .u-menu-title{padding:2px 12px 2px}\n.u-menu-cfg{display:inline-flex;align-items:center;justify-content:center;padding:4px;min-width:24px;min-height:24px;border:0;background:none;color:var(--u-muted);border-radius:6px}\n.u-menu-cfg svg{width:13px;height:13px}\n.u-menu-cfg:hover{color:var(--u-text);background:var(--u-surface-3)}\n/* proactive options editor */\n.u-po-help{font-size:13.5px;color:var(--u-muted);margin:0 0 10px}\n.u-po-list{display:flex;flex-direction:column;gap:10px}\n.u-po-row{border:1px solid var(--u-border);border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:8px;background:var(--u-surface-2)}\n.u-po-top{display:flex;align-items:center;gap:6px}\n.u-po-label{flex:1;min-width:0;border:1px solid var(--u-border);border-radius:8px;padding:7px 10px;font:inherit;font-size:14px;background:var(--u-bg);color:var(--u-text)}\n.u-po-text{width:100%;border:1px solid var(--u-border);border-radius:8px;padding:7px 10px;font:inherit;font-size:13.5px;background:var(--u-bg);color:var(--u-text);resize:vertical}\n.u-po-iconwrap{position:relative;flex:none}\n.u-po-iconbtn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;min-height:0;padding:0;border:1px solid var(--u-border);border-radius:8px;background:var(--u-bg);color:var(--u-text)}\n.u-po-iconbtn svg{width:15px;height:15px}\n.u-po-iconbtn:disabled{opacity:.4}\n.u-po-iconbtn-on{border-color:var(--u-highlight);box-shadow:0 0 0 1px var(--u-highlight);color:var(--u-highlight)}\n.u-po-remove:hover{color:var(--u-danger);border-color:var(--u-danger)}\n.u-po-iconpick{position:absolute;top:calc(100% + 4px);left:0;z-index:5;display:grid;grid-template-columns:repeat(6,32px);gap:4px;padding:6px;background:var(--u-bg);border:1px solid var(--u-border);border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.18)}\n.u-po-add{margin-top:10px;border:1px dashed var(--u-border);background:transparent;border-radius:9px;padding:8px 12px;font-weight:600;color:var(--u-link);min-height:38px;width:100%}\n.u-po-actions{display:flex;gap:8px;align-items:center;margin-top:12px;flex-wrap:wrap}\n.u-menu-item{display:flex;align-items:center;gap:8px;width:100%;padding:8px 12px;border:0;border-radius:8px;background:none;text-align:left;font-size:14px;color:var(--u-text);min-height:36px}\n.u-menu-item:hover{background:var(--u-surface-3)}\n.u-menu-purpose svg{width:14px;height:14px;color:var(--u-highlight);flex:none}\n/* inbox rows (native ClientRow) */\n.u-row-open{position:relative}\n.u-r-ind{position:absolute;left:3px;top:50%;transform:translateY(-50%);width:20px;display:grid;place-items:center}\n.u-rows .u-row-open{padding-left:26px}\n.u-r-dot{width:8px;height:8px;border-radius:50%;background:var(--u-highlight)}\n.u-r-badge{min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--u-highlight);color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center}\n/* The open conversation is the only row with a colour: a clear shade and an accent bar on the left\n edge, like WhatsApp's selected chat. Unread shows by the dot and bold name, never a tint. Built\n from the text colour so it reads on any host theme, light or dark. */\n.u-rows li:has(.u-row-open[aria-current=\"true\"]){background:color-mix(in srgb,var(--u-text) 8%,var(--u-bg));box-shadow:inset 3px 0 0 var(--u-accent)}\n.u-rows li:has(.u-row-open[aria-current=\"true\"]) .u-row-open{background:transparent}\n.u-r-name-unread{font-weight:700}\n.u-r-follow,.u-r-fail{display:inline-flex;align-items:center;flex:none}\n.u-r-follow svg,.u-r-fail svg{width:13px;height:13px}\n.u-r-follow{color:var(--u-warn)}\n.u-r-fail{color:var(--u-danger)}\n.u-r-prev{display:inline-flex;align-items:center;gap:5px;max-width:100%}\n.u-r-pico{display:inline-flex;flex:none}.u-r-pico svg{width:11px;height:11px}\n.u-r-prev-in .u-r-ptxt{color:var(--u-text)}\n.u-r-prev-in .u-r-pico{color:var(--u-highlight)}\n.u-r-prev-out .u-r-ptxt,.u-r-prev-out .u-r-pico{color:var(--u-muted)}\n.u-r-prev-ev .u-r-ptxt,.u-r-prev-ev .u-r-pico{color:var(--u-muted);font-style:italic}\n.u-r-ptxt{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}\n.u-r-hosttags{flex:1 0 100%;display:flex;flex-wrap:wrap;gap:4px;padding:0 12px 10px 72px;margin-top:-6px}\n.u-tag-connect{cursor:pointer;font:inherit;font-size:12px;font-weight:600;line-height:inherit}\n.u-tag-connect:hover{border-color:var(--u-highlight);color:var(--u-highlight);background:var(--u-highlight-soft)}\n.u-r-quick{flex:1 0 100%;display:flex;justify-content:flex-end;align-items:center;min-width:0;padding:0 12px 10px 72px}\n.u-qsend{display:inline-flex;align-items:center;gap:6px;max-width:100%;border:1px solid var(--u-highlight);background:var(--u-highlight);color:#fff;border-radius:999px;padding:4px 11px;font-size:12px;font-weight:600;min-height:26px}\n.u-qsend:hover:not(:disabled){filter:brightness(1.08)}\n/* Bulk generate states in the quick-send slot (native: Generating\u2026 / Generation failed) */\n.u-qsend.u-qsend-bulk{background:var(--u-surface-2);border-color:var(--u-border);color:var(--u-muted);cursor:default}\n.u-qsend-busy svg{width:12px;height:12px}\n/* Bulk generate sheet (native BulkGenerateModal) */\n.u-bulk-head{display:flex;align-items:flex-start;gap:10px;margin-bottom:6px}\n.u-bulk-spark{color:var(--u-highlight);display:grid;place-items:center;padding-top:9px}\n.u-bulk-spark svg{width:18px;height:18px}\n.u-bulk-titles{flex:1;min-width:0}\n.u-bulk-titles h3{margin:4px 0 2px;font-size:18px}\n.u-bulk-sub{margin:0;font-size:13.5px;color:var(--u-muted)}\n.u-bulk-sub .u-linkbtn{font-size:13px}\n.u-bulk-sec{margin-top:14px}\n.u-bulk-sechead{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}\n.u-bulk-sechead .u-linkbtn{font-size:13px}\n.u-bulk-label{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--u-muted)}\n.u-bulk-chips{display:flex;flex-wrap:wrap;gap:6px;max-height:180px;overflow:auto;padding:2px}\n.u-bulk-empty{font-size:13px;color:var(--u-muted)}\n.u-bulk-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--u-border);background:var(--u-bg);border-radius:999px;padding:3px 10px 3px 3px;font-size:13px;color:var(--u-muted);min-height:30px;max-width:100%}\n.u-bulk-chip-on{border-color:var(--u-highlight);background:var(--u-highlight-soft);color:var(--u-text)}\n.u-bulk-av{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:10px;font-weight:700;flex:none}\n.u-bulk-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n.u-bulk-meta{font-size:11px;color:var(--u-muted)}\n.u-bulk-prompt{width:100%;box-sizing:border-box;border:1px solid var(--u-border);border-radius:10px;padding:10px 12px;font:inherit;font-size:14px;color:var(--u-text);background:var(--u-bg);resize:vertical}\n.u-bulk-prompt:focus{outline:none;border-color:var(--u-accent)}\n.u-bulk-hist{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:8px}\n.u-bulk-histlabel{font-size:12px;color:var(--u-muted)}\n.u-bulk-histbtn{border:1px solid var(--u-border);background:var(--u-surface-2);border-radius:999px;padding:3px 10px;font-size:12px;color:var(--u-text);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n.u-bulk-foot{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}\n.u-bulk-go{display:inline-flex;align-items:center;gap:6px}\n.u-bulk-go svg{width:14px;height:14px}\n/* Gold shimmer ring on a ready quick reply, same as the draft cells. Countdown, sending, sent and error states drop it. */\n.u-qsend{position:relative}\n.u-qsend:not(.u-qsend-count):not(.u-qsend-sending):not(.u-qsend-sent):not(.u-qsend-err):not(:disabled)::before{content:\"\";position:absolute;inset:-2px;border-radius:999px;padding:2px;pointer-events:none;background:linear-gradient(110deg,var(--u-gold) 0%,var(--u-gold-hi) 25%,var(--u-gold) 50%,var(--u-gold-hi) 75%,var(--u-gold) 100%);background-size:250% 100%;animation:u-shimmer 3.2s linear infinite;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude}\n.u-qsend svg{width:12px;height:12px;flex:none}\n.u-qsend-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n.u-qsend-count{border-color:var(--u-warn);background:color-mix(in srgb,var(--u-warn) 12%,transparent);color:var(--u-warn)}\n.u-qsend-sent{border-color:var(--u-accent);background:var(--u-accent);color:var(--u-accent-ink)}\n.u-qsend-err{border-color:var(--u-danger);color:var(--u-danger);background:transparent}\n.u-qsend:disabled{opacity:.9}\n/* delivery receipts */\n.u-rcpt{display:inline-flex;align-items:center;margin-left:4px;color:var(--u-muted)}\n.u-rcpt svg{width:13px;height:13px}\n.u-rcpt-ok{color:var(--u-highlight)}\n.u-rcpt-bad{color:var(--u-danger)}\n/* inline reply drafts under the latest client message */\n.u-inl{align-self:flex-start;max-width:78%;display:flex;flex-direction:column;gap:6px;margin-top:2px}\n.u-inl-h{display:flex;align-items:center;gap:4px}\n.u-inl-toggle{display:inline-flex;align-items:center;gap:6px;border:0;background:transparent;color:var(--u-muted);font-size:12px;font-weight:600;padding:2px 6px;border-radius:6px;min-height:24px}\n.u-inl-toggle:hover{background:var(--u-surface-3);color:var(--u-text)}\n.u-inl-notnow{border:0;background:transparent;color:var(--u-muted);font-size:12px;padding:2px 6px;min-height:24px;border-radius:6px}\n.u-inl-notnow:hover{color:var(--u-text);background:var(--u-surface-3)}\n.u-inl-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;width:100%}\n.u-inl-cell{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0;border:1px solid var(--u-border);background:var(--u-bg);border-radius:12px;padding:7px 10px;text-align:left;color:var(--u-text)}\n/* Gold shimmer ring, same as the composer's draft cells. Reduced motion leaves a still ring. */\n.u-inl-cell::before{content:\"\";position:absolute;inset:-1px;border-radius:13px;padding:1.5px;pointer-events:none;background:linear-gradient(110deg,var(--u-gold) 0%,var(--u-gold-hi) 25%,var(--u-gold) 50%,var(--u-gold-hi) 75%,var(--u-gold) 100%);background-size:250% 100%;animation:u-shimmer 3.2s linear infinite;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude}\n.u-inl-cell:hover{border-color:var(--u-highlight)}\n.u-inl-txt{font-size:13px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}\n/* Item action row (native InlineDrafts): under client messages, and inside activity cards. */\n.u-ia{align-self:flex-start;width:78%;display:flex;flex-direction:column;gap:6px;margin-top:2px}\n.u-ev .u-ia{width:100%;margin-top:6px}\n.u-ev>div{flex:1}\n.u-ev>div{min-width:0}\n.u-ev .u-ia svg{width:13px;height:13px;margin-top:0}\n.u-ia-h{display:flex;flex-wrap:wrap;align-items:center;gap:2px;margin-left:-6px}\n.u-ia-h .u-inl-toggle svg{width:13px;height:13px}\n.u-ia-ai{display:flex;flex-direction:column;gap:6px;border:1px solid var(--u-border);background:var(--u-bg);border-radius:12px;padding:10px;min-width:min(420px,100%)}\n.u-ia-ai-label{font-size:12.5px;font-weight:700}\n.u-ia-ai-hint{font-size:12px;color:var(--u-muted)}\n.u-ia-ai-note{font-size:12px;color:var(--u-warn);background:color-mix(in srgb,var(--u-warn) 10%,transparent);border-radius:8px;padding:6px 8px}\n.u-ia-ai textarea{font:inherit;font-size:13.5px;color:var(--u-text);background:var(--u-surface-2);border:1px solid var(--u-border);border-radius:8px;padding:8px 10px;resize:vertical;min-height:64px}\n.u-ia-ai-row{display:flex;align-items:center;gap:10px;font-size:12px}\n.u-ia-ai-count{color:var(--u-muted);font-variant-numeric:tabular-nums}\n.u-ia-ai-err{color:var(--u-danger)}\n.u-cx-h4{display:flex;align-items:center;gap:6px}\n.u-cx-info{display:inline-grid;place-items:center;width:22px;height:22px;border:0;border-radius:999px;background:transparent;color:var(--u-muted);padding:0;cursor:pointer}\n.u-cx-info:hover{color:var(--u-highlight);background:var(--u-highlight-soft)}\n.u-cx-info svg{width:15px;height:15px}\n.u-cx-head{display:flex;align-items:center;gap:10px}\n.u-cx-mark{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:999px;color:#fff;flex:none}\n.u-cx-rule{margin:10px 0}\n.u-cx-rule h4{margin:0 0 3px;font-size:14px}\n.u-cx-rule p{margin:0;font-size:13.5px;line-height:1.5;color:var(--u-muted)}\n.u-cx-sec{display:block;margin-top:14px;font-size:13px;font-weight:600}\n.u-cx-mocks{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:8px 0 10px}\n.u-cx-col{display:flex;flex-direction:column;gap:4px;min-width:0}\n.u-cx-label{font-size:11.5px;font-weight:500;color:var(--u-muted)}\n.u-cx-phone{border:1px solid var(--u-border);border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:8px;min-height:120px}\n.u-cx-coach{background:var(--u-surface-2)}\n.u-cx-coach-bub{align-self:flex-end;max-width:95%;background:var(--u-highlight);color:#fff;border-radius:12px;border-bottom-right-radius:4px;padding:8px 10px;font-size:12px;line-height:1.45}\n.u-cx-tpl{display:inline-block;margin-top:6px;padding:2px 8px;border-radius:999px;background:rgba(255,255,255,.22);font-size:10px;font-weight:500}\n.u-cx-client{background:#e5ddd5;border-color:#d5cdc4}\n.u-cx-client-bub{align-self:flex-start;max-width:95%;background:#fff;color:#1c1c1e;border-radius:12px;border-top-left-radius:4px;padding:8px 10px;font-size:12px;line-height:1.45;box-shadow:0 1px 1px rgba(0,0,0,.08)}\n.u-cx-link{display:block;margin-top:6px;color:#027eb5;font-weight:500}\n.u-cx-meta{font-size:10px;color:var(--u-muted);text-align:center;margin-top:auto}\n.u-cx-client .u-cx-meta{color:#7a7269}\n.u-cx-foot{font-size:12px;line-height:1.5;color:var(--u-muted)}\n.u-offer-who{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--u-muted);margin:2px 0 8px}\n.u-offer-avs{display:inline-flex}\n.u-offer-avs .u-av{border:2px solid var(--u-bg);margin-left:-6px}\n.u-offer-avs .u-av:first-child{margin-left:0}\n.u-offer-list{list-style:none;margin:10px 0;padding:0;display:flex;flex-direction:column;gap:7px;font-size:13.5px}\n.u-offer-list li{display:flex;gap:8px;align-items:flex-start}\n.u-offer-tick{display:inline-flex;color:var(--u-accent);flex:none;margin-top:2px}\n.u-offer-tick svg{width:15px;height:15px}\n.u-ai-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}\n.u-ai-plan{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border:1px solid var(--u-border);border-radius:10px;padding:8px 11px;font-size:13px;margin:0 0 10px}\n.u-ai-plan .u-linkbtn{font-size:13px}\n.u-ai-err{color:var(--u-danger,#b42318);font-size:12.5px;width:100%}\n.u-ai-disclaimer{display:flex;gap:8px;align-items:flex-start;background:var(--u-highlight-soft);border-radius:10px;padding:9px 11px;font-size:12.5px;line-height:1.45;margin:6px 0 10px}\n.u-ai-disclaimer svg{width:15px;height:15px;flex:none;margin-top:2px;color:var(--u-highlight)}\n.u-ai-tabs{display:flex;flex-wrap:wrap;gap:4px;border-bottom:1px solid var(--u-border);margin-bottom:10px}\n.u-ai-tab{border:0;background:transparent;padding:7px 10px;font-size:13px;font-weight:600;color:var(--u-muted);border-bottom:2px solid transparent;margin-bottom:-1px;border-radius:0}\n.u-ai-tab-on{color:var(--u-text);border-bottom-color:var(--u-highlight)}\n.u-ai-body{display:flex;flex-direction:column;gap:14px}\n.u-ai-sec{display:flex;flex-direction:column;gap:6px}\n.u-ai-sec h4{margin:0;font-size:14px}\n.u-ai-area,.u-ai-input{font:inherit;font-size:13.5px;color:var(--u-text);background:var(--u-surface-2);border:1px solid var(--u-border);border-radius:8px;padding:8px 10px;width:100%;box-sizing:border-box}\n.u-ai-area{resize:vertical}\n.u-ai-form{display:flex;flex-direction:column;gap:6px;border:1px solid var(--u-border);border-radius:10px;padding:10px}\n.u-ai-form label{font-size:12.5px;font-weight:700}\n.u-ai-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}\n.u-ai-list li{border:1px solid var(--u-border);border-radius:10px;padding:8px 10px;display:flex;flex-direction:column;gap:3px}\n.u-ai-item-head{display:flex;align-items:center;gap:6px;font-size:13px}\n.u-ai-tags{display:flex;flex-wrap:wrap;gap:4px}\n.u-ai-learned{display:grid;grid-template-columns:max-content 1fr;gap:6px 14px;margin:8px 0 0;font-size:13.5px}\n.u-ai-learned dt{font-weight:700;color:var(--u-muted)}\n.u-ai-learned dd{margin:0}\n.u-ai-k{font-size:11.5px;font-weight:700;color:var(--u-muted);text-transform:uppercase;letter-spacing:.04em}\n.u-ai-v{font-size:13.5px;white-space:pre-wrap}\n.u-ai-locked{border:1px dashed var(--u-border);border-radius:10px;padding:12px;font-size:13px;color:var(--u-muted)}\n.u-ai-locked strong{color:var(--u-text)}\n.u-ai-field{display:flex;flex-direction:column;gap:3px;margin-top:10px}\n.u-ai-field textarea{font:inherit;font-size:13.5px;color:var(--u-text);background:var(--u-surface-2);border:1px solid var(--u-border);border-radius:8px;padding:8px 10px;resize:vertical}\n.u-ai-labelrow{display:flex;justify-content:space-between;gap:8px;font-size:13px;font-weight:700}\n.u-ai-sub{margin-top:16px!important;font-size:12.5px;font-weight:700;color:var(--u-muted)}\n.u-ai-ok{color:var(--u-accent);font-size:13px;font-weight:600}\n.u-ai-more{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin-top:16px;padding-top:12px;border-top:1px solid var(--u-border);font-size:13px;color:var(--u-muted)}\n.u-ia-save{border:1px solid var(--u-accent);background:var(--u-accent);color:var(--u-accent-ink);border-radius:8px;padding:5px 12px;font-weight:600;font-size:13px;min-height:30px}\n.u-ia-save:disabled{opacity:.5}\n/* WhatsApp closed window */\n.u-wa{display:flex;gap:8px;align-items:flex-start;padding:8px 12px;border-radius:9px;background:color-mix(in srgb,var(--u-warn) 10%,var(--u-bg));border:1px solid color-mix(in srgb,var(--u-warn) 35%,transparent);font-size:13px;line-height:1.4}\n.u-wa-ico{display:inline-flex;color:var(--u-warn);flex:none;margin-top:2px}.u-wa-ico svg{width:14px;height:14px}\n.u-wa-body{min-width:0}\n.u-wa-more{display:inline-flex;align-items:center;gap:2px;border:0;background:transparent;color:var(--u-link);font-weight:600;font-size:12.5px;padding:0 4px;min-height:0;margin-left:4px}\n.u-wa-more svg{width:12px;height:12px}\n.u-wa-why{margin:6px 0 0;color:var(--u-muted);font-size:12.5px}\n.u-ghost{display:flex;flex-direction:column;align-items:flex-end;gap:2px;opacity:.7}\n.u-ghost-bub{border:1px dashed color-mix(in srgb,var(--u-out-ink) 50%,transparent);background:color-mix(in srgb,var(--u-out) 60%,transparent)}\n.u-ghost-cut{font-weight:700}\n/* beginning of history */\n.u-hist-start{align-self:center;font-size:12px;color:var(--u-muted);padding:4px 0}\n/* header badges */\n.u-chan-badge{display:inline-flex;align-items:center;justify-content:center;position:absolute;right:-2px;bottom:-2px;width:16px;height:16px;border-radius:50%;color:#fff;border:2px solid var(--u-bg);box-sizing:content-box}\n.u-chan-wa{background:#25d366}\n.u-chan-sms{background:var(--u-highlight)}\n.u-chan-app{background:var(--u-text);color:var(--u-bg)}\n.u-r-av{grid-row:span 3;align-self:start}\n.u-r-av .u-av{grid-row:auto}\n.u-av-wrap{position:relative;display:inline-flex;flex:none}\n.u-head-status{margin-left:4px}\n.u-chan-ctl{position:relative;display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}\n.u-chan-pick{display:inline-flex;align-items:center;gap:2px;border:0;background:none;padding:2px;margin:-2px 0;border-radius:6px;font:inherit;color:inherit;cursor:pointer}\n.u-chan-pick:hover{color:var(--u-text);background:var(--u-surface-2)}\n.u-chan-pick svg{width:14px;height:14px}\n.u-chan-reach{font-size:11.5px;padding:0 7px}\n.u-chan-menu{position:absolute;top:calc(100% + 6px);left:0;z-index:4;min-width:200px;display:flex;flex-direction:column;padding:4px;background:var(--u-bg);border:1px solid var(--u-border);border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.18)}\n.u-chan-item{display:flex;flex-direction:column;align-items:flex-start;gap:1px;text-align:left;border:0;background:none;color:var(--u-text);font:inherit;font-size:14px;padding:8px 10px 8px 28px;border-radius:7px;position:relative;cursor:pointer}\n.u-chan-item:hover,.u-chan-item:focus-visible{background:var(--u-surface-2);outline:none}\n.u-chan-item[aria-checked=\"true\"]::before{content:\"\";position:absolute;left:10px;top:13px;width:9px;height:5px;border-left:2px solid var(--u-link);border-bottom:2px solid var(--u-link);transform:rotate(-45deg)}\n.u-chan-item[aria-disabled=\"true\"]{color:var(--u-muted);cursor:not-allowed}\n.u-chan-item small{font-size:12px;color:var(--u-muted)}\n.u-chan-note{margin:8px 16px;background:var(--u-highlight-soft);border:1px solid color-mix(in srgb,var(--u-highlight) 35%,transparent)}\n.u-chan-note.u-note-err{background:color-mix(in srgb,var(--u-danger) 9%,var(--u-bg));border-color:color-mix(in srgb,var(--u-danger) 35%,transparent)}\n.u-chan-note-x{min-height:30px;padding:4px 12px}\n/* attachments on thread messages */\n.u-att{display:flex;flex-wrap:wrap;gap:6px;max-width:78%}\n.u-att-out{align-self:flex-end;justify-content:flex-end}.u-att-in{align-self:flex-start}\n.u-att-img{border:0;background:none;padding:0;min-height:0;cursor:zoom-in}\n.u-att-img img{display:block;max-width:220px;max-height:220px;border-radius:12px;border:1px solid var(--u-border)}\n.u-att-desc{display:block;font-size:12px;color:var(--u-muted);max-width:220px}\n.u-att-video{display:block;max-width:280px;max-height:320px;border-radius:12px;background:#000;object-fit:contain}\n.u-att-audio{display:flex;flex-direction:column;gap:4px;max-width:300px}\n.u-att-player{width:100%;max-width:300px}\n.u-att-trans{font-size:13px;color:var(--u-muted);font-style:italic}\n.u-lightbox{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.85);display:grid;place-items:center;padding:24px}\n.u-lightbox img{max-width:100%;max-height:100%;border-radius:8px}\n.u-lightbox-x{position:absolute;top:16px;right:16px;width:40px;height:40px;border-radius:999px;border:0;background:rgba(255,255,255,.15);color:#fff;display:grid;place-items:center}\n.u-lightbox-x svg{width:18px;height:18px}\n.u-att-file{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:var(--u-bg);border:1px solid var(--u-border);font-size:13px;color:var(--u-link);text-decoration:none}\n.u-att-file svg{width:14px;height:14px}\n.u-editor{width:100%;border:1px solid var(--u-border);border-radius:var(--u-radius);padding:10px 12px;min-height:64px;font:inherit;font-size:14.5px;background:var(--u-bg);color:var(--u-text);resize:vertical}\n.u-editor::placeholder{color:var(--u-muted)}\n.u-editor-rich{min-height:64px;max-height:220px;overflow-y:auto;white-space:normal;word-break:break-word;line-height:1.5}\n.u-editor-rich:empty::before{content:attr(data-placeholder);color:var(--u-muted);pointer-events:none}\n.u-editor-rich[aria-disabled=\"true\"]{opacity:.6}\n/* Draft pills, ported from native: one per clause, hue hashed from the text, \u00D7 drops it. */\n/* Pills keep the suggested draft's greyed text until the coach touches one: clicked or typed-in pills turn white (native #633). */\n.u-seg{display:inline;padding:1px 3px;margin:0 2px 0 0;border-radius:6px;border:1px solid var(--u-highlight-soft);background:var(--u-surface-2);color:var(--u-muted);line-height:1.9;-webkit-box-decoration-break:clone;box-decoration-break:clone;transition:background .15s,color .15s,border-color .15s}\n.u-seg.touched{background:var(--u-bg);color:var(--u-text)}\n.u-seg.active{background:var(--u-bg);color:var(--u-text);border-color:var(--u-highlight)}\n/* Suggested draft: Uplift's words, softened, until the coach engages. */\n.u-editor-sugg{cursor:text;display:flex;flex-direction:column;gap:2px}\n.u-pill .u-editor-sugg,.u-editor-sugg{background:var(--u-surface-2);border-radius:10px}\n.u-editor-sugg:focus-visible{outline:2px solid var(--u-highlight);outline-offset:1px}\n.u-sugg-label{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--u-highlight)}\n.u-sugg-label svg{width:13px;height:13px;flex:none}\n.u-sugg-text{color:var(--u-muted)}\n/* Stock intro: no pill highlight, the text itself shimmers gold (gradient clipped to the glyphs). Reduced motion leaves a still gold gradient. */\n.u-seg-lock{cursor:default;user-select:text;padding:0;margin:0;border:0;border-radius:0;font-weight:600;background:linear-gradient(110deg,var(--u-gold-ink) 0%,var(--u-gold-ink-hi) 30%,var(--u-gold-ink) 50%,var(--u-gold-ink-hi) 70%,var(--u-gold-ink) 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:u-shimmer 4s linear infinite}\n.u-seg-lock:hover{opacity:1}\n.u-seg-x{display:inline-flex;align-items:center;justify-content:center;margin-left:2px;min-width:24px;min-height:24px;cursor:pointer;font-size:14px;color:var(--u-muted);border-radius:6px;line-height:1;vertical-align:middle;user-select:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent}\n.u-seg-x:hover,.u-seg-x:active,.u-seg-x:focus-visible{color:var(--u-text);background:var(--u-border);outline:none}\n.u-editor:disabled{opacity:.6}\n.u-send{border:0;background:var(--u-accent);color:var(--u-accent-ink);font-weight:700;border-radius:9px;padding:8px 16px;min-height:40px}\n.u-send:disabled{opacity:.45}\n.u-gen{border:1px solid var(--u-border);background:var(--u-bg);border-radius:9px;padding:8px 14px;font-weight:600;min-height:40px}\n.u-gen:disabled{opacity:.5}\n.u-note{margin-top:8px;border-radius:9px;padding:9px 12px;font-size:13.5px;display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center}\n.u-note-err{background:color-mix(in srgb,var(--u-danger) 9%,var(--u-bg));border:1px solid color-mix(in srgb,var(--u-danger) 35%,transparent)}\n.u-note-warn{background:color-mix(in srgb,var(--u-warn) 10%,var(--u-bg));border:1px solid color-mix(in srgb,var(--u-warn) 35%,transparent)}\n.u-note-ok{background:var(--u-highlight-soft)}\n.u-banner{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:10px 16px;font-size:14px;border-bottom:1px solid var(--u-border);background:var(--u-accent-soft)}\n.u-headbtn{border:1px solid var(--u-border);background:var(--u-bg);border-radius:8px;padding:6px 11px;font-size:14px;font-weight:600;min-height:34px}\n.u-headbtn:disabled{opacity:.5}\n.u-connect{margin-left:4px;display:inline-flex;align-items:center;gap:7px;flex:none}\n.u-hostlink{margin-left:4px;display:inline-flex;align-items:center;gap:6px;flex:none;text-decoration:none;color:var(--u-text);white-space:nowrap}\n.u-hostlink-icon{width:18px;height:18px;object-fit:contain;flex:none}\n.u-ev-open{margin-top:8px;display:flex}\n.u-ev-open .u-hostlink{margin-left:0}\n.u-ia-extra{display:inline-flex;margin-left:4px}\n.u-ia-extra .u-hostlink{margin-left:0;border:0;background:transparent;color:var(--u-muted);font-size:12px;font-weight:600;padding:2px 6px;border-radius:6px;min-height:24px;gap:5px}\n.u-ia-extra .u-hostlink:hover{background:var(--u-surface-3);color:var(--u-text)}\n.u-ia-extra .u-hostlink-icon{width:14px;height:14px}\n/* AI settings + full screen: the right end of the conversation header (no panel header row). */\n.u-head-acts{margin-left:auto;display:inline-flex;align-items:center;gap:6px;flex:none}\n.u-chan ~ .u-head-acts{margin-left:6px}\n.u-pane-head-empty{justify-content:flex-end;min-height:62px;box-sizing:border-box}\n/* On wide panels the toolbar leaves them to the conversation header. */\n.u-toolbar-acts{display:none}\n.u-toolbar .u-addbtn{flex:none;margin-left:auto}\n.u-connect svg{flex:none}\n.u-example{width:100%;border:1px dashed var(--u-border);border-radius:12px;padding:12px;background:var(--u-surface-2);display:flex;flex-direction:column}\n.u-ex-lab{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--u-muted);margin-bottom:6px}\n.u-sheet-wrap{position:absolute;inset:0;background:rgba(10,10,10,.45);display:grid;place-items:center;padding:16px;z-index:5}\n.u-sheet{width:min(560px,100%);max-height:100%;overflow:auto;background:var(--u-bg);color:var(--u-text);border:1px solid var(--u-border);border-radius:16px;box-shadow:0 18px 50px rgba(0,0,0,.25);padding:20px;outline:none}\n.u-eyebrow{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--u-muted)}\n.u-sheet h3{font-size:21px;margin:6px 0 8px}\n.u-lede{font-size:14.5px;color:var(--u-muted)}\n.u-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;align-items:center}\n.u-secondary{border:1px solid var(--u-border);background:var(--u-bg);border-radius:9px;padding:8px 14px;font-weight:600;min-height:40px}\n.u-steps{display:flex;gap:6px;margin-bottom:12px}\n.u-steps span{flex:1;height:4px;border-radius:999px;background:var(--u-surface-3)}\n.u-steps span.u-on{background:var(--u-highlight)}\n.u-plan{margin-top:14px;border:1px solid var(--u-highlight);border-radius:12px;padding:14px;background:var(--u-highlight-soft)}\n.u-plan-name{font-weight:700;font-size:15px}\n.u-plan-price{font-size:30px;font-weight:700;margin-top:2px}\n.u-plan-price small{font-size:15px;font-weight:500;color:var(--u-muted)}\n.u-plan-vs{font-size:13.5px;color:var(--u-muted)}\n.u-feats{margin:12px 0 0;padding-left:18px;font-size:14px}\n.u-feats li{margin:3px 0}\n.u-chanbox{margin-top:12px;border:1px solid var(--u-border);border-radius:12px;padding:11px 13px}\n.u-chanbox h4{font-size:15px}\n.u-chanbox p{font-size:14px;margin-top:4px;color:var(--u-text)}\n.u-tick{display:flex;gap:10px;align-items:flex-start;margin-top:12px;font-size:14.5px}\n.u-tick input{width:20px;height:20px;margin-top:1px;accent-color:var(--u-highlight)}\n.u-field{margin-top:12px;display:flex;flex-direction:column;gap:5px}\n.u-field>label,.u-field>span:first-child{font-size:13.5px;font-weight:600}\n.u-field select{border:1px solid var(--u-border);background:var(--u-bg);color:var(--u-text);border-radius:9px;padding:9px 11px;font:inherit;min-height:42px}\n.u-field input{border:1px solid var(--u-border);background:var(--u-bg);color:var(--u-text);border-radius:9px;padding:9px 11px;font:inherit;min-height:42px}\n.u-field input[aria-invalid=\"true\"]{border-color:var(--u-danger)}\n.u-hint{font-size:13px;color:var(--u-muted)}\n.u-err{font-size:13px;color:var(--u-danger)}\n.u-chanpick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}\n.u-chanpick button{border:1px solid var(--u-border);background:var(--u-bg);border-radius:10px;padding:9px;text-align:left;min-height:56px}\n.u-chanpick button[aria-checked=\"true\"]{border-color:var(--u-highlight);box-shadow:0 0 0 1px var(--u-highlight)}\n.u-chanpick b{display:block;font-size:14.5px}\n.u-chanpick small{font-size:12.5px;color:var(--u-muted)}\n@media (prefers-reduced-motion:reduce){.uplift *{transition:none!important;animation:none!important}}\n@container panel (max-width:759px){\n .u-cx-mocks{grid-template-columns:1fr}\n .u-inl-grid{grid-template-columns:1fr}\n .u-ia{width:100%}\n .u-split{grid-template-columns:1fr;height:min(80vh,720px)}\n .u-split.u-show-thread .u-list{display:none}\n .u-split:not(.u-show-thread) .u-pane{display:none}\n .u-back{display:inline-flex}\n /* A row opens its thread full screen here, so it says so. */\n .u-r-chev{display:inline-flex}\n .u-toolbar-acts{display:inline-flex;flex:none;margin-left:auto}\n .u-toolbar-acts .u-head-acts{margin-left:0}\n /* Phone widths: the toolbar wraps its buttons rather than cutting them off; the conversation header\n keeps name, Connect and the buttons on one line by dropping the phone number and Connect's label. */\n .u-toolbar{flex-wrap:wrap;row-gap:6px}\n .u-sortgroup button{padding:4px 7px}\n .u-pane-head{gap:8px;padding:10px 12px}\n .u-pane-head .u-chan{display:none}\n .u-who{flex:0 1 auto}\n .u-who strong,.u-who small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n .u-connect{padding:6px 9px}\n .u-connect span{display:none}\n /* The host link stays, compact; the name keeps room to show. */\n .u-who{min-width:72px}\n .u-pane-head .u-hostlink{padding:6px 9px;font-size:13px}\n /* With a host link there may not be room for everything: the panel's buttons wrap to a second line rather than run off the edge. */\n .u-pane-head{flex-wrap:wrap;row-gap:6px}\n .u-ag-grid{grid-template-columns:1fr}\n .u-c-actions .u-meta{flex-basis:100%}\n .u-sheet-wrap{padding:0}\n .u-sheet{width:100%;height:100%;border-radius:0}\n}\n/* \u2500\u2500 ClientChat: a client's chat with their coach. Fills the host's box; every colour is a token. \u2500\u2500 */\n:where(.uplift.u-chat){\n --u-font:inherit;--u-kb:0px;\n --u-chat-out:var(--u-accent);--u-chat-out-ink:var(--u-accent-ink);\n --u-chat-in:#e9e9eb;--u-chat-in-ink:var(--u-text);--u-chat-scrim:rgba(0,0,0,.88);\n}\n:where(.uplift.u-chat[data-theme=\"dark\"],[data-theme=\"dark\"] .uplift.u-chat){--u-chat-in:#26262a;color-scheme:dark}\n.uplift.u-chat{border:0;border-radius:0;height:100%;display:flex;flex-direction:column;container-name:chat;font-size:16px}\n.u-cc-head{display:flex;align-items:center;gap:4px;padding:8px 12px;flex:none}\n.u-cc-back{display:inline-grid;place-items:center;width:44px;height:44px;border:0;background:none;color:var(--u-text);padding:0;margin-inline-start:-10px}\n.u-cc-back svg{width:26px;height:26px}\n.u-cc-title{font-size:19px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n.u-cc-wrap{position:relative;flex:1;min-height:0;display:flex}\n.u-cc-thread{flex:1;min-width:0;overflow-y:auto;overscroll-behavior:contain;padding:8px 12px 12px;display:flex;flex-direction:column;gap:6px}\n.u-cc-note{align-self:center;text-align:center;color:var(--u-muted);font-size:14px;margin:10px 0 4px}\n.u-cc-row{display:flex;flex-direction:column;gap:4px;max-width:78%}\n.u-cc-in{align-self:flex-start;align-items:flex-start}\n.u-cc-out{align-self:flex-end;align-items:flex-end}\n.u-cc-bub{display:block;padding:9px 14px;border:0;border-radius:20px;white-space:pre-wrap;overflow-wrap:anywhere;font:inherit;line-height:1.35;text-align:start}\n.u-cc-in .u-cc-bub{background:var(--u-chat-in);color:var(--u-chat-in-ink);border-end-start-radius:6px}\n.u-cc-out .u-cc-bub{background:var(--u-chat-out);color:var(--u-chat-out-ink);border-end-end-radius:6px}\n.u-cc-pending[data-state=\"queued\"] .u-cc-bub,.u-cc-pending[data-state=\"queued\"] .u-cc-media,.u-cc-pending[data-state=\"sending\"] .u-cc-media,.u-cc-pending[data-state=\"uploading\"] .u-cc-media{opacity:.6}\n.u-cc-bub-failed{opacity:.75}\n.u-cc-cap{font-size:13px;color:var(--u-muted);padding-inline:6px}\n.u-cc-danger,.u-cc-danger.u-cc-link{color:var(--u-danger)}\n.u-cc-link{background:none;border:0;padding:0 6px;font:inherit;font-size:13px;color:var(--u-link);min-height:32px}\n.u-cc-media{display:block;border:0;padding:0;background:var(--u-surface-3);border-radius:16px;overflow:hidden;width:min(60cqw,320px);max-width:100%}\n.u-cc-media img{display:block;width:100%;height:auto;max-height:360px;object-fit:cover}\n.u-cc-video{max-height:360px}\n.u-cc-voice{display:flex;flex-direction:column;gap:4px;max-width:100%}\n.u-cc-voice audio{max-width:min(260px,70cqw)}\n.u-cc-trans{font-size:15px;color:var(--u-muted);padding-inline:6px}\n.u-cc-file{display:inline-flex;align-items:center;gap:6px;text-decoration:none}\n.u-cc-file svg{width:18px;height:18px}\n.u-cc-upload{display:flex;align-items:center;gap:8px;flex-wrap:wrap;width:min(60cqw,320px);max-width:100%}\n.u-cc-bar{flex:1 0 100%;height:4px;border-radius:2px;background:var(--u-surface-3);overflow:hidden}\n.u-cc-bar>span{display:block;height:100%;background:var(--u-muted);transition:width .2s}\n.u-cc-actions{display:flex;gap:6px}\n.u-cc-btn{border:1px solid var(--u-border);background:var(--u-surface);color:var(--u-text);border-radius:999px;padding:8px 16px;min-height:44px;font:inherit;font-size:15px}\n.u-cc-empty{margin:auto;text-align:center;color:var(--u-muted);max-width:300px}\n.u-cc-skel{display:flex;flex-direction:column;gap:10px;margin-top:auto}\n.u-cc-sk{display:block;height:40px;border-radius:20px;background:var(--u-surface-3);width:45%}\n.u-cc-sk-in{align-self:flex-start}.u-cc-sk-out{align-self:flex-end;width:35%}.u-cc-sk-wide{width:62%}\n.u-cc-older{display:flex;justify-content:center;padding:8px}\n.u-cc-spinner{width:18px;height:18px;border-radius:50%;border:2px solid var(--u-border);border-top-color:var(--u-muted);animation:u-spin 1s linear infinite}\n.u-cc-pill{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);display:inline-flex;align-items:center;gap:4px;border:1px solid var(--u-border);background:var(--u-surface);color:var(--u-text);border-radius:999px;padding:8px 16px;min-height:44px;font:inherit;font-size:15px}\n.u-cc-pill svg{width:16px;height:16px}\n.u-cc-banner{flex:none;text-align:center;font-size:14px;color:var(--u-muted);background:var(--u-surface-2);padding:6px 12px}\n.u-cc-fail{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--u-muted);padding:24px;text-align:center}\n.u-cc-readonly{flex:none;text-align:center;color:var(--u-muted);font-size:15px;padding:14px 16px calc(14px + var(--u-kb))}\n.u-cc-composer{flex:none;display:flex;flex-direction:column;gap:6px;padding:8px 10px calc(8px + var(--u-kb));background:var(--u-bg)}\n.u-cc-safe .u-cc-composer,.u-cc-safe .u-cc-readonly{padding-bottom:calc(8px + max(var(--u-kb), env(safe-area-inset-bottom, 0px)))}\n.u-cc-bar-row{display:flex;align-items:flex-end;gap:8px}\n.u-cc-round{flex:none;display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;border:0;background:var(--u-surface-3);color:var(--u-text);padding:0}\n.u-cc-round svg{width:22px;height:22px}\n.u-cc-field{flex:1;min-width:0;display:flex;align-items:flex-end;gap:4px;border:1px solid var(--u-border);background:var(--u-surface-2);border-radius:23px;padding:0 1px 0 14px;min-height:46px}\n.u-cc-field:focus-within{outline:2px solid var(--u-highlight);outline-offset:1px}\n.u-cc-field textarea{flex:1;min-width:0;border:0;background:transparent;color:var(--u-text);font:inherit;font-size:16px;line-height:22px;padding:11px 0;resize:none;outline:none}\n.u-cc-field textarea::placeholder{color:var(--u-muted)}\n/* The field draws the focus ring, so the textarea inside it doesn't draw a second one. */\n.uplift .u-cc-field textarea:focus-visible{outline:none}\n.u-cc-send,.u-cc-mic{flex:none;display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;border:0;padding:0}\n.u-cc-send{background:var(--u-chat-out);color:var(--u-chat-out-ink);transform:scale(.84)}\n.u-cc-send:disabled{opacity:.4}\n.u-cc-mic{background:none;color:var(--u-muted)}\n.u-cc-send svg,.u-cc-mic svg{width:22px;height:22px}\n.u-cc-recording{align-items:center;gap:8px;color:var(--u-text)}\n.u-cc-recording>span:not(.u-cc-dot){flex:1}\n.u-cc-recording audio{flex:1;min-width:0;height:40px}\n.u-cc-dot{flex:none;width:10px;height:10px;border-radius:50%;background:var(--u-danger);animation:u-cc-blink 1s ease-in-out infinite}\n@keyframes u-cc-blink{50%{opacity:.3}}\n.u-cc-stop{display:block;width:14px;height:14px;border-radius:3px;background:currentColor}\n.u-cc-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}\n.u-cc-chip{display:inline-flex;align-items:center;gap:2px;max-width:100%;border:1px solid var(--u-border);background:var(--u-surface-2);border-radius:999px;padding:0 0 0 12px;font-size:14px}\n.u-cc-chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n.u-cc-chip button{display:inline-grid;place-items:center;width:40px;height:40px;border:0;background:none;color:var(--u-muted);padding:0}\n.u-cc-chip svg{width:16px;height:16px}\n.u-cc-notice{font-size:14px;color:var(--u-danger)}\n.u-cc-light{position:fixed;inset:0;z-index:2147483001;display:grid;place-items:center;padding:16px;background:var(--u-chat-scrim)}\n.u-cc-light img{max-width:100%;max-height:100%;object-fit:contain}\n.u-cc-light-x{position:absolute;top:calc(12px + env(safe-area-inset-top, 0px));right:12px;display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;border:0;background:var(--u-surface);color:var(--u-text);padding:0}\n";
13
13
  /** Add the panel stylesheet to `doc` once. Safe to call on every render. */
14
14
  export declare function injectStyles(doc?: Document | undefined): void;
15
15
  //# sourceMappingURL=styles.d.ts.map
package/dist/styles.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../src/styles.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AACH,eAAO,MAAM,gBAAgB,0BAA0B,CAAC;AAExD,eAAO,MAAM,YAAY,yrlDAqjBxB,CAAC;AAEF,4EAA4E;AAC5E,wBAAgB,YAAY,CAAC,GAAG,GAAE,QAAQ,GAAG,SAAkE,GAAG,IAAI,CAMrH"}
1
+ {"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../src/styles.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AACH,eAAO,MAAM,gBAAgB,0BAA0B,CAAC;AAExD,eAAO,MAAM,YAAY,m33DAipBxB,CAAC;AAEF,4EAA4E;AAC5E,wBAAgB,YAAY,CAAC,GAAG,GAAE,QAAQ,GAAG,SAAkE,GAAG,IAAI,CAMrH"}
package/dist/styles.js CHANGED
@@ -50,7 +50,7 @@ export const upliftStyles = `
50
50
  .u-iconbtn .u-ai-spark svg{width:14px;height:14px}
51
51
  .u-iconbtn svg{width:16px;height:16px}
52
52
  .u-iconbtn[aria-pressed="true"]{color:var(--u-text);background:var(--u-surface-2)}
53
- .u-bulkbtn svg{width:14px;height:14px}
53
+ .u-bulkbtn svg{width:16px;height:16px}
54
54
  .uplift.u-full{position:fixed;inset:0;z-index:2147483000;border-radius:0;border:0;display:flex;flex-direction:column}
55
55
  .uplift.u-full .u-split{flex:1;height:auto;min-height:0}
56
56
  .u-back{display:none;border:1px solid var(--u-border);background:var(--u-bg);border-radius:8px;padding:6px 10px;font-size:16px;min-height:36px;align-items:center;flex:none}
@@ -69,8 +69,9 @@ export const upliftStyles = `
69
69
  .u-sortgroup button{border:0;background:none;border-radius:999px;padding:4px 9px;font-size:12px;font-weight:600;color:var(--u-muted);min-height:28px;white-space:nowrap}
70
70
  .u-sortgroup button:hover{color:var(--u-text)}
71
71
  .u-sortgroup button[aria-pressed="true"]{background:var(--u-bg);color:var(--u-text);box-shadow:0 1px 2px rgba(0,0,0,.08),0 0 0 1px var(--u-border)}
72
- .u-rows li.u-bulkrow{border-bottom:0;padding:10px 12px}
73
- .u-bulkrow .u-bulkbtn{display:inline-flex;align-items:center;justify-content:center;gap:2px;width:100%;border:1px dashed var(--u-border);border-radius:10px;background:none;color:var(--u-muted);padding:8px 10px;min-height:36px;font:inherit;font-size:13px;cursor:pointer}
72
+ /* Bulk generate is a frozen row: it stays at the bottom of the list while the clients scroll above it. */
73
+ .u-rows li.u-bulkrow{position:sticky;bottom:0;z-index:1;margin-top:auto;border-bottom:0;border-top:1px solid var(--u-border);background:var(--u-bg);padding:10px 12px}
74
+ .u-bulkrow .u-bulkbtn{display:inline-flex;align-items:center;justify-content:center;gap:2px;width:100%;border:1px dashed var(--u-border);border-radius:10px;background:none;color:var(--u-muted);padding:10px 12px;min-height:44px;font:inherit;font-size:15px;font-weight:600;cursor:pointer}
74
75
  .u-bulkrow .u-bulkbtn span{margin-left:6px}
75
76
  .u-bulkrow .u-bulkbtn:hover:not(:disabled){color:var(--u-accent);border-color:var(--u-accent);background:var(--u-surface-2)}
76
77
  .u-bulkrow .u-bulkbtn:disabled{opacity:.45;cursor:not-allowed}
@@ -78,7 +79,7 @@ export const upliftStyles = `
78
79
  .u-clear-btn svg{width:15px;height:15px}
79
80
  .u-clear-btn:hover:not(:disabled){color:var(--u-text);background:var(--u-surface-2)}
80
81
  .u-clear-btn:disabled{opacity:.4;cursor:not-allowed}
81
- .u-rows{list-style:none;margin:0;padding:0;overflow:auto;flex:1;min-height:0}
82
+ .u-rows{list-style:none;margin:0;padding:0;overflow:auto;flex:1;min-height:0;display:flex;flex-direction:column}
82
83
  .u-rows li{display:flex;flex-wrap:wrap;align-items:stretch;border-bottom:1px solid var(--u-border)}
83
84
  .u-row-open{flex:1;min-width:0;text-align:left;border:0;background:transparent;padding:11px 12px;display:grid;grid-template-columns:36px minmax(0,1fr);gap:2px 10px;min-height:64px}
84
85
  .u-av{grid-row:span 3;width:36px;height:36px;border-radius:999px;display:grid;place-items:center;font-size:13px;font-weight:700;color:#fff}
@@ -86,6 +87,7 @@ export const upliftStyles = `
86
87
  .u-r-top{display:flex;gap:6px;align-items:baseline;min-width:0}
87
88
  .u-r-name{font-weight:600;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
88
89
  .u-r-time{margin-left:auto;font-size:12.5px;color:var(--u-muted);flex:none}
90
+ .u-r-chev{display:none;flex:none;align-self:center;margin-left:-2px;color:var(--u-muted)}.u-r-chev svg{width:15px;height:15px}
89
91
  .u-r-line{font-size:13.5px;color:var(--u-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
90
92
  .u-r-tags{display:flex;flex-wrap:wrap;gap:4px}
91
93
  .u-tag{font-size:12px;font-weight:600;border-radius:999px;padding:1px 8px;border:1px solid var(--u-border);color:var(--u-muted);background:var(--u-surface-2)}
@@ -121,15 +123,8 @@ export const upliftStyles = `
121
123
  /* ---- Composer footer (port of native ChatPage footer) ---- */
122
124
  .u-composer{display:flex;flex-direction:column;gap:8px;padding:10px 16px 12px;background:var(--u-surface-2);border-top:1px solid var(--u-border)}
123
125
  .u-composer>*:empty{display:none}
124
- .u-rail{align-self:center;display:inline-flex;align-items:center;gap:6px;border:0;background:transparent;color:var(--u-muted);font-size:12px;padding:2px 10px;border-radius:999px;min-height:24px}
125
- .u-rail:hover{color:var(--u-text);background:var(--u-surface-3)}
126
- .u-rail svg{width:14px;height:14px}
127
- .u-extras-wrap{position:relative;display:flex;flex-direction:column}
128
- .u-extras-wrap>.u-rail{align-self:flex-end}
129
- .u-extras-wrap>.u-rail[aria-expanded="true"]{position:absolute;top:0;right:0;z-index:1}
130
- .u-extras-wrap:has(>.u-rail[aria-expanded="true"]) .u-ag-h{padding-right:34px}
131
- .u-extras{display:contents}
132
- .u-extras-off{display:none}
126
+ /* Its menus open upward, over the conversation: a host that makes the composer scroll must not clip them. */
127
+ .uplift .u-composer.u-composer-menu{overflow:visible!important}
133
128
  /* draft grid (ComposerAssistant) */
134
129
  .u-ag{display:flex;flex-direction:column;gap:6px}
135
130
  .u-ag-h{display:flex;align-items:center;gap:2px}
@@ -218,7 +213,7 @@ export const upliftStyles = `
218
213
  .u-send-btn svg{width:15px;height:15px;stroke:var(--u-accent-ink)}
219
214
  .u-send-btn:hover:not(:disabled){transform:translateY(-1px)}
220
215
  .u-send-btn:disabled{opacity:.4;cursor:not-allowed}
221
- .u-send-btn-text{width:auto;padding:0 12px;font-size:12.5px;font-weight:600;white-space:nowrap}
216
+ .u-send-btn-text{width:auto;padding:0 10px 0 12px;gap:6px;font-size:12.5px;font-weight:600;white-space:nowrap}
222
217
  .u-gen-btn{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;min-height:0;padding:0;flex:none;border:0;border-radius:999px;background:transparent;color:var(--u-highlight);transition:background .15s}
223
218
  .u-gen-btn svg{width:16px;height:16px}
224
219
  .u-gen-btn:hover:not(:disabled){background:var(--u-highlight-soft)}
@@ -435,10 +430,25 @@ export const upliftStyles = `
435
430
  .u-chan-badge{display:inline-flex;align-items:center;justify-content:center;position:absolute;right:-2px;bottom:-2px;width:16px;height:16px;border-radius:50%;color:#fff;border:2px solid var(--u-bg);box-sizing:content-box}
436
431
  .u-chan-wa{background:#25d366}
437
432
  .u-chan-sms{background:var(--u-highlight)}
433
+ .u-chan-app{background:var(--u-text);color:var(--u-bg)}
438
434
  .u-r-av{grid-row:span 3;align-self:start}
439
435
  .u-r-av .u-av{grid-row:auto}
440
436
  .u-av-wrap{position:relative;display:inline-flex;flex:none}
441
437
  .u-head-status{margin-left:4px}
438
+ .u-chan-ctl{position:relative;display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}
439
+ .u-chan-pick{display:inline-flex;align-items:center;gap:2px;border:0;background:none;padding:2px;margin:-2px 0;border-radius:6px;font:inherit;color:inherit;cursor:pointer}
440
+ .u-chan-pick:hover{color:var(--u-text);background:var(--u-surface-2)}
441
+ .u-chan-pick svg{width:14px;height:14px}
442
+ .u-chan-reach{font-size:11.5px;padding:0 7px}
443
+ .u-chan-menu{position:absolute;top:calc(100% + 6px);left:0;z-index:4;min-width:200px;display:flex;flex-direction:column;padding:4px;background:var(--u-bg);border:1px solid var(--u-border);border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.18)}
444
+ .u-chan-item{display:flex;flex-direction:column;align-items:flex-start;gap:1px;text-align:left;border:0;background:none;color:var(--u-text);font:inherit;font-size:14px;padding:8px 10px 8px 28px;border-radius:7px;position:relative;cursor:pointer}
445
+ .u-chan-item:hover,.u-chan-item:focus-visible{background:var(--u-surface-2);outline:none}
446
+ .u-chan-item[aria-checked="true"]::before{content:"";position:absolute;left:10px;top:13px;width:9px;height:5px;border-left:2px solid var(--u-link);border-bottom:2px solid var(--u-link);transform:rotate(-45deg)}
447
+ .u-chan-item[aria-disabled="true"]{color:var(--u-muted);cursor:not-allowed}
448
+ .u-chan-item small{font-size:12px;color:var(--u-muted)}
449
+ .u-chan-note{margin:8px 16px;background:var(--u-highlight-soft);border:1px solid color-mix(in srgb,var(--u-highlight) 35%,transparent)}
450
+ .u-chan-note.u-note-err{background:color-mix(in srgb,var(--u-danger) 9%,var(--u-bg));border-color:color-mix(in srgb,var(--u-danger) 35%,transparent)}
451
+ .u-chan-note-x{min-height:30px;padding:4px 12px}
442
452
  /* attachments on thread messages */
443
453
  .u-att{display:flex;flex-wrap:wrap;gap:6px;max-width:78%}
444
454
  .u-att-out{align-self:flex-end;justify-content:flex-end}.u-att-in{align-self:flex-start}
@@ -470,8 +480,7 @@ export const upliftStyles = `
470
480
  .u-pill .u-editor-sugg,.u-editor-sugg{background:var(--u-surface-2);border-radius:10px}
471
481
  .u-editor-sugg:focus-visible{outline:2px solid var(--u-highlight);outline-offset:1px}
472
482
  .u-sugg-label{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--u-highlight)}
473
- .u-sugg-label i{width:7px;height:7px;border-radius:50%;background:currentColor;display:inline-block}
474
- .u-sugg-label em{font-style:normal;font-weight:400;color:var(--u-muted)}
483
+ .u-sugg-label svg{width:13px;height:13px;flex:none}
475
484
  .u-sugg-text{color:var(--u-muted)}
476
485
  /* Stock intro: no pill highlight, the text itself shimmers gold (gradient clipped to the glyphs). Reduced motion leaves a still gold gradient. */
477
486
  .u-seg-lock{cursor:default;user-select:text;padding:0;margin:0;border:0;border-radius:0;font-weight:600;background:linear-gradient(110deg,var(--u-gold-ink) 0%,var(--u-gold-ink-hi) 30%,var(--u-gold-ink) 50%,var(--u-gold-ink-hi) 70%,var(--u-gold-ink) 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:u-shimmer 4s linear infinite}
@@ -552,6 +561,8 @@ export const upliftStyles = `
552
561
  .u-split.u-show-thread .u-list{display:none}
553
562
  .u-split:not(.u-show-thread) .u-pane{display:none}
554
563
  .u-back{display:inline-flex}
564
+ /* A row opens its thread full screen here, so it says so. */
565
+ .u-r-chev{display:inline-flex}
555
566
  .u-toolbar-acts{display:inline-flex;flex:none;margin-left:auto}
556
567
  .u-toolbar-acts .u-head-acts{margin-left:0}
557
568
  /* Phone widths: the toolbar wraps its buttons rather than cutting them off; the conversation header
@@ -574,6 +585,87 @@ export const upliftStyles = `
574
585
  .u-sheet-wrap{padding:0}
575
586
  .u-sheet{width:100%;height:100%;border-radius:0}
576
587
  }
588
+ /* ── ClientChat: a client's chat with their coach. Fills the host's box; every colour is a token. ── */
589
+ :where(.uplift.u-chat){
590
+ --u-font:inherit;--u-kb:0px;
591
+ --u-chat-out:var(--u-accent);--u-chat-out-ink:var(--u-accent-ink);
592
+ --u-chat-in:#e9e9eb;--u-chat-in-ink:var(--u-text);--u-chat-scrim:rgba(0,0,0,.88);
593
+ }
594
+ :where(.uplift.u-chat[data-theme="dark"],[data-theme="dark"] .uplift.u-chat){--u-chat-in:#26262a;color-scheme:dark}
595
+ .uplift.u-chat{border:0;border-radius:0;height:100%;display:flex;flex-direction:column;container-name:chat;font-size:16px}
596
+ .u-cc-head{display:flex;align-items:center;gap:4px;padding:8px 12px;flex:none}
597
+ .u-cc-back{display:inline-grid;place-items:center;width:44px;height:44px;border:0;background:none;color:var(--u-text);padding:0;margin-inline-start:-10px}
598
+ .u-cc-back svg{width:26px;height:26px}
599
+ .u-cc-title{font-size:19px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
600
+ .u-cc-wrap{position:relative;flex:1;min-height:0;display:flex}
601
+ .u-cc-thread{flex:1;min-width:0;overflow-y:auto;overscroll-behavior:contain;padding:8px 12px 12px;display:flex;flex-direction:column;gap:6px}
602
+ .u-cc-note{align-self:center;text-align:center;color:var(--u-muted);font-size:14px;margin:10px 0 4px}
603
+ .u-cc-row{display:flex;flex-direction:column;gap:4px;max-width:78%}
604
+ .u-cc-in{align-self:flex-start;align-items:flex-start}
605
+ .u-cc-out{align-self:flex-end;align-items:flex-end}
606
+ .u-cc-bub{display:block;padding:9px 14px;border:0;border-radius:20px;white-space:pre-wrap;overflow-wrap:anywhere;font:inherit;line-height:1.35;text-align:start}
607
+ .u-cc-in .u-cc-bub{background:var(--u-chat-in);color:var(--u-chat-in-ink);border-end-start-radius:6px}
608
+ .u-cc-out .u-cc-bub{background:var(--u-chat-out);color:var(--u-chat-out-ink);border-end-end-radius:6px}
609
+ .u-cc-pending[data-state="queued"] .u-cc-bub,.u-cc-pending[data-state="queued"] .u-cc-media,.u-cc-pending[data-state="sending"] .u-cc-media,.u-cc-pending[data-state="uploading"] .u-cc-media{opacity:.6}
610
+ .u-cc-bub-failed{opacity:.75}
611
+ .u-cc-cap{font-size:13px;color:var(--u-muted);padding-inline:6px}
612
+ .u-cc-danger,.u-cc-danger.u-cc-link{color:var(--u-danger)}
613
+ .u-cc-link{background:none;border:0;padding:0 6px;font:inherit;font-size:13px;color:var(--u-link);min-height:32px}
614
+ .u-cc-media{display:block;border:0;padding:0;background:var(--u-surface-3);border-radius:16px;overflow:hidden;width:min(60cqw,320px);max-width:100%}
615
+ .u-cc-media img{display:block;width:100%;height:auto;max-height:360px;object-fit:cover}
616
+ .u-cc-video{max-height:360px}
617
+ .u-cc-voice{display:flex;flex-direction:column;gap:4px;max-width:100%}
618
+ .u-cc-voice audio{max-width:min(260px,70cqw)}
619
+ .u-cc-trans{font-size:15px;color:var(--u-muted);padding-inline:6px}
620
+ .u-cc-file{display:inline-flex;align-items:center;gap:6px;text-decoration:none}
621
+ .u-cc-file svg{width:18px;height:18px}
622
+ .u-cc-upload{display:flex;align-items:center;gap:8px;flex-wrap:wrap;width:min(60cqw,320px);max-width:100%}
623
+ .u-cc-bar{flex:1 0 100%;height:4px;border-radius:2px;background:var(--u-surface-3);overflow:hidden}
624
+ .u-cc-bar>span{display:block;height:100%;background:var(--u-muted);transition:width .2s}
625
+ .u-cc-actions{display:flex;gap:6px}
626
+ .u-cc-btn{border:1px solid var(--u-border);background:var(--u-surface);color:var(--u-text);border-radius:999px;padding:8px 16px;min-height:44px;font:inherit;font-size:15px}
627
+ .u-cc-empty{margin:auto;text-align:center;color:var(--u-muted);max-width:300px}
628
+ .u-cc-skel{display:flex;flex-direction:column;gap:10px;margin-top:auto}
629
+ .u-cc-sk{display:block;height:40px;border-radius:20px;background:var(--u-surface-3);width:45%}
630
+ .u-cc-sk-in{align-self:flex-start}.u-cc-sk-out{align-self:flex-end;width:35%}.u-cc-sk-wide{width:62%}
631
+ .u-cc-older{display:flex;justify-content:center;padding:8px}
632
+ .u-cc-spinner{width:18px;height:18px;border-radius:50%;border:2px solid var(--u-border);border-top-color:var(--u-muted);animation:u-spin 1s linear infinite}
633
+ .u-cc-pill{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);display:inline-flex;align-items:center;gap:4px;border:1px solid var(--u-border);background:var(--u-surface);color:var(--u-text);border-radius:999px;padding:8px 16px;min-height:44px;font:inherit;font-size:15px}
634
+ .u-cc-pill svg{width:16px;height:16px}
635
+ .u-cc-banner{flex:none;text-align:center;font-size:14px;color:var(--u-muted);background:var(--u-surface-2);padding:6px 12px}
636
+ .u-cc-fail{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--u-muted);padding:24px;text-align:center}
637
+ .u-cc-readonly{flex:none;text-align:center;color:var(--u-muted);font-size:15px;padding:14px 16px calc(14px + var(--u-kb))}
638
+ .u-cc-composer{flex:none;display:flex;flex-direction:column;gap:6px;padding:8px 10px calc(8px + var(--u-kb));background:var(--u-bg)}
639
+ .u-cc-safe .u-cc-composer,.u-cc-safe .u-cc-readonly{padding-bottom:calc(8px + max(var(--u-kb), env(safe-area-inset-bottom, 0px)))}
640
+ .u-cc-bar-row{display:flex;align-items:flex-end;gap:8px}
641
+ .u-cc-round{flex:none;display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;border:0;background:var(--u-surface-3);color:var(--u-text);padding:0}
642
+ .u-cc-round svg{width:22px;height:22px}
643
+ .u-cc-field{flex:1;min-width:0;display:flex;align-items:flex-end;gap:4px;border:1px solid var(--u-border);background:var(--u-surface-2);border-radius:23px;padding:0 1px 0 14px;min-height:46px}
644
+ .u-cc-field:focus-within{outline:2px solid var(--u-highlight);outline-offset:1px}
645
+ .u-cc-field textarea{flex:1;min-width:0;border:0;background:transparent;color:var(--u-text);font:inherit;font-size:16px;line-height:22px;padding:11px 0;resize:none;outline:none}
646
+ .u-cc-field textarea::placeholder{color:var(--u-muted)}
647
+ /* The field draws the focus ring, so the textarea inside it doesn't draw a second one. */
648
+ .uplift .u-cc-field textarea:focus-visible{outline:none}
649
+ .u-cc-send,.u-cc-mic{flex:none;display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;border:0;padding:0}
650
+ .u-cc-send{background:var(--u-chat-out);color:var(--u-chat-out-ink);transform:scale(.84)}
651
+ .u-cc-send:disabled{opacity:.4}
652
+ .u-cc-mic{background:none;color:var(--u-muted)}
653
+ .u-cc-send svg,.u-cc-mic svg{width:22px;height:22px}
654
+ .u-cc-recording{align-items:center;gap:8px;color:var(--u-text)}
655
+ .u-cc-recording>span:not(.u-cc-dot){flex:1}
656
+ .u-cc-recording audio{flex:1;min-width:0;height:40px}
657
+ .u-cc-dot{flex:none;width:10px;height:10px;border-radius:50%;background:var(--u-danger);animation:u-cc-blink 1s ease-in-out infinite}
658
+ @keyframes u-cc-blink{50%{opacity:.3}}
659
+ .u-cc-stop{display:block;width:14px;height:14px;border-radius:3px;background:currentColor}
660
+ .u-cc-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
661
+ .u-cc-chip{display:inline-flex;align-items:center;gap:2px;max-width:100%;border:1px solid var(--u-border);background:var(--u-surface-2);border-radius:999px;padding:0 0 0 12px;font-size:14px}
662
+ .u-cc-chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
663
+ .u-cc-chip button{display:inline-grid;place-items:center;width:40px;height:40px;border:0;background:none;color:var(--u-muted);padding:0}
664
+ .u-cc-chip svg{width:16px;height:16px}
665
+ .u-cc-notice{font-size:14px;color:var(--u-danger)}
666
+ .u-cc-light{position:fixed;inset:0;z-index:2147483001;display:grid;place-items:center;padding:16px;background:var(--u-chat-scrim)}
667
+ .u-cc-light img{max-width:100%;max-height:100%;object-fit:contain}
668
+ .u-cc-light-x{position:absolute;top:calc(12px + env(safe-area-inset-top, 0px));right:12px;display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;border:0;background:var(--u-surface);color:var(--u-text);padding:0}
577
669
  `;
578
670
  /** Add the panel stylesheet to `doc` once. Safe to call on every render. */
579
671
  export function injectStyles(doc = typeof document === "undefined" ? undefined : document) {
package/dist/styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"styles.js","sourceRoot":"","sources":["../src/styles.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,uBAAuB,CAAC;AAExD,MAAM,CAAC,MAAM,YAAY,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqjB3B,CAAC;AAEF,4EAA4E;AAC5E,MAAM,UAAU,YAAY,CAAC,MAA4B,OAAO,QAAQ,KAAK,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ;IAC7G,IAAI,CAAC,GAAG,IAAI,GAAG,CAAC,cAAc,CAAC,gBAAgB,CAAC;QAAE,OAAO;IACzD,MAAM,EAAE,GAAG,GAAG,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IACtC,EAAE,CAAC,EAAE,GAAG,gBAAgB,CAAC;IACzB,EAAE,CAAC,WAAW,GAAG,YAAY,CAAC;IAC9B,GAAG,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;AAC3B,CAAC"}
1
+ {"version":3,"file":"styles.js","sourceRoot":"","sources":["../src/styles.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,uBAAuB,CAAC;AAExD,MAAM,CAAC,MAAM,YAAY,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAipB3B,CAAC;AAEF,4EAA4E;AAC5E,MAAM,UAAU,YAAY,CAAC,MAA4B,OAAO,QAAQ,KAAK,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ;IAC7G,IAAI,CAAC,GAAG,IAAI,GAAG,CAAC,cAAc,CAAC,gBAAgB,CAAC;QAAE,OAAO;IACzD,MAAM,EAAE,GAAG,GAAG,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IACtC,EAAE,CAAC,EAAE,GAAG,gBAAgB,CAAC;IACzB,EAAE,CAAC,WAAW,GAAG,YAAY,CAAC;IAC9B,GAAG,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;AAC3B,CAAC"}
package/dist/useChatUnread.d.ts ADDED
@@ -0,0 +1,8 @@
1
+ import type { ChatClient } from "@uplifted/sdk";
2
+ /**
3
+ * How many coach messages the client has not read, kept live, for a tab badge or the app icon
4
+ * (`navigator.setAppBadge`) while <ClientChat> is not on screen. Pass null to stop. Counts the
5
+ * newest page of the thread (up to 50), which is plenty for a badge.
6
+ */
7
+ export declare function useChatUnread(client: ChatClient | null): number;
8
+ //# sourceMappingURL=useChatUnread.d.ts.map
package/dist/useChatUnread.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useChatUnread.d.ts","sourceRoot":"","sources":["../src/useChatUnread.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAe,MAAM,eAAe,CAAC;AAI7D;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,MAAM,EAAE,UAAU,GAAG,IAAI,GAAG,MAAM,CAqC/D"}
package/dist/useChatUnread.js ADDED
@@ -0,0 +1,63 @@
1
+ import { useEffect, useState } from "react";
2
+ const BACKOFF_MS = [2000, 5000, 15000, 30000];
3
+ /**
4
+ * How many coach messages the client has not read, kept live, for a tab badge or the app icon
5
+ * (`navigator.setAppBadge`) while <ClientChat> is not on screen. Pass null to stop. Counts the
6
+ * newest page of the thread (up to 50), which is plenty for a badge.
7
+ */
8
+ export function useChatUnread(client) {
9
+ const [count, setCount] = useState(0);
10
+ useEffect(() => {
11
+ if (!client) {
12
+ setCount(0);
13
+ return;
14
+ }
15
+ const ctrl = new AbortController();
16
+ let readAt = null;
17
+ const coach = new Map();
18
+ const recount = () => {
19
+ let n = 0;
20
+ for (const at of coach.values())
21
+ if (!readAt || at > readAt)
22
+ n++;
23
+ setCount(n);
24
+ };
25
+ const take = (m) => { if (m.from === "coach")
26
+ coach.set(m.id, m.at); };
27
+ (async () => {
28
+ let step = 0;
29
+ while (!ctrl.signal.aborted) {
30
+ try {
31
+ const page = await client.thread();
32
+ readAt = page.clientReadAt;
33
+ page.messages.forEach(take);
34
+ recount();
35
+ await client.stream((e) => {
36
+ if (e.type === "connected")
37
+ step = 0;
38
+ else if (e.type === "message") {
39
+ take(e.data);
40
+ recount();
41
+ }
42
+ else if (e.type === "read" && e.data.side === "client") {
43
+ if (!readAt || e.data.at > readAt)
44
+ readAt = e.data.at;
45
+ recount();
46
+ }
47
+ }, { signal: ctrl.signal });
48
+ }
49
+ catch (e) {
50
+ const code = e?.code;
51
+ if (code === "unauthorized" || code === "origin_not_allowed")
52
+ return;
53
+ }
54
+ if (ctrl.signal.aborted)
55
+ return;
56
+ await new Promise((r) => setTimeout(r, BACKOFF_MS[Math.min(step++, BACKOFF_MS.length - 1)]));
57
+ }
58
+ })();
59
+ return () => ctrl.abort();
60
+ }, [client]);
61
+ return count;
62
+ }
63
+ //# sourceMappingURL=useChatUnread.js.map
package/dist/useChatUnread.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useChatUnread.js","sourceRoot":"","sources":["../src/useChatUnread.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAG5C,MAAM,UAAU,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC;AAE9C;;;;GAIG;AACH,MAAM,UAAU,aAAa,CAAC,MAAyB;IACrD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IACtC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,MAAM,EAAE,CAAC;YAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;YAAC,OAAO;QAAC,CAAC;QACrC,MAAM,IAAI,GAAG,IAAI,eAAe,EAAE,CAAC;QACnC,IAAI,MAAM,GAAkB,IAAI,CAAC;QACjC,MAAM,KAAK,GAAG,IAAI,GAAG,EAAkB,CAAC;QACxC,MAAM,OAAO,GAAG,GAAG,EAAE;YACnB,IAAI,CAAC,GAAG,CAAC,CAAC;YACV,KAAK,MAAM,EAAE,IAAI,KAAK,CAAC,MAAM,EAAE;gBAAE,IAAI,CAAC,MAAM,IAAI,EAAE,GAAG,MAAM;oBAAE,CAAC,EAAE,CAAC;YACjE,QAAQ,CAAC,CAAC,CAAC,CAAC;QACd,CAAC,CAAC;QACF,MAAM,IAAI,GAAG,CAAC,CAAc,EAAE,EAAE,GAAG,IAAI,CAAC,CAAC,IAAI,KAAK,OAAO;YAAE,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;QACpF,CAAC,KAAK,IAAI,EAAE;YACV,IAAI,IAAI,GAAG,CAAC,CAAC;YACb,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,CAAC;gBAC5B,IAAI,CAAC;oBACH,MAAM,IAAI,GAAG,MAAM,MAAM,CAAC,MAAM,EAAE,CAAC;oBACnC,MAAM,GAAG,IAAI,CAAC,YAAY,CAAC;oBAC3B,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;oBAC5B,OAAO,EAAE,CAAC;oBACV,MAAM,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE;wBACxB,IAAI,CAAC,CAAC,IAAI,KAAK,WAAW;4BAAE,IAAI,GAAG,CAAC,CAAC;6BAChC,IAAI,CAAC,CAAC,IAAI,KAAK,SAAS,EAAE,CAAC;4BAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;4BAAC,OAAO,EAAE,CAAC;wBAAC,CAAC;6BACtD,IAAI,CAAC,CAAC,IAAI,KAAK,MAAM,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE,CAAC;4BAAC,IAAI,CAAC,MAAM,IAAI,CAAC,CAAC,IAAI,CAAC,EAAE,GAAG,MAAM;gCAAE,MAAM,GAAG,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;4BAAC,OAAO,EAAE,CAAC;wBAAC,CAAC;oBAC/H,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC;gBAC9B,CAAC;gBAAC,OAAO,CAAC,EAAE,CAAC;oBACX,MAAM,IAAI,GAAI,CAAuB,EAAE,IAAI,CAAC;oBAC5C,IAAI,IAAI,KAAK,cAAc,IAAI,IAAI,KAAK,oBAAoB;wBAAE,OAAO;gBACvE,CAAC;gBACD,IAAI,IAAI,CAAC,MAAM,CAAC,OAAO;oBAAE,OAAO;gBAChC,MAAM,IAAI,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,UAAU,CAAC,CAAC,EAAE,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,EAAE,UAAU,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YAC/F,CAAC;QACH,CAAC,CAAC,EAAE,CAAC;QACL,OAAO,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;IAC5B,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IACb,OAAO,KAAK,CAAC;AACf,CAAC"}