.ViewCamShareButton\#H_ {
    position: relative
}

.ViewCamShareButton_withRightPadding\#Ou {
    padding-right: 20px
}

.ViewCamShareButton__btn\#bE {
    align-items: center;
    display: flex;
    margin: 0
}

.ViewCamShareButton__shareIcon\#uR {
    height: 20px;
    width: 20px
}

.ViewCamShareButton__dropdownContent\#Nb {
    padding: 4px 0 !important
}

.ViewCamShareButton__list\#G0 {
    list-style-type: none;
    min-width: 260px
}

.ViewCamShareButton__link\#pz {
    align-items: center;
    background-color: transparent;
    border: none;
    color: rgba(248, 248, 248, .6);
    display: flex;
    font-size: 14px;
    font-weight: 500;
    justify-content: flex-start;
    line-height: 20px;
    padding: 10px 20px;
    text-align: left;
    text-decoration: none;
    width: 100%
}

.ViewCamShareButton__link\#pz:hover {
    background: rgba(0, 0, 0, .2);
    color: rgba(248, 248, 248, .6);
    text-decoration: none
}

.ViewCamShareButton__link_accent\#Su {
    align-items: flex-start;
    color: #a7b0ff
}

.ViewCamShareButton__link_accent\#Su:hover {
    color: #a7b0ff
}

.ViewCamShareButton__icon\#_o {
    flex-shrink: 0;
    height: 20px;
    margin-right: 12px;
    width: 20px
}

.ViewCamShareButton__icon_align-top\#Yl {
    margin-top: 3px
}

.ViewCamShareButton__hint\#JD {
    color: rgba(248, 248, 248, .6);
    display: block;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    margin-top: 6px
}

.epic-goal-progress {
    align-items: center;
    background-color: #3b3b3b;
    border: 1px solid transparent;
    border-radius: 4px;
    display: flex;
    height: 48px;
    justify-content: space-between;
    overflow: hidden;
    position: relative;
    width: 100%
}

.epic-goal-progress__wrap {
    --progress-bar-wrapper-height: 32px;
    --view-cam-shift: calc(var(--progress-bar-wrapper-height) / 2);
    --progress-bar-shift: calc(var(--progress-bar-wrapper-height) + 2px);
    align-content: center;
    display: flex;
    position: relative
}

.epic-goal-progress__wrap--player {
    pointer-events: auto
}

.epic-goal-progress__wrap--view-cam {
    --progress-bar-wrapper-height: 28px
}

.epic-goal-progress__wrap--on-broadcast-page {
    --progress-bar-wrapper-height: 32px
}

.epic-goal-progress__wrap:hover {
    filter: brightness(1.15)
}

.epic-goal-progress__content {
    border-radius: 0 8px 8px 0;
    margin-left: 2px;
    overflow: hidden;
    position: relative;
    width: 100%
}

.epic-goal-progress__content--player {
    border-radius: 0 8px 8px 0
}

.epic-goal-progress__tokens {
    color: #b2e345;
    font-weight: 700
}

.epic-goal-progress__tokens--player {
    color: #b2e345
}

.epic-goal-progress__tooltip {
    pointer-events: auto
}

.epic-goal-progress__tooltip>.tooltip-inner {
    border-radius: 8px;
    padding: 10px;
    text-align: center
}

.epic-goal-progress__tooltip-new {
    padding-bottom: 16px
}

.epic-goal-progress__tooltip-new>.tooltip-inner {
    padding: 0
}

.epic-goal-progress__tooltip-new>.tooltip-inner:before {
    display: none
}

.epic-goal-progress__complete-button-wrap {
    margin-top: 10px
}

.epic-goal-progress__tokens-label {
    color: #b2e345
}

.epic-goal-progress__tokens-highlight {
    color: #f8f8f8
}

.epic-goal-progress__icon-wrap {
    align-items: center;
    background-color: #6c903e;
    border-radius: 100px;
    box-shadow: 0 0 4px rgba(0, 0, 0, .25);
    display: flex;
    flex-shrink: 0;
    height: var(--progress-bar-wrapper-height);
    justify-content: center;
    width: var(--progress-bar-wrapper-height);
    z-index: 3
}

.epic-goal-progress__icon {
    color: #f8f8f8;
    margin: 0
}

.epic-goal-progress__animation-container {
    border-radius: 4px;
    bottom: 0;
    left: var(--view-cam-shift);
    overflow: hidden;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 2
}

.epic-goal-progress__animation-container.epic-goal-progress__animation-container--animate::before {
    background: #8bbf00
}

.epic-goal-progress.epic-goal-progress--animate::before,
.epic-goal-progress__animation-container--animate::before {
    animation: progress 1s linear;
    background-color: rgb(175.4891304348, 122, 255);
    border-radius: 100%;
    content: "";
    display: block;
    height: 200px;
    left: 0;
    opacity: 1;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%) scale(0);
    width: 100%;
    z-index: 2
}

.epic-goal-progress--view-cam {
    background-color: #303133;
    border-left: none;
    border-radius: 0 8px 8px 0;
    height: var(--progress-bar-wrapper-height);
    padding: 5px 5px 5px 0;
    width: 100%
}

.epic-goal-progress--player {
    background-color: rgba(0, 0, 0, .4);
    border: 1px solid transparent;
    border-radius: 0 8px 8px 0;
    height: var(--progress-bar-wrapper-height);
    width: 100%
}

.epic-goal-progress.epic-goal-progress--reached {
    background-color: rgba(248, 248, 248, .1)
}

.epic-goal-progress__inner {
    background: #9147ff;
    bottom: 0;
    height: var(--progress-bar-wrapper-height);
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    transition: .25s;
    z-index: 1
}

.epic-goal-progress__inner--player,
.epic-goal-progress__inner--view-cam {
    background: linear-gradient(90deg, #4d660d 0%, #698817 99.22%)
}

.epic-goal-progress__progress-filler {
    background-color: #303133;
    border-bottom: 1px solid transparent;
    border-top: 1px solid transparent;
    bottom: 0;
    left: var(--view-cam-shift);
    position: absolute;
    top: 0;
    width: calc(var(--progress-bar-shift) - var(--view-cam-shift));
    z-index: 1
}

.epic-goal-progress__progress-filler--player {
    background-color: rgba(0, 0, 0, .4)
}

.epic-goal-progress__progress-filler--active {
    background: #4e670f;
    border-bottom: none;
    border-top: none
}

.epic-goal-progress__progress-filler--player.epic-goal-progress__progress-filler--active {
    background: #4e670f
}

.epic-goal-progress__information {
    color: #f8f8f8;
    font-weight: 500;
    margin-left: 6px;
    z-index: 2;
    font-size: 1.125rem
}

.epic-goal-progress__information .epic-goal-progress__total {
    color: rgba(248, 248, 248, .6)
}

.epic-goal-progress__information--view-cam {
    font-size: .813rem;
    color: #f8f8f8;
    margin-left: 6px;
    padding-right: 10px
}

.epic-goal-progress__information--player {
    font-size: .75rem;
    line-height: .75rem;
    color: #f8f8f8;
    margin-left: 6px;
    padding-right: 10px
}

.epic-goal-progress .epic-goal-progress__status {
    color: rgba(248, 248, 248, .6);
    font-weight: 700;
    margin-right: 16px;
    z-index: 2;
    font-size: 1.125rem
}

.epic-goal-progress .epic-goal-progress__status--view-cam {
    font-size: .813rem;
    color: #f0f0f0;
    margin-right: 5px
}

@keyframes progress {
    to {
        opacity: 0;
        transform: translate(-50%, -50%) scale(2.5)
    }
}

.view-cam-info-goal {
    flex: 1;
    flex-basis: auto;
    flex-grow: 1;
    flex-shrink: 1
}

.view-cam-info-goal .icon-goal {
    opacity: .8
}

.view-cam-info-goal__title {
    color: #fff;
    display: block;
    font-weight: 400;
    margin: 0 0 7px;
    word-break: break-word;
    font-size: .875rem;
    line-height: 1.063rem
}

.view-cam-info-goal__title.view-cam-info-topic {
    color: rgba(248, 248, 248, .8);
    margin: 8px 0 0;
    font-size: .75rem;
    line-height: 1rem
}

.view-cam-info-goal__title.view-cam-info-topic__in-player {
    color: rgba(255, 255, 255, .8)
}

.view-cam-info-goal .goal-amount {
    color: #b2e345;
    font-weight: 700
}

.view-cam-info-goal .gray {
    color: rgba(248, 248, 248, .6);
    font-weight: 400
}

.view-cam-info-goal .tooltip {
    font-weight: 700;
    line-height: 1.25rem;
    font-size: .813rem
}

.view-cam-info-goal--player-controls .view-cam-info-goal__title {
    color: #fff
}

.view-cam-info-goal--player-controls .view-cam-info-goal__title.view-cam-info-topic {
    color: rgba(255, 255, 255, .8)
}

.view-cam-info-goal--disabled {
    pointer-events: none
}

.player-join-button {
    background-clip: padding-box;
    background-color: rgba(0, 0, 0, .6);
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    height: 42px;
    line-height: 14px;
    margin: 0;
    overflow: hidden;
    pointer-events: auto;
    text-shadow: 1px 1px rgba(0, 0, 0, .4);
    transition: 90ms ease-in-out
}

.player-join-button:hover {
    background-color: #ff4352
}

.player-live-badge {
    background-color: #d82938;
    border-radius: 4px;
    color: #f8f8f8;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: .02em;
    line-height: 14px;
    padding: 4px 9px;
    text-transform: uppercase
}

.player-live-badge--model-fullscreen {
    font-size: 12px;
    font-weight: 700;
    padding: 4px 10px
}

.player-mic-inactive-badge {
    background-color: rgba(0, 0, 0, .3);
    border-radius: 4px;
    color: rgba(255, 255, 255, .8);
    font-size: 11px;
    font-weight: 700;
    line-height: 14px;
    padding: 4px;
    pointer-events: auto;
    text-transform: uppercase
}

.player-mic-inactive-badge__icon {
    height: 14px;
    margin-right: 3px;
    vertical-align: top;
    width: 14px
}

.player-viewers-count {
    color: rgba(248, 248, 248, .8);
    font-size: 12px;
    line-height: 14px
}

.player-viewers-count--model-fullscreen {
    color: #f8f8f8;
    font-size: 16px;
    font-weight: 500;
    line-height: 20px
}

.player-volume-muted-badge {
    align-items: end;
    background: rgba(0, 0, 0, .4);
    border-radius: 4px;
    color: #fff;
    display: flex;
    font-size: 11px;
    font-weight: 700;
    height: 22px;
    justify-content: center;
    line-height: 11px;
    opacity: .7;
    padding: 5px;
    pointer-events: auto
}

.player-volume-muted-badge .icon {
    fill: #fff;
    height: 12px;
    width: 12px
}

.player-waiting-private {
    align-items: center;
    animation: opacity-fade-show 120ms;
    background-color: rgba(0, 0, 0, .6);
    border-radius: 40px;
    color: #fff;
    display: flex;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: -.09px;
    line-height: 15px;
    opacity: 1;
    padding: 5px;
    pointer-events: auto
}

.player-waiting-private .player-waiting-private__button {
    flex-shrink: 0;
    margin: 0 0 0 20px;
    opacity: 1;
    padding: 0 40px
}

.player-waiting-private .player-waiting-private__loader {
    margin: 0 20px 0 10px
}

.fullscreen-chat-actions-button {
    display: flex
}

.fullscreen-chat-actions-button .fullscreen-chat-actions-button__inner.btn {
    background: #101010;
    border-radius: 32px;
    box-shadow: none;
    display: flex;
    height: auto;
    margin: 0;
    opacity: 1;
    padding: 0
}

.fullscreen-chat-actions-button.fullscreen-chat-actions-button--private .icon {
    fill: #e9a63b
}

.PirvateShowDiscountIcon__happyHours\#gb {
    background-image: url("features/discounts/images/user-active-discount.svg");
    height: 30px;
    left: -12px;
    position: absolute;
    top: -7px;
    width: 30px
}

