/* One viewport, one scrolling main. Keep native safe areas separate from content spacing. */
:root{--qx-safe-top:env(safe-area-inset-top,0px);--qx-nav-height:65px}
@media(max-width:767px){:root{--qx-safe-top:max(env(safe-area-inset-top,0px),24px)}}
html:has(#root main),body:has(#root main){height:100%;overflow:hidden!important}
#root main{height:100dvh;min-height:0!important;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;padding-top:0!important;padding-bottom:var(--qx-nav-height)!important;transform:none!important;scroll-padding-top:var(--qx-header-height,180px)}
#root main>header.sticky,#root main>.home-sticky-shell{position:sticky!important;top:0!important;left:auto!important;right:auto!important;width:100%;z-index:50!important;background:#fafaf8!important}
#root main>.home-sticky-shell>header{padding-top:calc(var(--qx-safe-top) + 12px)!important}
#root main>header.sticky{padding-top:calc(var(--qx-safe-top) + 12px)!important}
#root main>.home-sticky-shell:after,#root main>header.sticky:after{display:none!important}
#root main:has(.qx-chat){background:#fafaf8}
#root .qx-chat{min-height:0!important}
#root .qx-chat-list{padding:0 20px 16px!important;margin:0!important}
#root .qx-chat-list-head{position:sticky;top:0;z-index:30;margin:0 -20px 0;padding:calc(var(--qx-safe-top) + 12px) 20px 16px!important;background:#fafaf8}
#root .qx-chat-new{margin-top:18px!important}
/* Conversation is a full-screen surface; only its message log scrolls. */
#root .qx-chat-conversation{position:fixed!important;inset:0!important;width:100%;max-width:520px!important;height:var(--qx-chat-height,100dvh)!important;margin:0 auto!important;border:0!important;border-radius:0!important;z-index:1000!important}
#root .qx-chat-top{padding-top:calc(var(--qx-safe-top) + 12px)!important;min-height:0!important}
#root .qx-chat-sheet-wrap{z-index:1100!important}
#root .qx-chat-toast{z-index:1200!important}
/* Let short conversation lists use the available screen, instead of leaving a dead band below. */
#root .qx-chat-list{min-height:calc(100dvh - var(--qx-nav-height));display:flex;flex-direction:column}
#root .qx-chat-list>header,#root .qx-chat-demo,#root .qx-chat-search,#root .qx-chat-tabs,#root .qx-chat-new{flex-shrink:0}
#root .qx-chat-rows{flex:1;display:flex;flex-direction:column}
#root .qx-chat-row{flex:1;min-height:104px}