.clib-message-workspace{
  position:relative;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  min-width:0;
  height:680px;
  color:var(--label);
}

.clib-message-workspace--full{height:680px}
.clib-message-workspace--compact{height:600px}
.clib-message-workspace--room{height:620px}
.clib-message-workspace--compact[data-logged-out="true"]{height:220px}

.clib-message-scope{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  width:min(100%,240px);
  margin:0 0 var(--s16);
  padding:2px;
  border:1px solid var(--hair);
  border-radius:24px;
  background:var(--page);
}

.clib-message-scope-button{
  min-height:44px;
  padding:0 var(--s16);
  border:0;
  border-radius:24px;
  background:transparent;
  color:var(--label-2);
  font:inherit;
  font-size:15px;
  cursor:pointer;
}

.clib-message-scope-button[aria-selected="true"]{
  background:var(--card);
  border:1px solid var(--hair);
  color:var(--label);
  font-weight:500;
}

.clib-message-scope-button:focus-visible,
.clib-message-header-button:focus-visible,
.clib-message-drawer-close:focus-visible,
.clib-message-more:focus-visible,
.clib-message-link:focus-visible{
  outline:0;
  box-shadow:0 0 0 4px var(--brand-0);
}

.clib-message-realtime{
  grid-column:1 / -1;
  padding:var(--s8) var(--s12);
  color:var(--label-2);
  font-size:12px;
}

.clib-message-main{
  height:100%;
  min-height:0;
  overflow:hidden;
  border:1px solid var(--hair);
  border-radius:var(--r-lg);
  background:var(--card);
  color:var(--label);
  box-shadow:none;
}

.clib-message-main.cs-main-container>.cs-sidebar.cs-sidebar--left{
  flex:0 0 300px;
  width:300px;
  max-width:300px;
  border-right:1px solid var(--hair);
  background:var(--page);
  box-shadow:none;
}

.clib-message-main .cs-chat-container{
  min-width:0;
  background:var(--card);
}

.clib-message-main .cs-conversation-header{
  min-height:64px;
  border-bottom:1px solid var(--hair);
  background:var(--card);
}

.clib-message-mobile-back{
  display:none;
  color:var(--brand);
  font-size:13px;
}

.clib-message-mobile-back-button{
  padding:0;
  border:0;
  background:transparent;
  color:inherit;
  font:inherit;
  cursor:pointer;
}

.clib-message-main .cs-conversation-header__content{
  min-width:0;
}

.clib-message-main .cs-conversation-header__user-name{
  color:var(--label);
  font-size:17px;
  font-weight:500;
}

.clib-message-main .cs-conversation-header__info{
  color:var(--label-2);
  font-size:13px;
}

.clib-message-main .cs-search{
  margin:0 var(--s16) var(--s12);
  border-radius:var(--r-sm);
  background:var(--card);
}

.clib-message-main .cs-search-input{
  font:inherit;
  font-size:15px;
}

.clib-message-main .cs-conversation-list{
  height:auto;
  flex:1;
  overflow:auto;
  border:0;
  border-radius:0;
  background:transparent;
}

.clib-message-main .cs-conversation{
  min-height:64px;
  margin:0 var(--s8) var(--s4);
  padding:var(--s8);
  border:0;
  border-radius:var(--r-sm);
  background:transparent;
}

.clib-message-main .cs-conversation:hover{
  background:color-mix(in srgb,var(--brand-0) 60%,var(--card));
}

.clib-message-main .cs-conversation--active{
  background:var(--card);
  box-shadow:0 0 0 1px var(--hair);
}

.clib-message-main .cs-conversation__name{
  color:var(--label);
  font-size:15px;
  font-weight:500;
}

.clib-message-main .cs-conversation__info,
.clib-message-main .cs-conversation__last-activity-time{
  color:var(--label-2);
  font-size:12px;
}

.clib-message-main .cs-avatar{
  width:36px;
  height:36px;
  min-width:36px;
}

.clib-message-main .cs-expansion-panel{
  border:0;
  background:transparent;
}

.clib-message-main .cs-expansion-panel__header{
  min-height:44px;
  color:var(--label);
  font-size:13px;
  font-weight:500;
}

.clib-message-main .cs-expansion-panel__content{
  padding:0;
}

.clib-message-main .cs-message-list{
  padding:var(--s24);
  background:var(--card);
}

.clib-message-main .cs-message{
  margin-bottom:var(--s8);
}