.PirvateShowDiscountIcon__fanClubBenefit\#Ak {
    background-repeat: no-repeat;
    height: 24px;
    left: -9px;
    position: absolute;
    top: -4px;
    width: 24px
}

.PirvateShowDiscountIcon__tier1\#NV {
    background-image: url("common/images/tiers/tier1.svg")
}

.PirvateShowDiscountIcon__tier2\#SJ {
    background-image: url("common/images/tiers/tier2.svg")
}

.PirvateShowDiscountIcon__tier3\#Gf {
    background-image: url("common/images/tiers/tier3.svg")
}

.fullscreen-private-button.btn {
    align-items: center;
    color: #f8f8f8;
    display: flex;
    font-size: 15px;
    font-weight: 500 !important;
    overflow: visible;
    padding: 0 20px
}

.fullscreen-private-button.btn.active,
.fullscreen-private-button.btn.focus,
.fullscreen-private-button.btn:active,
.fullscreen-private-button.btn:focus {
    color: #f8f8f8
}

.fullscreen-private-button__private-btn-actual-price {
    margin: 0 4px 0 8px;
    opacity: .4
}

.fullscreen-private-button__private-btn-actual-price:before {
    background-color: currentColor
}

.fullscreen-private-button__private-btn-price {
    white-space: nowrap
}

.fullscreen-private-tip-button {
    overflow: unset
}

.fullscreen-private-tip-button.btn {
    font-size: 13px;
    font-weight: 500;
    padding: 0 20px
}

.fullscreen-private-tip-button--full.btn {
    background-color: #feb601;
    color: #313135
}

.fullscreen-private-tip-button--full.btn:hover {
    background-color: #fbc932;
    color: #313135
}

.fullscreen-private-tip-button--spy.btn {
    font-weight: 500 !important
}

.fullscreen-private-tip-button--active.btn {
    background-color: #6f5001;
    color: #fff
}

.fullscreen-private-tip-button--active.btn:hover {
    background-color: #936a01;
    color: #fff
}

.fullscreen-private-tip-button--icon.btn {
    align-items: center;
    background-color: #101010;
    display: flex;
    justify-content: center;
    padding: 0;
    width: 38px
}

.fullscreen-private-tip-button--icon.btn .icon {
    fill: #e9a63b;
    margin: 0
}

.fullscreen-stop-private-button {
    align-items: center;
    border-radius: 64px;
    display: flex;
    font-size: 13px;
    justify-content: center;
    padding: 11px 18px;
    background: #101010;
    color: #fff;
    transition: 90ms ease-in-out
}

.fullscreen-stop-private-button__icon,
.fullscreen-stop-private-button__short-text {
    display: none
}

.fullscreen-stop-private-button>.icon {
    fill: #fff;
    transition: 90ms ease-in-out
}

.fullscreen-stop-private-button.focus,
.fullscreen-stop-private-button:focus {
    background: rgb(36.75, 36.75, 36.75);
    color: #fff
}

.fullscreen-stop-private-button.focus>.icon,
.fullscreen-stop-private-button:focus>.icon {
    fill: #fff
}

.fullscreen-stop-private-button.active,
.fullscreen-stop-private-button:active {
    background: rgb(36.75, 36.75, 36.75);
    color: #fff
}

.fullscreen-stop-private-button.active>.icon,
.fullscreen-stop-private-button:active>.icon {
    fill: #fff
}

.fullscreen-stop-private-button .btn-loader-overlay {
    background-color: #101010;
    color: #fff
}

.air-play-connecting-modal {
    align-items: center;
    color: #f8f8f8;
    display: flex;
    flex-direction: column
}

.air-play-connecting-modal span {
    margin: 20px 0;
    text-align: center
}

.air-play-connecting-modal .btn {
    background-color: #5f5f5f;
    border: 1px solid #5f5f5f;
    color: #fff;
    min-height: 31px
}

.player-top-button {
    background: 0 0;
    height: 36px;
    line-height: 16px;
    padding: 0;
    pointer-events: auto;
    width: 36px
}

.player-top-button__icon {
    color: #fff;
    fill: #fff;
    height: 16px;
    margin: 0;
    width: 16px
}

.player-top-button__badge-icon {
    height: 14px !important;
    left: 16px;
    position: absolute;
    top: -6px;
    width: 24px !important
}

.player-top-button--model-fullscreen .player-top-button__icon {
    height: 20px;
    width: 20px
}

.player-chat-button__model-fullscreen-enabled-icon {
    transform: scale(1.25)
}

.PlayerHotKeyTooltip\#q6 {
    display: flex;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
    text-align: center
}

.PlayerHotKeyTooltip__char\#Wk {
    margin-left: 8px
}

.player-low-latency-button .player-low-latency-button__icon {
    height: 18px
}

.HelpTooltip__iconWrapper\#du {
    cursor: pointer;
    display: inline-flex;
    color: #f8f8f8;
    opacity: .6
}

.HelpTooltip__iconWrapper\#du:hover {
    opacity: 1
}

.player-low-latency-toggler {
    align-items: center;
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between
}

.player-low-latency-toggler__label {
    color: #d3d3d3;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    letter-spacing: .2px;
    margin: 0;
    white-space: nowrap
}

.player-low-latency-toggler .player-low-latency-toggler__help-tooltip {
    margin: 0 16px 0 8px
}

.player-low-latency-toggler .player-low-latency-toggler__help-tooltip .tooltip>.tooltip-inner {
    padding: 10px
}

.player-low-latency-dropdown.tooltip {
    border-radius: 4px;
    padding: 0;
    pointer-events: auto;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    z-index: 201
}

.player-low-latency-dropdown.tooltip.bottom>.tooltip-inner:before {
    border-bottom-color: #222 !important
}

.player-low-latency-dropdown.tooltip.left>.tooltip-inner:before {
    border-left-color: #222 !important
}

.player-low-latency-dropdown.tooltip>.tooltip-inner {
    background-color: #222 !important;
    padding: 16px !important;
    z-index: 1
}

.player-low-latency-dropdown__toggler {
    margin-bottom: 16px
}

.player-low-latency-dropdown__text {
    font-size: .75rem;
    color: rgba(248, 248, 248, .6);
    font-weight: 400;
    margin: 0
}

.player-mic-inactive-button {
    cursor: default !important;
    top: 0 !important
}

.player-next-model-button {
    border-color: rgba(255, 255, 255, .2);
    pointer-events: auto
}

.player-next-model-button .icon {
    fill: rgba(255, 255, 255, 0.6)
}

.player-next-model-button:hover {
    background: rgba(255, 255, 255, .3);
    border-color: transparent;
    color: #fff;
    text-decoration: none
}

.player-next-model-button:hover .icon {
    fill: #fff
}

.player-picture-in-picture-button {
    align-items: center;
    display: flex;
    justify-content: center;
    opacity: .4;
    transform: scale(1, -1);
    transition: .2s ease-in-out
}

.player-picture-in-picture-button:hover {
    opacity: .7
}

.player-picture-in-picture-button .icon {
    fill: #fff
}

.PlayerFloatingToggler\#sw {
    display: flex;
    align-items: center;
    flex-flow: row nowrap;
    justify-content: space-between
}

.PlayerFloatingToggler__label\#rX {
    color: #d3d3d3;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    letter-spacing: .2px;
    margin: 0;
    white-space: nowrap
}

