body.sl-room-scroll-enabled.sl-live-room-shell-enabled{ overflow-y:auto!important; height:auto!important; min-height:100vh!important; } body.sl-room-scroll-enabled.sl-live-room-shell-enabled .vdchat-overlay{ position:relative!important; inset:auto!important; height:auto!important; min-height:calc(100vh - 48px)!important; overflow:visible!important; padding-bottom:88px!important; } body.sl-room-scroll-enabled.sl-live-room-shell-enabled .vdchat-overlay .container{ min-height:min(76vh,860px)!important; height:min(76vh,860px)!important; max-height:none!important; } .sl-room-scroll-tail{ padding:0 10px 24px; max-width:none; } .sl-room-stage-pip-active .sl-room-video-host{ min-height:220px; background:#000; border-radius:8px; display:flex; align-items:center; justify-content:center; color:#94a3b8; font-size:13px; } .sl-room-stage-pip-active .sl-room-video-host::after{ content:'Live stream continues in floating player'; } .sl-room-pip{ position:fixed; left:14px; bottom:78px; z-index:10080; width:min(42vw,320px); aspect-ratio:16/10; border-radius:14px; overflow:hidden; border:2px solid rgba(139,92,246,.45); box-shadow:0 22px 48px rgba(0,0,0,.55); background:#000; transition:transform .22s ease, opacity .22s ease; } .sl-room-pip[hidden]{ display:none!important; } .sl-room-pip.is-dragging{ transition:none; cursor:grabbing; } .sl-room-pip-media{ position:absolute; inset:0; background:#000; } .sl-room-pip-media video{ width:100%!important; height:100%!important; object-fit:cover!important; left:0!important; right:auto!important; bottom:auto!important; margin:0!important; border-radius:0!important; border:none!important; max-width:none!important; } .sl-room-pip-top{ position:absolute; top:0; left:0; right:0; display:flex; align-items:center; justify-content:space-between; gap:8px; padding:8px 10px; background:linear-gradient(180deg,rgba(0,0,0,.72),transparent); z-index:2; pointer-events:none; } .sl-room-pip-live{ display:inline-flex; align-items:center; gap:6px; padding:4px 8px; border-radius:999px; background:rgba(239,68,68,.92); color:#fff; font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; } .sl-room-pip-live::before{ content:''; width:7px; height:7px; border-radius:50%; background:#fff; animation:sl-room-pip-pulse 1.2s ease infinite; } @keyframes sl-room-pip-pulse{ 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.55;transform:scale(.85)} } .sl-room-pip-actions{ display:flex; gap:6px; pointer-events:auto; } .sl-room-pip-btn{ width:30px; height:30px; border:0; border-radius:8px; background:rgba(15,23,42,.78); color:#f8fafc; cursor:pointer; } .sl-room-pip-btn:hover{ background:rgba(124,58,237,.85); } @media (max-width:860px){ .sl-room-pip{ width:min(56vw,240px); bottom:118px; } } /* PAID CHAT indicator (injected into by videochat_user.js). It shipped with no CSS, so it rendered in static body flow and scrolled away with the page. Pin it so it stays visible for the whole paid session (SS8). */ .paid-chat-banner{ position:fixed; top:84px; left:50%; transform:translateX(-50%); z-index:10075; display:inline-flex; align-items:center; gap:8px; padding:8px 16px; border-radius:999px; background:linear-gradient(135deg,#ec4899,#7c3aed); color:#fff; font-weight:900; font-size:13px; letter-spacing:.04em; box-shadow:0 10px 30px rgba(124,58,237,.5); pointer-events:none; } .paid-chat-banner i{ font-size:13px; } @media (max-width:860px){ .paid-chat-banner{ top:68px; padding:6px 12px; font-size:12px; } }