#mh-conversations-dialog{
  width:min(760px,calc(100vw - 36px));height:min(790px,calc(100dvh - 36px));
  max-width:none;max-height:none;margin:auto;padding:0;overflow:hidden;
  border:1px solid #c6dcf0;border-radius:22px;background:#fff;
  box-shadow:0 30px 90px #001b3e70;color:#092b51;
}
#mh-conversations-dialog::backdrop{background:#00152fbd;backdrop-filter:blur(7px)}
.mh-chat-modal-frame{display:flex;flex-direction:column;height:100%;min-height:0;background:#fff}
.mh-chat-modal-head{
  display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:12px;
  min-height:88px;padding:14px 25px;color:#fff;
  background:linear-gradient(115deg,#061f42,#063a74 72%,#0966ba);
}
.mh-chat-modal-head h2{font-size:26px;letter-spacing:-.8px}
.mh-chat-modal-close{
  display:grid;place-items:center;width:42px;height:42px;padding:0;
  border:1px solid #ffffff4d;border-radius:12px;background:#ffffff16;color:#fff;
}
.mh-chat-modal-close .icon{width:21px;height:21px}
.mh-chat-modal-close:hover{background:#ffffff2a}
.mh-chat-modal-brand{display:block;width:102px;height:40px;object-fit:contain;filter:brightness(0) invert(1)}
.mh-chat-contact-strip{
  display:flex;gap:19px;flex:none;padding:17px 25px 15px;overflow-x:auto;
  border-bottom:1px solid #e2ebf4;scrollbar-width:thin;scrollbar-color:#b8d2eb transparent;
}
.mh-chat-contact{
  display:flex;flex-direction:column;align-items:center;gap:7px;min-width:66px;max-width:78px;
  padding:0;border:0;background:none;color:#617692;font-size:10px;font-weight:700;
}
.mh-chat-contact .avatar{width:54px;height:54px;border:2px solid #fff;box-shadow:0 0 0 1px #d5e4f1}
.mh-chat-contact.selected .avatar{box-shadow:0 0 0 3px #087bff}
.mh-chat-contact.selected{color:#062a50}
.mh-chat-contact span:last-child{max-width:78px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mh-chat-modal-thread{display:flex;flex-direction:column;flex:1;min-height:0}
.mh-chat-thread-head{
  display:flex;align-items:center;gap:12px;flex:none;min-height:72px;
  padding:12px 26px;border-bottom:1px solid #e6edf5;
}
.mh-chat-thread-head .avatar{width:43px;height:43px}
.mh-chat-thread-head h3{font-size:17px;line-height:1.2}
.mh-chat-thread-head p{margin-top:3px;color:#6b8099;font-size:11px}
.mh-chat-thread-messages{
  display:flex;flex-direction:column;flex:1;min-height:0;gap:15px;overflow-y:auto;
  padding:20px 27px;background:linear-gradient(#fff,#f8fbff);
}
.mh-chat-thread-messages .chat-day{align-self:center;margin-bottom:3px;color:#8193a8;font-size:10px}
.mh-chat-thread-messages .bubble{
  align-self:flex-start;max-width:min(78%,440px);margin:0;padding:13px 16px;
  border:1px solid #e2eaf4;border-radius:17px 17px 17px 4px;
  background:#fff;box-shadow:0 3px 11px #062c5a08;color:#122f52;
}
.mh-chat-thread-messages .bubble.sent{
  align-self:flex-end;margin-left:auto;border-color:#cfe6ff;
  border-radius:17px 17px 4px 17px;background:#e8f4ff;
}
.mh-chat-thread-messages .bubble p{font-size:13px;line-height:1.48}
.mh-chat-thread-messages .bubble small{display:block;margin-top:6px;color:#758aa4;font-size:10px}
.mh-chat-thread-messages .chat-empty{margin:auto;text-align:center;color:#667e99}
.mh-chat-thread-messages .chat-empty h3{color:#123c68;margin-bottom:7px}
.mh-chat-state{align-self:center;margin:auto;color:#667e99;font-size:12px}
.mh-chat-thread-state{display:flex;align-items:center;justify-content:center}
.mh-chat-empty{max-width:360px;margin:auto;padding:30px;text-align:center;color:#667e99}
.mh-chat-empty h3{margin:12px 0 7px;color:#123c68;font-size:17px}
.mh-chat-empty p{margin:0 0 16px;font-size:12px;line-height:1.6}
.mh-chat-empty .metric-icon{margin-inline:auto}
.mh-chat-empty .btn{margin-top:4px}
.mh-chat-compose-wrap{flex:none;padding:11px 25px 16px;border-top:1px solid #e2ebf4;background:#fff}
.mh-chat-compose-wrap>p:first-child{margin:0 0 8px;color:#8193a8;font-size:10px}
.mh-chat-compose{display:flex;align-items:center;gap:9px}
.mh-chat-compose input{
  flex:1;min-width:0;min-height:48px;padding:0 16px;border:1px solid #d9e6f3;
  border-radius:25px;background:#f4f8fc;color:#0b2d54;font-size:13px;
}
.mh-chat-compose button{
  display:grid;place-items:center;flex:none;width:48px;height:48px;border:0;
  border-radius:50%;background:#087bff;color:#fff;box-shadow:0 6px 15px #087bff37;
}
.mh-chat-compose button:hover{background:#006add}
.mh-chat-compose button .icon{width:21px;height:21px}
.mh-chat-compose-status{min-height:0;margin:5px 0 0;color:#426f9e;font-size:10px}
@media(max-width:760px){
  #mh-conversations-dialog{
    inset:0;width:100vw;height:100dvh;margin:0;border:0;border-radius:0;
  }
  .mh-chat-modal-head{min-height:78px;padding:13px 18px;grid-template-columns:38px 1fr auto}
  .mh-chat-modal-head h2{font-size:22px}
  .mh-chat-modal-close{width:35px;height:35px;border-color:transparent;background:transparent}
  .mh-chat-modal-brand{width:87px;height:35px}
  .mh-chat-contact-strip{gap:14px;padding:15px 18px 13px}
  .mh-chat-contact{min-width:60px;max-width:70px}
  .mh-chat-contact .avatar{width:50px;height:50px}
  .mh-chat-thread-head{padding:11px 19px;min-height:68px}
  .mh-chat-thread-messages{padding:18px 19px}
  .mh-chat-thread-messages .bubble{max-width:86%}
  .mh-chat-compose-wrap{padding:9px 15px calc(14px + env(safe-area-inset-bottom,0px))}
}
@media(prefers-reduced-motion:no-preference){
  #mh-conversations-dialog[open]{animation:mh-chat-open .22s ease-out both}
  @keyframes mh-chat-open{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
}