.PlayerFloatingToggler__help\#c2 {
    margin: 0 16px 0 8px
}

.PlayerFloatingToggler__switcher\#w3 {
    margin-left: auto
}

.player-resolution-tooltip.tooltip {
    background-color: #222;
    border-radius: 4px;
    cursor: default;
    font-size: 12px;
    font-weight: 700;
    padding: 0;
    z-index: 201
}

.player-resolution-tooltip.tooltip.bottom>.tooltip-inner:before {
    border-bottom-color: #222
}

.player-resolution-tooltip.tooltip.left>.tooltip-inner:before {
    border-left-color: #222
}

.player-resolution-tooltip.tooltip>.tooltip-inner {
    background-color: #222;
    border-color: #222;
    min-width: 130px;
    padding: 0;
    z-index: 1
}

.player-resolution-tooltip__header {
    border-bottom: 1px solid rgba(255, 255, 255, .1);
    color: #a7a7a7;
    padding: 8px 16px 6px
}

.player-resolution-tooltip__auto-resolution {
    float: right;
    opacity: .7
}

.player-resolution-tooltip__resolutions {
    padding: 8px 0
}

.player-resolution-tooltip__block {
    border-top: 1px solid rgba(255, 255, 255, .1);
    padding: 4px 0
}

.player-resolution-tooltip__button {
    color: #d3d3d3;
    cursor: pointer;
    height: 32px;
    line-height: 16px;
    padding: 8px 16px
}

.player-resolution-tooltip__button--active {
    background-color: rgba(255, 255, 255, .1)
}

.player-resolution-tooltip__button--resolution {
    text-transform: capitalize
}

.player-resolution-tooltip__button:hover {
    background-color: rgba(255, 255, 255, .2);
    color: #ebebeb
}

.player-resolution-tooltip__button .icon-badge-hd-red {
    margin-bottom: 1px;
    margin-left: 4px;
    width: 24px
}

.player-resolution-tooltip__floating-player,
.player-resolution-tooltip__low-latency {
    padding: 8px 16px
}

.TokensAmount__abbreviation\#uE {
    margin-left: 4px
}

.player-tokens-button.player-tokens-button {
    width: auto
}

.player-tokens-button .player-tokens-button__icon {
    height: 18px !important
}

.player-tokens-button__tokens {
    color: #fff;
    font-size: 13px;
    margin-left: 10px
}

.player-tokens-button__tokens-amount {
    font-weight: 700
}

.player-tokens-button--model-fullscreen .player-tokens-button__icon {
    vertical-align: text-bottom;
    width: 20px
}

.player-tokens-button--model-fullscreen .player-tokens-button__tokens-amount {
    font-size: 16px;
    font-weight: 700;
    line-height: 20px
}

.player-tokens-button--model-fullscreen .player-tokens-button__tokens-abbreviation {
    font-size: 16px;
    font-weight: 500;
    line-height: 20px
}

.player-tokens-dropdown.tooltip {
    border-radius: 4px;
    min-width: 200px;
    padding: 0;
    pointer-events: auto;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.player-tokens-dropdown.tooltip>.tooltip-inner {
    background-color: #222;
    color: #e1e1e1;
    padding: 0 0 8px;
    width: 100%;
    z-index: 1
}

.player-tokens-dropdown.tooltip.bottom>.tooltip-inner:before {
    border-bottom-color: #222
}

.player-tokens-dropdown.tooltip.left>.tooltip-inner:before {
    border-left-color: #222
}

.player-tokens-dropdown.tooltip .tokens-quick-refill-item {
    text-align: center
}

.player-tokens-dropdown__button {
    padding: 16px
}

.player-tokens-dropdown__button .btn {
    margin: 0
}

.player-tokens-dropdown .player-tokens-dropdown__refill {
    border-bottom: none;
    padding: 8px 16px
}

.player-tokens-dropdown .player-tokens-dropdown__refill:hover {
    background: #303133
}

.player-volume-slider {
    height: 100px;
    margin: 0 auto;
    position: relative;
    top: -3px;
    width: 26px
}

.player-volume-slider::before {
    background: rgba(248, 248, 248, .4);
    border-radius: 4px;
    content: "";
    display: block;
    height: 80px;
    left: 10px;
    position: absolute;
    top: 10px;
    width: 6px
}

.player-volume-slider__container {
    bottom: -10px;
    cursor: pointer;
    height: 80px;
    left: 10px;
    position: relative;
    width: 6px
}

.player-volume-slider__fill {
    background: #f8f8f8;
    border-radius: 4px;
    bottom: 0;
    height: 50%;
    position: absolute;
    width: 6px
}

.player-volume-slider__handle {
    bottom: calc(50% - 12px);
    height: 24px;
    left: -9px;
    margin-top: 5px;
    position: absolute;
    width: 24px
}

.player-volume-slider__handle::before {
    background: #f8f8f8;
    border-radius: 50%;
    content: "";
    cursor: pointer;
    display: block;
    height: 12px;
    left: 6px;
    position: absolute;
    top: 6px;
    width: 12px
}

.view-cam-controls-text {
    display: initial
}

.player-volume {
    background-color: transparent;
    border-radius: 36px;
    height: 36px;
    overflow: hidden;
    pointer-events: auto;
    transition: .1s ease-in-out;
    width: 36px
}

.player-volume--with-slider.player-volume--changing,
.player-volume--with-slider:hover {
    background-color: #181818;
    height: 140px;
    overflow: visible
}

.player-volume .player-volume__control {
    margin: 0
}

.cam-2-cam-player-button {
    align-items: center;
    display: flex;
    height: 36px
}

.cam-2-cam-player-button__camera-icon {
    height: 24px;
    margin-right: 10px;
    width: 24px
}

.cam-2-cam-player-button__dropdown-icon {
    fill: currentColor;
    height: 7px;
    margin-left: 6px;
    margin-right: 0;
    margin-top: 3px;
    width: 12px
}

.anonymous-tip-switcher-tooltip .tooltip-close {
    right: 20px;
    top: 18px
}

.anonymous-tip-switcher-tooltip>.tooltip-inner {
    background-color: #222;
    border-color: #222;
    box-shadow: 0 0 4px rgba(17, 17, 17, .2);
    position: relative
}

.anonymous-tip-switcher-tooltip-container {
    min-width: 276px;
    padding: 15px;
    font-size: .813rem
}

.anonymous-tip-switcher-tooltip-container.compact {
    min-width: unset
}

.anonymous-tip-switcher-tooltip-header {
    color: rgba(255, 255, 255, .9);
    font-weight: 700;
    font-size: .938rem
}

.anonymous-tip-switcher-tooltip-subheader {
    color: rgba(255, 255, 255, .6);
    font-weight: 400;
    margin: 15px 0;
    font-size: .813rem;
    line-height: 1.125rem
}

.anonymous-tip-switcher-tooltip-list {
    margin-top: 20px;
    font-size: .75rem;
    line-height: 1.563rem
}

.anonymous-tip-switcher-tooltip-list li {
    background: 0 0 !important;
    border: none !important;
    min-height: auto;
    padding: 0 0 0 22px;
    position: relative;
    white-space: nowrap
}

.anonymous-tip-switcher-tooltip-list li::after {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M41.03 80.34L100 21.37 89.74 11.1 30.77 70.1 10.26 49.57 0 59.83l20.51 20.51L30.77 90.6z' fill='%2397ff53'/%3E%3C/svg%3E");
    background-size: 12px 12px;
    content: " ";
    height: 12px;
    left: 0;
    position: absolute;
    top: 3px;
    width: 12px
}

.anonymous-tip-switcher-tooltip-controls {
    display: flex;
    justify-content: center;
    margin-top: 20px
}

.anonymous-tip-switcher-tooltip-controls .btn {
    color: rgba(33, 18, 0, .9);
    height: 41px;
    width: 100%;
    font-size: .938rem
}

.player-toolbox-icon {
    cursor: pointer;
    margin: 0 5px
}

.player-toolbox-icon .player-toolbox-icon-item {
    align-items: center;
    border-radius: 50%;
    height: 36px;
    justify-content: center;
    width: 36px;
    display: flex;
    flex-direction: row;
    transition: 120ms ease-in-out
}

.player-toolbox-icon .player-toolbox-icon-item .icon {
    fill: #fff;
    margin: 0
}

.player-toolbox-icon.reflect {
    cursor: pointer
}

.player-toolbox-icon.reflect.mirror {
    transform: scaleX(-1)
}

.player-toolbox-icon.can-mute-mic .stop {
    margin-right: 5px
}

.player-toolbox-icon:hover .player-toolbox-icon-item {
    opacity: .9
}

symbol#icons-tokens-plus .icon-part-tokens-plus-plus {
    fill: #93bb3b
}

symbol#icons-tokens-plus .icon-part-tokens-plus-token {
    fill: #fff
}

.send-tip-form .buy-tokens {
    border: none;
    box-sizing: border-box;
    min-width: 178px
}

.send-tip-form .buy-tokens.anonymous {
    background-color: rgba(121, 148, 61, .4);
    box-shadow: inset 0 0 0 2px #79943d
}

.send-tip-form .buy-tokens.anonymous:hover {
    background-color: #fff;
    box-shadow: none;
    color: #414141
}

.send-tip-form .radio-wrapper {
    cursor: pointer;
    display: flex
}

.send-tip-form .radio-wrapper+.radio-wrapper {
    margin-top: 10px
}

.send-tip-form .radio-wrapper .radio-container {
    flex: 1 1 auto;
    min-width: 200px;
    text-align: left;
    line-height: 2.313rem
}

.send-tip-form .radio-wrapper .radio-container label {
    margin-right: 20px;
    font-size: 1rem
}

.send-tip-form .radio-wrapper .description {
    flex: 1 1 50%
}

