/* ───────── Chat dock — floating messaging UI ───────── */
/* Self-contained CSS variable defaults — app vars win if already defined  */
:root {
  --bg:           var(--bg,           #f6f6f3);
  --ink:          var(--ink,          #111111);
  --ink-2:        var(--ink-2,        #3a3a3a);
  --muted:        var(--muted,        #6b6b6b);
  --muted-2:      var(--muted-2,      #8a8a8a);
  --line:         var(--line,         #e7e7e2);
  --line-2:       var(--line-2,       #efefea);
  --chip:         var(--chip,         #f1f1ec);
  --accent:       var(--accent,       #2d2a6e);
  --accent-soft:  var(--accent-soft,  #eeedf7);
  --positive:     var(--positive,     #2f7a4d);
  --positive-soft:var(--positive-soft,#e8f2ec);
  --warn:         var(--warn,         #8a5a00);
  --warn-soft:    var(--warn-soft,    #fbf2dc);
  --danger:       var(--danger,       #9c2a2a);
  --danger-soft:  var(--danger-soft,  #f7e3e3);
}
/* Spinner used while messages load */
@keyframes cd-spin { to { transform: rotate(360deg); } }

.cd-root, .cd-root *{box-sizing:border-box;}
/* Profile link inside the dock — inherits colour, underlines on hover */
.cd-profile-link{color:inherit;text-decoration:none;cursor:pointer;}
.cd-profile-link:hover{text-decoration:underline;text-underline-offset:2px;}
.cd-root{
  position:fixed; right:24px; bottom:24px;
  z-index:9000;
  font-family:'Inter', system-ui, sans-serif;
  color:var(--ink, #111);
}

/* Launcher */
.cd-launcher{
  width:54px; height:54px;
  border-radius:50%;
  background:var(--ink, #111);
  color:#fff;
  border:0;
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 24px rgba(0,0,0,.18), 0 2px 6px rgba(0,0,0,.1);
  position:relative;
  transition:transform .15s, box-shadow .15s;
}
.cd-launcher:hover{transform:scale(1.04);}
.cd-launcher svg{width:22px; height:22px;}
.cd-launcher .cd-badge{
  position:absolute; top:-2px; right:-2px;
  min-width:20px; height:20px;
  padding:0 6px;
  background:#d63d3d; color:#fff;
  border:2px solid var(--bg, #f6f6f3);
  border-radius:999px;
  font-size:11px; font-weight:600;
  display:inline-flex; align-items:center; justify-content:center;
}

/* Panel base */
.cd-panel{
  position:absolute;
  right:0; bottom:66px;
  width:360px; height:560px;
  max-height:calc(100vh - 120px);
  background:#fff;
  border:1px solid var(--line, #e7e7e2);
  border-radius:14px;
  box-shadow:0 18px 48px rgba(0,0,0,.18), 0 4px 10px rgba(0,0,0,.06);
  display:none;
  flex-direction:column;
  overflow:hidden;
}
.cd-panel.open{display:flex; animation:cd-rise .18s ease-out;}
@keyframes cd-rise{
  from{opacity:0; transform:translateY(8px);}
  to{opacity:1; transform:translateY(0);}
}

/* Panel header */
.cd-head{
  padding:14px 16px;
  display:flex; align-items:center; gap:10px;
  border-bottom:1px solid var(--line, #e7e7e2);
  background:#fff;
  flex-shrink:0;
}
.cd-head .back{
  width:30px; height:30px; border-radius:8px;
  border:0; background:transparent;
  color:var(--muted, #6b6b6b);
  display:none; align-items:center; justify-content:center;
  cursor:pointer;
}
.cd-head .back:hover{background:var(--chip, #f1f1ec); color:var(--ink, #111);}
.cd-head .back svg{width:16px; height:16px;}
.cd-head .ttl{
  flex:1; min-width:0;
  font-size:14px; font-weight:600;
  display:flex; flex-direction:column; gap:1px;
  line-height:1.2;
}
.cd-head .ttl .sub{
  font-size:11.5px; font-weight:400; color:var(--muted, #6b6b6b);
}
.cd-head .ttl .name-row{
  display:flex; align-items:center; gap:5px;
}
.cd-head .ttl .verified-mini{
  width:11px; height:11px;
  color:var(--accent, #2d2a6e);
  flex-shrink:0;
}
.cd-head .ttl .verified-mini svg{width:100%; height:100%;}
.cd-head .head-av{
  width:30px; height:30px; border-radius:50%;
  overflow:hidden; flex-shrink:0;
  border:1px solid var(--line, #e7e7e2);
  background:var(--chip, #f1f1ec);
}
.cd-head .head-av img{width:100%; height:100%; object-fit:cover; display:block;}
.cd-head .head-av.group{border-radius:8px;}
.cd-head .head-actions{display:flex; gap:2px;}
.cd-head .icon-act{
  width:30px; height:30px; border-radius:8px;
  border:0; background:transparent;
  color:var(--muted, #6b6b6b);
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.cd-head .icon-act:hover{background:var(--chip, #f1f1ec); color:var(--ink, #111);}
.cd-head .icon-act svg{width:15px; height:15px;}

/* Recents */
.cd-tabs{
  display:flex; gap:4px;
  padding:8px 12px;
  border-bottom:1px solid var(--line, #e7e7e2);
  flex-shrink:0;
}
.cd-tab{
  padding:5px 10px;
  font:inherit; font-size:12.5px; font-weight:500;
  border:0; background:transparent;
  color:var(--muted, #6b6b6b);
  border-radius:6px;
  cursor:pointer;
}
.cd-tab:hover{background:var(--chip, #f1f1ec);}
.cd-tab.active{background:var(--ink, #111); color:#fff;}
.cd-tab .ct{
  margin-left:5px;
  background:rgba(255,255,255,.18);
  padding:1px 5px; border-radius:8px;
  font-size:10.5px;
}
.cd-tab:not(.active) .ct{background:var(--chip, #f1f1ec); color:var(--muted, #6b6b6b);}

.cd-list{
  flex:1; overflow-y:auto;
  background:#fff;
}
.cd-conv{
  display:grid;
  grid-template-columns:36px 1fr auto;
  gap:10px; align-items:center;
  padding:10px 14px;
  border-bottom:1px solid var(--line-2, #efefea);
  cursor:pointer;
  background:#fff;
  text-decoration:none; color:inherit;
}
.cd-conv:hover{background:#fbfbf8;}
.cd-conv.unread{background:rgba(46,42,110,.025);}
.cd-conv .av{
  width:36px; height:36px; border-radius:50%;
  overflow:hidden; flex-shrink:0;
  border:1px solid var(--line, #e7e7e2);
  background:var(--chip, #f1f1ec);
}
.cd-conv .av img{width:100%; height:100%; object-fit:cover;}
.cd-conv .av.group{border-radius:8px;}
.cd-conv .body{min-width:0;}
.cd-conv h4{
  font-size:13px; font-weight:600;
  display:flex; align-items:center; gap:4px;
  margin:0 0 1px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.cd-conv h4 svg.v{width:11px; height:11px; color:var(--accent, #2d2a6e); flex-shrink:0;}
.cd-conv .prev{
  font-size:12px; color:var(--muted, #6b6b6b);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.cd-conv.unread .prev{color:var(--ink-2, #3a3a3a); font-weight:500;}
.cd-conv .meta{
  display:flex; flex-direction:column; align-items:flex-end; gap:3px;
}
.cd-conv .time{font-size:10.5px; color:var(--muted-2, #8a8a8a);}
.cd-conv .ud{
  background:var(--accent, #2d2a6e); color:#fff;
  font-size:10px; font-weight:600;
  min-width:17px; height:17px; padding:0 5px;
  border-radius:999px;
  display:inline-flex; align-items:center; justify-content:center;
}
.cd-conv .req-tag{
  background:var(--warn-soft, #fbf2dc); color:var(--warn, #8a5a00);
  font-size:9.5px; font-weight:600;
  padding:1px 5px; border-radius:4px;
  letter-spacing:.04em; text-transform:uppercase;
}

.cd-empty{
  padding:48px 28px;
  text-align:center;
  color:var(--muted, #6b6b6b);
  font-size:13px;
}
.cd-empty svg{width:36px; height:36px; opacity:.4; margin-bottom:10px;}

/* Chat view */
.cd-thread{
  flex:1; min-height:0;
  display:flex; flex-direction:column;
}

.cd-banner{
  flex-shrink:0;
  padding:10px 14px;
  background:var(--accent-soft, #eeedf7);
  border-bottom:1px solid #dcd9ee;
  font-size:12px;
  color:var(--ink-2, #3a3a3a);
  display:flex; gap:8px;
  align-items:flex-start;
}
.cd-banner svg{width:14px; height:14px; color:var(--accent, #2d2a6e); flex-shrink:0; margin-top:1px;}
.cd-banner strong{color:var(--ink, #111); font-weight:600;}

/* Request prompt — Accept/Decline/Mute/Block */
.cd-request{
  flex-shrink:0;
  padding:14px;
  background:var(--warn-soft, #fbf2dc);
  border-bottom:1px solid #e8d8a8;
}
.cd-request .head-row{
  display:flex; align-items:center; gap:6px; margin-bottom:6px;
  font-size:11px; font-weight:600;
  color:var(--warn, #8a5a00); text-transform:uppercase; letter-spacing:.06em;
}
.cd-request .head-row svg{width:12px; height:12px;}
.cd-request h5{
  font-size:13px; font-weight:600; margin-bottom:4px;
  color:var(--ink, #111);
}
.cd-request .first-msg{
  font-size:12.5px; color:var(--ink-2, #3a3a3a);
  background:#fff;
  padding:8px 10px; border-radius:7px;
  border:1px solid #e8d8a8;
  margin:6px 0 10px;
  line-height:1.45;
}
.cd-request .actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
}
.cd-request .actions .full{grid-column:span 2;}
.cd-req-btn{
  padding:7px 10px;
  border-radius:7px;
  border:1px solid var(--line, #e7e7e2);
  background:#fff;
  font:inherit; font-size:12px; font-weight:500;
  color:var(--ink-2, #3a3a3a);
  cursor:pointer;
}
.cd-req-btn:hover{background:var(--chip, #f1f1ec);}
.cd-req-btn.primary{background:var(--ink, #111); color:#fff; border-color:var(--ink, #111);}
.cd-req-btn.primary:hover{background:#000;}
.cd-req-btn.danger{color:#9c2a2a;}

/* Pinned in group */
.cd-pinned{
  flex-shrink:0;
  padding:8px 14px;
  background:#fffdf4;
  border-bottom:1px solid var(--line-2, #efefea);
  font-size:11.5px;
  color:var(--ink-2, #3a3a3a);
  display:flex; gap:6px; align-items:center;
}
.cd-pinned svg{width:12px; height:12px; color:#a98a2a; flex-shrink:0;}

.cd-messages{
  flex:1; min-height:0;
  overflow-y:auto;
  padding:14px;
  display:flex; flex-direction:column; gap:8px;
  background:#fbfbf8;
}
.cd-day-sep{
  text-align:center; font-size:10.5px;
  color:var(--muted-2, #8a8a8a);
  margin:4px 0 2px;
  position:relative;
}
.cd-day-sep::before,.cd-day-sep::after{
  content:''; position:absolute; top:50%;
  width:34%; height:1px; background:var(--line, #e7e7e2);
}
.cd-day-sep::before{left:0;} .cd-day-sep::after{right:0;}

.cd-sys{
  align-self:center;
  font-size:11px; color:var(--muted, #6b6b6b);
  background:var(--chip, #f1f1ec);
  padding:3px 9px; border-radius:999px;
  max-width:80%; text-align:center;
}

.cd-msg-row{
  display:flex; align-items:flex-end; gap:6px;
}
.cd-msg-row.out{justify-content:flex-end;}
.cd-msg-row .av-mini{
  width:22px; height:22px; border-radius:50%;
  overflow:hidden; flex-shrink:0;
  border:1px solid var(--line, #e7e7e2);
  background:var(--chip, #f1f1ec);
  visibility:hidden;
}
.cd-msg-row .av-mini.show{visibility:visible;}
.cd-msg-row .av-mini img{width:100%; height:100%; object-fit:cover;}

.cd-bubble{
  max-width:74%;
  font-size:13px; line-height:1.5;
  padding:7px 11px;
  border-radius:13px;
  border:1px solid var(--line, #e7e7e2);
  background:#fff;
  color:var(--ink-2, #3a3a3a);
  border-bottom-left-radius:4px;
  position:relative;
}
.cd-msg-row.out .cd-bubble{
  background:var(--ink, #111); color:#fff;
  border-color:var(--ink, #111);
  border-radius:13px; border-bottom-right-radius:4px;
}
.cd-bubble .sender-name{
  font-size:11px; font-weight:600;
  color:var(--accent, #2d2a6e);
  margin-bottom:2px;
}
.cd-bubble .reply-to{
  font-size:11.5px;
  background:rgba(0,0,0,.04);
  border-left:2px solid var(--ink, #111);
  padding:4px 8px;
  border-radius:5px;
  margin-bottom:5px;
  color:var(--muted, #6b6b6b);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  max-width:240px;
}
.cd-msg-row.out .cd-bubble .reply-to{
  background:rgba(255,255,255,.12);
  border-left-color:rgba(255,255,255,.6);
  color:rgba(255,255,255,.7);
}

/* Offer card inline */
.cd-bubble.offer{
  padding:0; background:#fff; color:var(--ink, #111);
  border:1px solid var(--line, #e7e7e2);
  max-width:84%;
  width:240px;
  border-radius:13px;
  overflow:hidden;
}
.cd-msg-row.out .cd-bubble.offer{background:#fff; color:var(--ink, #111); border-color:var(--line, #e7e7e2);}
.cd-bubble.offer .o-head{
  padding:8px 12px;
  background:var(--accent-soft, #eeedf7);
  font-size:10px; font-weight:600;
  letter-spacing:.06em; text-transform:uppercase;
  color:var(--accent, #2d2a6e);
}
.cd-bubble.offer .o-body{padding:10px 12px;}
.cd-bubble.offer .o-body strong{font-size:13px; display:block; margin-bottom:3px;}
.cd-bubble.offer .o-body .price{
  font-size:16px; font-weight:600;
  letter-spacing:-0.01em;
  font-feature-settings:'tnum';
  margin:3px 0;
}
.cd-bubble.offer .o-body .meta{
  font-size:11px; color:var(--muted, #6b6b6b);
  margin-bottom:6px;
}
.cd-bubble.offer .o-actions{
  display:flex; gap:5px; padding:0 12px 12px;
}
.cd-bubble.offer .o-actions .b{
  flex:1; padding:6px 8px;
  border-radius:6px;
  border:1px solid var(--line, #e7e7e2);
  background:#fff;
  font:inherit; font-size:11.5px; font-weight:500;
  cursor:pointer;
}
.cd-bubble.offer .o-actions .b.primary{background:var(--ink, #111); color:#fff; border-color:var(--ink, #111);}

/* Attachment row */
.cd-attach{
  display:flex; gap:6px; align-items:center;
  padding:6px 8px;
  border:1px solid var(--line, #e7e7e2);
  background:#fff;
  border-radius:7px;
  font-size:12px; color:var(--ink-2, #3a3a3a);
  margin-top:4px;
}
.cd-msg-row.out .cd-bubble .cd-attach{background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.2); color:#fff;}
.cd-attach svg{width:14px; height:14px;}

.cd-tick{
  font-size:10px;
  color:var(--muted-2, #8a8a8a);
  margin-top:2px;
  display:flex; align-items:center; gap:3px;
  justify-content:flex-end;
}
.cd-msg-row.out .cd-bubble .cd-tick{
  color:rgba(255,255,255,.55);
  justify-content:flex-end;
}
.cd-tick svg{width:11px; height:11px;}
.cd-tick.seen{color:#5fb89a;}
.cd-msg-row.out .cd-bubble .cd-tick.seen{color:#7ed5b3;}

.cd-typing{
  align-self:flex-start;
  background:#fff; border:1px solid var(--line, #e7e7e2);
  padding:8px 13px;
  border-radius:13px; border-bottom-left-radius:4px;
  display:flex; gap:4px;
}
.cd-typing span{
  width:5px; height:5px; border-radius:50%;
  background:var(--muted-2, #8a8a8a);
  animation:cd-bounce 1.2s infinite ease-in-out;
}
.cd-typing span:nth-child(2){animation-delay:.15s;}
.cd-typing span:nth-child(3){animation-delay:.3s;}
@keyframes cd-bounce{
  0%,80%,100%{opacity:.3; transform:translateY(0);}
  40%{opacity:1; transform:translateY(-3px);}
}

/* Composer */
.cd-composer{
  flex-shrink:0;
  border-top:1px solid var(--line, #e7e7e2);
  padding:8px 10px;
  background:#fff;
  display:flex; gap:6px; align-items:flex-end;
}
.cd-composer .editor{
  flex:1;
  border:1px solid var(--line, #e7e7e2);
  border-radius:9px;
  display:flex; flex-direction:column;
  background:#fff;
}
.cd-composer textarea{
  width:100%; resize:none;
  border:0; outline:none;
  font:inherit; font-size:13px;
  padding:8px 10px;
  min-height:36px; max-height:120px;
  color:var(--ink, #111);
  background:transparent;
}
.cd-composer .ed-actions{
  display:flex; align-items:center; gap:2px;
  padding:4px 6px;
  border-top:1px solid var(--line-2, #efefea);
}
.cd-composer .ed-btn{
  width:26px; height:26px; border-radius:6px;
  border:0; background:transparent;
  color:var(--muted, #6b6b6b);
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.cd-composer .ed-btn:hover{background:var(--chip, #f1f1ec); color:var(--ink, #111);}
.cd-composer .ed-btn svg{width:14px; height:14px;}
.cd-composer .send{
  margin-left:auto;
  padding:5px 12px;
  border-radius:6px;
  border:0; background:var(--ink, #111); color:#fff;
  font:inherit; font-size:12px; font-weight:500;
  cursor:pointer;
}
.cd-composer .send:hover{background:#000;}
.cd-composer .send[disabled]{background:var(--chip, #f1f1ec); color:var(--muted-2, #8a8a8a); cursor:not-allowed;}

/* Cooldown / blocked state — composer disabled */
.cd-composer.locked{
  padding:16px;
  justify-content:center;
  color:var(--muted, #6b6b6b);
  font-size:12.5px;
  text-align:center;
  flex-direction:column;
  gap:6px;
}
.cd-composer.locked svg{width:16px; height:16px; color:var(--muted-2, #8a8a8a);}

/* Group participants strip */
.cd-participants{
  flex-shrink:0;
  padding:8px 14px;
  border-bottom:1px solid var(--line-2, #efefea);
  display:flex; gap:5px;
  background:#fbfbf8;
  overflow-x:auto;
  font-size:11.5px;
}
.cd-participants .p-pill{
  display:inline-flex; align-items:center; gap:4px;
  padding:2px 8px;
  background:#fff;
  border:1px solid var(--line, #e7e7e2);
  border-radius:999px;
  color:var(--ink-2, #3a3a3a);
  white-space:nowrap;
}
.cd-participants .p-pill .pav{
  width:14px; height:14px; border-radius:50%;
  background:var(--chip, #f1f1ec); overflow:hidden;
}
.cd-participants .p-pill .pav img{width:100%; height:100%; object-fit:cover;}

/* Mobile fullscreen */
@media (max-width: 640px){
  .cd-root{right:16px; bottom:16px;}
  .cd-launcher{width:50px; height:50px;}
  .cd-panel{
    position:fixed;
    inset:0;
    width:100vw; height:100dvh; max-height:none;
    border-radius:0; border:0;
    bottom:0; right:0;
  }
}

/* ── Attachment preview strip (above composer) ──────────────────────────── */
.cd-att-preview{
  display:flex; align-items:center; gap:8px;
  padding:6px 8px;
  margin-bottom:6px;
  border:1px solid var(--line, #e7e7e2);
  border-radius:8px;
  background:#fbfbf8;
}
.cd-att-preview.err{
  border-color:rgba(156,42,42,.3);
  background:rgba(156,42,42,.04);
}
.cd-att-thumb{
  width:40px; height:40px; border-radius:7px;
  overflow:hidden; flex-shrink:0;
  position:relative;
  background:var(--chip, #f1f1ec);
  display:flex; align-items:center; justify-content:center;
}
.cd-att-thumb.img img{width:100%; height:100%; object-fit:cover; display:block;}
.cd-att-thumb.file svg{width:18px; height:18px; color:var(--muted, #6b6b6b);}
.cd-att-thumb.file.err svg{color:#9c2a2a;}
.cd-att-overlay{
  position:absolute; inset:0;
  background:rgba(0,0,0,.42);
  display:flex; align-items:center; justify-content:center;
}
.cd-att-spin{
  width:14px; height:14px; border-radius:50%;
  border:2px solid rgba(255,255,255,.35);
  border-top-color:#fff;
  animation:cd-spin .7s linear infinite;
  flex-shrink:0;
}
.cd-att-spin.dark{
  border-color:var(--line, #e7e7e2);
  border-top-color:var(--accent, #2d2a6e);
}
.cd-att-info{flex:1; min-width:0;}
.cd-att-name{
  font-size:12px; font-weight:500;
  color:var(--ink, #111);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.cd-att-status{font-size:11px; color:var(--muted, #6b6b6b); margin-top:1px;}
.cd-att-status.err{color:#9c2a2a;}
.cd-att-dismiss{
  width:24px; height:24px; border-radius:12px;
  border:0; background:var(--chip, #f1f1ec);
  color:var(--muted, #6b6b6b);
  font-size:13px; line-height:1;
  cursor:pointer; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
}
.cd-att-dismiss:hover{background:var(--line, #e7e7e2); color:var(--ink, #111);}

/* Active attach button (when attachment is pending) */
.cd-composer .ed-btn.att-active{
  color:var(--accent, #2d2a6e);
  background:var(--accent-soft, #eeedf7);
}

/* Send button spinner while uploading */
.cd-send-spin{
  width:11px; height:11px; border-radius:50%;
  border:2px solid rgba(255,255,255,.35);
  border-top-color:#fff;
  animation:cd-spin .7s linear infinite;
  display:inline-block;
}

/* ── Image bubble ──────────────────────────────────────────────────────────── */
.cd-bubble.has-img{padding:4px;}
.cd-img-wrap{line-height:0; border-radius:9px; overflow:hidden;}
.cd-img-msg{
  display:block; max-width:220px; width:100%;
  height:auto; border-radius:9px;
  cursor:zoom-in;
  transition:opacity .15s;
}
.cd-img-msg:hover{opacity:.93;}
.cd-img-caption{
  margin:5px 8px 3px;
  font-size:12.5px; line-height:1.45;
  color:var(--ink-2, #3a3a3a);
}
.cd-msg-row.out .cd-bubble.has-img .cd-img-caption{color:rgba(255,255,255,.9);}
/* Move tick inside padded footer when it's an image bubble */
.cd-bubble.has-img .cd-tick{padding:0 5px 3px; margin-top:2px;}

/* ── File chip ─────────────────────────────────────────────────────────────── */
.cd-file-chip{
  display:flex; align-items:center; gap:8px;
  padding:7px 9px;
  border-radius:8px;
  background:rgba(0,0,0,.05);
  text-decoration:none; color:inherit;
  transition:background .15s;
  min-width:0;
}
.cd-file-chip:hover{background:rgba(0,0,0,.09);}
.cd-msg-row.out .cd-file-chip{background:rgba(255,255,255,.14);}
.cd-msg-row.out .cd-file-chip:hover{background:rgba(255,255,255,.2);}
.cd-file-chip > svg:first-child{
  width:20px; height:20px; flex-shrink:0;
  color:var(--muted, #6b6b6b);
}
.cd-msg-row.out .cd-file-chip > svg:first-child{color:rgba(255,255,255,.7);}
.fc-info{flex:1; min-width:0; display:flex; flex-direction:column; gap:1px;}
.fc-name{
  font-size:12px; font-weight:500;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  color:var(--ink, #111);
}
.cd-msg-row.out .fc-name{color:#fff;}
.fc-size{font-size:10.5px; color:var(--muted, #6b6b6b);}
.cd-msg-row.out .fc-size{color:rgba(255,255,255,.6);}
.fc-dl{
  width:14px; height:14px; flex-shrink:0;
  color:var(--muted, #6b6b6b);
}
.cd-msg-row.out .fc-dl{color:rgba(255,255,255,.6);}

/* ── Lightbox overlay ──────────────────────────────────────────────────────── */
.cd-lightbox{
  position:fixed; inset:0; z-index:99999;
  background:rgba(0,0,0,.84);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  display:flex; align-items:center; justify-content:center;
  padding:24px;
  cursor:zoom-out;
}
.cd-lightbox img{
  max-width:90vw; max-height:90vh;
  object-fit:contain;
  border-radius:10px;
  box-shadow:0 20px 60px rgba(0,0,0,.5);
  cursor:default;
}
.cd-lb-close{
  position:fixed; top:20px; right:20px;
  width:38px; height:38px; border-radius:19px;
  border:0; background:rgba(255,255,255,.14);
  color:#fff; font-size:18px; line-height:1;
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.cd-lb-close:hover{background:rgba(255,255,255,.22);}