/* Keep both panes mounted; only the visible compact pane accepts input. */
@media(max-width:700px){
  #app{position:relative;isolation:isolate}
  #app>.sidebar,#app>.conversation{display:flex!important;min-width:0;height:100%;will-change:transform}
  #app>.sidebar{position:absolute;inset:0;width:100%;z-index:3;visibility:hidden;pointer-events:none;transform:translate3d(-100%,0,0);transition:transform .28s cubic-bezier(.2,.75,.25,1),visibility 0s linear .28s}
  #app>.conversation{position:relative;width:100%;flex:1;z-index:1;visibility:visible;transform:translate3d(0,0,0);transition:transform .28s cubic-bezier(.2,.75,.25,1),visibility 0s}
  body.show-list #app>.sidebar{visibility:visible;pointer-events:auto;transform:translate3d(0,0,0);transition-delay:0s}
  body.show-list #app>.conversation{visibility:hidden;pointer-events:none;transform:translate3d(100%,0,0);transition:transform .28s cubic-bezier(.2,.75,.25,1),visibility 0s linear .28s}
}
@media(prefers-reduced-motion:reduce){
  #app>.sidebar,#app>.conversation{transition:none!important}
}