.send-tip-form .radio-wrapper .description input {
    background-color: #232323;
    border-color: #232323;
    color: #fff;
    width: 100%
}

.send-tip-form .radio-wrapper .description .description-inner {
    border: 1px solid #8c9289;
    color: #8c9289;
    font-style: oblique;
    padding: 0 12px;
    white-space: nowrap;
    line-height: 2.313rem;
    border-radius: 4px
}

.send-tip-form .radio-wrapper.checked .description-inner {
    border-color: #b1e345;
    color: #93bb3b
}

.send-tip-form .radio-wrapper.disabled {
    cursor: default;
    opacity: .5;
    pointer-events: none
}

.send-tip-form .comment-type-select {
    border: 1px solid #232323;
    border-radius: 0 20px 20px 0;
    color: #f8f8f8;
    display: inline-block;
    height: 40px;
    padding: 10px 14px 10px 10px;
    transition: 120ms ease-in-out;
    font-size: .688rem;
    line-height: 1rem;
    align-items: center;
    background-color: #232323;
    cursor: pointer;
    display: flex;
    flex-shrink: 0;
    font-weight: 700;
    position: relative;
    text-align: right
}

.send-tip-form .comment-type-select::-moz-placeholder {
    color: rgba(248, 248, 248, .33)
}

.send-tip-form .comment-type-select::placeholder {
    color: rgba(248, 248, 248, .33)
}

.send-tip-form .comment-type-select:focus {
    background-color: #000;
    border-color: rgba(255, 255, 255, .3);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 5px rgba(255, 255, 255, .25)
}

.send-tip-form .comment-type-select.error {
    border: 1px solid #de5b64;
    color: #de5b64
}

.send-tip-form .comment-type-select.error:hover {
    border: 1px solid #d5444e;
    color: #d5444e
}

.send-tip-form .comment-type-select.error:active,
.send-tip-form .comment-type-select.error:focus {
    border: 1px solid #d5444e;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px rgba(213, 68, 78, .75);
    color: #d5444e
}

.send-tip-form .comment-type-select svg.icon {
    display: block;
    fill: rgba(255, 255, 255, 0.75);
    height: 1.3rem;
    margin-right: 6px;
    width: 1.3rem
}

.send-tip-form .input-comment:focus+.comment-type-select {
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 5px rgba(255, 255, 255, .25)
}

.send-tip-form .comments-transition-wrapper {
    width: 100%
}

.send-tip-form .comments-wrapper {
    border-bottom: 1px solid rgba(255, 255, 255, .2);
    display: flex;
    margin-top: 20px;
    padding-bottom: 20px
}

.send-tip-form .comments-wrapper .trigger {
    flex: 1 1 auto;
    margin-right: 20px;
    line-height: 2.313rem
}

.send-tip-form .comments-wrapper .comments {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    min-width: 370px;
    position: relative
}

.send-tip-form .comments-wrapper .comments.disabled,
.send-tip-form .comments-wrapper .comments.disabled * {
    cursor: pointer
}

.send-tip-form .comments-wrapper .comments.disabled.invisible {
    display: none
}

.send-tip-form .comments-wrapper .comments .icon-chat-actions,
.send-tip-form .comments-wrapper .comments .icon-feed,
.send-tip-form .comments-wrapper .comments .icon-flag-simple,
.send-tip-form .comments-wrapper .comments .icon-lock,
.send-tip-form .comments-wrapper .comments .icon-lock-ds,
.send-tip-form .comments-wrapper .comments .icon-timeline {
    left: 20px;
    position: absolute;
    top: 12px
}

.send-tip-form .comments-wrapper .comments .icon-lock,
.send-tip-form .comments-wrapper .comments .icon-lock-ds {
    fill: #f8f8f8
}

.send-tip-form .comments-wrapper .comments .icon-chat-actions {
    fill: #ff414f
}

.send-tip-form .comments-wrapper .comments .icon-flag-simple {
    fill: #a36aff
}

.send-tip-form .comments-wrapper .comments input.input-comment {
    background-color: #232323;
    border-color: #232323;
    display: block;
    transition: none;
    width: 100%
}

.send-tip-form .comments-wrapper .comments input.input-comment:not(:disabled).has-comment {
    border-bottom-right-radius: 0;
    border-right: 0;
    border-top-right-radius: 0
}

.send-tip-form .comments-wrapper .comments input.input-comment.with-icon {
    padding-left: 50px
}

.send-tip-form .comments-wrapper .comments input.input-comment:disabled {
    opacity: .6
}

.send-tip-form .send-tip-controls {
    margin-top: 20px;
    position: relative;
    text-align: center
}

.send-tip-form .send-tip-controls .btn {
    font-weight: 700;
    margin: 0;
    padding: 0 40px
}

.send-tip-form .send-tip-controls.public .anonymous-tip-switcher {
    position: absolute;
    top: 3px
}

.send-tip-form .send-tip-controls.public .anonymous-tip-switcher .switcher {
    margin-left: 0
}

.send-tip-form .need-more-tokens {
    align-items: center;
    border-top: 2px solid #3f3f3f;
    font-weight: 700;
    justify-content: space-between;
    margin: 20px 0 10px;
    padding: 20px 10px 0;
    display: flex;
    flex-direction: row
}

.send-tip-form .need-more-tokens .icon-tokens-plus-green {
    margin-right: 12px
}

.send-tip-form .need-more-tokens .need-more-tokens-text {
    max-width: 230px;
    line-height: 1.375rem
}

.send-tip-form .need-more-tokens .need-more-tokens-text .more-tokens {
    color: #fff;
    font-size: 1rem
}

.send-tip-form .need-more-tokens .need-more-tokens-text .more-tokens .break-row {
    display: block
}

.send-tip-form .need-more-tokens .need-more-tokens-text .more-tokens .more-tokens-alt {
    color: #93bb3b
}

.send-tip-form .need-more-tokens .need-more-tokens-text .tokens-left {
    color: rgba(255, 255, 255, .5);
    font-size: .75rem
}

.send-tip-form .need-more-tokens .buy-tokens-wrapper {
    min-width: 150px;
    text-align: right
}

.send-tip-form .need-more-tokens .buy-tokens-wrapper .btn-apply {
    margin-bottom: 0;
    line-height: 2.625rem;
    font-size: 1rem
}

.send-tip-form .buy-tokens-button-wrapper {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%
}

.send-tip-form .send-tip-button-label {
    font-size: 11px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: normal;
    bottom: -18px;
    opacity: .6;
    position: absolute
}

.send-tip-form.private .buy-tokens {
    background: #e9a63b;
    color: #583b0b;
    transition: 90ms ease-in-out;
    border-color: transparent
}

.send-tip-form.private .buy-tokens>.icon {
    fill: #583b0b;
    transition: 90ms ease-in-out
}

.send-tip-form.private .buy-tokens.focus,
.send-tip-form.private .buy-tokens:focus {
    background: #e9a63b;
    color: #583b0b;
    border-color: transparent
}

.send-tip-form.private .buy-tokens.focus>.icon,
.send-tip-form.private .buy-tokens:focus>.icon {
    fill: #583b0b
}

.send-tip-form.private .buy-tokens.active,
.send-tip-form.private .buy-tokens:active {
    background: #e9a63b;
    color: #583b0b;
    border-color: transparent
}

.send-tip-form.private .buy-tokens.active>.icon,
.send-tip-form.private .buy-tokens:active>.icon {
    fill: #583b0b
}

.send-tip-form.private .buy-tokens .btn-loader-overlay {
    background-color: #e9a63b;
    color: #583b0b
}

.send-tip-form.private .radio-wrapper.checked .description-inner {
    border-color: #e9a63b;
    color: #e9a63b
}

.send-tip-form.compact {
    overflow: hidden;
    padding: 20px;
    display: flex;
    flex-direction: column
}

.send-tip-form.compact .choices {
    flex: 0 1 auto;
    overflow: auto
}

.send-tip-form.compact .radio-wrapper {
    background: #3b3b3b;
    border-radius: 8px
}

.send-tip-form.compact .radio-wrapper+.radio-wrapper {
    margin-top: 12px
}

.send-tip-form.compact .radio-wrapper.checked {
    box-shadow: inset 0 0 0 4px #b1e345
}

.send-tip-form.compact .radio-wrapper .radio-container {
    height: 40px;
    text-align: center
}

.send-tip-form.compact .radio-wrapper .radio-container .radio-label {
    background: 0 0;
    margin: 0;
    padding: 0
}

.send-tip-form.compact .radio-wrapper .input-tokens {
    background-color: transparent;
    border-color: transparent;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: normal;
    line-height: normal
}

.send-tip-form.compact .comments-wrapper,
.send-tip-form.compact .need-more-tokens,
.send-tip-form.compact .send-tip-controls {
    border: 0;
    margin: 16px 0 0;
    padding: 0
}

.send-tip-form.compact .comments-wrapper .comments {
    min-width: 220px
}

.send-tip-form.compact .comments-wrapper .comments .comment-type-select,
.send-tip-form.compact .comments-wrapper .comments .input-comment {
    background: #101010;
    border-color: #101010
}

.send-tip-form.compact .send-tip-controls {
    align-items: center;
    justify-content: space-between;
    display: flex;
    flex-direction: row
}

.send-tip-form.compact .send-tip-controls .anonymous-tip-switcher {
    position: relative;
    top: 0
}

.send-tip-form.compact .send-tip-controls .anonymous-tip-switcher .switcher {
    box-shadow: inset 0 0 0 2px #3b3b3b
}

.send-tip-form.compact .send-tip-controls .toggle-comment {
    cursor: pointer;
    display: none;
    fill: #f8f8f8;
    padding: 0 8px;
    position: relative
}

