/* chat v3: острова, центральная колонка, компактные пузыри с хвостиком */

/* ---------- пузыри (везде: страница чатов и боковая панель) ---------- */
.cm-view .cm-msg{margin-top:8px;gap:8px}
.cm-view .cm-msg:not(.first){margin-top:2px}
.cm-view .cm-msg.other:not(.imgonly){gap:10px}
.cm-view .cm-bubble{padding:6px 9px 6px 10px;border-radius:12px;box-shadow:none;border:1px solid var(--ch-border-in);position:relative}
.cm-view .cm-msg.mine .cm-bubble{border:1px solid var(--ch-border-out)}
.cm-view .cm-msg.other:not(.grp) .cm-bubble,.cm-view .cm-msg.mine:not(.grp) .cm-bubble{border-radius:12px}
.cm-view .cm-bubble.imgonly,.cm-view .cm-msg.mine .cm-bubble.imgonly,.cm-view .cm-bubble.noteonly,.cm-view .cm-msg.mine .cm-bubble.noteonly{border:0}
.cm-view .cm-bubble.imgonly{border-radius:12px}
.cm-view .cm-meta{font-size:11px}
.cm-view .cm-more,.cm-view .cm-down{box-shadow:none}
.cm-view .cm-bubble{max-width:480px}
.cm-view.cm-compact .cm-bubble,#chat-panel .cm-bubble{max-width:85%}

/* хвостик у последнего сообщения серии */
.cm-view .cm-msg.other.last .cm-bubble:not(.imgonly):not(.noteonly),
.cm-view .cm-msg.other:not(.grp).last .cm-bubble:not(.imgonly):not(.noteonly){border-bottom-left-radius:4px}
.cm-view .cm-msg.mine.last .cm-bubble:not(.imgonly):not(.noteonly),
.cm-view .cm-msg.mine:not(.grp).last .cm-bubble:not(.imgonly):not(.noteonly){border-bottom-right-radius:4px}
.cm-view .cm-msg.last .cm-bubble:not(.imgonly):not(.noteonly)::after{
  content:"";position:absolute;bottom:-1px;width:10px;height:16px;pointer-events:none;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 16'%3E%3Cpath d='M10 0V16H0C3.5 14 9.5 11 10 0z'/%3E%3C/svg%3E") center/100% 100% no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 16'%3E%3Cpath d='M10 0V16H0C3.5 14 9.5 11 10 0z'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.cm-view .cm-msg.other.last .cm-bubble:not(.imgonly):not(.noteonly)::after{left:-9px;background-color:var(--bubble-in)}
.cm-view .cm-msg.mine.last .cm-bubble:not(.imgonly):not(.noteonly)::after{right:-9px;transform:scaleX(-1);background-color:var(--bubble-out)}

/* ---------- страница чатов: острова ---------- */
#chats-view .ch-page{box-sizing:border-box;padding:10px;gap:10px;
  background:var(--chat-pat) 0 0/240px 240px repeat,var(--ch-grid),var(--chat-bg)}
:root[data-chat-pattern="off"] #chats-view .ch-page{background:var(--chat-bg)}
#chats-view .ch-side,#chats-view .cm-prof{background:var(--panel);border-radius:16px;border:1px solid var(--border);overflow:hidden;box-shadow:none}
:root[data-theme="dark"] #chats-view .ch-side,:root[data-theme="dark"] #chats-view .cm-prof{border:0}
#chats-view .cm-prof{margin-left:10px}
#chats-view .cm-wrap.prof-over .cm-prof{margin-left:0;border-radius:16px}
#chats-view .cm-view,#chats-view .cm-scroll{background:transparent}

/* центральная колонка */
#chats-view .cm-head,#chats-view .cm-mini,#chats-view .cm-pin,#chats-view .cm-compose{
  width:100%;max-width:760px;margin-left:auto;margin-right:auto;box-sizing:border-box;
  background:var(--panel);border:1px solid var(--border);border-radius:14px;box-shadow:none}
#chats-view .cm-head{min-height:54px;margin-bottom:0}
#chats-view .cm-mini,#chats-view .cm-pin{margin-top:8px}
#chats-view .cm-pin{border-left:3px solid var(--accent)}
#chats-view .cm-head.selbar{background:var(--sel-bg)}
#chats-view .cm-compose{margin-top:8px;padding:6px 8px}
:root[data-theme="dark"] #chats-view .cm-head,:root[data-theme="dark"] #chats-view .cm-mini,:root[data-theme="dark"] #chats-view .cm-pin,:root[data-theme="dark"] #chats-view .cm-compose{border:0}
:root[data-theme="dark"] #chats-view .cm-pin{border-left:3px solid var(--accent)}
#chats-view .cm-scroll{padding-left:max(0px,calc((100% - 760px)/2));padding-right:max(0px,calc((100% - 760px)/2))}
#chats-view .cm-down{right:max(16px,calc((100% - 760px)/2 + 16px))}

@media (max-width:899px){
  #chats-view .cm-head,#chats-view .cm-compose,#chats-view .cm-mini,#chats-view .cm-pin{border-radius:12px}
  #chats-view .cm-scroll{padding-left:0;padding-right:0}
  #chats-view .cm-down{right:16px}
}
@media (max-width:699px){
  #chats-view .ch-page{padding:6px;gap:6px}
  #chats-view .ch-side,#chats-view .cm-prof{border-radius:12px}
  #chats-view .cm-wrap.prof-over .cm-prof{border-radius:12px}
}