/* TWINS v0.2.49 --------------------------------------------------------- */

/* LIKE / TYPE stay in place: no page jump, with a small tactile pulse. */
.profile-reaction-actions button:disabled{opacity:.72;cursor:wait}
.profile-reaction-actions button.reaction-sent{animation:reactionPulse .38s ease}
@keyframes reactionPulse{0%{transform:scale(1)}45%{transform:scale(.94)}100%{transform:scale(1)}}

/* Message screen owns the viewport. Only the conversation body scrolls. */
html.message-thread-open,
html.message-thread-open body{height:100%;overflow:hidden}
html.message-thread-open body{min-height:0}
html.message-thread-open .app-shell{
  height:100dvh;
  min-height:0;
  padding-bottom:0;
  overflow:hidden;
}
html.message-thread-open main{
  height:calc(100dvh - 74px);
  min-height:0;
  overflow:hidden;
}
.message-thread-page{
  height:100%;
  min-height:0;
  padding:0;
  display:grid;
  grid-template-rows:66px minmax(0,1fr) auto;
  overflow:hidden;
  background:#09070a;
}
.message-thread-head{
  position:relative!important;
  top:auto!important;
  flex:none;
}
.message-bubbles{
  min-height:0;
  overflow-y:auto!important;
  overflow-x:hidden;
  overscroll-behavior-y:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.message-bubbles::-webkit-scrollbar{display:none;width:0;height:0}
/* Keep short conversations anchored immediately above the composer. */
.message-bubbles::before{content:"";display:block;margin-top:auto;flex:0 0 0}
.message-compose{
  position:relative!important;
  z-index:22;
  left:auto!important;
  right:auto!important;
  bottom:auto!important;
  transform:none!important;
  width:100%!important;
  max-width:none!important;
  flex:none;
  padding-bottom:max(8px,env(safe-area-inset-bottom));
}
.message-compose textarea{
  min-height:44px;
  height:44px;
  max-height:104px;
  overflow-y:auto;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.message-compose textarea::-webkit-scrollbar{display:none;width:0;height:0}
.message-compose button:disabled{opacity:.55}
.message-bubble p{white-space:pre-wrap}

@media(min-width:621px){
  html.message-thread-open .app-shell{border-left:1px solid #ffffff0b;border-right:1px solid #ffffff0b}
}
.message-thread-page{position:relative}
.message-thread-page>.message-error{position:absolute;z-index:40;top:72px;left:12px;right:12px;margin:0}