.send-tip-form.compact .send-tip-controls .toggle-comment:not(.active):not(.has-comment):not(:hover) {
    opacity: .6
}

.send-tip-form.compact .send-tip-controls .toggle-comment.has-comment::after {
    background-color: #f8f8f8;
    box-shadow: 0 0 0 2px #3b3b3b;
    content: " ";
    display: block;
    height: 10px;
    position: absolute;
    right: 0;
    top: -5px;
    width: 10px;
    border-radius: 100%
}

.send-tip-form.compact .send-tip-controls .toggle-comment .icon {
    margin-right: 0
}

.send-tip-form.compact .send-tip-controls .btn {
    padding: 0 20px
}

.send-tip-form.compact .need-more-tokens {
    flex-wrap: wrap
}

.send-tip-form.compact .need-more-tokens .need-more-tokens-text {
    flex: 1
}

.send-tip-form.compact .need-more-tokens .buy-tokens-wrapper {
    margin-top: 12px;
    text-align: center;
    width: 100%
}

.send-tip-form.compact .need-more-tokens .buy-tokens-wrapper .btn {
    height: 40px;
    width: 100%;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: normal;
    line-height: normal
}

.send-tip-form.compact.private .radio-wrapper.checked {
    box-shadow: inset 0 0 0 4px #e9a63b
}

.send-tip-form.compact .send-tip-button-label {
    bottom: -16px
}

.send-tip-form.compact.fullscreen {
    animation: .2s opacity-fade-show;
    background: rgba(0, 0, 0, .8);
    border-radius: 8px;
    justify-content: flex-end;
    overflow: visible;
    pointer-events: auto
}

.send-tip-form.compact.fullscreen .close--fullscreen {
    cursor: pointer;
    left: -23px;
    opacity: .6;
    position: absolute;
    top: 10px
}

.send-tip-form.compact.fullscreen .close--fullscreen .icon {
    fill: rgba(255, 255, 255, 0.6);
    filter: drop-shadow(1px 1px 2px rgba(0, 0, 0, .9));
    height: 16px;
    margin: 0;
    width: 16px
}

.send-tip-form.compact.fullscreen .close--fullscreen .icon:hover {
    fill: #fff
}

.send-tip-form.compact.fullscreen .send-tip-controls .toggle-comment.has-comment::after {
    background-color: #f8f8f8
}

.send-tip-form.compact.fullscreen .send-tip-controls .buy-tokens {
    font-weight: 400;
    font-size: .813rem
}

.send-tip-form.compact.fullscreen input[type=radio].radio+label {
    color: #f8f8f8
}

.send-tip-form.compact.fullscreen input[type=radio]:checked.radio+label {
    color: #93bb3b
}

.send-tip-form.compact.fullscreen input::-moz-placeholder {
    color: #6d6d6d
}

.send-tip-form.compact.fullscreen input::placeholder {
    color: #6d6d6d
}

.send-tip-form.compact.fullscreen input.input-comment,
.send-tip-form.compact.fullscreen input.input-tokens {
    color: #f8f8f8
}

.send-tip-form.compact.fullscreen .icon-lock,
.send-tip-form.compact.fullscreen .icon-lock-ds {
    fill: #f8f8f8
}

.send-tip-form.compact.fullscreen .comment-type-select {
    color: #f8f8f8
}

.send-tip-form.compact.fullscreen.private input[type=radio]:checked.radio+label {
    color: #e9a63b
}

.css-popover {
    position: relative
}

.css-popover-content-default {
    background-color: #111;
    border-radius: 4px;
    box-shadow: 0 2px 4px transparent, 0 0 4px transparent;
    color: #e1e1e1;
    padding: 8px 10px;
    text-align: center;
    text-transform: none;
    white-space: nowrap;
    font-size: 11px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: normal
}

.css-popover-content-top {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition-duration: .15s;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    z-index: 1000;
    left: 50%;
    top: 0;
    transform: translate(-50%, calc(-100% + 10px - 5px))
}

.css-popover-content-top-shown {
    opacity: 1;
    pointer-events: auto;
    transform: translate(-50%, calc(-100% - 5px))
}

.css-popover-content-bottom {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition-duration: .15s;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    z-index: 1000;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, calc(100% - 10px + 5px))
}

.css-popover-content-bottom-shown {
    opacity: 1;
    pointer-events: auto;
    transform: translate(-50%, calc(100% + 5px))
}

.css-popover-content-left {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition-duration: .15s;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    z-index: 1000;
    left: 0;
    top: 50%;
    transform: translate(calc(-100% + 10px - 5px), -50%)
}

.css-popover-content-left-shown {
    opacity: 1;
    pointer-events: auto;
    transform: translate(calc(-100% - 5px), -50%)
}

.css-popover-content-right {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition-duration: .15s;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    z-index: 1000;
    right: 0;
    top: 50%;
    transform: translate(calc(100% - 10px + 5px), -50%)
}

.css-popover-content-right-shown {
    opacity: 1;
    pointer-events: auto;
    transform: translate(calc(100% + 5px), -50%)
}

.css-popover-content-topleft {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition-duration: .15s;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    z-index: 1000;
    right: 0;
    top: 0;
    transform: translate(0%, calc(-100% + 10px - 5px))
}

.css-popover-content-topleft-shown {
    opacity: 1;
    pointer-events: auto;
    transform: translate(0%, calc(-100% - 5px))
}