.clib-message-main .cs-message--incoming .cs-message__content{
  max-width:min(72%,620px);
  border:1px solid var(--hair);
  border-radius:var(--r-md);
  background:var(--page);
  color:var(--label);
}

.clib-message-main .cs-message--outgoing .cs-message__content{
  max-width:min(72%,620px);
  border:0;
  border-radius:var(--r-md);
  background:var(--brand-0);
  color:var(--label);
}

.clib-message-main .cs-message__content{
  padding:var(--s12) var(--s16);
  font-size:15px;
  line-height:1.5;
}

.clib-message-main .cs-message-separator{
  margin:var(--s16) 0;
  color:var(--label-2);
  font-size:12px;
}

.clib-message-main .cs-message-separator::before,
.clib-message-main .cs-message-separator::after{
  background:var(--hair);
}

.clib-message-main .cs-message-input{
  min-height:auto;
  padding:var(--s12) var(--s16) var(--s16);
  border-top:1px solid var(--hair);
  background:var(--card);
}

.clib-message-main .cs-message-input__content-editor-wrapper{
  border:1px solid var(--hair);
  border-radius:var(--r-sm);
  background:var(--card);
  box-shadow:0 0 0 1px rgb(255 255 255 / .8);
}

.clib-message-main .cs-message-input__content-editor-wrapper:focus-within{
  border-color:var(--brand-2);
  box-shadow:0 0 0 3px var(--brand-0);
}

.clib-message-main .cs-message-input__content-editor{
  min-height:48px;
  padding:var(--s12);
  background:var(--card);
  color:var(--label);
  font:inherit;
  font-size:15px;
}

.clib-message-main .cs-message-input__content-editor-container,
.clib-message-main .cs-message-input--disabled .cs-message-input__content-editor-wrapper{
  background:var(--card);
}

.clib-message-main .cs-button--send{
  color:var(--brand);
}

.clib-message-main .cs-message-input__tools:has(> .cs-button--attachment),
.clib-message-main .cs-button--attachment{
  display:none;
}

.clib-message-main .cs-button--send:disabled{
  color:var(--label-3);
}

.clib-message-list-heading,
.clib-message-list-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--s12);
  min-height:44px;
  padding:var(--s12) var(--s16) var(--s8);
  color:var(--label-2);
  font-size:12px;
}

.clib-message-link,
.clib-message-more{
  border:0;
  background:transparent;
  color:var(--brand);
  font:inherit;
  font-size:13px;
  cursor:pointer;
}

.clib-message-more{
  width:calc(100% - var(--s16));
  min-height:40px;
  margin:var(--s8);
  border:1px solid var(--hair);
  border-radius:var(--r-sm);
  background:var(--card);
}

.clib-message-direct-list,
.clib-message-project-groups,
.clib-message-notification-list{
  display:flex;
  min-height:0;
  height:100%;
  flex-direction:column;
}

.clib-message-project-groups,
.clib-message-notification-list{
  overflow:auto;
}

.clib-message-project-note{
  margin:0;
  padding:var(--s12) var(--s16);
  border-bottom:1px solid var(--hair);
  color:var(--label-2);
  font-size:12px;
  line-height:1.5;
}

.clib-message-state,
.clib-message-empty,
.clib-message-error,
.clib-message-muted{
  color:var(--label-2);
  font-size:13px;
  line-height:1.5;
}

.clib-message-state{
  margin:0;
  padding:var(--s16);
}

.clib-message-empty,
.clib-message-error,
.clib-message-login{
  display:grid;
  place-content:center;
  justify-items:start;
  gap:var(--s12);
  min-height:220px;
  padding:var(--s32);
}

.clib-message-empty strong{
  color:var(--label);
  font-size:17px;
  font-weight:500;
}

.clib-message-empty p,
.clib-message-error p{
  margin:0;
  color:var(--label-2);
  font-size:13px;
}

.clib-message-login-shell{
  display:grid;
  min-height:0;
  border:1px solid var(--hair);
  border-radius:var(--r-lg);
  background:var(--page);
}

.clib-message-notification-row{
  display:grid;
  grid-template-columns:8px minmax(0,1fr);
  gap:var(--s12);
  width:calc(100% - var(--s16));
  min-height:72px;
  margin:var(--s4) var(--s8);
  padding:var(--s12);
  border:0;
  border-radius:var(--r-sm);
  background:transparent;
  color:var(--label);
  text-align:left;
  cursor:pointer;
}

