.streamCommentUnreadDot{position:absolute;top:4px;right:8px;width:5px;height:5px;border-radius:50%;background:rgba(var(--hero),1)}.streamCommentsModal{min-width:300px}.streamCommentsModal .ds-popup__content,.streamCommentsModal .ds-drawer__content{padding:0}.streamCommentsModal .ds-drawer__content{display:flex;flex-direction:column}.streamCommentsModal .ds-drawer--contained{min-height:50dvh}.streamCommentsList{will-change:scroll-position;overflow-x:hidden;overflow-y:auto;scroll-behavior:smooth;-webkit-overflow-scrolling:touch}[class*=is-web] .streamCommentsList{padding:16px}[class*=is-mobile] .streamCommentsList{padding:8px 12px}.streamComment{display:flex;gap:8px}.streamComment+.streamComment{margin-top:5px}.streamCommentAvatar{width:32px;height:32px;border-radius:50%;object-fit:cover;flex-shrink:0}.streamCommentBody{flex:auto;display:flex;flex-direction:column;gap:2px;overflow:hidden}.streamCommentName{flex:auto;font-size:12px;font-weight:600;color:rgba(var(--b-sc),.7)}.streamCommentText{color:rgba(var(--b-sc),1);word-break:break-word}[class*=is-web] .streamCommentText{font-size:13px}[class*=is-mobile] .streamCommentText{font-size:12px}.streamCommentsEmpty{flex:auto;display:flex;justify-content:center;align-items:center;padding:12px 0;font-size:12px;color:rgba(var(--b-sc),.4);text-align:center}.streamCommentHeader{width:100%;margin-bottom:2px;display:flex;align-items:center;overflow:hidden}.streamCommenterActionsBlock{flex-shrink:0;display:flex;align-items:center;gap:5px;margin-inline-start:5px;padding-inline-start:5px;border-inline-start:1px solid rgba(var(--b-sc),.1)}.streamCommenterAction{padding:2px;display:flex;align-items:center;color:rgba(var(--b-sc),.8)}[class*=is-web] .streamCommenterAction:hover{cursor:pointer;color:rgba(var(--b-sc),1)}.streamCommenterAction .CMSIconSVGWrapper{width:12px;height:12px}.streamCommentInputArea.ds-textfield.ds-textfield--has-value .ds-textfield__right .ds-textfield__icon-btn{background:rgba(var(--hero),1)}.streamCommentInputArea.ds-textfield:not(.ds-textfield--has-value) .ds-textfield__right .ds-textfield__icon-btn{background:rgba(var(--b-sc),.08)}.streamCommentInputArea.ds-textfield .ds-textfield__right .ds-textfield__icon-btn{width:36px;height:24px;border-radius:var(--border-radius)}.streamCommentInputArea.ds-textfield .ds-textfield__right .ds-textfield__icon-btn .CMSIconSVGWrapper{width:12px;height:12px}.streamCommentsChat{position:fixed;display:flex;flex-direction:column;background:rgba(var(--b),1);color:rgba(var(--b-sc),1);z-index:9999;overflow:hidden;animation:streamerCommentsChatAnimation var(--slow-transition-duration) ease-in-out forwards}[class*=is-web] .streamCommentsChat{bottom:16px;width:360px;height:500px;border-radius:32px}[class*=is-mobile] .streamCommentsChat{bottom:0;width:100%;height:40vh}[class*=is-web][dir=ltr] .streamCommentsChat{right:10vw}[class*=is-web][dir=rtl] .streamCommentsChat{left:10vw}[class*=is-mobile][dir=ltr] .streamCommentsChat{right:0}[class*=is-mobile][dir=rtl] .streamCommentsChat{left:0}@keyframes streamerCommentsChatAnimation{0%{transform:translateY(500px)}to{transform:translateY(0)}}.streamCommentsChatHeader{flex-shrink:0;display:flex;align-items:center;gap:8px;background:rgba(var(--b-sc),.15)}[class*=is-web] .streamCommentsChatHeader{padding:16px 24px}[class*=is-mobile] .streamCommentsChatHeader{padding:4px 8px}.streamCommentsChatHeader button{margin-inline-start:auto}.streamerControlsBarChatDragHandler{display:flex;align-items:center;justify-content:center;width:32px;height:32px;color:rgba(var(--b-sc),.8);transition:color var(--default-transition-duration)}[class*=is-web] .streamerControlsBarChatDragHandler:hover{cursor:grab;color:rgba(var(--b-sc),1)}[class*=is-web] .streamerControlsBarChatDragHandler:active{cursor:grabbing}.streamerInfo{width:100%;flex:auto;display:flex;align-items:center;gap:8px;overflow:hidden}.streamerInfoName{font-size:12px;letter-spacing:.5px;color:rgba(var(--b-sc),1)}.streamerAvatarWrapper,.streamCommenterAvatarWrapper{flex-shrink:0;padding:1px;display:flex;justify-content:center;align-items:center;border:1px solid rgba(var(--b-sc),.25);border-radius:50%;overflow:hidden}[class*=is-web] .streamerAvatarWrapper,[class*=is-web] .streamCommenterAvatarWrapper{width:32px;height:32px}[class*=is-mobile] .streamerAvatarWrapper,[class*=is-mobile] .streamCommenterAvatarWrapper{width:24px;height:24px}.streamerAvatar,.streamCommenterAvatar{width:100%;height:100%;border-radius:50%;object-fit:cover}.streamCommentsChatBody{flex:auto;display:flex;flex-direction:column;overflow:hidden;position:relative}[class*=is-web] .streamCommentsChatBody{background:rgba(var(--b-sc),.08)}.streamCommentsChatBody .streamCommentsEmpty{height:100%}.streamCommentsChatBody .streamCommentsList{flex:auto}.streamCommentsNewBadge{position:absolute;bottom:10px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:6px;padding:6px 14px;border-radius:var(--border-radius-big);background:rgba(var(--hero),1);color:rgba(var(--hero-sc),1);font-size:12px;font-weight:600;white-space:nowrap;cursor:pointer;z-index:1}.streamCommentsNewBadge .CMSIconSVGWrapper{width:12px;height:12px}.streamCommentsChatFooter{flex-shrink:0}[class*=is-web] .streamCommentsChatFooter{padding:16px}[class*=is-mobile] .streamCommentsChatFooter{padding:8px}