.player-controls-layers {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.player-controls-layers--hidden {
    display: none
}

.player-controls-layers__layer {
    transition: opacity 120ms ease-in-out
}

.player-controls-layers__layer--alternate-controls,
.player-controls-layers__layer--main-controls,
.player-controls-layers__layer--permanent-controls,
.player-controls-layers__layer--shade,
.player-controls-layers__layer--toggle {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.player-controls-layers__layer--alternate-controls,
.player-controls-layers__layer--main-controls,
.player-controls-layers__layer--permanent-controls,
.player-controls-layers__layer--shade {
    pointer-events: none
}

.player-controls-layers__layer--semitransparent {
    opacity: .1;
    pointer-events: none
}

.player-controls-layers__layer--shade {
    background: rgba(34, 34, 34, .6);
    z-index: 103
}

.player-controls-layers__layer.player-controls-layers__layer--hidden {
    opacity: 0;
    z-index: 104
}

.player-controls-layers__layer--toggle {
    z-index: 105
}

.player-controls-layers__layer--plugin {
    z-index: 106
}

.player-controls-layers__layer--main-controls {
    z-index: 107
}

.player-controls-layers__layer--alternate-controls {
    z-index: 108
}

.player-controls-layers__layer--permanent-controls {
    z-index: 109
}

.player-controls-layers__layer--plugin-zoomed {
    z-index: 113
}

.player-controls-layers__layer--plugin-in-modal {
    z-index: 400
}

.view-cam-controls-toolbox .cam2cam-menu {
    align-items: center;
    display: flex;
    position: relative
}

.view-cam-controls-toolbox .cam2cam-menu .icon {
    height: 24px;
    width: 24px
}

.view-cam-controls-toolbox .cam2cam-menu .menu-button {
    align-items: center;
    border-radius: 64px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin: 0;
    padding: 6px 20px;
    transition: 90ms ease-in-out;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: 16px;
    background: #5b5b5b;
    color: #fff
}

.view-cam-controls-toolbox .cam2cam-menu .menu-button.with-new-send-tip {
    height: 36px;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal
}

.view-cam-controls-toolbox .cam2cam-menu .menu-button>.icon {
    fill: #fff;
    transition: 90ms ease-in-out
}

.view-cam-controls-toolbox .cam2cam-menu .menu-button.focus,
.view-cam-controls-toolbox .cam2cam-menu .menu-button:focus {
    background: #474747;
    color: #fff
}

.view-cam-controls-toolbox .cam2cam-menu .menu-button.focus>.icon,
.view-cam-controls-toolbox .cam2cam-menu .menu-button:focus>.icon {
    fill: #fff
}

.view-cam-controls-toolbox .cam2cam-menu .menu-button.active,
.view-cam-controls-toolbox .cam2cam-menu .menu-button:active {
    background: #474747;
    color: #fff
}

.view-cam-controls-toolbox .cam2cam-menu .menu-button.active>.icon,
.view-cam-controls-toolbox .cam2cam-menu .menu-button:active>.icon {
    fill: #fff
}

.view-cam-controls-toolbox .cam2cam-menu .menu-button .btn-loader-overlay {
    background-color: #5b5b5b;
    color: #fff
}

.view-cam-controls-toolbox .cam2cam-menu .menu-button .icon {
    fill: currentColor;
    margin-right: 10px
}

.view-cam-controls-toolbox .cam2cam-menu .menu-button .dropdown-icon.icon {
    fill: currentColor;
    height: 7px;
    margin-left: 6px;
    margin-right: 0;
    margin-top: 3px;
    width: 12px
}

.view-cam-controls-toolbox .cam2cam-menu .menu-icon {
    margin: 0
}

.view-cam-controls-toolbox .cam2cam-menu .menu {
    background-color: #3e3f42;
    border-radius: 16px;
    box-shadow: 0 4px 32px rgba(0, 0, 0, .6);
    margin: 0
}

.view-cam-controls-toolbox .cam2cam-menu .menu li:first-child {
    border-top-left-radius: 16px;
    border-top-right-radius: 16px
}

.view-cam-controls-toolbox .cam2cam-menu .menu li:last-child {
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px
}

.view-cam-controls-toolbox .cam2cam-menu .menu li:hover {
    background-color: #303133;
    color: #f8f8f8
}

.view-cam-controls-toolbox .cam2cam-menu .menu-item {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
    align-items: center;
    color: rgba(248, 248, 248, .7);
    display: flex;
    fill: currentColor;
    padding: 10px 16px;
    white-space: nowrap;
    width: 100%
}

.view-cam-controls-toolbox .cam2cam-menu .menu-item .icon {
    fill: currentColor;
    margin-right: 10px
}

.view-cam-controls-toolbox .cam2cam-menu .private-modal-cam2cam-tooltip {
    z-index: 1001
}

.view-cam-controls-toolbox.view-cam-controls-toolbox-cam2cam .player-toolbox-icon {
    cursor: pointer;
    margin: 0 7px
}

.view-cam-controls-toolbox.view-cam-controls-toolbox-cam2cam .player-toolbox-icon .player-toolbox-icon-item {
    align-items: center;
    border-radius: 64px;
    height: 36px;
    justify-content: center;
    padding: 6px 20px;
    width: 64px;
    display: flex;
    flex-direction: row;
    transition: 120ms ease-in-out
}

.view-cam-controls-toolbox.view-cam-controls-toolbox-cam2cam .player-toolbox-icon .player-toolbox-icon-item.settings {
    background: #181818;
    color: #fff;
    transition: 90ms ease-in-out
}

.view-cam-controls-toolbox.view-cam-controls-toolbox-cam2cam .player-toolbox-icon .player-toolbox-icon-item.settings>.icon {
    fill: #fff;
    transition: 90ms ease-in-out
}

.view-cam-controls-toolbox.view-cam-controls-toolbox-cam2cam .player-toolbox-icon .player-toolbox-icon-item.settings.focus,
.view-cam-controls-toolbox.view-cam-controls-toolbox-cam2cam .player-toolbox-icon .player-toolbox-icon-item.settings:focus {
    background: rgb(36.75, 36.75, 36.75);
    color: #fff
}

.view-cam-controls-toolbox.view-cam-controls-toolbox-cam2cam .player-toolbox-icon .player-toolbox-icon-item.settings.focus>.icon,
.view-cam-controls-toolbox.view-cam-controls-toolbox-cam2cam .player-toolbox-icon .player-toolbox-icon-item.settings:focus>.icon {
    fill: #fff
}

.view-cam-controls-toolbox.view-cam-controls-toolbox-cam2cam .player-toolbox-icon .player-toolbox-icon-item.settings.active,
.view-cam-controls-toolbox.view-cam-controls-toolbox-cam2cam .player-toolbox-icon .player-toolbox-icon-item.settings:active {
    background: rgb(36.75, 36.75, 36.75);
    color: #fff
}

.view-cam-controls-toolbox.view-cam-controls-toolbox-cam2cam .player-toolbox-icon .player-toolbox-icon-item.settings.active>.icon,
.view-cam-controls-toolbox.view-cam-controls-toolbox-cam2cam .player-toolbox-icon .player-toolbox-icon-item.settings:active>.icon {
    fill: #fff
}

.view-cam-controls-toolbox.view-cam-controls-toolbox-cam2cam .player-toolbox-icon .player-toolbox-icon-item.settings .btn-loader-overlay {
    background-color: #181818;
    color: #fff
}

.view-cam-controls-toolbox.view-cam-controls-toolbox-cam2cam .player-toolbox-icon .player-toolbox-icon-item .icon {
    fill: currentColor;
    height: 24px;
    margin: 0;
    width: 24px
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen .cam2cam-menu .menu {
    background-color: #2e2e2e
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen .cam2cam-menu .menu-item {
    color: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen .cam2cam-menu .menu-item:hover {
    background-color: rgba(0, 0, 0, .2);
    color: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen .menu-button {
    font-size: .813rem;
    height: 38px;
    padding: 7px 22px;
    background: #5b5b5b;
    color: #f8f8f8;
    transition: 90ms ease-in-out
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen .menu-button>.icon {
    fill: #f8f8f8;
    transition: 90ms ease-in-out
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen .menu-button.focus,
.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen .menu-button:focus {
    background: #474747;
    color: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen .menu-button.focus>.icon,
.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen .menu-button:focus>.icon {
    fill: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen .menu-button.active,
.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen .menu-button:active {
    background: #474747;
    color: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen .menu-button.active>.icon,
.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen .menu-button:active>.icon {
    fill: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen .menu-button .btn-loader-overlay {
    background-color: #5b5b5b;
    color: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen .menu-button .icon {
    height: 24px;
    margin-right: 10px;
    width: 24px
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam {
    display: flex;
    gap: 12px;
    margin: 0
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon {
    margin: 0
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon.settings {
    order: initial
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item {
    height: 38px;
    opacity: 1;
    padding: 8px;
    width: 38px
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.settings {
    background: #181818;
    color: #f8f8f8;
    transition: 90ms ease-in-out
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.settings>.icon {
    fill: #f8f8f8;
    transition: 90ms ease-in-out
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.settings.focus,
.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.settings:focus {
    background: rgb(36.75, 36.75, 36.75);
    color: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.settings.focus>.icon,
.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.settings:focus>.icon {
    fill: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.settings.active,
.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.settings:active {
    background: rgb(36.75, 36.75, 36.75);
    color: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.settings.active>.icon,
.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.settings:active>.icon {
    fill: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.settings .btn-loader-overlay {
    background-color: #181818;
    color: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-enabled {
    background: #5b5b5b;
    color: #f8f8f8;
    transition: 90ms ease-in-out
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-enabled>.icon {
    fill: #f8f8f8;
    transition: 90ms ease-in-out
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-enabled.focus,
.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-enabled:focus {
    background: #474747;
    color: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-enabled.focus>.icon,
.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-enabled:focus>.icon {
    fill: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-enabled.active,
.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-enabled:active {
    background: #474747;
    color: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-enabled.active>.icon,
.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-enabled:active>.icon {
    fill: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-enabled .btn-loader-overlay {
    background-color: #5b5b5b;
    color: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-disabled {
    background: #af262f;
    color: #f8f8f8;
    transition: 90ms ease-in-out
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-disabled>.icon {
    fill: #f8f8f8;
    transition: 90ms ease-in-out
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-disabled.focus,
.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-disabled:focus {
    background: #9c2a32;
    color: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-disabled.focus>.icon,
.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-disabled:focus>.icon {
    fill: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-disabled.active,
.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-disabled:active {
    background: #9c2a32;
    color: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-disabled.active>.icon,
.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-disabled:active>.icon {
    fill: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-disabled .btn-loader-overlay {
    background-color: #af262f;
    color: #f8f8f8
}

.view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item .icon {
    height: 20px;
    width: 20px
}

.fullscreen-bottom-controls {
    display: flex;
    justify-content: flex-end
}

.fullscreen-bottom-controls__tip-btn {
    font-weight: 500;
    overflow: unset
}

.fullscreen-bottom-controls__bubble {
    background: rgba(0, 0, 0, .6);
    border-radius: 40px;
    display: flex;
    height: 46px;
    padding: 4px;
    pointer-events: auto;
    position: relative
}

.fullscreen-bottom-controls__bubble:empty {
    display: none
}

.fullscreen-bottom-controls__bubble--left {
    margin-right: auto
}

.fullscreen-bottom-controls__bubble:not(:empty)+.fullscreen-bottom-controls__bubble {
    margin-left: 8px
}

.fullscreen-bottom-controls__bubble>* {
    flex-shrink: 0;
    margin: 0;
    max-height: 100%
}

.fullscreen-bottom-controls__bubble>:not(:last-child) {
    margin-right: 12px
}

.fullscreen-bottom-controls .fullscreen-bottom-controls__upgrade-private {
    height: 38px
}

@supports (grid-gap:12px) {
    .fullscreen-bottom-controls__bubble {
        display: grid;
        grid-auto-flow: column;
        grid-gap: 12px
    }

    .fullscreen-bottom-controls__bubble>* {
        min-height: 0
    }

    .fullscreen-bottom-controls__bubble>:not(:last-child) {
        margin-right: 0
    }
}

.private-timer {
    background: rgba(0, 0, 0, .4);
    border-radius: 4px;
    color: #fff;
    font-weight: 700;
    height: 22px;
    margin: 0;
    opacity: .9;
    padding: 5px;
    pointer-events: none;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    vertical-align: middle;
    white-space: nowrap;
    width: -moz-fit-content;
    width: fit-content;
    font-size: .688rem;
    line-height: .688rem
}

.record-show-button {
    align-items: center;
    display: flex;
    height: 36px;
    margin: 0 10px 10px 0;
    min-height: 0;
    pointer-events: auto
}

.record-show-button:last-child {
    margin-right: 0
}

.record-show-button>:not(:last-child):not(.tooltip) {
    margin-right: 4px
}

.record-show-button .btn {
    height: 36px;
    line-height: 1;
    margin: 0;
    overflow: visible;
    padding: 0;
    width: 36px
}

.record-show-button .btn:active {
    top: 0
}

.record-show-button .btn.with-text {
    padding: 0 12px;
    width: auto
}

.record-show-button .btn.btn-stop-with-text,
.record-show-button .btn.btn-stop-with-timer {
    align-items: center;
    display: flex;
    padding: 10px;
    width: auto
}

.record-show-button .btn.btn-stop-with-text.btn-stop-left>:nth-child(2),
.record-show-button .btn.btn-stop-with-timer.btn-stop-left>:nth-child(2) {
    margin-left: 8px
}

.record-show-button .btn.btn-stop-with-text.btn-stop-left>:nth-child(3),
.record-show-button .btn.btn-stop-with-timer.btn-stop-left>:nth-child(3) {
    margin-left: 4px
}

.record-show-button .btn.btn-stop-with-text.btn-stop-right>:nth-last-child(2),
.record-show-button .btn.btn-stop-with-timer.btn-stop-right>:nth-last-child(2) {
    margin-left: 0;
    margin-right: 8px
}

.record-show-button .btn.btn-stop-with-text.btn-stop-right>:nth-last-child(3),
.record-show-button .btn.btn-stop-with-timer.btn-stop-right>:nth-last-child(3) {
    margin-left: 0;
    margin-right: 4px
}

.record-show-button .icon {
    color: #f8f8f8;
    height: 22px;
    margin: 0;
    width: 22px
}

.record-show-button .record-show-btn-text {
    color: #f8f8f8;
    margin-left: 8px;
    vertical-align: middle;
    font-size: .75rem;
    line-height: .938rem
}

.record-show-button .record-show-rect {
    background-color: red;
    border-radius: 2px;
    display: block;
    height: 14px;
    margin: auto;
    width: 14px
}

.record-show-button .record-show-timer {
    border-radius: 4px;
    color: rgba(248, 248, 248, .8);
    padding: 4px 8px;
    font-size: .688rem;
    line-height: .875rem
}

.record-show-button .btn-stop-with-timer .record-show-timer {
    background-color: transparent !important;
    padding: 0 !important
}

.record-show-button .btn-stop-with-text.btn-stop-with-timer .record-show-timer {
    color: rgba(248, 248, 248, .6)
}

.record-show-button.record-show-button-broadcast .icon {
    height: 19px;
    opacity: .6;
    width: 19px
}

.record-show-button.record-show-button-broadcast.disabled .icon {
    --camera-3-circle-color: currentColor;
    opacity: .4
}

.record-show-button.record-show-button-broadcast .btn-start {
    background-color: rgba(24, 24, 24, .7)
}

.record-show-button.record-show-button-broadcast.disabled .btn-start {
    background-color: rgba(24, 24, 24, .3)
}

.record-show-button.record-show-button-broadcast .btn-stop {
    background-color: rgba(0, 0, 0, .6)
}

.record-show-button.record-show-button-broadcast .btn.with-text .icon {
    transform: translateY(-2px)
}

.record-show-button.record-show-button-broadcast .record-show-timer {
    background-color: rgba(0, 0, 0, .4)
}

.record-show-button.record-show-button-modelBroadcast .icon {
    height: 16px;
    opacity: .8;
    transition: opacity 120ms ease-in-out;
    width: 16px
}

.record-show-button.record-show-button-modelBroadcast .btn-start {
    background-color: rgba(24, 24, 24, .7);
    transition: background 120ms ease-in-out
}

.record-show-button.record-show-button-modelBroadcast .btn-start:focus-visible,
.record-show-button.record-show-button-modelBroadcast .btn-start:hover {
    background-color: rgba(24, 24, 24, .9)
}

.record-show-button.record-show-button-modelBroadcast .btn-start:focus-visible .icon,
.record-show-button.record-show-button-modelBroadcast .btn-start:hover .icon {
    opacity: 1
}

.record-show-button.record-show-button-modelBroadcast.disabled .icon {
    opacity: .4
}

.record-show-button.record-show-button-modelBroadcast.disabled .btn-start {
    background-color: rgba(24, 24, 24, .28)
}

.record-show-button.record-show-button-modelBroadcast.disabled .btn-start:focus-visible .icon,
.record-show-button.record-show-button-modelBroadcast.disabled .btn-start:hover .icon {
    opacity: .4
}

.record-show-button.record-show-button-modelBroadcast .btn-stop {
    background-color: rgba(24, 24, 24, .7)
}

.record-show-button.record-show-button-modelBroadcast .btn-stop:hover {
    background-color: rgba(24, 24, 24, .9)
}

.record-show-button.record-show-button-viewcam .icon {
    transform: translateY(-2px)
}

.record-show-button.record-show-button-viewcam .icon,
.record-show-button.record-show-button-viewcam .record-show-btn-text {
    opacity: .8
}

.record-show-button.record-show-button-viewcam:hover .icon,
.record-show-button.record-show-button-viewcam:hover .record-show-btn-text {
    opacity: 1
}

.record-show-button.record-show-button-viewcam .btn-start,
.record-show-button.record-show-button-viewcam .btn-stop {
    background-color: transparent
}

.record-show-button.record-show-button-viewcam .btn-start.with-text {
    background-color: rgba(0, 0, 0, .6)
}

.record-show-button.record-show-button-viewcam .btn-stop.btn-stop-with-text,
.record-show-button.record-show-button-viewcam .btn-stop.btn-stop-with-timer {
    background-color: rgba(0, 0, 0, .8)
}

.record-show-button.record-show-button-viewcam .record-show-timer {
    background-color: rgba(0, 0, 0, .6)
}

.record-show-button .tooltip>.tooltip-inner {
    background-color: #3b3b3b;
    box-shadow: none;
    color: #f8f8f8;
    filter: drop-shadow(0 0 10px rgba(0, 0, 0, .6));
    padding: 10px;
    font-size: .813rem;
    line-height: 1.125rem
}

.record-show-button .tooltip.right>.tooltip-inner:before {
    border-right-color: #3b3b3b
}

.record-show-button .tooltip.bottom>.tooltip-inner:before,
.record-show-button .tooltip.top>.tooltip-inner:before {
    display: none
}

.record-show-button .tooltip.bottom+.btn:before,
.record-show-button .tooltip.top+.btn:before {
    border-color: transparent;
    border-style: solid;
    content: "";
    height: 0;
    position: absolute;
    width: 0;
    z-index: 500
}

.record-show-button .tooltip.top+.btn:before {
    border-top-color: #3b3b3b;
    border-width: 5px 5px 0;
    bottom: calc(100% + 3px);
    left: calc(50% - 5px)
}

.record-show-button .tooltip.bottom+.btn:before {
    border-bottom-color: #3b3b3b;
    border-width: 0 5px 5px;
    left: calc(50% - 5px);
    top: calc(100% + 3px)
}

.fullscreen-top-controls {
    background: linear-gradient(180deg, rgba(0, 0, 0, .4) 0%, rgba(0, 0, 0, 0) 100%);
    display: flex;
    height: 50px;
    justify-content: space-between;
    min-height: 0;
    padding: 4px 8px 4px 14px
}

.fullscreen-top-controls__info-wrapper {
    align-items: center;
    display: flex
}

.fullscreen-top-controls__live-badge {
    margin-right: 8px
}

.fullscreen-top-controls__buttons {
    height: 100%
}

.fullscreen-top-controls__top-buttons {
    display: flex;
    height: 100%;
    justify-content: flex-end;
    padding-top: 4px
}

.fullscreen-top-controls__bottom-buttons {
    align-items: center;
    display: flex;
    justify-content: flex-end;
    margin-top: 6px;
    padding-right: 2px
}

.fullscreen-top-controls .fullscreen-top-controls__button {
    margin: 0 10px 0 0
}

.fullscreen-top-controls .fullscreen-top-controls__button:last-child {
    margin: 0
}

.fullscreen-top-controls .fullscreen-top-controls__button--record-left {
    left: 15px;
    margin: 0;
    position: absolute;
    right: auto;
    top: 50px;
    z-index: 1
}

.fullscreen-top-controls .fullscreen-top-controls__button--record-right-first {
    order: -1
}

.fullscreen-top-controls .fullscreen-top-controls__button--tokens {
    margin-right: 15px
}

.fullscreen-top-controls .fullscreen-top-controls__button--next {
    margin: 0;
    position: absolute;
    right: 10px;
    top: 53px
}

.fullscreen-top-controls .fullscreen-top-controls__button--volume {
    z-index: 1
}

.fullscreen-top-controls--landscape-mode .fullscreen-top-controls__top-buttons {
    bottom: 58px;
    display: flex;
    flex-direction: column-reverse;
    height: auto;
    justify-content: center;
    padding: 0;
    position: absolute;
    right: 8px;
    top: 32px
}

.fullscreen-top-controls--landscape-mode .fullscreen-top-controls__top-buttons .fullscreen-top-controls__button {
    margin: 0
}

.fullscreen-top-controls--landscape-mode .fullscreen-top-controls__top-buttons .fullscreen-top-controls__button .icon {
    filter: drop-shadow(1px 1px 2px rgba(0, 0, 0, .9))
}

.fullscreen-top-controls--landscape-mode .fullscreen-top-controls__bottom-buttons {
    height: 30px;
    margin-top: 0
}

.fullscreen-top-controls--landscape-mode .fullscreen-top-controls__button--next {
    position: static
}

.player-controls-fullscreen__main {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%
}

.player-controls-fullscreen__mic-inactive-badge {
    position: absolute;
    right: 20px;
    top: 25px
}

.player-controls-fullscreen__bottom {
    align-items: flex-end;
    display: flex;
    flex-grow: 1;
    min-height: 0;
    padding: 4px 10px;
    transition: opacity 120ms ease-in-out
}

.i-os .player-controls-fullscreen__bottom {
    padding-bottom: 16px
}

.player-controls-fullscreen__chat-wrapper {
    flex-shrink: 0;
    height: calc(100vh - 60px);
    max-height: 100%;
    width: 300px
}

.player-controls-fullscreen__chat-wrapper--full-width {
    width: 100%
}

.player-controls-fullscreen .player-controls-fullscreen__chat {
    height: 100%;
    width: 100%
}

.player-controls-fullscreen__bottom-controls {
    margin-left: auto
}

.player-controls-fullscreen .player-controls-fullscreen__chat-actions,
.player-controls-fullscreen .player-controls-fullscreen__send-tip {
    bottom: 66px;
    position: absolute;
    right: 14px;
    width: 320px;
    z-index: 1;
    transition: opacity 120ms ease-in-out
}

.player-controls-fullscreen .player-controls-fullscreen__send-tip {
    max-height: 100vh
}

.player-controls-fullscreen .player-controls-fullscreen__chat-actions {
    height: 100%;
    max-height: 40vh;
    min-width: 320px;
    top: auto
}

.player-controls-fullscreen__waiting-private {
    bottom: 4px;
    margin-left: 10px;
    position: absolute;
    right: 10px
}

.player-controls-fullscreen__waiting-private .i-os {
    bottom: 16px
}

.player-controls-model__main {
    display: flex;
    height: 100%;
    justify-content: flex-end;
    padding: 14px;
    width: 100%
}

.player-controls-model__main--gradient {
    background: linear-gradient(180deg, rgba(34, 34, 34, .5) 0, transparent 80px)
}

.player-controls-model .player-controls-model__button {
    margin: 0 10px 0 0
}

.player-controls-model .player-controls-model__button:last-child {
    margin: 0
}

.player-controls-model__tooltip {
    height: 36px
}

.player-controls-model__private-timer {
    left: 14px;
    position: absolute;
    top: 14px
}

.PlayerControlsUserFloating\#Ia {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: opacity .25s;
    width: 100%;
    z-index: 100
}

.PlayerControlsUserFloating\#Ia.PlayerControlsUserFloating__show\#xq .PlayerControlsUserFloating__shadeLayer\#n4 {
    opacity: 1;
    pointer-events: all
}

.PlayerControlsUserFloating__layer\#qn {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.PlayerControlsUserFloating__shadeLayer\#n4 {
    align-items: center;
    background: rgba(0, 0, 0, .6);
    display: flex;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity .25s
}

.PlayerControlsUserFloating__streamControls\#DF {
    display: flex
}

.PlayerControlsUserFloating__control\#J5 {
    background-color: transparent;
    border: none;
    color: rgba(248, 248, 248, .6);
    cursor: pointer;
    display: flex;
    margin: 0;
    padding: 0
}

.PlayerControlsUserFloating__btnIcon\#Om {
    height: 100%;
    width: 100%
}

.PlayerControlsUserFloating__closeBtn\#fd {
    height: 24px;
    position: absolute;
    right: 12px;
    top: 12px;
    width: 24px
}

.PlayerControlsUserFloating__streamControl\#jY {
    height: 24px;
    width: 24px
}

.PlayerControlsUserFloating__streamControl\#jY+.PlayerControlsUserFloating__streamControl\#jY {
    margin-left: 32px
}

.PlayerControlsUserFloating__liveBadge\#Cu {
    background: linear-gradient(0deg, red 0%, red 100%), #1e9b4b;
    border-radius: 4px;
    color: #f8f8f8;
    display: inline-block;
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    height: 16px;
    left: 8px;
    line-height: 16px;
    padding: 0 4px;
    position: absolute;
    text-transform: uppercase;
    top: 8px;
    z-index: 1
}

.player-controls-user--hidden {
    display: none
}

.player-controls-user__main {
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: space-between;
    padding: 14px;
    width: 100%
}

.player-controls-user__main--gradient {
    background: linear-gradient(180deg, rgba(34, 34, 34, .5) 0, transparent 80px)
}

.player-controls-user__bottom-actions {
    align-items: center;
    display: flex;
    flex-direction: row
}

.player-controls-user__main-top {
    display: flex;
    justify-content: space-between
}

.player-controls-user__info-wrapper {
    margin-right: 10px
}

.player-controls-user__online-info {
    align-items: center;
    display: flex
}

.player-controls-user__live-badge {
    margin-right: 8px
}

.player-controls-user__goal-info {
    margin-top: 8px
}

.player-controls-user__new-goal-info {
    margin-right: 20px
}

.player-controls-user__buttons {
    display: flex;
    margin-left: auto
}

.player-controls-user__left-buttons {
    display: flex;
    margin-right: 10px
}

.player-controls-user__right-buttons {
    display: flex
}

.player-controls-user .player-controls-user__button {
    margin: 0 10px 0 0
}

.player-controls-user .player-controls-user__button:last-child {
    margin: 0
}

.player-controls-user .player-controls-user__next-button {
    flex-shrink: 0;
    margin: 0 0 0 auto
}

.player-controls-user__stop-record-btn {
    left: 14px;
    position: absolute;
    top: 14px
}

.player-controls-user__overlay-top-btn {
    position: absolute;
    right: 14px;
    top: 14px
}

.player-controls-user__join-btn {
    bottom: 14px;
    left: 50%;
    position: absolute !important;
    top: initial !important;
    transform: translateX(-50%)
}

.player-controls-user__watch-vr {
    bottom: 14px;
    left: 14px;
    position: absolute
}

@media screen and (min-width:1024px) {
    .PlayerControlsUserFloating__closeBtn\#fd {
        right: 16px;
        top: 16px
    }

    .PlayerControlsUserFloating__streamControl\#jY {
        height: 32px;
        width: 32px
    }

    .PlayerControlsUserFloating__streamControl\#jY+.PlayerControlsUserFloating__streamControl\#jY {
        margin-left: 40px
    }

    .PlayerControlsUserFloating__liveBadge\#Cu {
        left: 16px;
        top: 16px
    }
}

@media screen and (min-width:1280px) {
    .view-cam-controls-text {
        display: initial
    }

    .view-cam-controls-text--short {
        display: none
    }
}

@media screen and (max-height:420px) {
    .send-tip-form.compact .comments-wrapper:not(.visible) {
        display: none
    }

    .send-tip-form.compact .send-tip-controls .toggle-comment {
        display: block
    }
}

@media screen and (max-height:420px) and (orientation:landscape) {
    .player-controls-fullscreen__send-tip {
        top: 0
    }
}

@media (orientation:landscape) {
    .i-os .player-controls-fullscreen .player-controls-fullscreen__send-tip {
        max-height: calc(100% - 50px - 66px);
        min-height: auto;
        top: auto
    }
}

@media (pointer:coarse) {
    .PlayerControlsUserFloating__control\#J5 {
        color: #f8f8f8
    }
}

@media (pointer:fine) {
    .fullscreen-chat-actions-button .fullscreen-chat-actions-button__inner.btn:hover {
        background: rgba(248, 248, 248, .2)
    }

    .fullscreen-private-button.btn.hover,
    .fullscreen-private-button.btn:hover {
        color: #000
    }

    .fullscreen-stop-private-button.hover,
    .fullscreen-stop-private-button:hover {
        background: rgb(36.75, 36.75, 36.75);
        color: #fff
    }

    .fullscreen-stop-private-button.hover>.icon,
    .fullscreen-stop-private-button:hover>.icon {
        fill: #fff
    }

    .send-tip-form.private .buy-tokens.hover,
    .send-tip-form.private .buy-tokens:hover {
        background: #e9ae50;
        color: #583b0b;
        border-color: transparent
    }

    .send-tip-form.private .buy-tokens.hover>.icon,
    .send-tip-form.private .buy-tokens:hover>.icon {
        fill: #583b0b
    }

    .view-cam-controls-toolbox .cam2cam-menu .menu-button.hover,
    .view-cam-controls-toolbox .cam2cam-menu .menu-button:hover {
        background: #7a7a7a;
        color: #fff
    }

    .view-cam-controls-toolbox .cam2cam-menu .menu-button.hover>.icon,
    .view-cam-controls-toolbox .cam2cam-menu .menu-button:hover>.icon {
        fill: #fff
    }

    .view-cam-controls-toolbox.view-cam-controls-toolbox-cam2cam .player-toolbox-icon .player-toolbox-icon-item.settings.hover,
    .view-cam-controls-toolbox.view-cam-controls-toolbox-cam2cam .player-toolbox-icon .player-toolbox-icon-item.settings:hover {
        background: rgb(36.75, 36.75, 36.75);
        color: #fff
    }

    .view-cam-controls-toolbox.view-cam-controls-toolbox-cam2cam .player-toolbox-icon .player-toolbox-icon-item.settings.hover>.icon,
    .view-cam-controls-toolbox.view-cam-controls-toolbox-cam2cam .player-toolbox-icon .player-toolbox-icon-item.settings:hover>.icon {
        fill: #fff
    }

    .view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen .menu-button.hover,
    .view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen .menu-button:hover {
        background: #7a7a7a;
        color: #f8f8f8
    }

    .view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen .menu-button.hover>.icon,
    .view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen .menu-button:hover>.icon {
        fill: #f8f8f8
    }

    .view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.settings.hover,
    .view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.settings:hover {
        background: rgb(36.75, 36.75, 36.75);
        color: #f8f8f8
    }

    .view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.settings.hover>.icon,
    .view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.settings:hover>.icon {
        fill: #f8f8f8
    }

    .view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-enabled.hover,
    .view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-enabled:hover {
        background: #7a7a7a;
        color: #f8f8f8
    }

    .view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-enabled.hover>.icon,
    .view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-enabled:hover>.icon {
        fill: #f8f8f8
    }

    .view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-disabled.hover,
    .view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-disabled:hover {
        background: #d53e48;
        color: #f8f8f8
    }

    .view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-disabled.hover>.icon,
    .view-cam-controls-toolbox.view-cam-controls-toolbox--fullscreen.view-cam-controls-toolbox-cam2cam .player-toolbox-icon-item.btn-disabled:hover>.icon {
        fill: #f8f8f8
    }

    .PlayerControlsUserFloating\#Ia:hover .PlayerControlsUserFloating__shadeLayer\#n4 {
        opacity: 1;
        pointer-events: all
    }

    .PlayerControlsUserFloating__control\#J5:hover {
        color: #f8f8f8
    }
}

@media (prefers-reduced-motion) {
    .css-popover-content-top {
        transition-property: opacity
    }

    .css-popover-content-bottom {
        transition-property: opacity
    }

    .css-popover-content-left {
        transition-property: opacity
    }

    .css-popover-content-right {
        transition-property: opacity
    }

    .css-popover-content-topleft {
        transition-property: opacity
    }
}