/* Stockertim Chat (standalone) — namespace .chat-  · loads over entry.css.
   Two-pane on desktop (list + thread); single-pane with back nav on mobile. */
html{overflow-x:hidden}
/* CRITICAL: several chat elements set display:flex, which OVERRIDES the browser's
   [hidden]{display:none} — so `el.hidden = true` silently did nothing (this is why
   cancelling a quoted reply didn't clear the reply bar). Force it. */
.chat-body [hidden]{display:none!important}
.chat-body{background:radial-gradient(1100px 620px at 50% -10%,#0a1226 0,#04060a 60%);color:#e7edf7;min-height:100vh;overflow-x:hidden;max-width:100%}
.chat-wrap{max-width:1100px;margin:0 auto;padding:14px 14px 18px;box-sizing:border-box}

/* Full-height app (no site footer under it). */
.chat-app{display:grid;grid-template-columns:320px 1fr;gap:0;border:1px solid rgba(156,180,255,.14);border-radius:16px;overflow:hidden;
  background:#080d18;width:100%;box-sizing:border-box;
  height:calc(100dvh - var(--header-h,56px) - var(--safe-top,0px) - 32px);min-height:480px}

/* Not-signed-in CTA */
.chat-signin{max-width:440px;margin:8vh auto;text-align:center;padding:34px 24px;border:1px solid rgba(156,180,255,.14);
  border-radius:18px;background:#0a1120}
.chat-signin-emoji{font-size:40px}
.chat-signin h1{margin:10px 0 6px;font-size:24px;font-weight:850}
.chat-signin p{margin:0 auto 6px;max-width:360px;color:#8b98ad;font-size:14px;line-height:1.6}
.chat-signin-btn{display:inline-block;margin:16px 0 10px;background:var(--cyan,#44f1ff);color:#04121a;font-weight:800;
  padding:13px 24px;border-radius:12px;text-decoration:none}
.chat-signin-btn:hover{filter:brightness(1.06)}
.chat-signin-note{font-size:12px;color:#6b788f}

/* ── Chat list ──────────────────────────────────────────────────────────────*/
.chat-list{display:flex;flex-direction:column;min-height:0;border-right:1px solid rgba(156,180,255,.1);background:#0a1120}
.chat-list-hd{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:16px 16px 12px;border-bottom:1px solid rgba(156,180,255,.08)}
.chat-list-hd h1{margin:0;font-size:19px;font-weight:850;letter-spacing:-.01em}
.chat-list-me{font-family:var(--mono,ui-monospace,monospace);font-size:11px;color:#8b98ad;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chat-list-items{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch}
.chat-list-empty{padding:22px 16px;color:#7c8aa5;font-size:13px}
.chat-item{display:flex;align-items:center;gap:11px;width:100%;max-width:100%;overflow:hidden;box-sizing:border-box;text-align:left;background:transparent;border:none;
  padding:12px 15px;cursor:pointer;border-bottom:1px solid rgba(156,180,255,.05);transition:background .12s}
.chat-item:hover{background:rgba(156,180,255,.05)}
.chat-item.is-active{background:rgba(68,241,255,.09)}
.chat-item-av{flex:0 0 40px;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:15px;color:#04121a;background:linear-gradient(180deg,#5ef6ff,#2bd4e6)}
.chat-item-av.grp{background:linear-gradient(180deg,#a78bfa,#7c6cff);color:#fff}
.chat-item-main{flex:1;min-width:0}
.chat-item-name{font-weight:700;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-item-prev{font-size:12px;color:#8b98ad;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.chat-item-badge{flex:0 0 auto;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:#ff4d6a;color:#fff;
  font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center}
.chat-item-badge.at{background:#7c6cff}

/* ── Thread ──────────────────────────────────────────────────────────────────*/
.chat-thread{display:flex;flex-direction:column;min-height:0;min-width:0;max-width:100%;overflow:hidden}
.chat-thread-hd{display:flex;align-items:center;gap:10px;padding:13px 16px;border-bottom:1px solid rgba(156,180,255,.1);background:#0a1120;flex:0 0 auto}
.chat-back{display:none;background:transparent;border:none;color:#e7edf7;padding:4px;margin:-4px 2px -4px -6px;cursor:pointer;border-radius:8px}
.chat-back:hover{background:rgba(156,180,255,.08)}
.chat-thread-titles{flex:1;min-width:0;overflow:hidden}
.chat-thread-title{display:block;font-weight:800;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.chat-thread-sub{display:block;font-size:11.5px;color:#8b98ad;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.chat-msgs{flex:1;min-height:0;min-width:0;max-width:100%;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding:16px;display:flex;flex-direction:column;gap:8px}
.chat-welcome{margin:auto;text-align:center;max-width:340px;padding:20px}
.chat-welcome-emoji{font-size:34px}
.chat-welcome-head{font-size:17px;font-weight:800;margin:8px 0 4px}
.chat-welcome-sub{font-size:13.5px;color:#8b98ad;line-height:1.55;margin:0}

/* Message bubbles */
.chat-msg{max-width:78%;display:flex;flex-direction:column;gap:2px}
.chat-msg.me{align-self:flex-end;align-items:flex-end}
.chat-msg-from{font-size:11px;font-weight:700;color:#9db2ff;padding:0 4px}
/* Sender vs receiver are colour-coded like the best consumer messengers: the
   INCOMING bubble is a clearly-distinct neutral slate (lifted well off the dark
   canvas so it never blends into the background), the OUTGOING bubble carries the
   AlphaChat cyan. Asymmetric corners give each a subtle directional "tail". */
.chat-bubble{padding:9px 13px;border-radius:16px 16px 16px 5px;font-size:14px;line-height:1.5;white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere;
  max-width:100%;box-sizing:border-box;background:#28344e;color:#eaf1ff;border:1px solid rgba(156,180,255,.18)}
.chat-bubble a{word-break:break-all;color:#8fd7ff}
.chat-msg.me .chat-bubble{background:linear-gradient(180deg,#2bd4e6,#1eb6cc);color:#04121a;border-color:transparent;border-radius:16px 16px 5px 16px}
.chat-msg.me .chat-bubble a{color:#043a45}
.chat-msg-time{font-size:10px;color:#6b788f;padding:0 4px}
/* Edit-my-message: a sleek glass pencil tucked into the bubble's own top-right
   corner — tinted to blend into the cyan bubble, revealed on hover/focus, and
   clearly tappable. No longer a stray box under the message. */
.chat-msg{position:relative}
.chat-msg.me .chat-bubble{padding-right:28px}          /* keep text clear of the icon */
.chat-msg-edit{position:absolute;top:5px;right:6px;z-index:2;width:22px;height:22px;
  display:grid;place-items:center;padding:0;border:1px solid rgba(3,32,40,.22);border-radius:50%;
  background:rgba(3,26,34,.20);color:#043a45;cursor:pointer;font:12px/1 inherit;
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
  opacity:.42;transform:scale(.9);            /* gently visible so it's always discoverable + touch-tappable */
  transition:opacity .15s ease,transform .15s ease,background .15s,color .15s,border-color .15s}
.chat-msg.me:hover .chat-msg-edit,.chat-msg.me:focus-within .chat-msg-edit{opacity:.96;transform:scale(1)}
.chat-msg-edit:hover{background:rgba(3,26,34,.46);color:#eafcff;border-color:rgba(3,32,40,.5);opacity:1}
.chat-msg-edit:active{transform:scale(.88)}
.chat-edit-box{display:flex;flex-direction:column;gap:6px;min-width:200px}
.chat-edit-input{width:100%;box-sizing:border-box;background:rgba(4,18,26,.35);border:1px solid rgba(4,48,58,.45);
  color:#04121a;border-radius:9px;padding:7px 9px;font:inherit;font-size:14px;resize:vertical}
.chat-msg:not(.me) .chat-edit-input{background:rgba(8,12,22,.6);border-color:rgba(156,180,255,.25);color:#eaf2ff}
.chat-edit-actions{display:flex;gap:6px;justify-content:flex-end}
.chat-edit-actions button{border:0;border-radius:8px;padding:5px 11px;font:600 12px/1 inherit;cursor:pointer}
.chat-edit-save{background:#04303a;color:#7ef0ff}
.chat-edit-cancel{background:rgba(4,48,58,.2);color:#04303a}
.chat-msg:not(.me) .chat-edit-save{background:#1eb6cc;color:#04121a}
.chat-msg:not(.me) .chat-edit-cancel{background:rgba(156,180,255,.15);color:#cdd9ff}
.chat-edit-save:disabled{opacity:.6;cursor:default}
.chat-bubble a{color:#8fd7ff;text-decoration:underline;overflow-wrap:anywhere}
.chat-msg.me .chat-bubble a{color:#04303a;text-decoration:underline}
.chat-bubble .at{color:#7cf;font-weight:700}
.chat-msg.me .chat-bubble .at{color:#053; font-weight:800}
.chat-day{align-self:center;font-size:10.5px;color:#7c8aa5;background:rgba(156,180,255,.06);padding:3px 12px;border-radius:10px;margin:6px 0}
.chat-msg{cursor:pointer}                    /* tap a message to reply to it */
.chat-msg:focus{outline:none}

/* Quoted (replied-to) message inside a bubble */
.chat-quote{border-left:3px solid rgba(68,241,255,.7);background:rgba(156,180,255,.09);border-radius:7px;
  padding:5px 9px;margin:0 0 6px;font-size:12.5px;line-height:1.4;color:#b9c9dd;
  white-space:pre-wrap;overflow-wrap:anywhere;max-height:64px;overflow:hidden}
.chat-msg.me .chat-quote{border-left-color:rgba(4,48,58,.75);background:rgba(4,48,58,.16);color:#04303a}

/* Typing indicator */
.chat-thread-sub.is-typing{color:#5be4a5;font-weight:700}

/* Reply bar above the composer */
.chat-replybar{display:flex;align-items:center;gap:8px;padding:8px 14px;background:#0a1120;
  border-top:1px solid rgba(156,180,255,.1);flex:0 0 auto;max-width:100%;box-sizing:border-box}
.chat-replybar-in{flex:1;min-width:0;border-left:3px solid #44f1ff;padding-left:9px}
.chat-replybar-name{display:block;font-size:11.5px;font-weight:800;color:#44f1ff}
.chat-replybar-text{display:block;font-size:12px;color:#8b98ad;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-replybar-x{flex:0 0 auto;background:transparent;border:none;color:#8b98ad;font-size:15px;cursor:pointer;padding:4px 6px}
.chat-replybar-x:hover{color:#e7edf7}

/* Composer */
.chat-compose{position:relative;display:flex;align-items:flex-end;gap:8px;padding:11px 14px;border-top:1px solid rgba(156,180,255,.1);background:#0a1120;flex:0 0 auto;box-sizing:border-box;max-width:100%}
/* font-size MUST be >=16px so iOS Safari never zooms the page on focus. */
.chat-input{flex:1;resize:none;max-height:120px;background:#070b15;border:1px solid rgba(156,180,255,.18);border-radius:12px;
  color:#e7edf7;font:inherit;font-size:16px;padding:10px 13px;outline:none}
.chat-input:focus{border-color:rgba(68,241,255,.6)}
.ac-tk{letter-spacing:-2px}.ac-tk2{color:#44f1ff}   /* ✓ queued · ✓✓ stored */
/* ── Shared embeds: document + live stock chart cards, picker, overlay ─────── */
.chat-embed{display:flex;align-items:center;gap:10px;background:rgba(0,0,0,.2);border:1px solid rgba(120,150,210,.18);
  border-radius:10px;padding:9px 11px;margin:2px 0;cursor:pointer;max-width:280px}
.chat-embed .ic{font-size:22px;flex:0 0 auto}
.chat-embed--stock .ic{color:#57e39a}
.chat-embed-main{min-width:0;display:flex;flex-direction:column}
.chat-embed-name{font-weight:650;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-embed-sub{font-size:11px;color:#93a6c8}
.chat-embed-pop{position:absolute;left:12px;right:12px;bottom:100%;margin-bottom:8px;z-index:40;background:#0d1424;
  border:1px solid rgba(120,150,210,.2);border-radius:12px;max-height:44vh;overflow-y:auto;box-shadow:0 -8px 30px rgba(0,0,0,.5)}
.chat-embed-pop[hidden]{display:none}
.chat-embed-h{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#93a6c8;padding:9px 12px 4px}
.chat-embed-item{display:flex;flex-direction:column;gap:2px;padding:9px 12px;cursor:pointer;border-top:1px solid rgba(120,150,210,.12)}
.chat-embed-item:hover{background:rgba(120,150,210,.08)}
.chat-embed-item b{font-size:13.5px;font-weight:650}
.chat-embed-empty{color:#93a6c8;padding:14px;font-size:13px}
.chat-embed-ov{width:min(920px,94vw);height:min(80vh,760px);display:flex;flex-direction:column}
.chat-embed-ovh{padding:12px 14px;border-bottom:1px solid rgba(120,150,210,.18);font-weight:700}
.chat-embed-ovbody{flex:1;overflow:auto;padding:10px}
.chat-embed-frame{width:100%;height:100%;min-height:60vh;border:0;background:#111;border-radius:8px}
.chat-sendbtn{flex:0 0 auto;width:42px;height:42px;border-radius:50%;border:none;background:var(--cyan,#44f1ff);color:#04121a;
  display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.14s}
.chat-sendbtn:disabled{opacity:.45;cursor:default}
.chat-sendbtn:not(:disabled):hover{filter:brightness(1.06)}
.chat-locked{padding:14px 16px;border-top:1px solid rgba(156,180,255,.1);color:#8b98ad;font-size:12.5px;text-align:center;background:#0a1120}

/* @mention autocomplete */
.chat-mention-pop{position:absolute;left:14px;right:64px;bottom:calc(100% + 6px);max-height:190px;overflow-y:auto;
  background:#0c1424;border:1px solid rgba(120,150,210,.35);border-radius:12px;box-shadow:0 16px 40px -12px rgba(0,0,0,.7);z-index:5}
.chat-mention-item{display:flex;align-items:center;gap:8px;padding:9px 12px;cursor:pointer;font-size:13px}
.chat-mention-item.sel,.chat-mention-item:hover{background:rgba(68,241,255,.1)}
.chat-mention-item b{font-weight:700}
.chat-mention-gid{margin-left:auto;font-family:var(--mono,ui-monospace,monospace);font-size:11px;color:#8b98ad}

/* ── Mobile: full-screen single pane with back nav (WhatsApp-style) ──────────*/
@media(max-width:720px){
  .chat-body{overflow:hidden;position:relative}   /* the app owns the viewport; no page scroll/side-shift */
  .chat-wrap{padding:0;max-width:100%}
  /* FIXED full-screen app: pinned between the site navbar and the bottom of the
     screen. Nothing scrolls except the message list — so the thread header (with
     the BACK button) and the composer are ALWAYS visible, never scrolled away. */
  .chat-app{position:fixed;top:calc(var(--header-h,56px) + var(--safe-top,0px));left:0;right:0;bottom:0;
    height:auto;min-height:0;width:100%;grid-template-columns:1fr;grid-template-rows:1fr;
    border:none;border-radius:0}
  .chat-list,.chat-thread{grid-column:1;grid-row:1;width:100%;max-width:100%;min-width:0}
  /* Only one pane visible at a time — the other is fully removed from flow so
     nothing can peek/slide from the side. */
  .chat-app[data-view="list"] .chat-thread{display:none!important}
  .chat-app[data-view="thread"] .chat-list{display:none!important}
  .chat-back{display:inline-flex}
  .chat-list{border-right:none}
  .chat-list-hd{padding:14px 16px 11px}
  .chat-msgs{padding:12px 12px calc(12px + env(safe-area-inset-bottom,0px))}
  .chat-msg{max-width:86%}
  .chat-compose{padding:9px 10px calc(9px + env(safe-area-inset-bottom,0px))}
  .chat-mention-pop{left:10px;right:60px}
  /* Bigger tap targets */
  .chat-item{padding:13px 15px}
  .chat-sendbtn{width:44px;height:44px}
}

/* Guard against any horizontal shift on very small screens. */
.chat-list,.chat-thread,.chat-msgs,.chat-item,.chat-item-main{min-width:0;max-width:100%}
.chat-bubble{overflow-wrap:anywhere}

/* ── Admin / agent console ───────────────────────────────────────────────────*/
.chat-admin-tools{display:flex;gap:6px;flex-wrap:wrap;padding:10px 12px;border-bottom:1px solid rgba(156,180,255,.08);background:#0a1120}
.chat-tool{flex:1 1 auto;min-width:0;font-size:12px;font-weight:700;color:#cfe0ff;background:rgba(156,180,255,.08);
  border:1px solid rgba(156,180,255,.16);border-radius:9px;padding:8px 6px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-tool:hover{background:rgba(68,241,255,.12);border-color:rgba(68,241,255,.3)}
.chat-sec{padding:12px 15px 5px;font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#6b788f}
.chat-thread-actions{margin-left:auto;display:flex;gap:6px;flex:0 0 auto}
.chat-taction{font-size:12px;font-weight:700;color:#cfe0ff;background:rgba(156,180,255,.08);border:1px solid rgba(156,180,255,.18);
  border-radius:8px;padding:6px 11px;cursor:pointer;white-space:nowrap}
.chat-taction:hover{background:rgba(68,241,255,.12)}
.chat-tag{font-size:9.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;padding:1px 6px;border-radius:6px;
  background:rgba(156,180,255,.14);color:#aebfe0;vertical-align:middle}
.chat-tag.prem{background:rgba(68,241,255,.16);color:#44f1ff}
.chat-tag.ban{background:rgba(255,90,110,.16);color:#ff8090}

/* Modals */
.chat-modal{position:fixed;inset:0;z-index:1000;background:rgba(2,5,12,.66);display:flex;align-items:center;justify-content:center;padding:16px;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.chat-modal-card{width:100%;max-width:420px;max-height:88vh;overflow-y:auto;background:#0b111f;border:1px solid rgba(120,150,210,.28);
  border-radius:16px;padding:18px;box-shadow:0 30px 80px -20px rgba(0,0,0,.8)}
.chat-modal-hd{display:flex;align-items:center;justify-content:space-between;font-size:16px;font-weight:800;margin-bottom:12px}
.chat-modal-x{background:transparent;border:none;color:#8b98ad;font-size:18px;cursor:pointer;padding:2px 6px;line-height:1}
.chat-modal-lbl{display:block;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#8b98ad;margin:12px 0 5px}
.chat-modal-input{width:100%;box-sizing:border-box;background:#070b15;border:1px solid rgba(156,180,255,.2);border-radius:10px;
  color:#e7edf7;font:inherit;font-size:16px;padding:10px 12px;outline:none}
.chat-modal-input:focus{border-color:rgba(68,241,255,.55)}
textarea.chat-modal-input{resize:vertical;min-height:90px}
.chat-modal-row{display:flex;gap:8px;align-items:center}
.chat-modal-btn{width:100%;margin-top:14px;background:var(--cyan,#44f1ff);color:#04121a;font-weight:800;font-size:14px;border:none;border-radius:11px;padding:12px;cursor:pointer}
.chat-modal-btn.sm{width:auto;margin-top:0;padding:10px 14px;font-size:13px;white-space:nowrap}
.chat-modal-btn:disabled{opacity:.6}
.chat-modal-msg{color:#ff8090;font-size:12.5px;min-height:16px;margin-top:8px}
/* Live ticker-resolution hint under the Publish News ticker field. */
.chat-modal-hint{font-size:12px;line-height:1.45;color:#8b98ad;margin:6px 0 0}
.chat-modal-hint.ok{color:#39d98a}
.chat-modal-hint.bad{color:#ffb020}
.chat-modal-p{color:#b9c9dd;font-size:14px;line-height:1.55;margin:4px 0}
.chat-modal-list{margin-top:8px;max-height:44vh;overflow-y:auto;border:1px solid rgba(156,180,255,.1);border-radius:10px}
.chat-picker-item{display:block;width:100%;text-align:left;background:transparent;border:none;border-bottom:1px solid rgba(156,180,255,.06);
  padding:10px 12px;cursor:pointer;color:#e7edf7;font-size:13.5px}
.chat-picker-item:hover{background:rgba(68,241,255,.08)}
.chat-picker-sub{display:block;font-size:11.5px;color:#8b98ad;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-mrow{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 12px;border-bottom:1px solid rgba(156,180,255,.06)}
.chat-mrow-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13.5px}
.chat-mrow-actions{display:flex;gap:5px;flex:0 0 auto}
.chat-mini{font-size:11.5px;font-weight:700;color:#cfe0ff;background:rgba(156,180,255,.1);border:1px solid rgba(156,180,255,.16);
  border-radius:7px;padding:5px 9px;cursor:pointer}
.chat-mini:hover{background:rgba(255,90,110,.14);border-color:rgba(255,90,110,.3);color:#ffb0bb}

/* ── File attachments (images / video / audio / PDF / documents) ───────────── */
.chat-attachbtn{flex:0 0 auto;width:40px;height:40px;border-radius:50%;border:1px solid rgba(156,180,255,.18);
  background:#070b15;color:#9fb4dd;display:grid;place-items:center;cursor:pointer;transition:.15s}
.chat-attachbtn:hover{color:var(--cyan,#44f1ff);border-color:rgba(68,241,255,.5)}
.chat-attachbtn svg{transform:rotate(0)}

/* Pending (pre-send) preview strip in the composer */
.chat-attach-pending{display:flex;flex-wrap:wrap;gap:8px;padding:10px 14px 0;background:#0a1120}
.chat-att-chip{display:flex;align-items:center;gap:8px;max-width:230px;background:#0e1626;border:1px solid rgba(156,180,255,.16);
  border-radius:10px;padding:5px 8px 5px 5px}
.chat-att-chip img{width:34px;height:34px;object-fit:cover;border-radius:6px;flex:0 0 auto}
.chat-chip-ic{width:34px;height:34px;border-radius:6px;display:grid;place-items:center;background:rgba(156,180,255,.1);font-size:18px;flex:0 0 auto}
.chat-chip-name{font-size:12px;color:#cfe0ff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
.chat-chip-x{flex:0 0 auto;width:20px;height:20px;border-radius:50%;border:none;background:rgba(255,90,110,.16);color:#ffb0bb;cursor:pointer;font-size:12px;line-height:1}
.chat-chip-x:hover{background:rgba(255,90,110,.32)}
.chat-att-chip--load{color:#9fb4dd;font-size:12px;gap:8px;padding:8px 12px}
.chat-chip-spin{width:14px;height:14px;border-radius:50%;border:2px solid rgba(156,180,255,.25);border-top-color:var(--cyan,#44f1ff);
  display:inline-block;animation:chatSpin .7s linear infinite}
@keyframes chatSpin{to{transform:rotate(360deg)}}

/* In-bubble attachment renders */
.chat-att{margin:2px 0 4px;max-width:min(300px,72vw)}
.chat-att--image{position:relative;border-radius:12px;overflow:hidden;cursor:pointer;line-height:0}
.chat-att--image img{width:100%;max-height:340px;object-fit:cover;display:block;background:rgba(156,180,255,.06)}
.chat-att--video{position:relative;border-radius:12px;overflow:hidden;cursor:pointer;background:#04070d;min-height:120px}
.chat-att--video img{width:100%;max-height:340px;object-fit:cover;display:block;opacity:.9}
.chat-att-play{position:absolute;inset:0;margin:auto;width:54px;height:54px;border-radius:50%;background:rgba(4,7,13,.62);
  color:#fff;display:grid;place-items:center;font-size:22px;pointer-events:none}
.chat-att-play--video{box-shadow:0 4px 20px rgba(0,0,0,.5)}
.chat-att-cap{position:absolute;left:8px;bottom:6px;right:8px;font-size:11px;color:#eaf2ff;text-shadow:0 1px 3px rgba(0,0,0,.7);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
.chat-att--doc{display:flex;align-items:center;gap:10px;background:rgba(156,180,255,.08);border:1px solid rgba(156,180,255,.14);
  border-radius:11px;padding:9px 11px;cursor:pointer}
.chat-att--doc:hover{background:rgba(156,180,255,.13)}
.chat-att--drive{cursor:pointer}
.chat-att-ic{font-size:24px;flex:0 0 auto}
.chat-att-info{display:flex;flex-direction:column;gap:2px;min-width:0}
.chat-att-name{font-size:13px;font-weight:600;color:#eaf2ff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px}
.chat-att-sub{font-size:11px;color:#9fb4dd}
.chat-att-links{display:flex;gap:10px;margin-top:3px}
.chat-att-open{font-size:11px;color:#8fd7ff;text-decoration:underline;cursor:pointer}
/* Download control — an overlay on media tiles, an inline button on doc rows.
   Anything shared into a chat you belong to is yours to save. */
.chat-att-dl{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;flex:0 0 auto;
  background:rgba(4,7,13,.6);color:#eaf2ff;border:1px solid rgba(255,255,255,.18);cursor:pointer;text-decoration:none;
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:background .15s,transform .15s,opacity .15s}
.chat-att-dl:hover{background:rgba(4,7,13,.88);transform:scale(1.06)}
.chat-att--image .chat-att-dl,.chat-att--video .chat-att-dl{position:absolute;top:8px;right:8px;z-index:3;opacity:.9}
.chat-att--image:hover .chat-att-dl,.chat-att--video:hover .chat-att-dl{opacity:1}
.chat-att--doc .chat-att-dl,.chat-att--audio .chat-att-dl{margin-left:auto}
.chat-msg.me .chat-att--doc .chat-att-dl{background:rgba(4,26,34,.28);color:#04303a;border-color:rgba(4,48,58,.35)}

/* Forward action — a small icon revealed on hover next to the timestamp (on
   every message, mine or theirs). */
/* Hover actions — forward, copy, save. These are direct children of the
   flex-column .chat-msg, so WITHOUT an explicit width they stretch to the full
   bubble width and paint the browser's default (white) button background — the
   "white bar behind the emoji" bug. Every action button MUST therefore fix its
   size and background here. Save (🔖) is a colour emoji, greyed until hovered
   like the react button; copy (⧉) is a glyph and follows the forward styling. */
.chat-msg-fwd,.chat-msg-copy,.chat-msg-save{width:22px;height:22px;display:inline-grid;place-items:center;padding:0;margin-left:3px;vertical-align:middle;
  border:0;border-radius:50%;background:transparent;color:#7d8fb0;cursor:pointer;opacity:0;font-size:12px;line-height:1;transition:opacity .15s,color .15s,background .15s,filter .15s}
.chat-msg-save{filter:grayscale(1) brightness(1.5)}
.chat-msg:hover .chat-msg-fwd,.chat-msg:focus-within .chat-msg-fwd,
.chat-msg:hover .chat-msg-copy,.chat-msg:focus-within .chat-msg-copy,
.chat-msg:hover .chat-msg-save,.chat-msg:focus-within .chat-msg-save{opacity:.85}
.chat-msg-fwd:hover,.chat-msg-copy:hover{color:#44f1ff;opacity:1;background:rgba(120,150,210,.12)}
.chat-msg-save:hover{opacity:1;filter:none;background:rgba(120,150,210,.12)}
@media (hover:none){.chat-msg-copy,.chat-msg-save{opacity:.55}}

/* Forward picker (multi-select destinations) */
.chat-fwd{position:fixed;inset:0;z-index:1300;background:rgba(2,5,10,.72);display:flex;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.chat-fwd-card{width:min(440px,96vw);max-height:min(86vh,640px);display:flex;flex-direction:column;background:#0d1524;border:1px solid rgba(156,180,255,.18);border-radius:16px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.chat-fwd-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;font-weight:800;color:#eaf2ff;border-bottom:1px solid rgba(156,180,255,.12)}
.chat-fwd-x{background:none;border:0;color:#9db2ff;font-size:16px;cursor:pointer;line-height:1}
.chat-fwd-preview{margin:12px 16px;padding:9px 12px;background:rgba(156,180,255,.08);border-left:3px solid #2bd4e6;border-radius:8px;color:#c7d6f5;font-size:13px;line-height:1.4;max-height:64px;overflow:hidden}
.chat-fwd-search{margin:0 16px 10px;padding:10px 12px;background:rgba(120,150,210,.1);border:1px solid rgba(156,180,255,.2);border-radius:10px;color:#eaf2ff;font:inherit;font-size:14px;outline:none}
.chat-fwd-search:focus{border-color:#44f1ff}
.chat-fwd-list{flex:1;overflow-y:auto;padding:0 8px 8px}
.chat-fwd-sec{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#7d8fb0;padding:10px 10px 4px}
.chat-fwd-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;cursor:pointer}
.chat-fwd-item:hover{background:rgba(156,180,255,.08)}
.chat-fwd-item.on{background:rgba(43,212,230,.12)}
.chat-fwd-av{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:14px;color:#04121a;background:#7fb0ff;flex:0 0 auto}
.chat-fwd-av.grp{background:#8f7dff}.chat-fwd-av.cust{background:#ffb15e}
.chat-fwd-main{flex:1;min-width:0;display:flex;flex-direction:column}
.chat-fwd-name{font-size:14px;color:#eaf2ff;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-fwd-sub{font-size:11.5px;color:#8ea3c7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-fwd-check{width:22px;height:22px;border-radius:50%;border:1.5px solid rgba(156,180,255,.35);display:grid;place-items:center;color:#04121a;font-size:13px;font-weight:800;flex:0 0 auto}
.chat-fwd-item.on .chat-fwd-check{background:#2bd4e6;border-color:#2bd4e6}
.chat-fwd-empty{padding:20px;text-align:center;color:#8ea3c7;font-size:13px}
.chat-fwd-foot{padding:12px 16px;border-top:1px solid rgba(156,180,255,.12)}
.chat-fwd-send{width:100%;padding:12px;border:0;border-radius:12px;background:linear-gradient(180deg,#2bd4e6,#1eb6cc);color:#04121a;font-weight:800;font-size:14.5px;cursor:pointer}
.chat-fwd-send:disabled{opacity:.5;cursor:default}

/* Toast */
.chat-toast{position:fixed;left:50%;bottom:30px;transform:translate(-50%,20px);z-index:1400;background:#0d1524;border:1px solid rgba(156,180,255,.22);color:#eaf2ff;padding:11px 18px;border-radius:12px;font-size:13.5px;font-weight:600;box-shadow:0 16px 40px rgba(0,0,0,.5);opacity:0;transition:opacity .25s,transform .25s;pointer-events:none;max-width:90vw}
.chat-toast.show{opacity:1;transform:translate(-50%,0)}

/* Drag-and-drop upload overlay */
.chat-drop{position:absolute;inset:0;z-index:1100;display:none;align-items:center;justify-content:center;
  background:rgba(4,10,20,.82);border:2.5px dashed #44f1ff;border-radius:14px;color:#eaf2ff;font-weight:700;font-size:16px;
  pointer-events:none;text-align:center;padding:20px;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.chat-drop.show{display:flex}
.chat-msg.me .chat-att--doc{background:rgba(4,48,58,.18);border-color:rgba(4,48,58,.28)}
.chat-msg.me .chat-att-name{color:#04303a}
.chat-msg.me .chat-att-sub{color:#065a68}
.chat-att--audio{display:flex;flex-direction:column;gap:4px}
.chat-att--audio audio{width:250px;max-width:72vw;height:38px}

/* Lightbox (image zoom / video + PDF inline player) */
.chat-lb{position:fixed;inset:0;z-index:1200;background:rgba(2,5,10,.92);display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:14px;padding:24px;box-sizing:border-box;backdrop-filter:blur(4px)}
.chat-lb-body{max-width:min(1100px,94vw);max-height:80vh;width:100%;display:flex;align-items:center;justify-content:center}
.chat-lb-img{max-width:100%;max-height:80vh;object-fit:contain;border-radius:8px}
.chat-lb-frame{width:min(1000px,94vw);height:80vh;border:0;border-radius:10px;background:#0a1120}
.chat-lb-x{position:absolute;top:16px;right:18px;width:42px;height:42px;border-radius:50%;border:none;
  background:rgba(255,255,255,.12);color:#fff;font-size:19px;cursor:pointer}
.chat-lb-x:hover{background:rgba(255,255,255,.24)}
.chat-lb-dl{font-size:13px;color:#8fd7ff;text-decoration:underline;max-width:90vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Toast */
.chat-toast{position:fixed;left:50%;bottom:78px;transform:translateX(-50%) translateY(14px);z-index:1300;
  background:#101a2e;border:1px solid rgba(156,180,255,.22);color:#eaf2ff;font-size:13px;padding:10px 16px;border-radius:10px;
  box-shadow:0 12px 34px rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:.25s;max-width:86vw;text-align:center}
.chat-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* Support satisfaction (CSAT) card — shown in a member's support thread */
.chat-rate{margin:10px 4px 2px;padding:13px 15px;border:1px solid rgba(156,180,255,.22);border-radius:14px;background:rgba(120,150,210,.06)}
.chat-rate h4{margin:0 0 3px;font-size:14px;color:#eaf2ff}
.chat-rate p{margin:0 0 10px;font-size:12px;color:#8b98ad}
.chat-rate-thumbs{display:flex;gap:8px;margin-bottom:9px}
.chat-rate-thumb{flex:1;padding:10px;border:1px solid rgba(156,180,255,.28);background:#070d18;color:#cfe0ff;border-radius:10px;cursor:pointer;font-size:14px}
.chat-rate-thumb:hover{border-color:#44f1ff}
.chat-rate-thumb.on{border-color:#44f1ff;background:rgba(68,241,255,.14)}
.chat-rate-thumb.down.on{border-color:#ff5d73;background:rgba(255,93,115,.14)}
.chat-rate-note{width:100%;box-sizing:border-box;background:#070d18;border:1px solid rgba(156,180,255,.22);color:#eaf2ff;border-radius:10px;padding:9px 11px;font:inherit;font-size:13px;resize:none;margin-bottom:9px}
.chat-rate-send{width:100%;padding:10px;border:0;border-radius:10px;background:linear-gradient(135deg,#44f1ff,#22d3ee);color:#04121a;font-weight:800;font-size:13px;cursor:pointer}
.chat-rate-send:disabled{opacity:.5;cursor:default}
.chat-rate.thanks{color:#7ef0b5;text-align:center;font-size:13px}

/* ── Emoji picker (shared alphachat/assets/ac-emoji.js; Oyster theme) ─────────
   A popover anchored above the composer (the form is position:relative — same
   anchoring as the mention/embed pops). Structure is built by the module; only
   the look lives here, scoped under .chat-emoji-panel. */
.chat-emojibtn{flex:0 0 auto;width:40px;height:40px;border-radius:50%;border:1px solid rgba(156,180,255,.18);
  background:none;font-size:19px;line-height:1;cursor:pointer;display:grid;place-items:center;padding:0;
  filter:grayscale(1) brightness(1.45);transition:filter .12s,border-color .12s}
.chat-emojibtn:hover,.chat-emojibtn.on{filter:none;border-color:rgba(68,241,255,.5)}
.chat-emoji-panel{position:absolute;left:12px;bottom:calc(100% + 8px);z-index:45;width:352px;
  max-width:calc(100vw - 24px);height:330px;max-height:min(52vh,360px);display:flex;flex-direction:column;
  background:#0d1526;border:1px solid rgba(156,180,255,.2);border-radius:14px;overflow:hidden;
  box-shadow:0 18px 50px rgba(0,0,0,.55)}
.chat-emoji-panel[hidden]{display:none}
.chat-emoji-panel .ace-search{padding:9px 10px 6px;flex:0 0 auto}
.chat-emoji-panel .ace-search input{width:100%;box-sizing:border-box;background:#070b15;
  border:1px solid rgba(156,180,255,.18);border-radius:10px;color:#eaf2ff;font:inherit;font-size:13.5px;
  padding:8px 12px;outline:none}
.chat-emoji-panel .ace-search input:focus{border-color:rgba(68,241,255,.6)}
.chat-emoji-panel .ace-tabs{display:flex;gap:2px;padding:0 8px 6px;flex:0 0 auto;overflow-x:auto}
.chat-emoji-panel .ace-tab{flex:1 0 auto;min-width:32px;height:32px;background:none;border:0;border-radius:8px;
  font-size:16px;line-height:1;cursor:pointer;padding:0;filter:grayscale(1) brightness(1.35)}
.chat-emoji-panel .ace-tab:hover{background:rgba(156,180,255,.1)}
.chat-emoji-panel .ace-tab.on{background:rgba(68,241,255,.14);filter:none}
.chat-emoji-panel .ace-body{flex:1;min-height:0;overflow-y:auto;position:relative;padding:0 8px 8px;
  scroll-behavior:smooth}
.chat-emoji-panel .ace-h{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:#8b98ad;
  padding:8px 4px 4px}
.chat-emoji-panel .ace-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(36px,1fr))}
.chat-emoji-panel .ace-e{height:38px;background:none;border:0;border-radius:8px;font-size:21px;line-height:1;
  cursor:pointer;padding:0;display:grid;place-items:center}
.chat-emoji-panel .ace-e:hover{background:rgba(156,180,255,.12)}
.chat-emoji-panel .ace-empty{color:#8b98ad;text-align:center;padding:26px 14px;font-size:13px}
@media(max-width:720px){
  /* Phone: full-width sheet above the composer; taller touch targets. */
  .chat-emoji-panel{left:8px;right:8px;width:auto;height:300px;max-height:46vh}
  .chat-emoji-panel .ace-search input{font-size:16px}
  .chat-emoji-panel .ace-e{height:40px;font-size:23px}
  .chat-emoji-panel .ace-tab{min-width:34px;height:34px}
}
/* Pick-ONE reaction panel (ACEmoji.openPicker) — the same themed panel, but a
   fixed popover anchored near a message's react button; left/top are set inline
   by the module (clamped to the visible viewport). The double class outranks
   the composer-popover positioning above, including the phone media block. */
.chat-emoji-panel.ace-pick{position:fixed;left:auto;right:auto;bottom:auto;z-index:1350;
  width:min(320px,calc(100vw - 16px));height:300px;max-height:min(46vh,320px)}
.chat-emoji-panel.ace-pick--compact{height:240px}

/* ── Message reactions ────────────────────────────────────────────────────────
   Chips sit just under the bubble on the message's side — small pills, subtle
   on desktop, ≥28px tap height on touch; mine highlighted in the cyan accent. */
.chat-reacts{display:flex;flex-wrap:wrap;gap:4px;margin-top:1px;max-width:100%}
.chat-react{display:inline-flex;align-items:center;gap:4px;min-height:22px;padding:2px 9px;
  border-radius:999px;border:1px solid rgba(156,180,255,.22);background:rgba(156,180,255,.08);
  color:#cfe0ff;font-size:12.5px;line-height:1;cursor:pointer;
  transition:background .12s,border-color .12s}
.chat-react .n{font-size:11px;font-weight:800;color:#9fb4dd}
.chat-react:hover{background:rgba(156,180,255,.15);border-color:rgba(156,180,255,.4)}
.chat-react.mine{background:rgba(68,241,255,.16);border-color:rgba(68,241,255,.55);color:#bff5ff}
.chat-react.mine .n{color:#44f1ff}
@media (max-width:720px),(hover:none){
  .chat-react{min-height:28px;padding:4px 11px;font-size:13.5px}
}

/* React (😊) — joins the fwd/copy/save hover actions on every stored message. */
.chat-msg-react{width:22px;height:22px;display:inline-grid;place-items:center;padding:0;margin-left:3px;vertical-align:middle;
  border:0;border-radius:50%;background:transparent;cursor:pointer;font-size:12px;line-height:1;
  filter:grayscale(1) brightness(1.5);opacity:0;transition:opacity .15s,background .15s,filter .15s}
.chat-msg:hover .chat-msg-react,.chat-msg:focus-within .chat-msg-react{opacity:.85}
.chat-msg-react:hover{opacity:1;filter:none;background:rgba(120,150,210,.12)}
@media (hover:none){.chat-msg-react{opacity:.55}}

/* ══ Profile & Settings (Oyster) — WhatsApp/Telegram-style ═══════════════════ */
.ac-me{display:inline-flex;align-items:center;gap:8px;background:none;border:0;cursor:pointer;color:inherit;font:inherit;padding:2px 5px;border-radius:8px}
.ac-me:hover{background:rgba(156,180,255,.1)}
.ac-me-av{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:800;background:linear-gradient(135deg,#12323a,#233056);color:#44f1ff;flex:0 0 auto}
.ac-me-av.emo{font-size:16px;background:rgba(156,180,255,.12);color:inherit}
.ac-me-nm{font-size:12px;color:#93a6c8;max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:720px){.ac-me-nm{display:none}}
.ac-prof-modal{position:fixed;inset:0;z-index:1400;background:rgba(3,6,12,.62);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:20px}
.ac-prof-modal[hidden]{display:none}
.ac-prof-sheet{width:100%;max-width:520px;max-height:88vh;display:flex;flex-direction:column;background:#0d1526;border:1px solid rgba(156,180,255,.2);border-radius:16px;overflow:hidden;box-shadow:0 24px 70px rgba(0,0,0,.6)}
.ac-prof-hd{display:flex;align-items:center;gap:8px;padding:15px 16px;border-bottom:1px solid rgba(156,180,255,.12)}
.ac-prof-hd h3{margin:0;font-size:16px;flex:1;color:#eaf1ff}
.ac-prof-x{background:none;border:0;color:#93a6c8;cursor:pointer;font-size:20px;line-height:1;padding:2px 6px}
.ac-prof-back{background:none;border:0;color:#44f1ff;cursor:pointer;font-size:26px;line-height:1;padding:0 6px 0 0}
.ac-prof-body{padding:14px 16px 18px;overflow-y:auto}
.ac-prof-hero{display:flex;flex-direction:column;align-items:center;gap:9px;padding:6px 0 14px}
.ac-prof-av{position:relative;width:84px;height:84px;border-radius:50%;border:0;cursor:pointer;display:grid;place-items:center;font-size:30px;font-weight:800;background:linear-gradient(135deg,#12323a,#233056);color:#44f1ff;padding:0}
.ac-prof-av .emo{font-size:46px;line-height:1}
.ac-prof-avedit{position:absolute;right:-2px;bottom:-2px;width:26px;height:26px;border-radius:50%;background:#2bd4e6;color:#04121a;display:grid;place-items:center;font-size:12px;font-weight:800;border:2px solid #0d1526}
.ac-prof-name{font-size:18px;font-weight:750;color:#eaf1ff}
.ac-prof-badges{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:center}
.ac-prof-org{font-size:12.5px;color:#93a6c8}
.ac-pill{font-size:11px;font-weight:700;padding:3px 9px;border-radius:999px;background:rgba(156,180,255,.1);color:#93a6c8;border:1px solid rgba(156,180,255,.18);flex:0 0 auto}
.ac-pill.on{background:rgba(68,241,255,.14);color:#7ff0ff;border-color:rgba(68,241,255,.4)}
.ac-set-grp{margin:16px 0 0}
.ac-set-h{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#8ea3c7;margin:0 2px 6px}
.ac-set-card{border:1px solid rgba(156,180,255,.14);border-radius:12px;overflow:hidden;background:rgba(156,180,255,.04)}
.ac-set-card>*{border-bottom:1px solid rgba(156,180,255,.1)}
.ac-set-card>*:last-child{border-bottom:0}
.ac-set-row{display:flex;align-items:center;gap:10px;padding:12px;color:#eaf1ff}
.ac-set-row .k{font-size:12px;color:#93a6c8;width:104px;flex:0 0 auto}
.ac-set-row .v{flex:1;min-width:0;font-size:14px;word-break:break-word}
.ac-set-row .mono{font-family:ui-monospace,Menlo,monospace;font-size:13px}
.ac-set-copy{background:none;border:1px solid rgba(156,180,255,.2);color:#44f1ff;border-radius:8px;padding:5px 10px;font:600 12px sans-serif;cursor:pointer;flex:0 0 auto}
.ac-set-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ac-set-main .l{font-size:14px}
.ac-set-main .s{font-size:11.5px;color:#93a6c8;line-height:1.35}
.ac-set-act{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:none;border:0;color:#eaf1ff;padding:12px;font:inherit;cursor:pointer}
.ac-set-act .ic{font-size:18px;width:22px;text-align:center;flex:0 0 auto}
.ac-set-act:hover{background:rgba(156,180,255,.06)}
.ac-set-act.dan .l{color:#ff6b81}
.ac-tgl{position:relative;width:44px;height:26px;border-radius:999px;border:0;background:rgba(156,180,255,.25);cursor:pointer;flex:0 0 auto;transition:background .15s}
.ac-tgl i{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:transform .15s}
.ac-tgl.on{background:#2bd4e6}
.ac-tgl.on i{transform:translateX(18px)}
.ac-seg{display:inline-flex;gap:2px;background:#070b15;border:1px solid rgba(156,180,255,.18);border-radius:9px;padding:2px;flex:0 0 auto}
.ac-seg button{border:0;background:none;color:#93a6c8;font:600 12.5px sans-serif;padding:6px 12px;border-radius:7px;cursor:pointer}
.ac-seg button.on{background:#2bd4e6;color:#04121a}
.ac-sel{background:#070b15;border:1px solid rgba(156,180,255,.18);color:#eaf1ff;border-radius:8px;padding:6px 8px;font:inherit;font-size:13px;cursor:pointer;flex:0 0 auto}
.ac-set-note{font-size:11.5px;color:#8ea3c7;line-height:1.5;padding:11px 12px;background:rgba(68,241,255,.05)}
.ac-set-ver{font-size:11px;color:#8ea3c7;text-align:center;padding:13px 0 2px}
.ac-av-hero{display:grid;place-items:center;width:92px;height:92px;margin:8px auto 4px;border-radius:50%;background:linear-gradient(135deg,#12323a,#233056);color:#44f1ff;font-size:30px;font-weight:800}
.ac-av-hero .emo{font-size:50px;line-height:1}
.ac-avgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(48px,1fr));gap:8px;margin:12px 0 16px}
.ac-avopt{aspect-ratio:1;border:1px solid rgba(156,180,255,.14);background:rgba(156,180,255,.05);border-radius:12px;font-size:25px;line-height:1;cursor:pointer;display:grid;place-items:center}
.ac-avopt:hover{background:rgba(156,180,255,.1)}
.ac-avopt.on{border-color:#44f1ff;background:rgba(68,241,255,.14)}
.chat-att--filechip{display:flex;align-items:center;gap:8px;padding:10px 12px;background:rgba(0,0,0,.2);border:1px solid rgba(120,150,210,.18);border-radius:12px;cursor:pointer;max-width:100%}
.chat-att--filechip .chat-att-ic{font-size:18px;flex:0 0 auto}
.chat-att--filechip .chat-att-nm{font-size:13px;color:#cfe0ff;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body[data-fs="s"] .chat-bubble{font-size:13px}
body[data-fs="l"] .chat-bubble{font-size:15.5px}

/* ── Contact card — view another user's profile (WhatsApp-style) ─────────── */
.ac-pill.gold{background:linear-gradient(135deg,rgba(255,200,60,.2),rgba(255,166,32,.12));color:#ffd76a;border-color:rgba(255,200,60,.45)}
.ac-card-av{width:84px;height:84px;border-radius:50%;display:grid;place-items:center;font-size:30px;font-weight:800;background:linear-gradient(135deg,#12323a,#233056);color:#44f1ff}
.ac-prof-dim{color:#8ea3c7}
.ac-card-msg{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:18px;background:linear-gradient(135deg,#44f1ff,#22d3ee);color:#04121a;border:0;border-radius:11px;padding:13px;font:800 15px sans-serif;cursor:pointer}
.ac-card-msg:hover{filter:brightness(1.06)}
/* Tappable identities: sender names, DM/customer row avatars, thread header, manage-list names */
.chat-msg-from[data-gid]{cursor:pointer}
.chat-msg-from[data-gid]:hover{text-decoration:underline}
.chat-item[data-kind="dm"] .chat-item-av,.chat-item[data-kind="support"] .chat-item-av{cursor:pointer}
#chatApp[data-kind="dm"] #chatThreadTitle,#chatApp[data-kind="dm"] #chatThreadSub,
#chatApp[data-kind="support"] #chatThreadTitle,#chatApp[data-kind="support"] #chatThreadSub{cursor:pointer}
.acg-po .nm{cursor:pointer}