/* Connection status stays visible on desktop and mobile. */
.app-shell{grid-template-rows:auto minmax(0,1fr)}
#serverStatus{display:inline-flex!important;flex-shrink:0;white-space:nowrap;max-width:100%;line-height:1.35}
#serverStatus.status-online{color:#8af4c6;border-color:#218768}
#serverStatus.status-online .dot{background:#29e19c;box-shadow:0 0 10px rgba(41,225,156,.5)}
#serverStatus.status-offline{color:#ffb1b9;border-color:#a64451}
#serverStatus.status-offline .dot{background:#ff6476;box-shadow:0 0 10px rgba(255,100,118,.5)}
@media(max-width:900px){
  .app-shell .topbar{height:auto;min-height:76px;flex-wrap:wrap}
  .topbar .top-actions{flex-wrap:wrap;flex:1 1 auto;min-width:0}
  .topbar #serverStatus{font-size:11px;padding:6px 9px}
  .app-shell .sidebar{top:var(--rm-status-topbar-height,118px);transition:transform .2s}
  .app-shell .sidebar.open{max-height:calc(100dvh - var(--rm-status-topbar-height,118px))}
  .app-shell .reader-panel,.app-shell .list-toolbar{top:var(--rm-status-topbar-height,118px)}
  .app-shell .search-wrap{top:calc(var(--rm-status-topbar-height,118px) + var(--rm-status-toolbar-height,64px))}
  .app-shell .workspace,.app-shell .mail-list-panel{min-height:calc(100dvh - var(--rm-status-topbar-height,118px))}
}