.clib-message-notification-tools{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--s4);
  padding:var(--s12) var(--s8) var(--s8);
  border-bottom:1px solid var(--hair);
}

.clib-message-notification-tools .clib-message-link{
  min-height:36px;
  padding:0 var(--s8);
  border-radius:var(--r-sm);
  font-size:12px;
}

.clib-message-notification-tools .clib-message-link[aria-pressed="true"]{
  background:var(--brand-0);
}

.clib-message-notification-row:hover,
.clib-message-notification-row.is-active{
  background:var(--card);
}

.clib-message-notification-row strong,
.clib-message-notification-row span,
.clib-message-notification-row time{
  display:block;
}

.clib-message-notification-row strong{
  margin-bottom:var(--s4);
  font-size:13px;
  font-weight:500;
}

.clib-message-notification-row span span{
  display:-webkit-box;
  overflow:hidden;
  color:var(--label-2);
  font-size:13px;
  line-height:1.45;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}

.clib-message-notification-row time{
  margin-top:var(--s4);
  color:var(--label-3);
  font-size:12px;
}

.clib-message-notification-dot{
  width:6px;
  height:6px;
  margin-top:var(--s8);
  border-radius:50%;
  background:transparent;
}

.clib-message-notification-dot.is-unread{
  background:var(--brand);
}

.clib-message-notification-body{
  flex:1;
  min-height:0;
  overflow:auto;
}

.clib-message-notification-detail{
  display:grid;
  gap:var(--s16);
  max-width:620px;
  padding:var(--s32);
}

.clib-message-notification-detail h2,
.clib-message-notification-detail p{
  margin:0;
}

.clib-message-notification-detail time{
  color:var(--label-2);
  font-size:13px;
}

.clib-message-notification-detail .btn{
  justify-self:start;
}

.clib-message-header-button{
  min-height:36px;
  padding:0 var(--s12);
  border:1px solid var(--hair);
  border-radius:var(--r-sm);
  background:var(--card);
  color:var(--label-2);
  font:inherit;
  font-size:13px;
  text-decoration:none;
  cursor:pointer;
}

.clib-message-header-button:hover{
  border-color:var(--brand-1);
  color:var(--label);
}

.clib-message-member-drawer{
  position:absolute;
  z-index:8;
  top:calc(var(--s48) + 2px);
  right:0;
  bottom:0;
  width:280px;
  overflow:auto;
  border-left:1px solid var(--hair);
  background:var(--card);
  padding:var(--s16);
}

.clib-message-member-drawer header,
.clib-message-contact-panel header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:var(--s12);
  margin-bottom:var(--s16);
}

.clib-message-member-drawer h2,
.clib-message-contact-panel h2{
  margin:var(--s4) 0 0;
}

.clib-message-drawer-close{
  min-height:36px;
  padding:0 var(--s12);
  border:0;
  border-radius:var(--r-sm);
  background:var(--page);
  color:var(--label-2);
  font:inherit;
  font-size:13px;
  cursor:pointer;
}

.clib-message-member-profile{
  display:grid;
  gap:var(--s12);
  padding:var(--s16) 0;
  border-bottom:1px solid var(--hair);
}

.clib-message-member-profile p{
  margin:0;
}

.clib-message-member-profile dl{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:var(--s8);
  margin:0;
}

.clib-message-member-profile dl div{
  padding:var(--s8);
  border:1px solid var(--hair);
  border-radius:var(--r-sm);
}

.clib-message-shared-projects{
  display:grid;
  gap:var(--s8);
}

.clib-message-shared-projects .clib-message-list-head{
  min-height:0;
  padding:0;
}

.clib-message-shared-projects>p:not(.clib-message-list-head){
  display:grid;
  gap:2px;
  margin:0;
  padding:var(--s8);
  border:1px solid var(--hair);
  border-radius:var(--r-sm);
}

.clib-message-shared-projects span{
  color:var(--label);
  font-size:13px;
}

.clib-message-shared-projects small{
  color:var(--label-2);
  font-size:12px;
}

.clib-message-member-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:var(--s8);
}

.clib-message-member-profile dt{
  color:var(--label-2);
  font-size:12px;
}

.clib-message-member-profile dd{
  margin:var(--s4) 0 0;
  color:var(--label);
  font-size:13px;
}

.clib-message-roster{
  display:grid;
  gap:var(--s4);
  padding-top:var(--s16);
}

