/* Bottom-right chat grows upward and keeps the latest answer within reach. */
html:not(.product-showcase-embed) .scroll-showreel #sc3{height:100%;padding:12px 16px 16px}
html:not(.product-showcase-embed) .scroll-showreel #sc3.on{display:flex;flex-direction:column;justify-content:flex-end}
html:not(.product-showcase-embed) .scroll-showreel #sc3 .chatw2{width:100%;max-width:480px;margin:auto 0 0 auto;height:auto;max-height:100%;min-height:0;flex:0 1 auto}
.scroll-showreel #sc3 .chbody{flex:0 1 auto;min-height:0;overflow-y:auto!important;overflow-x:hidden!important;position:relative;overflow-anchor:none;overscroll-behavior:contain!important}
.scroll-showreel #sc3 .chbody>*{flex-shrink:0;overflow-wrap:anywhere}
.scroll-showreel #sc3 .chbody>.rv:not(.on){display:none}
.scroll-showreel #sc3 .chbody>.rv.on{animation:chat-message-in .35s ease both}
@keyframes chat-message-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(max-width:860px){
 html:not(.product-showcase-embed) .scroll-showreel .showreel-screen:has(>#sc3){height:clamp(620px,85svh,760px)}
 html:not(.product-showcase-embed) .scroll-showreel .showreel-screen>#sc3{display:flex;flex-direction:column;justify-content:flex-end;height:calc(100% - 46px);padding-inline:10px}
}
@media(prefers-reduced-motion:reduce){.scroll-showreel #sc3 .chbody>.rv.on{animation:none;transition:none}}

/* Start compact at the bottom right, grow to the frame, then scroll messages.
   Keep this scope stronger than the shared clip rule. */
@media(min-width:861px){
 html:not(.product-showcase-embed) .scroll-showreel .scr #sc3 .chatw2{height:auto;min-height:0;max-height:100%;flex:0 1 auto;margin:auto 0 0 auto}
 html:not(.product-showcase-embed) .scroll-showreel .scr #sc3 .chbody{flex:0 1 auto;min-height:0;overflow-y:auto!important;overflow-x:hidden!important;scrollbar-gutter:stable}
 html:not(.product-showcase-embed) .scroll-showreel .scr #sc3 :is(.chh,.inb2){flex:none}
}