.clib-message-roster h3{
  margin:0 0 var(--s8);
  font-size:13px;
  font-weight:500;
}

.clib-message-roster-row{
  display:grid;
  grid-template-columns:36px minmax(0,1fr);
  align-items:center;
  gap:var(--s8);
  padding:var(--s8);
  border:0;
  border-radius:var(--r-sm);
  background:transparent;
  text-align:left;
  cursor:pointer;
}

.clib-message-roster-row:hover{
  background:var(--page);
}

.clib-message-roster-row span{
  min-width:0;
}

.clib-message-roster-row strong,
.clib-message-roster-row small{
  display:block;
}

.clib-message-roster-row strong{
  color:var(--label);
  font-size:13px;
  font-weight:500;
}

.clib-message-roster-row small{
  margin-top:2px;
  color:var(--label-2);
  font-size:12px;
}

.clib-message-contact-picker{
  position:fixed;
  z-index:20;
  inset:0;
  display:grid;
  place-items:center;
  padding:var(--s24);
  background:rgb(29 29 31 / .28);
}

.clib-message-contact-panel{
  width:min(100%,560px);
  max-height:min(80vh,680px);
  overflow:auto;
  padding:var(--s24);
  border:1px solid var(--hair);
  border-radius:var(--r-lg);
  background:var(--card);
}

.clib-message-contact-results{
  display:grid;
  gap:var(--s4);
  margin-top:var(--s12);
}

.clib-message-contact-result{
  display:grid;
  grid-template-columns:36px minmax(0,1fr);
  align-items:center;
  gap:var(--s12);
  padding:var(--s8);
  border:0;
  border-radius:var(--r-sm);
  background:transparent;
  text-align:left;
  cursor:pointer;
}

.clib-message-contact-result:hover{
  background:var(--page);
}

.clib-message-contact-result strong,
.clib-message-contact-result small{
  display:block;
}

.clib-message-contact-result strong{
  color:var(--label);
  font-size:13px;
  font-weight:500;
}

.clib-message-contact-result small{
  margin-top:2px;
  color:var(--label-2);
  font-size:12px;
}

.clib-message-boot-error{
  display:grid;
  place-items:center;
  gap:var(--s12);
  min-height:240px;
  padding:var(--s24);
  border:1px solid var(--hair);
  border-radius:var(--r-lg);
  color:var(--label-2);
}

@media (max-width: 1024px){
  .clib-message-main.cs-main-container>.cs-sidebar.cs-sidebar--left{
    flex-basis:280px;
    width:280px;
    max-width:280px;
  }
  .clib-message-member-drawer{
    box-shadow:0 12px 32px -24px var(--label);
  }
}

@media (max-width: 760px){
  .clib-message-workspace,
  .clib-message-workspace--compact,
  .clib-message-workspace--room{
    height:650px;
  }

  .clib-message-scope{
    width:100%;
  }

  .clib-message-main.cs-main-container{
    position:relative;
    display:block;
    overflow:hidden;
  }

  .clib-message-main.cs-main-container>.cs-sidebar.cs-sidebar--left{
    width:100%;
    max-width:none;
    height:100%;
    border-right:0;
  }

  .clib-message-main .cs-chat-container{
    position:absolute;
    inset:0;
    height:100%;
    background:var(--card);
  }

  .clib-message-workspace[data-has-target="false"] .cs-chat-container{
    display:none;
  }

  .clib-message-workspace[data-has-target="true"] .cs-sidebar.cs-sidebar--left{
    display:none;
  }

  .clib-message-main .cs-conversation-header__back{
    display:flex;
    cursor:pointer;
  }

  .clib-message-mobile-back{
    display:inline-flex;
    align-items:center;
    min-height:36px;
  }

  .clib-message-main .cs-message-list{
    padding:var(--s16);
  }

  .clib-message-main .cs-message--incoming .cs-message__content,
  .clib-message-main .cs-message--outgoing .cs-message__content{
    max-width:84%;
  }

  .clib-message-member-drawer,
  .clib-message-contact-panel{
    position:fixed;
    top:auto;
    right:0;
    bottom:0;
    left:0;
    width:100%;
    max-height:80vh;
    border-radius:var(--r-lg) var(--r-lg) 0 0;
  }
}

@media (prefers-reduced-motion: reduce){
  .clib-message-workspace *,
  .clib-message-workspace *::before,
  .clib-message-workspace *::after{
    scroll-behavior:auto!important;
    transition-duration:.01ms!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
  }
}