@charset "UTF-8";

@keyframes opacity-fade-show {

    0% {

        opacity: 0;

    }

    to {

        opacity: 1;

    }

}

@keyframes opacity-fade-hide {

    0% {

        opacity: 1;

    }

    to {

        opacity: 0;

    }

}

@keyframes opacity-fade-bottom-show {

    0% {

        opacity: 0;

        transform: translateY(-30%);

    }

    to {

        opacity: 1;

        transform: translateY(0);

    }

}

@keyframes opacity-fade-top-show {

    0% {

        opacity: 0;

        transform: translateY(30%);

    }

    to {

        opacity: 1;

        transform: translateY(0);

    }

}

@keyframes opacity-fade-in {

    0% {

        opacity: 0.4;

    }

    to {

        opacity: 1;

    }

}

@keyframes opacity-fade-light-show-modal {

    0% {

        opacity: 0;

        transform: scale(0.8);

    }

    to {

        opacity: 1;

        transform: scale(1);

    }

}

@keyframes opacity-fade-show-modal-strict {

    0% {

        opacity: 0;

        transform: scale(0.1);

    }

    to {

        opacity: 1;

        transform: scale(1);

    }

}

@keyframes opacity-fade-show-modal {

    0% {

        opacity: 0;

        transform: scale(0.9);

    }

    to {

        opacity: 1;

        transform: scale(1);

    }

}

@keyframes opacity-fade-hide-modal {

    0% {

        opacity: 1;

        transform: scale(1);

    }

    to {

        opacity: 0;

        transform: scale(0.7);

    }

}

@keyframes opacity-zoom-fade-hide {

    0% {

        opacity: 0.5;

    }

    to {

        opacity: 0;

        transform: scale(6);

    }

}

@keyframes ring {

    0% {

        transform: rotate(-15deg);

    }

    2% {

        transform: rotate(15deg);

    }

    12%,

    4% {

        transform: rotate(-18deg);

    }

    14%,

    6% {

        transform: rotate(18deg);

    }

    8% {

        transform: rotate(-22deg);

    }

    10% {

        transform: rotate(22deg);

    }

    16% {

        transform: rotate(-12deg);

    }

    18% {

        transform: rotate(12deg);

    }

    20%,

    to {

        transform: rotate(0deg);

    }

}

@keyframes pointing-down {

    0%,

    to {

        transform: translate3d(0, 0, 0);

    }

    50% {

        transform: translate3d(0, -10%, 0);

    }

}

@keyframes form-alert-top-and-hide {

    0% {

        opacity: 0;

        transform: translateY(50px);

    }

    20%,

    80% {

        opacity: 1;

        transform: translateY(0);

    }

    to {

        opacity: 0;

    }

}

@keyframes move-from-right {

    0% {

        transform: translateX(100%);

    }

    to {

        transform: translateX(0);

    }

}

@keyframes move-bottom-right {

    0% {

        transform: translateY(100%);

    }

    to {

        transform: translateY(0);

    }

}

@keyframes landing-opacity-zoom-fade-show-delay {

    0% {

        opacity: 0;

        transform: translateY(20%);

    }

    to {

        opacity: 1;

        transform: translateY(0);

    }

}

@keyframes landing-opacity-move-left-delay {

    0% {

        opacity: 0.4;

        transform: translateX(-20%);

    }

    to {

        opacity: 1;

        transform: translateX(0);

    }

}

@keyframes toast-flash-show {

    0% {

        opacity: 0;

        transform: translateY(0);

    }

    to {

        opacity: 1;

        transform: translateY(64px);

    }

}

@keyframes circleFadeDelay {

    0%,

    39%,

    to {

        opacity: 0;

    }

    40% {

        opacity: 1;

    }

}

@keyframes scanner {

    0% {

        top: 0;

    }

    to {

        top: calc(100% - 3px);

    }

}

@keyframes loader-ds {

    to {

        transform: rotate(360deg);

    }

}

@keyframes loader-ds-circle {

    0% {

        stroke-dasharray: 1px, 200px;

        stroke-dashoffset: 0;

    }

    50% {

        stroke-dasharray: 100px, 200px;

        stroke-dashoffset: -15px;

    }

    to {

        stroke-dasharray: 100px, 200px;

        stroke-dashoffset: -125px;

    }

}

@keyframes select-animation-spin {

    to {

        transform: rotate(1turn);

    }

}

@keyframes select-animation-fadeIn {

    0% {

        opacity: 0;

    }

    to {

        opacity: 1;

    }

}

@keyframes video-player-animation-play-desktop {

    0% {

        opacity: 0.6;

        transform: translateX(-50%) translateY(-50%) scale(1);

    }

    to {

        opacity: 0;

        transform: translateX(-50%) translateY(-50%) scale(1.5);

    }

}

@keyframes moving-stripes {

    0% {

        background-position: 0 0;

    }

    to {

        background-position: 1rem 0;

    }

}

@keyframes toast-animation-show {

    0% {

        opacity: 0.3;

        right: calc(100% + 50px);

    }

    to {

        opacity: 1;

        right: 0;

    }

}

@keyframes toast-animation-hide {

    0% {

        opacity: 1;

        right: 0;

    }

    to {

        opacity: 0.3;

        right: calc(100% + 50px);

    }

}

@keyframes ability-animation-for-left {

    0% {

        opacity: 0;

        transform: translateX(-40%);

    }

    to {

        opacity: 1;

        transform: translateX(0);

    }

}

@keyframes ability-animation-for-right {

    0% {

        opacity: 0;

        transform: translateX(40%);

    }

    to {

        opacity: 1;

        transform: translateX(0);

    }

}

@keyframes arrow-down-animated-move {

    0% {

        top: -26px;

    }

    to {

        top: 4px;

    }

}

@keyframes arrow-down-animated-move-infinity {

    0%,

    70% {

        top: -26px;

    }

    to {

        top: 4px;

    }

}

@keyframes controls-appearance {

    0% {

        opacity: 0;

    }

    to {

        opacity: 1;

    }

}

@keyframes animation-ability-tip {

    0%,

    50% {

        transform: scale(0);

    }

    80% {

        transform: scale(1.2);

    }

    to {

        transform: scale(1);

    }

}

@keyframes animation-element-highlighted {

    0%,

    20%,

    to {

        box-shadow: 0 0 0 4px transparent;

    }

    10% {

        box-shadow: 0 0 2px 4px #ff3332;

    }

    30% {

        box-shadow: 0 0 2px 4px rgba(163, 73, 252, 0.8);

    }

}

@keyframes smile-appear {

    0% {

        opacity: 0;

        transform: scale(0);

    }

    to {

        opacity: 1;

        transform: scale(1);

    }

}

@keyframes flareAnimation {

    0%,

    30% {

        transform: translateX(-100%);

    }

    50%,

    to {

        transform: translateX(100%);

    }

}

@keyframes skeleton-animation {

    0%,

    to {

        opacity: 1;

    }

    50% {

        opacity: 0.4;

    }

}

@keyframes donut-spin {

    0% {

        transform: rotate(0deg);

    }

    to {

        transform: rotate(360deg);

    }

}

@keyframes animation-comment-highlighted {

    0%,

    50% {

        opacity: 1;

    }

    to {

        opacity: 0;

    }

}

@keyframes animate-slide {

    0% {

        opacity: 0;

        transform: translate(16px, 0);

    }

    to {

        opacity: 1;

        transform: translate(0, 0);

    }

}

@keyframes fadeIn {

    0% {

        opacity: 0;

        transform: translate(12px, 0);

    }

    to {

        opacity: 1;

        transform: translate(0, 0);

    }

}



body {

    background: #050506;

    font: 0.875rem "Open Sans", Helvetica, "Roboto", "Arial", sans-serif;

    -moz-osx-font-smoothing: grayscale;

    -webkit-font-smoothing: antialiased;

    font-weight: 500;

    font-family: 'Open Sans'!important;

}

html {

    font-size: 16px;

    -webkit-tap-highlight-color: transparent;

}

body,

html {

    text-size-adjust: 100%;

    letter-spacing: 0.031rem;

}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {

    body,

    html {

        letter-spacing: 0.019rem;

    }

}

.text-underline {

    text-decoration: underline;

}

a {

    color: #a4a4a4;

    cursor: pointer;

    text-decoration: none;

    font-family: 'Open Sans'!important;

}

a:active,

a:focus,

a:hover {

    color: #f8f8f8;

    text-decoration: none;

}

p {

    margin-bottom: 1rem;

    margin-top: 0;

}

.small {

    font-size: 80%;

    font-weight: 500;

}

.strong {

    font-weight: 700;

}

.strong-500 {

    font-weight: 500;

}

.text-left {

    text-align: left;

}

.text-center {

    text-align: center;

}

.text-right {

    text-align: right;

}

.no-wrap {

    white-space: nowrap;

}

.pre-line {

    white-space: pre-line;

}

.color-ios,

.color-ios:hover {

    color: #2e7cf6;

}

.color-teaser {

    color: #f9d400;

}

.color-st {

    color: #a2252d;

}

.black-color-text,

.black-color-text:hover {

    color: #000;

}

.white-color-text,

.white-color-text:hover {

    color: #fff;

}

.white-color-text-2,

.white-color-text-2:hover {

    color: #49494a;

}

.white-color-text-4,

.white-color-text-4:hover {

    color: #707071;

}

.white-color-text-opacity-4,

.white-color-text-opacity-4:hover {

    color: rgba(255, 255, 255, 0.4);

}

.white-color-text-6,

.white-color-text-6:hover {

    color: #a0a0a1;

}

.white-color-text-opacity-6,

.white-color-text-opacity-6:hover {

    color: rgba(255, 255, 255, 0.6);

}

.white-color-text-8,

.white-color-text-8:hover {

    color: #cfcfd0;

}

.white-color-text-opacity-8,

.white-color-text-opacity-8:hover {

    color: rgba(255, 255, 255, 0.8);

}

.color-green-light {

    color: #83cb3e;

}

.color-grey-100 {

    color: #d4d4d4;

}

.color-grey-200 {

    color: #808085;

}

.color-grey-300 {

    color: #5f5f67;

}

.color-grey-400 {

    color: #424248;

}

.color-grey-500 {

    color: #343437;

}

.color-grey-600 {

    color: #232325;

}

.color-grey-700 {

    color: #1b1b1d;

}

.color-grey-800 {

    color: #111113;

}

.color-grey-900 {

    color: #050506;

}

.pale-light-text {

    opacity: 0.8;

}

.pale-text-7 {

    opacity: 0.7;

}

.pale-text {

    color: #a0a0a1;

}

.pale-x-text {

    opacity: 0.4;

}

.white-pale-text {

    color: #a0a0a1;

}

.white-pale-text-04 {

    color: #707071;

}

.primary-default-color-text,

.primary-default-color-text:hover {

    color: #d60908;

}

.accent-color-text,

.accent-color-text-bg:hover,

.accent-color-text:hover {

    color: #ff3332;

}

.accent-color-text-bg,

.color-positive-light-text-bg {

    align-items: center;

    border-radius: 6px;

    display: inline-flex;

    height: 18px;

    padding: 2px 4px;

}

.accent-color-text-bg {

    background: #28234a;

    color: #ff3332;

}

.color-positive-light-text-bg {

    background: #1c2a24;

    color: #67ed27;

}

.color-positive-light-text-bg:hover {

    color: #67ed27;

}

.accent-color-text-with-hover:active,

.accent-color-text-with-hover:hover,

.accent-light-color-text,

.accent-light-color-text:hover {

    color: #d60908;

}

.accent-color-text-with-hover {

    color: #ff3332;

    text-decoration: underline;

}

.color-like,

.color-like:hover {

    color: #f44;

}

.color-positive,

.color-positive:hover {

    color: #21b062;

}

.primary-color-text,

.primary-color-text:hover {

    color: var(--primary-border);

}

.primary-dark-x-color-text,

.primary-dark-x-color-text:hover {

    color: #6903ce;

}

.primary-light-color-text,

.primary-light-color-text:hover {

    color: #d60908;

}

.yellow-color-text,

.yellow-color-text:hover {

    color: #ffd600;

}

.alive-link {

    pointer-events: auto;

    text-decoration: underline;

}

.alive-link:hover {

    text-decoration: none;

}

.red-color-text,

.red-color-text:hover {

    color: #d9023c;

}

.red-light-color-text,

.red-light-color-text:hover {

    color: #fd4967;

}

.error-color-text,

.error-color-text:hover {

    color: #fd3a5b;

}

.error-light-color-text,

.error-light-color-text:hover {

    color: #d21b4c;

}

.color-pale {

    opacity: 0.6;

}

.color-pale-x {

    opacity: 0.4;

}

.color-warning,

.color-warning:hover {

    color: #fccf49;

}

.email-text::after {

    content: "help@my.club";

}

.text-onf::before {

    content: "Only";

}

.text-onf::after {

    content: "Fans";

}

.text-starsavn::before {

    content: "AVN";

}

.text-starsavn::after {

    content: " Stars";

}

.text-fansly::before {

    content: "Fan";

}

.text-fansly::after {

    content: "sly";

}

.text-bold {

    font-weight: 700;

}

.text-uppercase {

    text-transform: uppercase;

}

.text-lowercase {

    text-transform: lowercase;

}

.cursor-pointer {

    cursor: pointer;

}

a.text-link {

    color: inherit;

}

.color-male {

    color: #1fc9ff;

}

.color-female {

    color: #f423a2;

}

.color-trans {

    color: #a862ff;

}

.content-header-text {

    font-size: 40px;

    font-weight: 700;

    margin: 0 0 32px;

}

@media screen and (max-width: 639px) {

    .content-header-text {

        font-size: 18px;

        line-height: 22px;

        margin-bottom: 12px;

    }

}

.trending-header {

    font-size: 40px;

    font-weight: 700;

    line-height: 49px;

    margin: 0;

    padding: 0;

    position: relative;

    width: 100%;

}

.trending-header--center {

    margin-right: 49px;

    text-align: center;

}

.trending-header__subtitle {

    color: #a0a0a1;

    font-size: 16px;

    font-weight: 400;

    line-height: normal;

    position: absolute;

    width: 100%;

}

.trending-header__text {

    overflow: hidden;

    text-overflow: ellipsis;

}

@media screen and (max-width: 639px) {

    .trending-header {

        font-size: 27px;

        line-height: 32px;

    }

    .trending-header--center {

        margin: 0 0 34px;

        text-align: left;

    }

}

.is-multiple a.select-value-label:hover,

.underline-hover:hover,

a.text-link {

    text-decoration: underline;

}

.opacity-hover:hover {

    opacity: 0.8;

}

.terms-address::before {

    content: "Spyrou Kyprianou 79, 2";

}

.terms-address::after {

    content: " Floor, Flat 201, 3076, Limassol, Cyprus";

}

.hidden {

    display: none !important;

}

.page-wrapper {

    display: flex;

    flex-direction: column;

    flex: 1;

    flex-basis: auto;

    flex-grow: 1;

    flex-shrink: 0;

}

.container.island-page,

.island-page {

    display: flex;

    justify-content: center;

    padding: 60px 0;

    text-align: center;

}

.container.island-page > .island-wrapper,

.form-fields .settings-field > div.settings-label > label,

.island-page > .island-wrapper {

    text-align: left;

}

.island-wrapper {

    display: inline-block;

    max-width: 100%;

    position: relative;

    vertical-align: top;

}

.island-top {

    align-items: center;

    justify-content: space-between;

    padding-bottom: 10px;

    position: relative;

    display: flex;

    flex-direction: row;

}

.island-top-title {

    color: #fff;

    display: inline-block;

    margin: 0;

    font-size: 1.5rem;

}

.island {

    background-color: var(--primary-modal);

    border: 0;

    border-radius: 8px;

}

.footer-bottom > a,

.island .text {

    color: #fff;

}

.island .link {

    color: #e3e3e3;

    text-decoration: underline;

}

.island .link:hover {

    text-decoration: none;

}

.island .link-after-text {

    margin-left: 0.3em;

}

.island .field {

    display: block;

    position: relative;

}

.island .field-action {

    text-align: center;

}

.island .btn-action {

    font-weight: 700;

    opacity: 0.9;

}

.island .btn-action.disabled,

.island .btn-action:disabled {

    opacity: 0.33;

}

.island-small {

    max-width: 100%;

    padding: 18px 20px;

    width: 300px;

}

.island-small .island-title {

    font-size: 1.5rem;

}

.island-small .link,

.island-small .suggestion {

    font-size: 0.75rem;

}

.island-small .field {

    margin-top: 20px;

}

.island-small .field:first-child {

    margin-top: 0;

}

.island-small .btn-action {

    line-height: 38px;

    min-width: 160px;

    font-size: 0.938rem;

}

.island-small .textarea,

.island-small input.input[type="date"],

.island-small input.input[type="email"],

.island-small input.input[type="password"],

.island-small input.input[type="text"] {

    padding: 0 15px;

    width: 100%;

    font-size: 0.875rem;

}

.island-small .tooltip > .tooltip-inner {

    font-size: 0.75rem;

}

@media screen and (max-width: 1023px) {

    .island-small .tooltip-inner {

        padding: 0;

    }

}

.columns {

    display: flex;

    flex-wrap: wrap;

    margin-left: -0.375rem;

    margin-right: -0.375rem;

}

.column {

    display: block;

    flex: 1 1 0;

    padding: 0 0.375rem;

}

.container {

    margin: 0 auto;

    max-width: 100%;

    position: relative;

    width: 100%;

}

@media screen and (min-width: 1600px) {

    .container {

        max-width: 1388px;

        padding-left: 0;

        padding-right: 0;

        width: 1388px;

    }

    .fs {

        right: 560px!important;

    }



}

.spacer {

    margin-top: 0.375rem;

}

.spacer-small-x {

    margin-top: 0.25rem;

}

.spacer-small-s {

    margin-top: 0.5rem;

}

.spacer-10 {

    margin-top: 10px;

}

.spacer-small {

    margin-top: 0.75rem;

}

.spacer-medium-x {

    margin-top: 1rem;

}

.spacer-medium {

    margin-top: 1.25rem;

}

.spacer-large,

.spacer-large-double {

    margin-top: 1.5rem;

}

.spacer-large-2 {

    margin-top: 2rem;

}

.spacer-large-xs {

    margin-top: 2.5rem;

}

.spacer-large-x {

    margin-top: 3rem;

}

.spacer-large-xx {

    margin-top: 80px;

}

.line {

    background: rgba(255, 255, 255, 0.1);

    height: 1px;

}

.indent-left-small {

    margin-left: 12px;

}

.indent-right-medium {

    margin-right: 16px;

}

.indent-right-16,

.indent-right-small {

    margin-right: 12px;

}

.indent-right-small-6 {

    margin-right: 6px;

}

.indent-right-small-8 {

    margin-right: 8px;

}

.indent-right-small-4 {

    margin-right: 4px;

}

.indent-right-small-10 {

    margin-right: 10px;

}

.indent-left-small-6 {

    margin-left: 6px;

}

.indent-left-small-4 {

    margin-left: 4px;

}

.indent-left-10 {

    margin-left: 10px;

}

.indent-left-16 {

    margin-left: 16px;

}

@media screen and (max-width: 639px) {

    .media-up-to-s-hidden {

        display: none !important;

    }

}

@media screen and (min-width: 640px) {

    .media-after-m-hidden {

        display: none !important;

    }

}

@media screen and (min-width: 1024px) {

    .media-after-l-hidden {

        display: none !important;

    }

}

@media screen and (max-width: 639px) {

    .from-tablet {

        display: none;

    }

}

@media screen and (min-width: 640px) {

    .only-phone {

        display: none;

    }

}

.max-height-300 {

    max-height: 300px;

}

.min-width-200 {

    min-width: 200px;

}

.min-width-500 {

    min-width: 500px;

}

.max-width-140 {

    max-width: 140px;

}

.max-width-230 {

    max-width: 230px;

}

.min-width-140 {

    min-width: 140px;

}

.min-width-230 {

    min-width: 230px;

}

.max-width-560 {

    max-width: 560px;

}

.max-width-590 {

    max-width: 590px;

}

.text-overflow {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.flex-align-left {

    align-items: center;

    display: flex;

    justify-content: flex-start;

}

.flex-align-center {

    justify-content: center;

}

.flex-align-center,

.flex-vertical-center {

    align-items: center;

    display: flex;

}

.align-center {

    justify-content: center;

    text-align: center;

}

.align-right {

    justify-content: flex-end;

    text-align: right;

}

.align-end {

    justify-content: flex-end;

    text-align: end;

}

.align-space-between {

    align-items: center;

    display: flex;

    justify-content: space-between;

}

.line-1 {

    background: rgba(255, 255, 255, 0.1);

    height: 1px;

}

.disabled-click,

.disabled-content {

    pointer-events: none;

}

.disabled-content {

    opacity: 0.6;

}

.break-word {

    word-break: break-word;

}

.block {

    clear: both;

    display: block;

}

.observer-page {

    height: 400px;

    pointer-events: none;

    position: absolute;

    transform: translateY(-218px);

}

.list-dot {

    list-style: inside disc;

}

.grid-align-center {

    align-items: center;

    display: grid;

    grid-auto-flow: column;

    justify-content: center;

}

.columns-grid-medium {

    display: flex;

    flex-direction: column;

    gap: 10px;

}

.position-relative {

    position: relative;

}

.padding-regular-x {

    padding-left: 20px;

    padding-right: 20px;

}

.padding-regular-y {

    padding-bottom: 20px;

    padding-top: 20px;

}

.error-boundary {

    align-items: center;

    background: #000;

    bottom: 0;

    color: #fff;

    display: flex;

    justify-content: center;

    left: 0;

    position: fixed;

    right: 0;

    top: 0;

}

.error-boundary__content {

    max-width: 470px;

    padding: 35px;

    position: relative;

}

.error-boundary__title {

    font-size: 20px;

    line-height: 26px;

    margin: 10px 0 0;

    opacity: 0.9;

}

.error-boundary__text {

    border-bottom: 1px solid rgba(255, 255, 255, 0.2);

    font-size: 15px;

    line-height: 22px;

    opacity: 0.6;

    padding-bottom: 30px;

}

.error-boundary__text-error {

    font-size: 13px;

    margin: 30px 0 0;

    opacity: 0.4;

}

.error-boundary__text-error-number {

    display: block;

    margin-top: 4px;

    word-break: break-all;

}

.error-boundary__textarea {

    display: block;

    margin: 10px 0;

    min-height: 100px;

    width: 100%;

}

.error-boundary .button {

    margin: 30px 0;

}

.main-layout {

    min-height: 100vh;

    overflow: hidden;

    padding-bottom: calc(var(--tap-bar-height) + env(safe-area-inset-bottom));

    padding-top: var(--pwa-notification-height);

}

.main-layout__landing-body {

    overscroll-behavior-y: none;

}

@media screen and (max-width: 1023px) {

    .main-layout__landing-body {

        overscroll-behavior-x: none;

    }

}

.main-layout__landing-body .default-footer {

    background: 0 0;

}

.main-layout__wrapper {

    min-height: 100vh;

    padding: 0 0 40px;

}

.main-layout--clear-page {

    background: linear-gradient(199.01deg, #27053d 0, #050506 72.26%);

}

.main-layout__shadow-circle {

    background: #ff3332;

    border-radius: 50%;

    filter: blur(250px);

    height: 625px;

    left: -180px;

    opacity: 0.08;

    position: fixed;

    top: 659px;

    width: 625px;

    z-index: 1;

}

.main-layout--landing {

    background: #050506;

}

@media screen and (min-width: 640px) {

    .main-layout--cookie .messenger-chats {

        bottom: 60px;

    }

    .main-layout--cookie .messenger-chat--expanded .content {

        max-height: calc(100vh - 160px);

    }

}

:root {

    --primary: #a2252d;

    --primary-light: #fa5365;

    --primary-dark: #912229;

    --primary-border: #d60908;

    --primary-modal: #af262f;

    --pwa-notification-height: 0px;

    --pwa-sticky-header-height: 0px;

    --tap-bar-height: 0px;

}

* {

    box-sizing: inherit;

}

::selection {

    background: #d60908;

    color: #fff;

}

html {

    background: #050506;

    box-sizing: border-box;

    min-height: 100vh;

}

html.disable-scroll {

    overflow: hidden;

    position: fixed;

    width: 100%;

}

html.scroll-lock--hard {

    overflow: hidden;

}

html.scroll-lock--hard > body {

    overflow: hidden;

    position: fixed;

}

html.scroll-lock--hard-mobile > body {

    position: fixed;

}

body {

    color: #fff;

    width: 100%;

}

li,

ul {

    padding: 0;

}

body,

li {

    margin: 0;

}

ul {

    list-style: none;

    margin-bottom: 0;

    margin-top: 1rem;

}

img {

    border: 0;

    vertical-align: middle;

}

button,

input,

select,

textarea {

    line-height: inherit;

    margin: 0;

    outline: 0;

}

textarea {

    font: 0.875rem "Rubik", Helvetica, "Roboto", "Arial", sans-serif;

    resize: vertical;

}

input::-webkit-inner-spin-button,

input::-webkit-outer-spin-button,

input[type="search"],

input[type="submit"] {

    -webkit-appearance: none;

    appearance: none;

}

input[type="number"] {

    -moz-appearance: textfield;

}

input::-webkit-inner-spin-button,

input::-webkit-outer-spin-button {

    margin: 0;

}

hr {

    border: 0;

    border-top: 0.0625rem solid rgba(0, 0, 0, 0.1);

    margin: 1rem 0;

}

.adsbox {

    bottom: 0;

    left: 0;

    position: fixed;

}

.invisible-block {

    visibility: hidden;

}



.mobile-show {

    display: none !important;

}

.profile-media-pills{



}

@media screen and (max-width: 1023px) {

    .mobile-hide {

        display: none !important;

    }

    .mobile-show {

        display: inline-flex !important;

    }  

    .fs {

        background: #0c0c0c!important;

    }      

    .user-media-content-sub-title{

        margin-left: 20px!important;

    }

    .profile-media-pills{

        margin-top: 15px!important;

        margin-right: 15px!important;

        margin-left: 15px!important;

    }

    .header-notifications {

        position: fixed!important;

        bottom: 60px!important;

        top: initial!important;

    } 



}

@media screen and (max-width: 639px) {

    .before-tablet-hide {

        display: none !important;

    }

}

@media screen and (max-width: 374px) {

    .before-phablet-hide {

        display: none !important;

    }

}

@media screen and (min-width: 1024px) {

    .desktop-hide {

        display: none !important;

    }

}

@media screen and (min-width: 640px) {

    .after-phone-hide {

        display: none !important;

    }

}

@media screen and (max-width: 639px) {

    .phone-hide {

        display: none !important;

    }

}

@media screen and (min-width: 480px) {

    .before-phone-hide {

        display: none !important;

    }

}

#body_loader {

    pointer-events: none;

    transition: opacity 0.5s;

    z-index: 10000;

}

.hide {

    display: none !important;

}

.footer-description {

    opacity: 0.4;

    padding: 0 30px 0 0;

}

.footer-description p:last-child {

    margin: 0;

}

.default-footer {

    background: #050506;

    color: #fff;

    padding: 0;

    position: relative;

    font-size: 0.75rem;

}

.default-footer__content {

    margin: 0 auto;

    max-width: 1400px;

    padding: 0 40px;

}

.default-footer .column {

    padding: 0.375rem 0.7rem 0.375rem 0;

}

.default-footer .column:last-child {

    padding-right: 0;

}

.default-footer .icon-agreement {

    opacity: 0.4;

}

@media screen and (max-width: 1023px) {

    .default-footer__content {

        padding: 0 16px;

    }

}

@media screen and (min-width: 640px) and (max-width: 1023px) {

    .default-footer .footer-section:nth-child(-n + 2) {

        margin-bottom: 20px;

    }

}

@media screen and (min-width: 480px) and (max-width: 639px) {

    .default-footer .column {

        padding: 0.375rem;

    }

    .default-footer .footer-address {

        flex-wrap: wrap;

    }

    .default-footer .footer-section:nth-child(-n + 2) {

        margin-bottom: 20px;

    }

    .default-footer .footer-left .footer-nav {

        margin: 10px 0 0;

        display: flex;

        flex-direction: row;

    }

    .default-footer .icon-agreement {

        display: none;

    }

}

@media screen and (max-width: 479px) {

    .default-footer .footer-description {

        padding: 0;

    }

    .default-footer .columns {

        margin: 0;

    }

    .default-footer .column {

        padding: 0.375rem 0;

    }

    .default-footer .footer-bottom {

        border-top: 1px solid rgba(255, 255, 255, 0.25);

        display: block;

        margin: 0;

        padding: 24px 0 0;

    }

    .default-footer .footer-address {

        margin: 16px 0 0;

    }

    .default-footer .footer-top {

        margin-bottom: 0;

    }

    .default-footer .footer-section:nth-child(-n + 2) {

        margin-bottom: 20px;

    }

    .default-footer .footer-additionally {

        border-bottom: 1px solid rgba(164, 164, 164, 0.2);

        border-top-width: 0;

        margin-top: 0;

    }

    .default-footer .footer-left .footer-nav {

        display: flex;

        margin: 10px 0;

        flex-direction: column;

    }

    .default-footer .icon-agreement {

        display: none;

    }

    .default-footer .footer-left .footer-nav .footer-section {

        width: 100%;

    }

}

.footer-top {

    margin-bottom: 0.375rem;

}

.footer-section-header {

    color: rgba(255, 255, 255, 0.6);

    margin: 0 0 8px;

}

.footer-social-link {

    vertical-align: middle;

    display: flex;

    flex-direction: row;

}

.footer-social-link .icon {

    fill: #a4a4a4;

    margin-right: 6px;

    margin-top: 1px;

}

.footer-social-link:hover .icon {

    fill: #d60908;

}

.footer-right {

    margin: -0.375rem 0;

}

.footer-right .footer-nav .footer-section:last-child {

    flex: 0;

}

.footer-address {

    justify-content: flex-end;

    margin-top: -3px;

    display: flex;

    flex-direction: row;

}

.footer-bottom,

.footer-logo {

    align-items: center;

    justify-content: space-between;

    display: flex;

    flex-direction: row;

}

.footer-bottom {

    border-top: 1px solid rgba(255, 255, 255, 0.1);

    margin: 0 0 4px;

    opacity: 0.4;

    padding: 20px 0 0;

}

.footer-logo {

    flex-wrap: wrap;

    margin: 0 0 24px;

}

.footer-logo__icon {

    background: url('../logo.png') no-repeat;

    background-size: contain;

    display: block;

    height: 34px;

    margin: 0 0 20px;

    opacity: 0.6;

    transition: opacity 0.3s;

    width: 146px;

}

.footer-logo__icon:hover {

    opacity: 1;

}

.footer-section__social {

    align-items: center;

    display: flex;

    margin: 20px 0;

}

.footer-section__social-item {

    margin: 0 18px 0 0;

}

.footer-section__social-item-icon {

    height: 18px;

    width: 18px;

}

.footer-section__link {

    color: #707071;

    transition: color 0.3s;

}

.footer-section__link--purple {

    color: #7f6e8c;

}

.footer-section__link:hover {

    color: #fff;

}

.footer-section-item {

    font-size: 0.813rem;

    line-height: 1.125rem;

    margin: 8px 0;

}

.footer-section-item .icon-myclub-logo {

    opacity: 0.6;

}

.footer-section-item__q-icon {

    margin: 0 0 0 4px;

    position: absolute;

}

.footer-section-item__tel {

    color: #fff;

    opacity: 0.4;

    transition: opacity 0.3s;

}

.footer-section-item__tel::before {

    content: "1-855-610-0599 ";

}

.footer-section-item__tel::after {

    content: "(USA Toll Free)";

    display: inline-block;

}

.footer-section-item__title {

    color: rgba(255, 255, 255, 0.4);

    margin-right: 4px;

    white-space: nowrap;

}

.footer-place::after {

    content: "Warmtech Ltd Spyrou Kyprianou 79, Protopapas Blg, flat 201, 3076, Limassol, Cyprus";

}

.btn {

    align-items: center;

    border: 1px solid transparent;

    border-radius: 12px;

    cursor: pointer;

    display: inline-flex;

    font-family: inherit;

    font-weight: 400;

    justify-content: center;

    outline: 0;

    overflow: hidden;

    padding: 0 20px;

    text-align: center;

    text-decoration: none;

    text-overflow: ellipsis;

    touch-action: manipulation;

    vertical-align: middle;

    white-space: nowrap;

    -webkit-user-select: none;

    user-select: none;

    font-size: 0.813rem;

    letter-spacing: 0.013rem;

    line-height: 1.813rem;

}

.btn.overflow-visible {

    overflow: visible;

}

.btn:active,

.btn:focus,

.btn:hover {

    text-decoration: none;

}

.btn:active {

    transform: translateY(1px);

}

.btn.disabled,

.btn:disabled {

    cursor: default;

    opacity: 0.33;

    pointer-events: none;

}

.btn--width--medium {

    width: 140px;

}

.btn--width--wide {

    width: 100%;

}

.btn__percent {

    display: inline-block;

    text-align: right;

    width: 3em;

}

.btn-extra-small {

    line-height: 19px;

}

.btn-small {

    line-height: 23px;

}

.btn-medium {

    height: 32px;

}

.btn-medium-x {

    height: 36px;

    line-height: 34px;

}

.btn-medium-xx {

    height: 38px;

    line-height: 36px;

    padding: 0 8px;

}

.btn-medium-xx-compact {

    align-items: center;

    display: flex;

    height: 38px;

    justify-content: center;

    min-width: 48px;

    padding: 0 6px;

    font-size: 1rem;

}

.btn-large-compact.disabled,

.btn-large-compact:disabled,

.btn-medium-xx-compact.disabled,

.btn-medium-xx-compact:disabled {

    opacity: 0.9;

}

.btn-large {

    height: 40px;

    line-height: 38px;

    font-size: 0.875rem;

}

.btn-large-compact {

    align-items: center;

    display: flex;

    height: 40px;

    justify-content: center;

    min-width: 44px;

    padding: 0 6px;

    font-size: 1rem;

}

.btn-block,

.btn-flex {

    display: block;

}

.btn-flex {

    align-items: center;

}

.btn-default {

    background: #343437;

    color: #fff;

    transition: background 250ms, color 250ms;

    border-color: transparent;

}

.btn-default > .icon {

    transition: fill 250ms, color 250ms;

}

.btn-default:hover {

    background: #424248;

    color: #fff;

}

.btn-default:active,

.btn-default:focus {

    background: #343437;

    color: #fff;

}

.btn-default .btn-loader-overlay {

    background-color: #343437;

    color: #fff;

}

.btn-default.hover,

.btn-default:hover {

    border-color: transparent;

}

.btn-default.active,

.btn-default.focus,

.btn-default:active,

.btn-default:focus {

    border-color: transparent;

}

.btn-dark {

    background: #111113;

    color: #fff;

    transition: background 250ms, color 250ms;

    border-color: transparent;

}

.btn-dark > .icon {

    transition: fill 250ms, color 250ms;

}

.btn-dark:hover {

    background: #232325;

    color: #fff;

}

.btn-dark:active,

.btn-dark:focus {

    background: #232325;

    color: #fff;

}

.btn-dark .btn-loader-overlay {

    background-color: #111113;

    color: #fff;

}

.btn-dark.hover,

.btn-dark:hover {

    border-color: transparent;

}

.btn-dark.active,

.btn-dark.focus,

.btn-dark:active,

.btn-dark:focus {

    border-color: transparent;

}

.btn-accept {

    background: #d9023c !important;

    color: #f1f1f1;

    transition: background 250ms, color 250ms;

}

.btn-accept > .icon {

    transition: fill 250ms, color 250ms;

}

.btn-accept:hover {

    background: #424248;

    color: #fff;

}

.btn-accept:active,

.btn-accept:focus {

    background: #9c2a32;

    color: #fff;

}

.btn-accept .btn-loader-overlay {

    background-color: #d9023c;

    color: #fff;

}

.btn-red-chat {

    background: rgba(210, 27, 76, 0.2);

    color: #d21b4c;

    transition: background 250ms, color 250ms;

}

.btn-red-chat > .icon {

    transition: fill 250ms, color 250ms;

}

.btn-red-chat:hover {

    background: rgba(210, 27, 76, 0.4);

    color: #d21b4c;

}

.btn-red-chat:active,

.btn-red-chat:focus {

    background: rgba(210, 27, 76, 0.4);

    color: #d21b4c;

}

.btn-red-chat .btn-loader-overlay {

    background-color: rgba(210, 27, 76, 0.2);

    color: #d21b4c;

}

.btn-green-chat {

    background: rgba(33, 176, 98, 0.2);

    color: #21b062;

    transition: background 250ms, color 250ms;

}

.btn-green-chat > .icon {

    transition: fill 250ms, color 250ms;

}

.btn-green-chat:hover {

    background: rgba(33, 176, 98, 0.4);

    color: #21b062;

}

.btn-green-chat:active,

.btn-green-chat:focus {

    background: rgba(33, 176, 98, 0.4);

    color: #21b062;

}

.btn-green-chat .btn-loader-overlay {

    background-color: rgba(33, 176, 98, 0.2);

    color: #21b062;

}

.btn-apply {

    background: #d60908;

    color: #fff;

    transition: background 250ms, color 250ms;

}

.btn-apply > .icon {

    transition: fill 250ms, color 250ms;

}

.btn-apply:hover {

    background: #e20707;

    color: #fff;

}

.btn-apply:active,

.btn-apply:focus {

    background: #ff3332;

    color: #fff;

}

.btn-apply .btn-loader-overlay {

    background-color: #d60908;

    color: #fff;

}

.btn-apply-outline {

    background: 0 0;

    border-color: #d60908;

    border-width: 2px;

    color: #fff;

    transition: background 250ms;

}

.btn-apply-outline:hover {

    background: #d60908;

    border-color: #d60908;

}

.btn-apply-primary {

    background: #34b353;

    color: #fff;

    transition: background 250ms, color 250ms;

}

.btn-apply-primary > .icon {

    transition: fill 250ms, color 250ms;

}

.btn-apply-primary:hover {

    background: #34c753;

    color: #fff;

}

.btn-apply-primary:active,

.btn-apply-primary:focus {

    background: #34c753;

    color: #fff;

}

.btn-apply-primary .btn-loader-overlay {

    background-color: #34b353;

    color: #fff;

}

.btn-light {

    background: rgba(255, 255, 255, 0.1);

    color: rgba(255, 255, 255, 0.6);

    transition: background 250ms, color 250ms;

    font-weight: 400;

}

.btn-light > .icon {

    transition: fill 250ms, color 250ms;

}

.btn-light:hover {

    background: rgba(255, 255, 255, 0.2);

    color: rgba(255, 255, 255, 0.8);

}

.btn-light:active,

.btn-light:focus {

    background: rgba(255, 255, 255, 0.2);

    color: rgba(255, 255, 255, 0.8);

}

.btn-light .btn-loader-overlay {

    background-color: rgba(255, 255, 255, 0.1);

    color: rgba(255, 255, 255, 0.8);

}

.btn-join {

    transition: background 250ms, color 250ms;

}

.btn-join > .icon {

    transition: fill 250ms, color 250ms;

}

.btn-join,

.btn-join:hover {

    background: #ff3332;

    color: #fff;

}

.btn-join:active,

.btn-join:focus {

    background: #ff3332;

    color: #fff;

}

.btn-join .btn-loader-overlay {

    background-color: #ff3332;

    color: #fff;

}

.btn-outline {

    background: 0 0;

    color: #fdfdfd;

    transition: background 250ms, color 250ms;

    border-color: rgba(255, 255, 255, 0.2);

}

.btn-outline > .icon {

    transition: fill 250ms, color 250ms;

}

.btn-outline:hover {

    background: #fff;

    color: #414141;

}

.btn-outline:active,

.btn-outline:focus {

    background: #fff;

    color: #414141;

}

.btn-outline .btn-loader-overlay {

    background-color: transparent;

    color: #414141;

}

.btn-outline.hover,

.btn-outline:hover {

    border-color: #fff;

}

.btn-outline.active,

.btn-outline.focus,

.btn-outline:active,

.btn-outline:focus {

    border-color: #fff;

}

.btn-outline-pale {

    background: 0 0;

    color: #fff;

    transition: background 250ms, color 250ms;

    border-color: #343437;

    border-width: 2px;

}

.btn-outline-pale > .icon {

    transition: fill 250ms, color 250ms;

}

.btn-outline-pale:hover {

    background: #424248;

    color: #fff;

}

.btn-outline-pale:active,

.btn-outline-pale:focus {

    background: #232325;

    color: #fff;

}

.btn-outline-pale .btn-loader-overlay {

    background-color: transparent;

    color: #fff;

}

.btn-outline-pale.hover,

.btn-outline-pale:hover {

    border-color: #424248;

}

.btn-outline-pale.active,

.btn-outline-pale.focus,

.btn-outline-pale:active,

.btn-outline-pale:focus {

    border-color: #232325;

}

.btn-signup {

    background: #f1f1f1;

    color: #d60908;

}

.btn-signup:active,

.btn-signup:focus,

.btn-signup:hover {

    opacity: 0.9;

}

.btn-signup .btn-loader-overlay {

    color: #1b1b1d;

}

.btn-goal {

    background: #fff;

    color: #21b062;

}

.btn-goal:active,

.btn-goal:focus,

.btn-goal:hover {

    background: rgba(255, 255, 255, 0.8);

}

.btn-goal .btn-loader-overlay {

    color: #21b062;

}

.btn-pale {

    background: 0 0;

    color: rgba(255, 255, 255, 0.6);

    transition: background 250ms, color 250ms;

    border-color: rgba(255, 255, 255, 0.3);

}

.btn-pale > .icon {

    transition: fill 250ms, color 250ms;

}

.btn-pale:hover {

    background: 0 0;

    color: rgba(255, 255, 255, 0.8);

}

.btn-pale:active,

.btn-pale:focus {

    background: 0 0;

    color: rgba(255, 255, 255, 0.8);

}

.btn-pale .btn-loader-overlay {

    background-color: transparent;

    color: rgba(255, 255, 255, 0.8);

}

.btn-pale.hover,

.btn-pale:hover {

    border-color: rgba(255, 255, 255, 0.6);

}

.btn-pale.active,

.btn-pale.focus,

.btn-pale:active,

.btn-pale:focus {

    border-color: rgba(255, 255, 255, 0.6);

}

.btn-telegram {

    background: #27a7e9;

    color: #fff;

    transition: background 250ms, color 250ms;

    border-width: 0;

}

.btn-telegram > .icon {

    transition: fill 250ms, color 250ms;

}

.btn-telegram:hover {

    background: #098fd4;

    color: #fff;

}

.btn-telegram:active,

.btn-telegram:focus {

    background: #119de6;

    color: #fff;

}

.btn-telegram .btn-loader-overlay {

    background-color: #27a7e9;

    color: #fff;

}

.btn-text {

    background: 0 0;

    color: rgba(255, 255, 255, 0.6);

    transition: background 250ms, color 250ms;

    padding: 0;

}

.btn-text > .icon {

    transition: fill 250ms, color 250ms;

}

.btn-text:hover {

    background: 0 0;

    color: rgba(255, 255, 255, 0.8);

}

.btn-text:active,

.btn-text:focus {

    background: 0 0;

    color: rgba(255, 255, 255, 0.8);

}

.btn-text .btn-loader-overlay {

    background-color: transparent;

    color: rgba(255, 255, 255, 0.8);

}

.btn-default-filled {

    background: rgba(255, 255, 255, 0.8);

    color: #000;

    transition: background 250ms, color 250ms;

}

.btn-default-filled > .icon {

    transition: fill 250ms, color 250ms;

}

.btn-default-filled:hover {

    background: rgba(255, 255, 255, 0.6);

    color: #000;

}

.btn-default-filled:active,

.btn-default-filled:focus {

    background: #fff;

    color: #000;

}

.btn-default-filled .btn-loader-overlay {

    background-color: rgba(255, 255, 255, 0.8);

    color: #000;

}

.btn-default-outline {

    background: 0 0;

    color: #fff;

    transition: background 250ms, color 250ms;

    border-color: #343437;

}

.btn-default-outline > .icon {

    transition: fill 250ms, color 250ms;

}

.btn-default-outline:hover {

    background: #000;

    color: #fff;

}

.btn-default-outline:active,

.btn-default-outline:focus {

    background: #343437;

    color: #fff;

}

.btn-default-outline .btn-loader-overlay {

    background-color: transparent;

    color: #fff;

}

.btn-default-outline.hover,

.btn-default-outline:hover {

    border-color: #424248;

}

.btn-default-outline.active,

.btn-default-outline.focus,

.btn-default-outline:active,

.btn-default-outline:focus {

    border-color: #343437;

}

.btn-second {

    background: 0 0;

    color: rgba(255, 255, 255, 0.8);

    transition: background 250ms, color 250ms;

    border-color: rgba(255, 255, 255, 0.4);

}

.btn-second > .icon {

    transition: fill 250ms, color 250ms;

}

.btn-second:hover {

    background: 0 0;

    color: #fff;

}

.btn-second:active,

.btn-second:focus {

    background: 0 0;

    color: #fff;

}

.btn-second .btn-loader-overlay {

    background-color: transparent;

    color: #fff;

}

.btn-second.hover,

.btn-second:hover {

    border-color: rgba(255, 255, 255, 0.6);

}

.btn-second.active,

.btn-second.focus,

.btn-second:active,

.btn-second:focus {

    border-color: #fff;

}

.btn-gray-ds {

    background: #424248;

    color: #fff;

    transition: background 250ms, color 250ms;

    border-width: 0;

}

.btn-gray-ds > .icon {

    transition: fill 250ms, color 250ms;

}

.btn-gray-ds:hover {

    background: #5f5f5f;

    color: #fff;

}

.btn-gray-ds:active,

.btn-gray-ds:focus {

    background: #525252;

    color: #fff;

}

.btn-gray-ds .btn-loader-overlay {

    background-color: #424248;

    color: #fff;

}

.btn-loading.btn-loading {

    color: transparent;

    opacity: 1;

    position: relative;

}

.btn-loading.btn-loading > svg {

    opacity: 0;

}

.btn-loader-overlay {

    align-items: center;

    display: flex;

    height: 100%;

    justify-content: center;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

}

.btn-dark-blue {

    background: #2a244b;

    color: #fff;

    transition: background 250ms, color 250ms;

}

.btn-dark-blue > .icon {

    transition: fill 250ms, color 250ms;

}

.btn-dark-blue:hover {

    background: #9e40fd;

    color: #fff;

}

.btn-dark-blue:active,

.btn-dark-blue:focus {

    background: #ff3332;

    color: #fff;

}

.btn-dark-blue .btn-loader-overlay {

    background-color: #2a244b;

    color: #fff;

}

.pwa-install-notification {

    align-items: center;

    animation: opacity-fade-show 0.5s;

    background: #232325;

    display: flex;

    left: 0;

    padding: 10px 15px;

    position: fixed;

    right: 0;

    top: 0;

    z-index: 105;

}

.pwa-install-notification .btn {

    margin-bottom: 0;

    margin-left: 10px;

    padding: 0 12px;

    flex: 1;

    flex-basis: auto;

    flex-grow: 0;

    flex-shrink: 0;

}

.pwa-install-notification .close-button {

    background: 0 0;

    border: 0;

    color: #fff;

    cursor: pointer;

    margin: 0 11px 0 0;

    opacity: 0.5;

    padding: 4px;

}

.pwa-install-notification-title {

    color: #fff;

    font-weight: 700;

    font-size: 0.875rem;

}

.pwa-install-notification-description {

    color: #fff;

    margin-top: 4px;

    opacity: 0.8;

    font-size: 0.75rem;

    line-height: 1.063rem;

}

.pwa-install-notification-body {

    justify-content: space-between;

    flex: 1;

    flex-basis: auto;

    flex-grow: 1;

    flex-shrink: 1;

}

.pwa-install-notification-body,

.pwa-install-notification-content,

.pwa-install-notification-logo {

    align-items: center;

    display: flex;

    flex-direction: row;

}

.pwa-install-notification-logo {

    height: 48px;

    justify-content: center;

    margin-right: 10px;

    width: 48px;

    flex: 1;

    flex-basis: auto;

    flex-grow: 0;

    flex-shrink: 0;

}

.pwa-install-notification-logo.transparent {

    background: 0 0;

}

.pwa-install-notification-logo img,

.pwa-install-popup-logo img {

    height: 100%;

    width: 100%;

}

.post-page {

    column-gap: 20px;

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    margin: 0 auto;

    position: relative;

}

.post-page__post {

    width: 642px;

}

.post-page__comments {

    max-width: 100%;

    position: relative;

    width: 300px;

}

.post-page .comments-gallery {

    height: 100%;

}

.post-page .comments-gallery__wrapper {

    border-radius: 16px;

    height: 100%;

}

.post-page .comments-gallery__count {

    border-top: 0;

}

@media screen and (max-width: 1279px) {

    .post-page .comments-gallery__wrapper {

        position: relative;

    }

    .post-page__comments {

        width: 642px;

    }

}

@media screen and (max-width: 639px) {

    .post-page {

        margin: 0-16px;

    }

}

.signup-page {

    max-width: 320px;

}

.landing-webcam-page__wrapper {

    align-items: center;

    display: flex;

    min-height: 100vh;

    width: 100%;

}

.landing-webcam-page__info {

    flex: 1;

    margin: 0 130px 0 0;

    padding: 10px 0 0;

}

.landing-webcam-page__animation--move-left {

    animation: landing-opacity-move-left-delay 0.6s;

}

.landing-webcam-page__animation--fade-in {

    animation: landing-opacity-zoom-fade-show-delay 1s;

}

.landing-webcam-page__title {

    font-size: 40px;

    font-weight: 500;

    line-height: 46px;

    margin: 22px 0 0;

}

.landing-webcam-page__description {

    color: #a0a0a1;

    font-size: 16px;

    line-height: 24px;

    margin: 20px 0 0;

}

.landing-webcam-page__benefit-list {

    font-size: 18px;

    font-weight: 400;

    line-height: 20px;

    margin: 58px 0 20px;

}

.landing-webcam-page__benefit {

    color: #a0a0a1;

    margin: 22px 0;

    padding: 0 0 0 44px;

    position: relative;

}

.landing-webcam-page__benefit-icon {

    color: #ff3332;

    left: 0;

    position: absolute;

    top: 0;

}

.landing-webcam-page__content {

    align-items: center;

    display: flex;

    justify-content: space-between;

    margin: 0 auto;

    max-width: 1280px;

    padding: 20px 40px;

    width: 100%;

}

.landing-webcam-page__right {

    display: flex;

    justify-content: center;

}

.landing-webcam-page__form {

    max-width: 100%;

    width: 384px;

}

@media screen and (max-width: 1023px) {

    .landing-webcam-page__info {

        margin: 80px 0 0;

        padding: 0;

    }

    .landing-webcam-page__content {

        display: block;

        padding: 0 24px 20px;

    }

    .landing-webcam-page__title {

        font-size: 32px;

        font-weight: 700;

        line-height: 39px;

    }

    .landing-webcam-page__right {

        margin: 20px 0 0;

    }

}

@media screen and (max-width: 479px) {

    .landing-webcam-page__logo {

        width: 222px;

    }

    .landing-webcam-page__title {

        margin: 0;

    }

    .landing-webcam-page__description {

        font-size: 14px;

        line-height: 24px;

    }

}

@media screen and (max-width: 320px) {

    .landing-webcam-page__content {

        padding: 20px 10px;

    }

}

.confirm-email-page {

    margin-bottom: 100px;

    margin-top: 100px;

    max-width: 600px;

    padding-bottom: 0;

    text-align: center;

}

.confirm-email-page .confirm-email-description {

    line-height: 34px;

    margin-bottom: 30px;

    margin-top: 25px;

    font-size: 1.75rem;

}

.confirm-email-page .confirm-email-actions {

    margin-top: 10px;

}

.confirm-email-page .confirm-email-actions > .btn {

    padding: 0 30px;

}

.confirm-email-page .icon-wrong {

    fill: #eab744;

}

.confirm-email-page .icon-error {

    fill: #fa7055;

}

@media screen and (max-width: 480px) {

    .confirm-email-page {

        margin-bottom: 20px;

        margin-top: 20px;

    }

}

.unsubscribe-page {

    display: flex;

    flex-direction: column;

}

.unsubscribe-page .header {

    font-weight: 700;

    margin: 20px;

    font-size: 1.25rem;

    line-height: 1.375rem;

}

.unsubscribe-page .description {

    margin-bottom: 10px;

    font-size: 0.813rem;

    line-height: 1rem;

}

.unsubscribe-page .subscription {

    font-weight: 700;

    margin-bottom: 32px;

    font-size: 0.938rem;

    line-height: 1.125rem;

}

.unsubscribe-page .subscription.font-weight-normal {

    font-weight: 400;

}

.unsubscribe-page .btn {

    margin-bottom: 32px;

}

.unsubscribe-page .footer {

    align-self: center;

    border-top: 1px solid rgba(255, 255, 255, 0.12);

    color: rgba(255, 255, 255, 0.8);

    padding: 20px 40px;

    font-size: 0.75rem;

    line-height: 0.875rem;

}

.unsubscribe-page .footer .btn {

    margin-top: 20px;

}

.subscriptions-page__navigation {

    align-items: center;

    display: flex;

    flex-wrap: nowrap;

    gap: 48px;

    justify-content: flex-start;

}

.subscriptions-page__link {

    font-size: 32px;

    font-weight: 700;

}

.subscriptions-page__link--active {

    color: #fff;

}

.subscriptions-page__link-icon {

    margin-right: 20px;

}

.user-photo-upload-menu-modal__content {

    max-width: 100%;

    width: 500px;

}

.user-photo-upload-menu-modal__camera {

    display: flex;

    max-width: 100%;

    min-height: min(380px, 50vh);

    padding: 20px;

    width: 500px;

}

.user-photo-upload-menu-modal__title {

    font-size: 16px;

    font-weight: 500;

}

.user-photo-upload-menu-modal .error {

    background-color: #603838;

    color: #fff;

    padding: 10px;

    text-align: center;

}

.user-photo-upload-menu-modal .divider {

    background-color: rgba(248, 248, 248, 0.05);

    height: 2px;

    margin: 24px 0;

    width: 100%;

}

.user-photo-upload-menu-modal .footer {

    display: flex;

    flex-direction: row-reverse;

    justify-content: space-between;

}

.user-photo-upload-menu-modal .limits-description {

    color: #bfbfbf;

    left: 0;

    margin-top: 10px;

    position: absolute;

    right: 0;

    text-align: center;

    top: 100%;

    font-size: 0.75rem;

}

@media screen and (max-width: 479px) {

    .user-photo-upload-menu-modal .cA {

        font-size: 1.125rem;

        line-height: 1.375rem;

    }

    .user-photo-upload-menu-modal .panes {

        margin-top: 20px;

    }

    .user-photo-upload-menu-modal .panes .pane {

        padding: 22.5px 0;

    }

    .user-photo-upload-menu-modal .divider {

        height: 1px;

        margin: 20px 0;

    }

}

.panes {

    margin-top: 24px;

    overflow: hidden;

    text-align: center;

    border-radius: 4px;

}

.panes > .pane {

    align-items: center;

    background-color: #424248;

    background-size: cover;

    border-radius: 12px;

    color: #fff;

    cursor: pointer;

    display: flex;

    flex-direction: column;

    justify-content: center;

    margin: 0 10px;

    min-width: calc(50% - 0.75rem);

    padding: 42.5px 0;

    position: relative;

    width: 100%;

}

.panes > .pane.is-pending > :not(.loader) {

    opacity: 0.33;

    pointer-events: none;

}

.panes > .pane:first-child {

    margin-left: 0;

}

.panes > .pane:last-child {

    margin-right: 0;

}

.panes > .pane > .pane-icon {

    display: flex;

    flex-direction: row;

    margin-bottom: 10px;

}

.panes > .pane > .pane-icon > svg {

    fill: #ccc;

    height: 32px;

    margin: 0;

    width: auto;

}

.panes > .pane > input[type="file"] {

    display: none;

}

.header-top,

.header-top .container {

    display: flex;

    width: 100%;

    max-width: 1480px;

    margin: 0 auto;    

}

.header-top {

    background: #050506;

    box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.15);

    height: 56px;

    left: 0;

    position: fixed;

    right: 0;

    top: var(--pwa-notification-height);

    transition: top 0.3s;

    z-index: 105;

    flex-direction: row;

}

.header-top--hidden {

    top: calc(-56px + var(--pwa-notification-height));

}

@media screen and (max-width: 479px) {

    .header-top-logo {

        margin-left: 1.125rem;

    }

}

.header-top__story {

    position: absolute;

    right: 24px;

    top: 80px;

    z-index: 1;

}

.header-top__back {

    align-items: center;

    background: #232325;

    border-radius: 50%;

    color: #a0a0a1;

    cursor: pointer;

    display: flex;

    height: 24px;

    justify-content: center;

    margin: 0 6px 0 16px;

    min-width: 24px;

    width: 24px;

}

.header-top .container {

    align-items: center;

    justify-content: space-between;

    margin: 0 auto;

    position: relative;

}

.header-top .container .dropdown-link.active {

    background-color: #1b1b1d;

}

.header-top .container .dropdown-link:hover,

.header-top .container .nav-link:hover a {



    color: #fff;

    border-radius: 10px;

}

.header-top .container .dropdown-link.active,

.header-top .container .link.active,

.header-top .container .nav-link .active {

    color: #fff;

}

.header-top .container .accent {

    font-weight: 700;

}

.header-top .container .icon-dot {

    fill: #9fe20d;

    margin-right: 7px;

}

.header-top .container .icon-best-models {

    margin-right: 8px;

}

.header-top .container .icon-menu {

    margin: 0;

}

@media screen and (max-width: 1599px) {

    .header-top .container nav.nav-right {

        padding-right: 0;

    }

}

.header-top .icon-dot {

    height: 9px;

    width: 9px;

}

@media screen and (max-width: 479px) {

    .header-top .container {

        padding: 0;

    }

    .header-top .container nav.nav-left,

    .header-top .container nav.nav-right {

        flex: 1 1 50%;

    }

}

@media screen and (min-width: 1024px) {

    .header-top--hidden {

        top: 0;

    }

}

.header-top__create-menu {

    left: 0;

    margin-top: 20px;

    position: absolute;

    top: 100%;

}

@media screen and (max-width: 1023px) {

    .header-top__create-menu {

        left: 50%;

        margin: 0;

        position: fixed;

        top: calc(56px + var(--pwa-notification-height));

        transform: translateX(-50%);

    }

}

.header-top__create-post-button-wrapper {

    margin: 0 16px 0 32px;

    position: relative;

}

.header-top .header-top__create-post-button {

    font-size: 15px;

    font-weight: 400;

    padding: 0 16px;

}

.header-top .header-top__create-post-button .create-post-button__title {

    display: none;

}

@media screen and (min-width: 1024px) {

    .header-top .header-top__create-post-button .create-post-button__title {

        display: inline;

        margin-left: 12px;

    }

}

@media screen and (max-width: 1023px) {

    .header-top .header-top__create-post-button {

        border-radius: 6px;

        height: 24px;

        padding: 0;

        width: 24px;

    }

}

@media screen and (max-width: 479px) {

    .header-top .header-user-menu {

        max-width: 56px;

        width: 56px;

    }

    .header-top .header-user-menu--guest {

        margin-right: 0;

        max-width: none;

        width: auto;

    }

}

.main-layout__wrapper > header {

    height: 56px;

    min-height: 56px;

}

.nav-left {

    flex: 0;

    position: relative;

    z-index: 2;

}

.nav-right {

    justify-content: flex-end;

    z-index: 2;

}

.nav-left,

.nav-right {

    align-items: center;

    align-self: stretch;

    display: flex;

    flex-direction: row;

}

.header-user-menu {

    align-items: center;

    display: flex;

    justify-content: flex-end;

    margin-left: 0;

    width: 68px;

}

.header-user-menu--guest {

    margin: 0 20px;

    width: auto;

}

.nav-center {

    display: flex;

    justify-content: flex-start;

    margin: 0 0 0 192px;

    padding: 0 190px 0 0;

    position: absolute;

}

@media screen and (min-width: 1280px) {

    .nav-center {

        padding: 0;

    }

}

.top-menu__link {

    align-items: center;

    color: #cfcfd0;

    display: inline-flex;

    font-size: 15px;

    height: 56px;

    margin: 0 16px;

    position: relative;

}

.top-menu__link--split {

    margin-left: 32px;

}

.top-menu__link--split::after {

    background: rgba(255, 255, 255, 0.1);

    bottom: 12px;

    content: "";

    left: -24px;

    position: absolute;

    top: 12px;

    width: 1px;

}

.top-menu__link:hover {

    color: #fff;

}

.top-menu__link.active::before {

    background: var(--primary-border);

    bottom: 0;

    content: "";

    height: 3px;

    left: 0;

    position: absolute;

    width: 100%;

}

.top-menu__gift-icon {

    margin: 0 8px 0 0;

}

.lazy-component-error {

    color: #f44;

    padding: 10px;

    text-align: center;

    transition: all 120msms ease-in-out 0s;

    left: 50%;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

}

.account-disabled-page {

    max-width: 360px;

    padding: 70px 0;

    text-align: center;

}

.account-disabled-page .icon-account-disabled,

.account-disabled-page .icon-mail-filled {

    color: #d8d8d8;

    margin: 20px;

}

.account-disabled-page .account-disabled-header {

    color: #fff;

    font-weight: 500;

    line-height: 34px;

    margin-bottom: 10px;

    font-size: 1.75rem;

}

.account-disabled-page .account-disabled-description {

    color: #8d8d8d;

    line-height: 20px;

    margin-bottom: 30px;

    font-size: 0.875rem;

}

.account-disabled-page.model-deleted-page {

    max-width: inherit;

}

.account-disabled-page.model-deleted-page .deleted-wrapper {

    align-items: center;

    display: flex;

    flex-direction: column;

    padding-bottom: 55px;

}

@media screen and (max-width: 480px) {

    .account-disabled-page {

        max-width: 320px;

    }

    .account-disabled-page .btn {

        margin-bottom: 10px;

        margin-right: 0;

    }

}

.icon {

    pointer-events: none;

    vertical-align: middle;

}

.icon--default-size {

    height: 1rem;

    width: 1rem;

}

.icon--top-2 {

    position: relative;

    top: -2px;

}

.icon__back {

    align-items: center;

    background: #343437;

    border: 0;

    border-radius: 50%;

    color: #fff;

    cursor: pointer;

    display: flex;

    height: 24px;

    justify-content: center;

    min-width: 24px;

    padding: 0 2px 0 0;

    width: 24px;

}

.icon__back--space--regular {

    margin: 0 16px 0 0;

}

.icon__back--space--big {

    margin: 0 22px 0 0;

}

.verification-icon-shadow {

    background: radial-gradient(50% 50%at 50% 50%, rgba(81, 53, 255, 0.2) 0, rgba(27, 27, 29, 0) 100%);

    border-radius: 50%;

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    transform: scale(3);

    width: 100%;

}

.cj--mobile,

.cj__root > body {

    overscroll-behavior-x: none;

    overscroll-behavior-y: none;

}

.cj__root--mobile > body {

    position: fixed;

}

.cj--mobile {

    background: #000;

    bottom: 0;

    left: 0;

    position: fixed;

    top: 0;

    width: 100%;

    z-index: 500;

}

.cj--mobile .video-player--playing .video-player__play {

    display: none;

}

.cj--mobile .video-player__video {

    background: 0 0;

    opacity: 1;

    pointer-events: auto;

}

.cj--mobile .cj__comments {

    animation: move-bottom-right 0.25s;

    background: rgba(0, 0, 0, 0.2);

}

.cj--mobile .image-swiper__points {

    align-items: center;

    background: rgba(0, 0, 0, 0.6);

    border: 2px solid rgba(255, 255, 255, 0.1);

    border-radius: 16px;

    bottom: 100%;

    height: 32px;

    justify-content: center;

    left: 50%;

    padding: 0 16px;

    transform: translateX(-50%);

    width: auto;

}

.cj--mobile-vertical .image-swiper__points,

.select .native-select > option {

    opacity: 0;

}

.cj__vertical-single-row {

    background-position: center;

    background-repeat: no-repeat;

    background-size: contain;

    contain: strict;

    height: inherit;

    overflow: hidden;

    position: relative;

    width: 100%;

}

.cj__root-showing.media-gallery__root {

    overflow: initial;

}

.cj__root-showing.media-gallery__root > body,

.de__root-showing > body {

    overflow: initial;

    position: initial;

}

.cj__comments,

.cj__user-tags {

    bottom: 0;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 1;

}

.cj__vertical-controls {

    bottom: 38px;

    display: flex;

    flex-direction: column;

    gap: 4px;

    position: absolute;

    right: 8px;

    z-index: 10;

}

.cj__vertical-controls--video {

    bottom: 82px;

}

.cj__vertical-controls .tile-button {

    background: 0 0;

    color: #fff;

    flex-direction: column;

    height: auto;

    min-width: 40px;

    padding: 6px 8px;

}

.cj__vertical-controls .tile-button:hover {

    background: 0 0;

}

.cj__vertical-controls .tile-button::before {

    background: radial-gradient(50% 50%at 50% 50%, rgba(0, 0, 0, 0.1) 0, transparent 100%);

    border-radius: 50%;

    content: "";

    height: 64px;

    position: absolute;

    top: 0;

    width: 64px;

    z-index: -1;

}

.cj__vertical-controls .tile-button .tile-button__text {

    font-size: 10px;

    font-weight: 500;

    margin: 2px 0 0;

    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);

}

.cj__vertical-controls .tile-button__count,

.pwa-install-popup-steps ul {

    margin: 0;

}

.cj__controls {

    display: flex;

}

.cj__vertical-controls,

.cj__vertical-user {

    opacity: 0;

    pointer-events: none;

}

.cj__stub-model-end {

    align-items: center;

    display: flex;

    flex-direction: column;

    gap: 20px;

    height: 100%;

    justify-content: center;

    text-align: center;

}

.cj__arrow-thumb {

    align-items: center;

    background: #232325;

    display: flex;

    flex: 1;

    height: 100%;

    justify-content: center;

    transition: background 0.3s;

}

.cj__arrow-thumb--prev {

    transform: rotate(180deg);

}

.cj__arrow-thumb:hover {

    background: #343437;

}

.cj__toast-flash {

    align-items: center;

    display: flex;

    gap: 18px;

}

.cj__toast-flash-text {

    color: #cfcfd0;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.cj__user-vertical {

    bottom: 84px;

    left: 16px;

    position: absolute;

    z-index: 2;

}

.cj__icon-album {

    display: block;

    height: 32px;

    width: 32px;

}

.cj--aside-panel .media-gallery--mobile-portrait .media-gallery__close,

.cj--aside-panel .media-gallery--mobile-portrait .media-gallery__info {

    display: none;

}

.cj__lock {

    align-items: center;

    background: linear-gradient(246.82deg, #3c185e 0, #100415 100%);

    color: #fff;

    display: flex;

    height: 100%;

    justify-content: center;

    width: 100%;

}

.cj__user {

    bottom: 86px;

    left: 20px;

    position: fixed;

    z-index: 4;

}

.cj__user-card {

    align-items: center;

    column-gap: 14px;

    display: flex;

    position: relative;

}

.cj__top-shadow {

    background: linear-gradient(180deg, rgba(0, 0, 0, 0.6) 0, transparent 100%);

    height: 64px;

    left: 0;

    pointer-events: none;

    position: fixed;

    right: 0;

    top: 0;

}

.cj__vertical-viewer-close {

    align-items: center;

    color: rgba(255, 255, 255, 0.6);

    display: flex;

    height: 48px;

    justify-content: center;

    position: fixed;

    right: 0;

    top: 0;

    width: 48px;

    z-index: 1;

}

.cj__vertical-viewer-controls {

    opacity: 0;

    pointer-events: none;

    position: absolute;

    z-index: 2;

}

.cj--controls-visible .image-swiper__points,

.cj--controls-visible .cj__controls,

.cj--controls-visible .cj__vertical-controls,

.cj--controls-visible .cj__vertical-user,

.cj--controls-visible .cj__vertical-viewer-controls,

.cj--controls-visible .video-player__controls,

.cj--controls-visible .video-player__play {

    opacity: 1;

    pointer-events: auto;

}

.cj__vertical-user {

    background: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, 0.6) 100%);

    bottom: 0;

    display: flex;

    flex-direction: column;

    gap: 10px;

    left: 0;

    padding: 20px 66px 42px 16px;

    position: absolute;

    right: 0;

    z-index: 2;

}

.cj__vertical-user--video {

    background: 0 0;

    bottom: 78px;

    padding-bottom: 0;

}

.cj__vertical-user-top {

    align-items: center;

    display: flex;

    gap: 20px;

}

.cj__vertical-user-follow {

    align-items: center;

    background: 0 0;

    border: 2px solid rgba(255, 255, 255, 0.8);

    border-radius: 8px;

    color: #fff;

    cursor: pointer;

    display: inline-flex;

    font-size: 12px;

    font-weight: 500;

    height: 24px;

    padding: 0 10px;

    white-space: nowrap;

}

.cj__vertical-user-follow--active {

    background: #fff;

    border-color: #fff;

    color: #000;

}

.cj__vertical-user-follow--joined {

    pointer-events: none;

}

.cj__vertical-user-follow--join-paid {

    background: #d60908;

    border-color: #d60908;

    color: #fff;

}

.cj__vertical-user-album {

    align-items: center;

    color: #cfcfd0;

    display: flex;

    gap: 4px;

    max-width: 70vw;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.cj__vertical-user-body {

    -webkit-box-orient: vertical;

    color: #e7e7e7;

    display: -webkit-box;

    font-size: 14px;

    font-weight: 400;

    -webkit-line-clamp: 2;

    max-width: 340px;

    overflow: hidden;

    word-break: break-all;

}

.cj__vertical-user-hashtag {

    color: #fff;

    font-weight: 500;

    line-height: 140%;

    word-break: normal;

}

.cj__on-boarding {

    align-items: center;

    background: rgba(0, 0, 0, 0.7);

    bottom: 0;

    display: flex;

    font-size: 18px;

    font-weight: 400;

    justify-content: center;

    line-height: 27px;

    position: fixed;

    top: 0;

    width: 100%;

    z-index: 20;

}

.cj__on-boarding-icon {

    color: #a0a0a1;

}

.cj__on-boarding-icon--left {

    transform: rotate(180deg);

}

.cj__on-boarding-icon--top {

    transform: rotate(-90deg);

}

.cj__on-boarding-icon--bottom {

    transform: rotate(90deg);

}

.cj__on-boarding-bottom {

    bottom: 56px;

    position: absolute;

    right: 16px;

    text-align: right;

}

.cj__on-boarding-center {

    text-align: center;

}

.cj__on-boarding-center-text {

    align-items: center;

    display: flex;

    gap: 20px;

    justify-content: space-between;

    margin: 0 0 20px;

}

.cj__on-boarding-top {

    align-items: flex-end;

    display: flex;

    flex-direction: column;

    gap: 10px;

    position: absolute;

    right: 48px;

    text-align: right;

    top: 80px;

}

.cj__on-boarding-bold {

    display: block;

    font-weight: 700;

}

.media-gallery--desktop .cj__comments {

    animation: move-from-right 0.25s;

}

.media-gallery--desktop .comments-gallery__wrapper {

    border-radius: 16px;

    height: 100%;

}

.media-gallery--desktop .comments-gallery__close {

    display: none;

}

.media-gallery--desktop .tile-button {

    margin: 0 0 0 12px;

}

.media-gallery--desktop .cj__user {

    bottom: auto;

    left: 24px;

    top: 30px;

}

.media-gallery--mobile-portrait .comments-gallery__footer {

    padding-bottom: max(12px, env(safe-area-inset-bottom));

}

.media-gallery--mobile-portrait .cj__comments,

.media-gallery--mobile-portrait .cj__user-tags {

    animation: move-bottom-right 0.25s;

}

.media-gallery--mobile-portrait .cj__user {

    bottom: 75px;

    left: 10px;

    position: fixed;

    top: auto;

    z-index: 4;

}

.media-gallery--mobile-portrait .cj__user--video {

    bottom: 140px;

}

.media-gallery--mobile-portrait .cj__controls {

    flex: 1;

    justify-content: space-between;

    left: -2px;

    position: relative;

}

.media-gallery--mobile-portrait .tile-button {

    background: 0 0;

    border-radius: 0;

    font-weight: 700;

    height: 36px;

    padding: 0 8px;

}

.media-gallery--mobile-portrait .tile-button:hover {

    background: 0 0;

}

.media-gallery--mobile-portrait .tile-button__text {

    display: none;

}

.media-gallery--mobile-portrait .tile-button__count {

    margin: 0 0 0 6px;

}

.cj--has-title .media-gallery--mobile-portrait .cj__user {

    bottom: 130px;

}

.media-gallery--mobile-landscape .cj__user {

    left: 10px;

    position: fixed;

    z-index: 4;

}

.media-gallery--mobile-landscape .cj__controls {

    filter: drop-shadow(0 0 4px rgba(0, 0, 0, 0.8));

    flex-direction: column;

    height: 100%;

    justify-content: center;

}

.media-gallery--mobile-landscape .tile-button {

    background: 0 0;

    border-radius: 0;

    color: #fff;

    flex-direction: row-reverse;

    font-weight: 700;

    height: 36px;

    padding: 0 8px;

}

.media-gallery--mobile-landscape .tile-button__count {

    margin: 0 6px 0 0;

}

.media-gallery--mobile-landscape .tile-button__text {

    display: none;

}

.dd {

    align-items: center;

    background: #232325;

    bottom: 0;

    color: rgba(255, 255, 255, 0.8);

    display: flex;

    justify-content: center;

    left: 0;

    min-height: 60px;

    padding: 10px 12px;

    position: fixed;

    width: 100%;

    z-index: 11;

    font-size: 0.813rem;

    line-height: 1.125rem;

}

.dd__icon-cookie {

    flex-shrink: 0;

}

.dd__description {

    line-height: normal;

    margin: 0 12px 0 15px;

}

@media screen and (max-width: 639px) {

    .dd__description {

        font-size: 11px;

    }

}

@media screen and (max-width: 479px) {

    .dd__description {

        font-size: 10px;

    }

}

@media screen and (max-width: 320px) {

    .dd__description {

        font-size: 9px;

    }

}

.dd__learn-more {

    color: #fff;

    opacity: 1;

}

@media (max-width: 479px) {

    .dd {

        bottom: 60px;

    }

}

.pwa-install-popup-wrapper {

    background: rgba(0, 0, 0, 0.8);

    height: 100%;

    left: 0;

    position: fixed;

    top: 0;

    width: 100vw;

    z-index: 210;

}

.pwa-install-popup {

    background-color: #3b3b3b;

    border-radius: 12px;

    bottom: 20px;

    color: #fff;

    left: 50%;

    max-width: 290px;

    padding: 38px 24px 20px;

    pointer-events: all;

    position: fixed;

    transform: translateX(-50%);

    width: 100%;

    z-index: 500;

}

.pwa-install-popup::before {

    border-style: solid;

    border-color: #3b3b3b transparent transparent;

    border-width: 8px 8px 0;

    content: "";

    height: 0;

    left: calc(50% - 8px);

    position: absolute;

    top: 100%;

    width: 0;

}

.pwa-install-popup .close-button {

    color: #f8f8f8;

    margin-right: 15px;

    opacity: 0.5;

    position: absolute;

    right: 0;

    top: 10px;

}

.pwa-install-popup .close-button .icon {

    fill: #f8f8f8;

    margin: 0;

}

.pwa-install-popup-title {

    font-weight: 700;

    margin: 8px 0;

    font-size: 1rem;

    line-height: 1.125rem;

}

.pwa-install-popup-description {

    margin: 8px 0;

    opacity: 0.6;

    font-size: 0.813rem;

    line-height: 1rem;

}

.pwa-install-popup-steps {

    font-size: 0.75rem;

    line-height: 1rem;

}

.pwa-install-popup-steps li {

    align-items: center;

    display: flex;

    padding: 8px 0;

}

.pwa-install-popup-steps .icon {

    color: #fff;

    fill: #fff;

    margin-left: 5px;

    margin-top: -5px;

}

.pwa-install-popup-logo {

    align-items: center;

    background: 0 0;

    border-radius: 13px;

    box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);

    height: 48px;

    justify-content: center;

    position: absolute;

    top: 0;

    transform: translateY(-40%);

    width: 48px;

    flex: 1;

    flex-basis: auto;

    flex-grow: 0;

    flex-shrink: 0;

    display: flex;

    flex-direction: row;

}

.pwa-install-popup-logo .icon {

    margin: 0;

}

.toast-notifications {

    bottom: 16px;

    right: 12px;

    position: fixed;

    width: 362px;

    z-index: 1001;

}

@media screen and (max-width: 424px) {

    .toast-notifications {

        bottom: 20px;

        left: 16px;

        max-width: calc(100vw - 32px);

    }

}

.da {

    background: #111113;

    bottom: 0;

    left: 0;

    position: fixed;

    right: 0;

    z-index: 210;

}

.da--purple {

    background: #0d0711;

}

.da__navigation {

    align-items: center;

    color: #a0a0a1;

    display: flex;

    font-size: 11px;

    height: var(--tap-bar-height);

    justify-content: space-around;

    width: 100%;

}

.da__container {

    padding-bottom: env(safe-area-inset-bottom);

    transition: all 150ms linear;

}

.da__menu-item-button {

    background: 0 0;

    border: 0;

    font-size: inherit;

}

.da__create-post-button,

.da__menu-item-button {

    align-items: center;

    color: inherit;

    display: flex;

    flex: 1;

    flex-direction: column;

    padding: 0 8px;

    position: relative;

    transition: color 100ms linear;

    white-space: nowrap;

}

.da__create-post-button--active,

.da__create-post-button.active,

.da__create-post-button:active,

.da__menu-item-button--active,

.da__menu-item-button.active,

.da__menu-item-button:active {

    color: #fff;

}

.da__create-post-button--has-unread-notifications::after,

.da__menu-item-button--has-unread-notifications::after {

    background-color: #e12947;

    border: 3px solid #111113;

    border-radius: 10px;

    content: "";

    height: 10px;

    position: absolute;

    right: 18px;

    top: -6px;

    width: 10px;

}

/* changes made 1908 */

.has-unread-msg {

    background-color: #fb0000f7;

    border-radius: 15px;

    font-size: 0.6rem;

    line-height: 15px;

    text-align: center;

    height: 15px;

    position: absolute;

    right: 30%;

    top: 9px;

    width: 15px;

}





.da__create-post-menu {

    bottom: var(--tap-bar-height);

    left: 50%;

    margin: 0 0 10px;

    position: fixed;

    transform: translateX(-50%);

}

.da__create-post-button {

    background: 0 0;

    border: 0;

    font-size: 11px;

}

.da__icon-outline {

    background: 0 0;

    border: 2px solid #d60908;

    border-radius: 6px;

    display: grid;

    height: 24px;

    margin-bottom: 4px;

    place-items: center;

    width: 24px;

}

.da__menu-item-icon {

    height: 20px;

    margin-bottom: 4px;

    width: 20px;

}

.db {

    left: 0;

    pointer-events: none;

    position: fixed;

    right: 0;

    text-align: center;

    top: 0;

    width: 100%;

    z-index: 1001;

}

.db__content {

    animation: toast-flash-show 0.2s ease-in-out;

    background: #1b1b1d;

    border-radius: 20px;

    display: inline-block;

    margin: 0 auto;

    max-width: min(100vw - 32px, 400px);

    overflow: hidden;

    padding: 12px 18px;

    transform: translateY(64px);

}

.dc {

    color: #a0a0a1;

}

.dc .recaptcha {

    display: flex;

    justify-content: center;

    margin: 20px auto 0;

}

.user-feed-page__header {

    margin: 0 auto;

    max-width: calc(100vw - 32px);

    width: 642px;

}

.confirmation-modal-controls {

    display: flex;

    gap: 20px;

    justify-content: flex-end;

}

.confirmation-modal-description {

    color: #cfcfd0;

    font-size: 13px;

    font-weight: 400;

    line-height: 18px;

    margin: 12px 0 20px;

}

.confirmation-modal-title {

    font-size: 18px;

    line-height: 22px;

    margin: 0 0 16px;

}

.confirmation-modal-btn-confirm {

    float: right;

}

.page-block {

    background-color: #1b1b1d;

    border: 0;

    padding: 20px;

    position: relative;

    border-radius: 4px;

}

.page-block::after {

    clear: both;

    content: "";

    display: table;

}

.page-block__title {

    font-weight: 500;

    margin: 0;

    font-size: 1rem;

}

.page-block.empty {

    opacity: 0.33;

}

.page {

    min-height: 120px;

    padding-bottom: 20px;

    padding-top: 60px;

    margin: 0 auto;

    max-width: 100%;

    position: relative;

    width: 100%;

    display: flex;

    flex-direction: column;

}

@media screen and (min-width: 1600px) {

    .page {

        max-width: 1388px;

        padding-left: 0;

        padding-right: 0;

        width: 1388px;

    }

}

.page__content {

    margin: 0 40px;

}

.page--limited-width {

    max-width: 1000px;

}

@media screen and (max-width: 1023px) {

    .page {

        padding-top: 32px;

    }

    .page__content {

        margin: 0;

    }

}

.page-header {

    margin: 0 0 30px;

}

.landing {

    display: flex;

    justify-content: center;

    position: relative;

    scroll-behavior: smooth;

}

.landing__main-arrow {

    bottom: 12px;

    cursor: pointer;

    left: 50%;

    margin-left: -18px;

    position: fixed;

    transition: opacity 1s;

}

.landing__main-arrow--hidden {

    opacity: 0;

    pointer-events: none;

}

.landing__content {

    max-width: 1400px;

    padding: 0 100px;

}

.landing__section {

    min-height: 100vh;

    padding-top: var(--pwa-sticky-header-height);

}

.landing__section-login {

    min-height: max(100vh, 800px);

    position: relative;

}

.landing__section-flex,

.landing__section-flex-center {

    align-items: center;

    display: flex;

    justify-content: space-between;

}

.landing__section-flex-center {

    justify-content: center;

}

.landing__footer-gradient {

    background: radial-gradient(74.17% 69.92%at 50% -6.37%, #3f1962 0, transparent 100%);

    bottom: 0;

    height: 155vh;

    pointer-events: none;

    position: absolute;

    transform: rotate(-180deg);

    width: 100%;

    z-index: -1;

}

.landing__top-gradient {

    background: radial-gradient(86.51% 96.48%at 92.2% 11.85%, #27053d 0, #050506 80.7%);

    height: 100vh;

    left: 0;

    min-height: 800px;

    pointer-events: none;

    position: absolute;

    top: 0;

    width: 100vw;

    z-index: -1;

}

.landing__profile-card-wrapper {

    flex: 1;

    margin: 100px auto 84px;

    transform: translateY(-60px);

    width: 100%;

}

@media screen and (max-width: 1023px) {

    .landing {

        display: block;

    }

    .landing__content {

        padding: 0 40px;

    }

    .landing__section-login {

        width: auto;

    }

}

@media screen and (min-width: 768px) {

    .landing__nav_center {

        justify-content: flex-end;

    }

}

@media screen and (max-width: 767px) {

    .landing__nav-left {

        flex: 1 1 50%;

    }

    .landing__logo-wrapper {

        width: 100%;

    }

}

@media screen and (max-width: 639px) {

    .landing {

        margin: unset;

    }

    .landing__content {

        padding: 0 24px;

    }

    .landing__header {

        justify-content: space-between;

        padding-right: 10px;

    }

    .landing__nav-center {

        justify-content: flex-end;

    }

    .landing__section {

        min-height: unset;

    }

    .landing__section-flex {

        align-items: flex-start;

        flex-direction: column;

        justify-content: flex-start;

    }

    .landing__section-login {

        flex-direction: column-reverse;

    }

    .landing__profile-card-wrapper {

        transform: translateY(0);

    }

}

.profile-card {

    align-items: center;

    border-radius: 44px;

    margin: 0 auto;

    max-width: 340px;

    padding: 24px;

    position: relative;

    width: 100%;

    display: flex;

    flex-direction: column;

}

.profile-card--colored {

    background: linear-gradient(201.03deg, #2d0844 4.82%, transparent 97.07%);

}

.profile-card__border-gradient {

    position: absolute;

}

.profile-card__avatar-wrapper {

    margin-bottom: 16px;

}

.profile-card__text {

    display: grid;

    grid-auto-flow: row;

    grid-row-gap: 8px;

    margin-bottom: 24px;

    place-items: center;

}

.profile-card__description {

    color: rgba(255, 255, 255, 0.6);

    text-align: center;

}

.profile-card__button {

    margin-bottom: 24px;

    width: 100%;

}

.profile-card__hint {

    font-size: 12px;

    font-weight: 400;

    letter-spacing: normal;

    color: rgba(255, 255, 255, 0.4);

    line-height: 16px;

    text-align: center;

    white-space: pre-wrap;

}

.avatar {

    align-items: center;

    border: var(--avatar-border-size) solid rgba(255, 255, 255, 0.1);

    border-radius: 30.75%;

    color: rgba(191, 191, 191, 0.5);

    display: inline-flex;

    font-size: 5px;

    height: var(--avatar-size);

    justify-content: center;

    line-height: 1;

    min-width: var(--avatar-size);

    position: relative;

    text-align: center;

    text-decoration: none;

    text-transform: capitalize;

    transition: border-color 0.3s;

    vertical-align: middle;

    width: var(--avatar-size);

    -webkit-user-select: none;

    user-select: none;

}

.avatar--skeleton {

    background: rgba(255, 255, 255, 0.15);

}

.avatar:hover {

    border-color: #fff;

    text-decoration: none;

}

.avatar__img {

    align-items: center;

    background-color: #201e1e;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    border-radius: inherit;

    bottom: 0;

    display: flex;

    justify-content: center;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

}

.avatar__img--dark::before {

    background: rgba(0, 0, 0, 0.8);

    border-radius: inherit;

    bottom: -1px;

    content: "";

    left: -1px;

    position: absolute;

    right: -1px;

    top: -1px;

}

.avatar__story-border {

    background: #5f5f67;

    border-radius: 33.75%;

    bottom: -7.5%;

    left: -7.5%;

    overflow: hidden;

    position: absolute;

    right: -7.5%;

    top: -7.5%;

}

.avatar__story-border::before {

    background: #050506;

    border-radius: 32.75%;

    bottom: 1px;

    content: "";

    left: 1px;

    position: absolute;

    right: 1px;

    top: 1px;

}

.avatar__story-border--active {

    background: linear-gradient(225deg, #8a17fc 14.64%, #fc17fc 37.98%, #fcc217 85.36%);

}

.avatar__story-border--active::before {

    bottom: max(2.5%, 2px);

    left: max(2.5%, 2px);

    right: max(2.5%, 2px);

    top: max(2.5%, 2px);

}



.avatar__story-border--popular {

    background: linear-gradient(225deg, #ef0202 14.64%, #fc17fc 37.98%, #ef0202 85.36%);

}

.avatar__story-border--popular::before {

    bottom: max(2.5%, 2px);

    left: max(2.5%, 2px);

    right: max(2.5%, 2px);

    top: max(2.5%, 2px);

}



.avatar__story-border--add-story {

    background: linear-gradient(313deg, #1bff24 14.64%, #a9ff00 37.98%, #00ffde 85.36%);

}

.avatar__story-border--add-story::before {

    bottom: max(2.5%, 2px);

    left: max(2.5%, 2px);

    right: max(2.5%, 2px);

    top: max(2.5%, 2px);

}



.avatar .icon-user-deleted {

    fill: #424242;

    height: 70%;

    left: 50%;

    margin: 0;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

    width: 70%;

}

.avatar .user-status-icon {

    height: 20%;

    left: -3%;

    position: absolute;

    text-align: left;

    top: -3%;

    width: 20%;

}

.avatar__edit-button {

    align-items: center;

    backdrop-filter: blur(3.2px);

    background: rgba(0, 0, 0, 0.4);

    border-radius: 50%;

    bottom: -7%;

    color: #fff;

    cursor: pointer;

    display: flex;

    height: 35%;

    justify-content: center;

    position: absolute;

    right: -7%;

    width: 35%;

}

.avatar__edit-button--left {

    left: -7%;

    right: auto;

}

.avatar__edit-button--disabled {

    color: #707071;

    cursor: default;

}

.avatar__edit-button:hover {

    color: #ff3332;

}

.avatar__edit-button .icon {

    height: 46%;

    width: 46%;

}

.avatar__moderation {

    align-items: center;

    background: rgba(252, 207, 73, 0.6);

    border-radius: inherit;

    bottom: 0;

    color: #000;

    display: flex;

    justify-content: center;

    left: 0;

    pointer-events: none;

    position: absolute;

    right: 0;

    top: 0;

}

.avatar__moderation-icon {

    height: 30%;

    margin: 0 !important;

    width: 30%;

}

.landing-login-form {

    border-radius: 44px;

    flex: 1;

    margin: 60px 0;

    max-width: 368px;

    padding: 40px 24px;

    position: relative;

    z-index: 1;

}

.landing-login-form--colored {

    background: linear-gradient(201.03deg, #000 4.82%, transparent 97.07%);

}

.landing-login-form--dark {

    background: linear-gradient(201.03deg, #000 4.82%, transparent 97.07%), #020202;

    box-shadow: 0 0 80px #000, 0 0 80px #000, 0 0 80px #000, 0 0 80px #000;

}

.landing-login-form__header {

    align-items: center;

    display: flex;

    flex-direction: column;

}

.landing-login-form__title {

    font-size: 22px;

    font-weight: 700;

    line-height: 27px;

    margin: 0 0 8px;

}

.landing-login-form__description {

    font-size: 13px;

    font-weight: 400;

    line-height: 16px;

    margin: 0 0 6px;

    opacity: 0.8;

}

.landing-login-form__sub-title {

    display: flex;

    margin: -18px auto 16px;

    max-width: 264px;

}

.landing-login-form__sub-title-left {

    align-items: center;

    display: flex;

    font-size: 24px;

    font-weight: 700;

    margin: 0 6px 0 0;

}

.landing-login-form__sub-title-right {

    color: #a0a0a1;

    font-size: 12px;

    line-height: 15px;

}

.landing-login-form__dollar {

    position: relative;

    top: -2px;

}

.landing-login-form__dollar .smile {

    height: 26px;

    margin: 0;

    width: 26px;

}

.landing-login-form__sub-footer {

    display: flex;

    justify-content: center;

    left: 0;

    margin: 30px 0 0;

    right: 0;

    top: 100%;

}

.landing-login-form__sub-footer-link {

    align-items: center;

    color: #707071;

    display: flex;

    justify-content: center;

}

.landing-login-form__sub-footer-link:hover {

    color: #fff;

}

.landing-login-form .avatar {

    height: 96px;

    margin: 0 0 26px;

    width: 96px;

}

@media screen and (max-width: 1023px) {

    .landing-login-form {

        padding: 32px 20px;

    }

}

@media screen and (max-width: 479px) {

    .landing-login-form .avatar {

        height: 64px;

        margin-bottom: 16px;

        width: 64px;

    }

}

@media screen and (max-width: 639px) {

    .landing-login-form {

        width: 100%;

    }

    .landing-login-form--with-margin {

        margin: 40px auto 84px;

        top: -180px;

    }

}

.subscription-tabs {

    margin: 0 0 40px;

}

.subscription-tabs__accent {

    opacity: 0.6;

}

.pill-control__item--active .subscription-tabs__accent {

    opacity: 1;

}

.login-wrapper .island-top-title {

    line-height: 1.875rem;

}

.login-wrapper .island {

    border-radius: 8px;

}

.login-wrapper.recaptcha-shown {

    max-width: 100%;

}

.login-wrapper.recaptcha-shown .island-small {

    min-width: 344px;

    width: auto;

}

.login-wrapper.recaptcha-shown .field-recaptcha {

    min-height: 78px;

}

@media screen and (max-width: 480px) {

    .login-wrapper.recaptcha-shown .island-small {

        min-width: 300px;

        width: 300px;

    }

}

.modal-ds-content .login-wrapper {

    background: linear-gradient(71.77deg, #11021a 1.36%, #26053a 17.56%, rgba(52, 5, 81, 0.97) 33%, rgba(53, 7, 81, 0.92) 43.39%, #1e052e 99.41%);

    max-width: 100%;

    padding: 24px 40px;

    width: 400px;

}

.signup-wrapper__model-invite-text {

    font-size: 34px;

    font-weight: 700;

    line-height: 120%;

    margin: 20px 0 0;

}

.signup-wrapper__model-invite-text .smile {

    height: 34px;

    margin: 0 0 0 10px;

    transform: rotate(-10deg);

    width: 34px;

}

.signup-wrapper__right-content .landing-webcam-page__benefit-list {

    font-size: 15px;

    font-weight: 500;

    line-height: 20px;

}

.signup-wrapper__right-content .landing-webcam-page__benefit {

    margin: 12px 0;

}

.signup-wrapper__right-content .landing-webcam-page__benefit-icon {

    transform: scale(0.9);

}

.being-redirected {

    align-items: center;

    display: flex;

    flex-direction: column;

}

.being-redirected .being-redirected-message {

    color: rgba(255, 255, 255, 0.6);

    font-weight: 500;

    margin: 30px 0 0;

}

.being-redirected .loader,

.my-collection .page-header .edit-button button {

    margin: 0;

}

.loader-container {

    bottom: 0;

    left: 0;

    padding-bottom: 60%;

    position: relative;

    right: 0;

    top: 0;

}

.loader-container--small {

    height: 400px;

    padding: 0;

}

.loader {

    pointer-events: none;

}

.loader.centered {

    left: 50%;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

}

.loader.inline {

    display: inline-block;

    margin-right: 4px;

    vertical-align: middle;

}

.fading-circle {

    height: 66px;

    margin: 0 auto;

    position: relative;

    width: 66px;

}

.loader-circle {

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

}

.loader-circle-inner {

    animation: circleFadeDelay 960ms infinite ease-in-out both;

    background: #666;

    border-radius: 100%;

    height: 15%;

    margin: 0 auto;

    width: 15%;

}

.login-wrapper {

    width: 320px;

}

.login-wrapper .island-top {

    color: #fff;

    justify-content: center;

    margin-bottom: 32px;

    text-align: center;

}

.reset-password-form {

    display: flex;

    flex-direction: column;

    width: 320px;

}

.reset-password-form__field {

    margin-bottom: 16px;

}

.reset-password-form__input.input {

    background: rgba(255, 255, 255, 0.1);

    transition: all ease 0.25s;

    width: 100%;

}

.reset-password-form__submit-button {

    width: 100%;

}

.reset-password-form__terms-warning {

    align-self: center;

    color: rgba(255, 255, 255, 0.4);

    margin-bottom: 32px;

    font-size: 0.813rem;

}

.reset-password-form__terms-warning .link {

    text-decoration-line: underline;

    transition: all ease 0.25s;

}

.reset-password-form__terms-warning .link:hover {

    color: rgba(255, 255, 255, 0.8);

}

.reset-password-form__login-suggestion {

    align-self: center;

    color: rgba(255, 255, 255, 0.4);

    margin-top: 32px;

    transition: all ease 0.25s;

    font-size: 0.813rem;

}

.reset-password-form__login-suggestion .link {

    color: #ff3332;

}

.reset-password-form__login-suggestion .link:hover {

    color: #9e40fd;

}

.forgot-password-wrapper {

    display: flex;

    flex-direction: column;

    max-width: 320px;

}

.forgot-password-wrapper__header {

    margin-bottom: 16px;

    text-align: center;

}

.forgot-password-wrapper__header-title {

    font-size: 22px;

    font-weight: 500;

    line-height: 27px;

}

.forgot-password-wrapper__header-description {

    font-size: 13px;

    font-weight: 400;

    line-height: 16px;

    opacity: 0.6;

}

.forgot-password-wrapper__field {

    margin-bottom: 16px;

}

.forgot-password-wrapper .forgot-password-wrapper__input.input {

    background: rgba(255, 255, 255, 0.1);

    transition: all ease 0.25s;

    width: 100%;

}

.forgot-password-wrapper__actions {

    align-items: center;

    display: flex;

    flex-direction: column;

    width: 100%;

}

.forgot-password-wrapper__submit-button {

    width: 100%;

}

.forgot-password-wrapper__return-to-signin {

    align-items: center;

    display: flex;

    margin-top: 36px;

}

.forgot-password-wrapper__return-to-signin:hover {

    text-decoration: none;

}

.forgot-password-wrapper__return-to-signin .icon-wrapper {

    align-items: center;

    backdrop-filter: blur(10px);

    background: rgba(255, 255, 255, 0.1);

    border-radius: 50%;

    display: flex;

    height: 40px;

    justify-content: center;

    width: 40px;

}

.forgot-password-wrapper__return-to-signin .icon-wrapper .icon {

    fill: rgba(255, 255, 255, 0.6);

    margin: 0;

}

.forgot-password-wrapper__return-to-signin .title {

    color: rgba(255, 255, 255, 0.6);

    margin-left: 14px;

}

.forgot-password-wrapper .recaptcha {

    align-items: center;

    display: flex;

    justify-content: center;

    margin: 0 auto 14px;

}

.modal-ds-content .forgot-password-wrapper {

    background: linear-gradient(71.77deg, #11021a 1.36%, #26053a 17.56%, rgba(52, 5, 81, 0.97) 33%, rgba(53, 7, 81, 0.92) 43.39%, #1e052e 99.41%);

    max-width: 100%;

    padding: 24px 40px;

    width: 400px;

}

.document-safe-upload {

    display: flex;

    justify-content: center;

}

.my-collection {

    width: 100%;

}

.my-collection .videos-list-item .video-controls {

    z-index: 10;

}

.my-collection .my-collection-load-more {

    padding: 40px 0;

    text-align: center;

}

.my-collection .my-collection-content-header {

    font-weight: 500;

    margin: 30px 0 20px;

    opacity: 0.8;

    align-items: center;

    justify-content: center;

    display: flex;

    flex-direction: row;

    font-size: 1rem;

}

.my-collection .my-collection-content-header .header-icon {

    align-self: flex-start;

    flex: 0 0 16px;

}

.my-collection .my-collection-content-header .name {

    flex: 1 1 auto;

    margin: 0 10px;

}

.my-collection .my-collection-content-header .access-mode-controls {

    align-self: flex-start;

    flex: 0 0 auto;

}

.my-collection .my-collection-content-header .access-mode .icon,

.my-collection .my-collection-content-header .count,

.my-collection .my-collection-content-header .video-access-viewer {

    opacity: 0.4;

}

.my-collection .my-collection-content-header .btn-restore {

    float: right;

    margin: 0 0-2px;

}

.my-collection .my-collection-content-header .delete-album-button {

    cursor: pointer;

    float: right;

    opacity: 0.9;

}

.my-collection .my-collection-content-header .delete-album-button:hover {

    opacity: 1;

}

.my-collection .my-collection-content-header .count {

    margin-left: 10px;

}

.my-collection .my-collection-content-header .icon {

    fill: #fff;

    margin: 0;

    vertical-align: -2px;

}

.my-collection .page-header .my-collection-title,

.set-password .form-input input {

    width: 100%;

}

.my-collection .page-header .avatar {

    height: 48px;

    margin: 0 8px 0 0;

    width: 48px;

}

.my-collection .page-header .icon-prev-small {

    fill: #fff;

    margin: 4px 10px 4px 5px;

    vertical-align: -1px;

}

.my-collection .page-header .icon-next-small {

    fill: #fff;

    margin: 2px 20px 0;

    vertical-align: 1px;

}

.my-collection .page-header .stud {

    flex-grow: 1;

}

.my-collection .page-header .edit-button {

    text-align: right;

}

.my-collection .page-footer {

    align-items: baseline;

    flex-wrap: wrap;

    margin-top: 40px;

    display: flex;

    flex-direction: row;

}

.my-collection .page-footer .btn {

    margin-bottom: 10px;

    margin-right: 20px;

}

.my-collection .page-footer .description {

    opacity: 0.4;

}

.my-collection .faded > :not(.access-mode-controls) {

    opacity: 0.4;

    pointer-events: none;

}

.my-collection .model-list-content.restricted {

    background-color: rgba(255, 255, 255, 0.06);

    padding: 50px;

}

.my-collection .model-list-content.restricted .photos-gallery {

    align-items: center;

    display: flex;

    flex-direction: row;

}

.my-collection .model-list-content.restricted .photos-gallery .description-icon .icon {

    fill: #fff;

    opacity: 0.9;

}

.my-collection .model-list-content.restricted .photos-gallery .description {

    flex: 1 1 auto;

    padding: 0 10px;

}

.my-collection .model-list-content.restricted .photos-gallery .action .btn {

    margin: 0;

}

.my-collection .loader-container {

    height: 100px;

    margin-top: 50px;

    padding: 0;

    position: relative;

}

.hr-content {

    border-top: 2px solid rgba(255, 255, 255, 0.15);

    margin: 60px 0 50px;

    width: 100%;

}

.hr-content--small {

    border-top-width: 1px;

    margin: 10px 0;

}

.hr-content--medium {

    margin: 40px 0;

}

@media screen and (max-width: 639px) {

    .hr-content {

        margin: 20px 0;

    }

    .hr-content--small {

        margin: 8px 0;

    }

}

.profile-page .page {

    padding-top: 0;

}

.header-logo-link {

    margin: 0 0 0 10px;

}

@media screen and (max-width: 479px) {

    .header-logo-link {

        margin-right: 0;

        padding: 0;

        width: 100%;

    }

    .header-logo-link .header-logo {

        margin-left: -2px;

        width: 100%;

    }

}

.set-password {

    background-color: #1b1b1d;

    border: 0;

    line-height: 18px;

    padding: 20px;

    text-align: left;

}

.set-password a:not(.btn) {

    color: #69a8e0;

    text-decoration: underline;

}

.set-password .set-password-title {

    line-height: 20px;

    font-size: 1.125rem;

}

.set-password .set-password-description {

    line-height: 18px;

    margin: 20px 0;

    font-size: 0.875rem;

}

.set-password .set-password-inputs {

    margin-top: 20px;

    display: flex;

    flex-direction: column;

}

.set-password .set-password-controls {

    margin-top: 20px;

    display: flex;

    flex-direction: row;

}

.set-password .form-field {

    align-items: center;

    margin: 10px 0;

    width: 100%;

    display: flex;

    flex-direction: row;

}

.set-password .form-label {

    text-align: left;

    flex: 1;

    flex-basis: 30%;

    flex-grow: 1;

    flex-shrink: 0;

}

.set-password .form-input {

    flex: 1;

    flex-basis: 70%;

    flex-grow: 1;

    flex-shrink: 0;

}

@media screen and (max-width: 480px) {

    .set-password .form-field {

        align-items: stretch;

        flex-flow: column;

    }

    .set-password .form-field .form-label {

        margin-bottom: 10px;

    }

    .set-password .set-password-controls {

        justify-content: center;

    }



    .has-unread-msg {

        right: 25px;

        top: 2px;

    }



}

.header-dropdown,

.header-dropdown .dropdown-link {

    align-items: center;

    align-self: stretch;

    position: relative;

    display: flex;

    flex-direction: row;

}

.header-dropdown .dropdown-link {

    color: rgba(255, 255, 255, 0.6);

    display: block;

    padding: 0 18px;

    text-decoration: none;

    transition: color 120ms 120ms;

}

.header-dropdown .dropdown-link .icon-menu {

    margin: 0;

}

.header-dropdown .dropdown-link .dropdown-arrow {

    margin-left: 6px;

}

.header-dropdown .dropdown-link .dropdown-arrow .icon {

    fill: rgba(255, 255, 255, 0.6);

    height: 7px;

    margin: 0;

    width: 7px;

    transition: all 120msms ease-in-out 0s;

}

.header-dropdown .dropdown-link.mobile-nav-link .icon {

    margin: 0;

}

.header-dropdown__menu-alert {

    left: 14px;

    line-height: 0;

    position: absolute;

    top: 9px;

}

.header-dropdown .badge-alert-small {

    left: 12px;

    position: absolute;

    top: 9px;

}

.header-dropdown__avatar-badge {

    left: 7px;

    position: absolute;

    top: 9px;

}

.header-dropdown--active .dropdown-link {

    background-color: #1b1b1d;

}

.header-dropdown--active .dropdown-link .dropdown-arrow .icon {

    transform: rotate(180deg);

}

.header-dropdown-content-wrapper {

    animation: opacity-fade-show 0.2s forwards;

    left: 0;

    overflow: auto;

    position: absolute;

    top: calc(100% + 12px);

    z-index: 201;

}

.header-dropdown .scroll-bar-container {

    max-height: 60vh;

    max-width: 320px;

    overflow: hidden auto;

    z-index: 1;

}

.header-dropdown .scroll-bar-container:last-child {

    border-bottom-left-radius: 3px;

    border-bottom-right-radius: 3px;

}

@media screen and (max-width: 479px) {

    .header-dropdown.header-user-menu a.dropdown-link.mobile-nav-link {

        margin-right: 0;

        max-width: 56px;

        width: 56px;

    }

}

.header-dropdown-content {

    background-color: #232325;

    box-shadow: 0 20px 30px rgba(0, 0, 0, 0.3);

    display: block;

    margin: 0;

    white-space: nowrap;

}

.header-dropdown-content li {

    min-width: 200px;

    position: relative;

}

.header-dropdown-content li > a:not(.btn),

.header-dropdown-content li > button {

    align-items: center;

    color: rgba(255, 255, 255, 0.8);

    display: flex;

    line-height: 42px;

    padding: 0 18px;

    text-decoration: none;

    text-overflow: ellipsis;

}

.header-dropdown-content li > a:not(.btn):hover,

.header-dropdown-content li > button:hover {

    background: #343437;

    color: #fff;

    transition: all 30ms ease-in-out 0s;

}

.header-dropdown-content li > button {

    border-radius: 0;

    justify-content: flex-start;

    width: 100%;

}

.header-dropdown-content li .user-menu-avatar-wrapper {

    color: rgba(255, 255, 255, 0.8);

    line-height: 42px;

    padding: 0 18px;

    text-decoration: none;

    text-overflow: ellipsis;

}

.header-dropdown-content li .user-menu-avatar-wrapper:hover {

    background: #343437;

    color: #fff;

    transition: all 30ms ease-in-out 0s;

}

.header-dropdown-content li .btn,

.header-dropdown-content li.list-item-wrapper .btn {

    margin: 0;

}

.header-dropdown-content li.list-item-wrapper {

    padding: 20px;

}

.header-dropdown-content li.list-item-wrapper .btn.btn-block:not(:last-child) {

    margin-bottom: 20px;

}

.header-user-menu.header-dropdown > .btn {

    margin: 0 12px 0 0;

    vertical-align: top;

}

.header-user-menu.header-dropdown > .btn:last-of-type {

    margin-right: 0;

}

.header-user-menu.header-dropdown > .dropdown-link {

    align-items: center;

    display: flex;

    flex: 1;

    justify-content: center;

    padding: 0 12px;

    margin-top: 5px;

    margin-bottom: 5px;

}

.header-user-menu.header-dropdown > .dropdown-link > .avatar {

    font-size: 2px;

    margin-right: 2px;

}

.header-user-menu.header-dropdown ul > li .badge.badge-alert-small {

    left: 15px;

    position: absolute;

    top: 10px;

}

.header-user-menu.header-dropdown ul > li .user-menu-avatar-wrapper {

    align-items: flex-start;

    display: flex;

    margin: 0;

    max-width: 320px;

    padding: 8px 16px;

    width: 100%;

}

.header-user-menu.header-dropdown .header-dropdown-content-wrapper {

    left: auto;

    right: 0;

}

.header-user-menu.header-dropdown .header-dropdown-content-wrapper-bordered {

    border-radius: 16px;

}

.header-user-menu.header-dropdown .header-dropdown-content-wrapper:before {

    left: auto;

    right: 20px;

}

.header-user-menu.header-dropdown .header-dropdown-content {

    min-width: 310px;

    padding: 10px 0;

}

.header-user-menu.header-dropdown .icon-menu {

    height: 18px;

    width: 18px;

}

@media screen and (max-width: 1023px) {

    .header-user-menu.header-dropdown .header-dropdown-content-wrapper {

        right: 0;

    }

    .header-user-menu.header-dropdown .header-dropdown-content-wrapper:before {

        right: 8px;

    }

    .header-user-menu.header-dropdown .mobile-nav-link {

        margin-right: -0.75rem;

    }

}

.creator-lists-page__header {

    align-items: center;

    display: flex;

    justify-content: space-between;

    margin-bottom: 42px;

}

.creator-lists-page__new-list-icon {

    height: 14px;

    margin-right: 10px;

    width: 14px;

}

.creator-list-page__header {

    display: flex;

    gap: 10px;

    justify-content: space-between;

}

.creator-list-page__header .bread-crumbs__item {

    display: grid;

    grid-auto-flow: column;

    word-break: break-all;

}

.creator-list-page__list-name {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.creator-list-page__header-actions {

    align-items: center;

    display: flex;

    gap: 10px;

    justify-content: flex-end;

}

.creator-list-page__plus-icon {

    margin-right: 12px;

}

.creators-onboarding-page__description {

    display: flex;

    flex-direction: column;

    gap: 10px;

    margin-bottom: 32px;

}

.agreement-popup__loader {

    font-size: 16px;

    font-weight: 400;

    left: 50%;

    line-height: 28px;

    opacity: 0.8;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

}

.agreement-popup__loader > .loader-ds {

    margin: 0 auto 20px;

}

.agreement-popup__button-icon {

    margin: 0 8px 0 0;

}

.agreement-popup .modal-ds-header {

    border-bottom: 1px solid rgba(255, 255, 255, 0.05);

    font-size: 20px;

    font-weight: 700;

    line-height: 24px;

    padding: 20px;

}

.agreement-popup .modal-ds-footer {

    align-items: center;

    border-top: 1px solid rgba(255, 255, 255, 0.05);

    display: flex;

    flex-direction: row;

    height: 82px;

    justify-content: space-between;

    max-height: 110px;

    padding: 20px;

}

.agreement-popup .modal-ds-body {

    height: 80%;

    margin: auto;

    max-width: 900px;

    width: 80%;

    font-size: 0.875rem;

    line-height: 1.25rem;

}

.agreement-footer-bottom,

.agreement-footer-top {

    align-items: center;

    display: flex;

    justify-content: flex-end;

}

.agreement-footer-bottom {

    justify-content: space-between;

    flex-direction: row;

}

.agreement-popup-input {

    align-items: center;

    display: flex;

    font-weight: 500;

    margin-right: 10px;

    opacity: 0.6;

}

.agreement-text {

    margin: 10px 0;

}

.share-link {

    padding: 22px 24px;

}

.share-link--size--small {

    max-width: 414px;

}

.share-link__title {

    font-size: 20px;

    font-weight: 500;

    line-height: 24px;

    margin: 0 0 12px;

}

.share-link__title > .smile {

    height: 24px;

    margin: 0 0 0 8px;

    position: relative;

    width: 24px;

}

.share-link__gift-icon {

    margin: 0 10px 0 0;

    position: relative;

    top: 4px;

}

.share-link__description {

    color: #a0a0a1;

    font-size: 13px;

    font-weight: 400;

    line-height: 18px;

}

.share-link__split {

    background: rgba(255, 255, 255, 0.1);

    height: 1px;

    margin: 12px 0;

}

.share-link__form {

    display: flex;

    margin: 16px 0 0;

}

.share-link__form .input-wrapper {

    flex: 1;

    margin: 0 12px 0 0;

}

.share-link__form .input-wrapper .input {

    padding: 0 12px;

}

@media screen and (max-width: 639px) {

    .share-link__form {

        flex-direction: column;

    }

    .share-link__form .input-wrapper {

        margin: 0 0 12px;

    }

}

.select-username-modal .site-logo {

    height: 30px;

    width: 130px;

}

.select-username-modal-wrapper {

    background-image: url(/assets/users/components/ui/SelectUsernameModal/images/bg.png);

    background-position: right;

    background-size: cover;

    border-radius: 8px;

    padding: 35px;

}

.select-username-modal-header {

    align-items: center;

    margin-bottom: 25px;

    display: flex;

    flex-direction: row;

}

.select-username-modal-header .icon-user-username {

    fill: #fff;

}

.select-username-modal-header .select-username-modal-title-wrapper {

    margin-left: 10px;

}

.select-username-modal-header .select-username-modal-title {

    color: #cfcfd0;

    font-size: 15px;

    line-height: 18px;

}

.select-username-modal-header .select-username-modal-sub-title {

    font-size: 22px;

    line-height: 27px;

}

.select-username-modal-body .select-username-modal-description {

    color: #a0a0a1;

    font-size: 13px;

    line-height: 20px;

    margin-bottom: 25px;

    max-width: 350px;

}

.select-username-modal-body .select-username-modal-controls {

    display: flex;

    flex-direction: column;

}

.select-username-modal-body .select-username-modal-controls-input {

    position: relative;

}

.select-username-modal-body .input {

    min-width: 250px;

}

.select-username-modal-body .btn-default-filled {

    background: 0 0;

    border: 2px solid rgba(255, 255, 255, 0.8);

    border-radius: 20px;

    color: rgba(255, 255, 255, 0.8);

    margin: 0 0 0 10px;

    padding: 0 35px;

}

.select-username-modal-body .btn-default-filled:hover:not(:disabled) {

    color: rgba(255, 255, 255, 0.9) !important;

}

.cG__content {

    margin: 0 20px;

    position: relative;

    -webkit-user-select: none;

    user-select: none;

}

.cG__content-agreement {

    flex: 1;

    overflow: hidden;

    padding: 60px 60px 20px;

    position: relative;

    width: 100%;

}

.cG__text-block {

    color: #a0a0a1;

    line-height: 140%;

}

.cG__wrapper {

    aspect-ratio: 3/4;

    margin: 20px auto 0;

    max-width: 300px;

    position: relative;

}

.cG__photo-wrapper {

    align-items: center;

    aspect-ratio: 3/4;

    background: #000;

    border-radius: 12px;

    display: flex;

    justify-content: center;

    overflow: hidden;

    position: relative;

    width: 100%;

}

.cG__loading-shadow {

    background: rgba(0, 0, 0, 0.8);

    border-radius: 12px;

    bottom: 0;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

    z-index: 1;

}

.cG__shadow {

    background-repeat: no-repeat;

    background-size: contain;

    bottom: 0;

    left: 0;

    opacity: 0.6;

    position: absolute;

    top: 0;

    width: 100%;

}

.cG__oval-wrapper {

    align-items: center;

    aspect-ratio: 24/30;

    display: flex;

    justify-content: center;

    position: absolute;

    transform: translateY(-6.9%);

    width: 80%;

    z-index: 1;

}

.cG__face {

    display: block;

    height: 100%;

    width: 100%;

}

.cG__video {

    border-radius: 12px;

    height: 100%;

    left: 0;

    object-fit: cover;

    object-position: center;

    position: absolute;

    top: 0;

    transition: opacity 0.6s;

    width: 100%;

}

.cG__video--flip {

    transform: scaleX(-1);

}

.cG__video--hidden {

    visibility: hidden;

}

.cG__video::-webkit-media-controls-start-playback-button {

    appearance: none;

    display: none !important;

}

.cG__loader-shaker {

    color: #67ed27;

    font-weight: 500;

    height: 0;

    margin: 0 auto;

    overflow: hidden;

    text-align: center;

    transition: height 0.3s;

    white-space: nowrap;

    width: 160px;

}

.cG__scanner-wrapper {

    bottom: 17%;

    clip-path: ellipse(50% 50%at 50% 50%);

    left: 10%;

    position: absolute;

    right: 10%;

    top: 7%;

    z-index: 2;

}

.cG__scanner {

    animation: scanner 2s infinite alternate;

    background: #67ed27;

    box-shadow: 0 0 9.33333px 1.86667px #67ed27;

    height: 2px;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

}

.cG__placeholder {

    bottom: 50%;

    color: #fff;

    font-size: 14px;

    font-weight: 500;

    left: 50%;

    line-height: 20px;

    position: absolute;

    text-align: center;

    transform: translate(-50%, 10%);

    width: 130px;

    z-index: 1;

}

.cG__text-arrow {

    position: absolute;

    right: 55px;

    top: -45px;

}

.cG__scanner-dots {

    background: url(/assets/common/images/face-verification/face-dots.svg) no-repeat center;

    background-size: contain;

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

}

.cG__scanner-lines {

    background: url(/assets/common/images/face-verification/face-lines.svg) no-repeat center;

    background-size: contain;

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

}

.cG__example,

.cG__example-btn {

    align-items: center;

    cursor: pointer;

    display: flex;

    justify-content: center;

    position: absolute;

    top: 0;

}

.cG__example-btn {

    background: 0 0;

    border: 0;

    color: rgba(255, 255, 255, 0.8);

    height: 36px;

    padding: 0;

    right: 0;

    width: 36px;

    z-index: 1;

}

.cG__example-btn:hover {

    color: #fff;

}

.cG__example {

    aspect-ratio: 3/4;

    background-repeat: no-repeat;

    background-size: contain;

    border-radius: 12px;

    height: 100%;

    left: 0;

    opacity: 0;

    overflow: hidden;

    transform: scale(0);

    transform-origin: right top;

    transition: transform 0.3s, opacity 0.3s;

    width: 100%;

    z-index: 2;

}

.cG__example--opened {

    opacity: 1;

    transform: scale(1);

}

.cG__example-text {

    bottom: 8px;

    color: #fff;

    font-size: 14px;

    left: 0;

    position: absolute;

    text-align: center;

    width: 100%;

}

.cG__example-expand {

    align-items: center;

    -webkit-backdrop-filter: blur(2px);

    backdrop-filter: blur(2px);

    background: rgba(5, 5, 6, 0.4);

    border-radius: 50%;

    color: #fff;

    display: flex;

    height: 32px;

    justify-content: center;

    position: absolute;

    right: 8px;

    top: 8px;

    transition: background 0.3s;

    width: 32px;

}

.cG__photo-btn,

.cG__photo-controls {

    align-items: center;

    cursor: pointer;

    display: flex;

    justify-content: center;

    width: 100%;

}

.cG__photo-btn {

    background: 0 0;

    border: 2px solid #fff;

    border-radius: 50%;

    color: #fff;

    height: 48px;

    width: 48px;

}

.cG__photo-btn :disabled {

    opacity: 0.6;

    pointer-events: none;

}

.cG__photo-btn:hover > .icon-photo-3 {

    transform: scale(0.8);

}

.cG__photo-btn > .icon-photo-3 {

    transition: transform 0.3s;

}

.cG__tooltip {

    min-width: 320px;

}

.cG__tooltip-content {

    padding: 20px;

}

.cG__settings-btn,

.cG__swap-btn {

    align-items: center;

    background: #343437;

    border: 0;

    border-radius: 50%;

    color: #fff;

    display: flex;

    height: 32px;

    justify-content: center;

    position: absolute;

    width: 32px;

}

.cG__settings-btn {

    cursor: pointer;

    left: 20px;

}

.cG__settings-btn:hover {

    background: #424248;

}

.cG__swap-btn {

    padding: 0;

    right: 20px;

}

.cG__footer {

    align-items: flex-end;

    display: flex;

    height: 80px;

    padding: 20px;

    position: relative;

}

.cG__footer--submit {

    animation: opacity-fade-show-modal-strict 0.3s;

    justify-content: space-between;

}

.cG__footer--border::before {

    background: rgba(255, 255, 255, 0.05);

    content: "";

    height: 1px;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

}

.cG__nose,

.cG__nose-text {

    aspect-ratio: 1;

    height: 10%;

    position: absolute;

    transform: translateX(-50%) translateY(-50%);

    z-index: 1;

}

.cG__nose {

    background: url(/assets/common/images/face-verification/nose.svg) no-repeat;

    background-size: contain;

    border-radius: 50%;

}

.cG__nose--border::before {

    background: url(/assets/common/images/face-verification/donut.webp) no-repeat;

    background-size: cover;

    bottom: -100%;

    content: "";

    left: -100%;

    opacity: 0.4;

    position: absolute;

    right: -100%;

    top: -100%;

}

.cG__nose-text {

    display: flex;

    font-size: 14px;

    justify-content: center;

    left: 50%;

    right: 0;

    text-align: center;

    top: 30%;

}

.cG__close {

    align-items: center;

    background: 0 0;

    border: 0;

    color: #707071;

    cursor: pointer;

    display: none;

    height: 32px;

    justify-content: center;

    padding: 0;

    position: absolute;

    right: 0;

    top: 0;

    width: 32px;

}

.cG__close:hover,

.cG__faq:hover {

    color: #fff;

}

.cG__checkbox {

    display: flex;

    margin: 24px 0 0;

}

.cG__info {

    background: #232325;

    border-radius: 12px;

    color: #a0a0a1;

    display: flex;

    font-size: 14px;

    gap: 8px;

    line-height: 20px;

    margin: 20px 0 10px;

    padding: 10px 16px;

    text-align: left;

}

.cG__faq {

    color: #cfcfd0;

    display: flex;

    left: 4px;

    padding: 4px;

    position: absolute;

    top: 4px;

    z-index: 1;

}

.cG__attache-file {

    align-items: center;

    bottom: 4%;

    display: flex;

    flex-direction: column;

    gap: 5px;

    left: 0;

    opacity: 1;

    position: absolute;

    width: 100%;

    z-index: 2;

}

.cG__attache-file-button {

    background: 0 0;

    border: 0;

    color: #ff3332;

    cursor: pointer;

    font-size: 14px;

    font-weight: 700;

    padding: 0;

}

@media (max-width: 639px), (max-height: 420px) {

    .cG__close {

        display: flex;

    }

}

@media (max-width: 479px) {

    .cG__checkbox {

        justify-content: center;

    }

    .cG__content-agreement {

        padding: 20px 50px;

    }

}

.cK__content {

    max-width: 100%;

    width: 1200px;

}

.upload-cover-video-modal.modal-ds-body {

    width: 400px;

}

.upload-cover-video-modal.modal-ds-body .modal-ds-content {

    padding: 14px 16px;

}

.upload-cover-video-modal .modal-content {

    background: #232325;

    padding: 10px;

    width: 600px;

}

.upload-cover-video-modal__filename {

    padding-bottom: 20px;

}

.upload-cover-video-modal__row {

    display: flex;

}

.upload-cover-video-modal__icon {

    align-items: center;

    background-color: rgba(255, 255, 255, 0.2);

    display: flex;

    height: 95px;

    justify-content: center;

    margin-right: 20px;

    width: 25%;

}

.upload-cover-video-modal__progress {

    width: 100%;

}

.upload-cover-video-modal__actions {

    border-top: 1px solid rgba(0, 0, 0, 0.5);

    display: flex;

    justify-content: center;

    margin: 10px -10px 0;

    padding: 10px 10px 0;

}

.upload-cover-video-modal__actions .btn {

    margin: 0;

}

.loader-ds {

    animation: loader-ds 1.4s linear infinite;

}

.loader-ds-default-color {

    color: #fff;

}

.loader-ds-circle {

    animation: loader-ds-circle 1.4s ease-in-out infinite;

    stroke-dasharray: 80px, 200px;

    stroke-dashoffset: 0;

}

.checkbox-ds {

    display: flex;

}

.checkbox-ds__box {

    align-items: center;

    cursor: pointer;

    display: flex;

    justify-content: center;

    position: relative;

    transition: border 0.3s;

}

.checkbox-ds__box--size--normal {

    border-radius: 6px;

    height: 24px;

    width: 24px;

}

.checkbox-ds__box--size--normal.checkbox-ds__box--theme--radio,

.checkbox-ds__box--size--small.checkbox-ds__box--theme--radio {

    border-radius: 50%;

}

.checkbox-ds__box--size--small {

    border-radius: 4px;

    height: 18px;

    width: 18px;

}

.checkbox-ds__box--theme--primary {

    border: 2px solid #707071;

    color: #fff;

}

.checkbox-ds__box--theme--white {

    border: 2px solid #fff;

    color: #000;

}

.checkbox-ds__box--theme--radio {

    border: 2px solid #707071;

}

.checkbox-ds__box--theme--radio:after {

    border-radius: 50%;

    content: "";

    display: none;

    height: 12px;

    width: 12px;

}

.checkbox-ds__box--checked.checkbox-ds__box--theme--primary {

    background: #d60908;

    border-color: #d60908;

}

.checkbox-ds__box--checked.checkbox-ds__box--theme--white {

    background: #fff;

}

.checkbox-ds__box--checked.checkbox-ds__box--theme--radio {

    border-color: #d60908;

}

.checkbox-ds__box--checked.checkbox-ds__box--theme--radio:after {

    background: #d60908;

    display: block;

}

.checkbox-ds__input,

input.checkbox,

input.radio {

    height: 0;

    opacity: 0;

    position: absolute;

    width: 0;

}

.checkbox-ds__icon {

    display: block;

    height: 14px;

    width: 14px;

}

.checkbox-ds__content {

    display: inline-block;

}

.checkbox-ds__content--size--normal {

    margin: 2px 0 0 6px;

}

.checkbox-ds__content--size--small {

    margin: 0 0 0 6px;

}

.input-wrapper,

.input-wrapper__text-wrapper {

    position: relative;

}

.input-wrapper .input-wrapper__password-button {

    cursor: pointer;

    position: absolute;

    right: 10px;

    top: 50%;

    transform: translateY(-50%);

}

.input-wrapper .input-wrapper__password-button .icon {

    fill: #808085;

}

.input {

    width: 100%;

}

.input.input--prefixed.input--prefixed {

    padding-left: calc(16px + 1em);

}

.input__prefix {

    font-size: 0.75rem;

    left: 12px;

    line-height: 100%;

    opacity: 0.4;

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

}

.input__error {

    color: #fd3a5b;

    display: block;

    font-size: 13px;

    margin: 4px 0 0;

}

.input__multy-suggest {

    cursor: default;

    display: flex;

    text-align: left;

    width: 100%;

}

.input__multy-suggest-link {

    cursor: pointer;

    padding: 4px 8px;

}

.input.text-x-large {

    height: 44px;

}

input.checkbox,

input.radio {

    display: block;

}

input.checkbox + label,

input.radio + label {

    background-position: center left;

    background-repeat: no-repeat;

    cursor: pointer;

    display: inline-block;

    height: 18px;

    line-height: 18px;

    margin: 4px 0 3px;

    max-width: 100%;

    opacity: 0.9;

    overflow: hidden;

    padding-left: 24px;

    padding-top: 0;

    text-align: left;

    text-overflow: ellipsis;

    vertical-align: middle;

    white-space: nowrap;

    width: auto;

    -webkit-user-select: none;

    user-select: none;

    font-size: 0.875rem;

}

input.checkbox:checked + label,

input.checkbox:focus + label,

input.checkbox:hover + label,

input.radio:checked + label,

input.radio:focus + label,

input.radio:hover + label {

    opacity: 1;

}

.checkbox + label {

    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='null' fill='%23fff' d='M8.55 8.55h82.9v82.9H8.55V8.55zM1 99h98V1H1v98z'/%3E%3C/svg%3E");

    background-size: 16px;

    color: #fff;

}

.checkbox:checked + label {

    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23d60908'%3E%3Cpath d='M9.55 9.65H90.5V90.6H9.55V9.65zM2.2 97.97h95.67V2.27H2.2v95.7z'/%3E%3Cpath d='M42.66 59.6L27.93 44.96l-5.17 5.17 19.9 19.9L77.3 35.4l-5.17-5.18'/%3E%3C/g%3E%3C/svg%3E");

    color: #d60908;

}

.checkbox.white:checked + label {

    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23fff'%3E%3Cpath d='M9.55 9.65H90.5V90.6H9.55V9.65zM2.2 97.97h95.67V2.27H2.2v95.7z'/%3E%3Cpath d='M42.66 59.6L27.93 44.96l-5.17 5.17 19.9 19.9L77.3 35.4l-5.17-5.18'/%3E%3C/g%3E%3C/svg%3E");

    color: #fff;

}

.radio + label {

    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' d='M50.03 86.9c-20.4 0-36.87-16.57-36.87-36.87s16.47-36.87 36.87-36.87S86.9 29.63 86.9 50.03 70.43 86.9 50.03 86.9zm0-85.9C22.97 1 1 22.97 1 50.03s21.97 49.03 49.03 49.03S99.06 77.1 99.06 50.03 77.1 1 50.03 1z'/%3E%3C/svg%3E");

    background-size: 16px;

    color: #fff;

}

.radio:checked + label {

    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23d60908'%3E%3Cpath d='M70.82 50.03c0 11.47-9.32 20.8-20.8 20.8s-20.78-9.33-20.78-20.8 9.32-20.8 20.8-20.8 20.78 9.33 20.78 20.8'/%3E%3Cpath d='M50.03 86.9c-20.4 0-36.87-16.57-36.87-36.87s16.47-36.87 36.87-36.87S86.9 29.63 86.9 50.03 70.43 86.9 50.03 86.9zm0-85.9C22.97 1 1 22.97 1 50.03s21.97 49.03 49.03 49.03S99.06 77.1 99.06 50.03 77.1 1 50.03 1z'/%3E%3C/g%3E%3C/svg%3E");

    color: #d60908;

}

.radio.white:checked + label {

    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23fff'%3E%3Cpath d='M70.82 50.03c0 11.47-9.32 20.8-20.8 20.8s-20.78-9.33-20.78-20.8 9.32-20.8 20.8-20.8 20.78 9.33 20.78 20.8'/%3E%3Cpath d='M50.03 86.9c-20.4 0-36.87-16.57-36.87-36.87s16.47-36.87 36.87-36.87S86.9 29.63 86.9 50.03 70.43 86.9 50.03 86.9zm0-85.9C22.97 1 1 22.97 1 50.03s21.97 49.03 49.03 49.03S99.06 77.1 99.06 50.03 77.1 1 50.03 1z'/%3E%3C/g%3E%3C/svg%3E");

    color: #fff;

}

.radio.theme-primary + label {

    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' d='M50.03 86.9c-20.4 0-36.87-16.57-36.87-36.87s16.47-36.87 36.87-36.87S86.9 29.63 86.9 50.03 70.43 86.9 50.03 86.9zm0-85.9C22.97 1 1 22.97 1 50.03s21.97 49.03 49.03 49.03S99.06 77.1 99.06 50.03 77.1 1 50.03 1z'/%3E%3C/svg%3E");

    background-size: 20px;

}

.radio.theme-primary:checked + label {

    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%2334b353'%3E%3Cpath d='M70.82 50.03c0 11.47-9.32 20.8-20.8 20.8s-20.78-9.33-20.78-20.8 9.32-20.8 20.8-20.8 20.78 9.33 20.78 20.8'/%3E%3Cpath d='M50.03 86.9c-20.4 0-36.87-16.57-36.87-36.87s16.47-36.87 36.87-36.87S86.9 29.63 86.9 50.03 70.43 86.9 50.03 86.9zm0-85.9C22.97 1 1 22.97 1 50.03s21.97 49.03 49.03 49.03S99.06 77.1 99.06 50.03 77.1 1 50.03 1z'/%3E%3C/g%3E%3C/svg%3E");

}

.checkbox-small + label,

.radio-small + label {

    background-size: 13px;

    height: 15px;

    line-height: 15px;

    padding-left: 20px;

    font-size: 0.75rem;

}

.checkbox-large + label {

    background-size: 18px;

}

.checkbox-large + label,

.radio-large + label {

    height: 20px;

    line-height: 20px;

    padding-left: 30px;

    font-size: 1rem;

}

.checkbox-x-large + label {

    background-size: 26px !important;

    min-height: 26px;

    padding-left: 42px;

    font-size: 1rem;

    line-height: 1.625rem;

}

.radio-large + label {

    background-size: 18px;

}

.input.multiple:disabled,

input.checkbox:disabled + label,

input.radio:disabled + label,

input:disabled {

    cursor: default;

    opacity: 0.33;

}

input.input {

    border-radius: 12px;

    padding: 10px;

}

input.input,

textarea.textarea {

    background-color: #111113;

    border: 2px solid transparent;

    color: rgba(255, 255, 255, 0.8);

    display: inline-block;

    height: 40px;

    line-height: 20px;

    transition: color ease 0.25s, background ease 0.25s, background-color ease 0.25s;

    font-size: 0.75rem;

}

input.input::placeholder,

textarea.textarea::placeholder {

    color: rgba(223, 223, 223, 0.6);

}

input.input:hover:not(input.input:focus, textarea.textarea:focus):not(input.input.error, textarea.textarea.error),

textarea.textarea:hover:not(input.input:focus, textarea.textarea:focus):not(input.input.error, textarea.textarea.error) {

    border-color: rgba(255, 255, 255, 0.2);

}

input.input:focus,

textarea.textarea:focus {

    background-color: #050506;

    border-color: #ff3332;

}

input.input.error,

textarea.textarea.error {

    border: 1px solid #fd3a5b;

    color: #fd3a5b;

}

input.input.error:hover,

textarea.textarea.error:hover {

    border: 1px solid #d5444e;

    color: #d5444e;

}

input.input.error:active,

input.input.error:focus,

textarea.textarea.error:active,

textarea.textarea.error:focus {

    border: 1px solid #d5444e;

    color: #d5444e;

}

input.input.date-small,

input.input.email-small,

input.input.number-small,

input.input.password-small,

input.input.search-small,

input.input.text-small {

    border-radius: 15px;

    height: 30px;

    font-size: 0.813rem;

    line-height: 0.938rem;

}

input.input.date-medium,

input.input.email-medium,

input.input.number-medium,

input.input.password-medium,

input.input.search-medium,

input.input.text-medium {

    border-radius: 12px;

    height: 32px;

    padding: 0 16px;

    font-size: 0.875rem;

    line-height: 1.063rem;

}

input[type="email"].input.theme-light,

input[type="number"].input.theme-light,

input[type="password"].input.theme-light,

input[type="tel"].input.theme-light,

input[type="text"].input.theme-light {

    background-color: rgba(255, 255, 255, 0.15);

    border: 2px solid transparent;

    box-shadow: none;

}

input[type="email"].input.theme-light:active,

input[type="email"].input.theme-light:focus,

input[type="number"].input.theme-light:active,

input[type="number"].input.theme-light:focus,

input[type="password"].input.theme-light:active,

input[type="password"].input.theme-light:focus,

input[type="tel"].input.theme-light:active,

input[type="tel"].input.theme-light:focus,

input[type="text"].input.theme-light:active,

input[type="text"].input.theme-light:focus {

    background-color: rgba(255, 255, 255, 0.15);

    border: 2px solid #ff3332;

}

.multiple.input,

textarea.textarea {

    border-radius: 12px;

    padding: 10px;

}

label {

    display: inline-block;

    margin-bottom: 0;

    text-align: right;

}

input.block {

    width: 100%;

}

.multiple.input {

    background-color: #111113;

    border: 1px solid transparent;

    color: rgba(255, 255, 255, 0.8);

    cursor: text;

    display: flex;

    flex-wrap: wrap;

    line-height: 20px;

    min-height: 30px;

    padding: 2px 10px;

    font-size: 0.75rem;

}

.multiple.input input {

    background: 0 0;

    border: transparent;

    color: rgba(255, 255, 255, 0.8);

    flex-grow: 1;

    height: 25px;

    margin: 5px;

}

.multiple.input .multiple-item {

    align-items: center;

    background-color: #464646;

    border-radius: 20px;

    color: #fff;

    display: flex;

    font-weight: 500;

    height: 25px;

    justify-content: space-between;

    line-height: 25px;

    margin: 5px;

    padding: 0 5px 0 10px;

    vertical-align: top;

}

.multiple.input .multiple-item .multiple-item-remove {

    cursor: pointer;

    fill: #6e6e6e;

    margin-left: 10px;

}

.multiple.input .multiple-item .multiple-item-remove:focus .icon,

.multiple.input .multiple-item .multiple-item-remove:hover .icon {

    fill: #d72c37;

}

.multiple.input .multiple-item.error {

    background-color: #603838;

}

.select {

    line-height: normal;

    position: relative;

}

.select .native-select {

    -webkit-appearance: none;

    appearance: none;

    background-color: transparent;

    border: 0;

    color: transparent;

    height: 100%;

    left: 0;

    opacity: 0.01;

    position: absolute;

    top: 0;

    width: 100%;

    z-index: 1;

}

.select,

.select.disabled {

    transition: all 120msms ease-in-out 0s;

}

.select.disabled {

    opacity: 0.33;

}

.select.disabled > .select-control:hover {

    box-shadow: none;

}

.select.disabled > .select-arrow-zone {

    cursor: default;

    pointer-events: none;

}

.select-control {

    background-clip: padding-box !important;

    background-color: #111113;

    border: 1px solid transparent;

    border-radius: 12px;

    box-shadow: none;

    color: #fff;

    cursor: default;

    display: flex;

    height: 40px;

    outline: 0;

    overflow: hidden;

    padding-right: 35px;

    position: relative;

    transition-duration: 120ms;

    transition-property: border, border-color, box-shadow;

    transition-timing-function: ease-in-out;

    width: 100%;

}

.select-control:hover {

    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);

}

.select.is-searchable.is-focused:not(.is-open) > .select-control,

.select.is-searchable.is-open > .select-control {

    cursor: text;

}

.select.is-open > .select-control {

    background: #111113;

    border-color: transparent;

    border-bottom-left-radius: 0;

    border-bottom-right-radius: 0;

}

.select.is-open > .select-control > .select-arrow-zone > .icon {

    transform: rotate(180deg);

}

.select.is-focused > .select-control {

    background: #050506;

    border-color: #ff3332;

    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 5px #5f5f61;

}

.select-value {

    align-items: center;

    display: flex;

    margin-bottom: 2px;

    margin-top: 2px;

}

.select .select-placeholder,

.select:not(.is-multiple) > .select-control .select-value {

    bottom: 0;

    color: rgba(223, 223, 223, 0.6);

    left: 0;

    line-height: 38px;

    max-width: 100%;

    overflow: hidden;

    padding-left: 10px;

    padding-right: 10px;

    position: absolute;

    right: 0;

    text-overflow: ellipsis;

    top: 0;

    white-space: nowrap;

}

.select.has-value.is-pseudo-focused:not(.is-multiple) > .select-control > .select-value .select-value-label,

.select.has-value:not(.is-multiple):not(.is-focused) > .select-control > .select-value .select-value-label {

    color: #fff;

}

.select.has-value.is-pseudo-focused:not(.is-multiple) > .select-control > .select-value a.select-value-label,

.select.has-value:not(.is-multiple):not(.is-focused) > .select-control > .select-value a.select-value-label {

    cursor: pointer;

    text-decoration: none;

}

.select.has-value.is-pseudo-focused:not(.is-multiple) > .select-control > .select-value a.select-value-label:hover,

.select.has-value:not(.is-multiple):not(.is-focused) > .select-control > .select-value a.select-value-label:hover {

    color: #ff3332;

    text-decoration: underline;

}

.select.has-value.is-pseudo-focused .select-input {

    opacity: 0;

}

.select-control:not(.select.is-searchable) > .select-input {

    outline: 0;

}

.select-loading,

.select-loading-zone {

    position: relative;

    vertical-align: middle;

    width: 16px;

}

.select-loading-zone {

    cursor: pointer;

    display: table-cell;

    text-align: center;

}

.select-loading {

    animation: select-animation-spin 400ms infinite linear;

    border: 2px solid transparent;

    border-radius: 50%;

    border-right-color: #fff;

    box-sizing: border-box;

    display: inline-block;

    height: 16px;

}

.select-arrow-zone,

.select-clear-zone {

    cursor: pointer;

    position: absolute;

    right: 10px;

    text-align: center;

    top: 50%;

    transform: translateY(-50%);

    z-index: 2;

}

.select-clear-zone {

    animation: select-animation-fadeIn 200ms;

    padding: 5px;

}

.select-clear-zone > .icon {

    color: rgba(255, 255, 255, 0.75);

    display: block;

    margin: 0;

    transition: all 120msms ease-in-out 0s;

}

.select-clear-zone:hover,

.title-ds a {

    color: #fff;

}

.select-clear-zone ~ .select-arrow-zone {

    right: 30px;

}

.select-arrow-zone {

    color: #a0a0a1;

    padding-right: 5px;

}

.select-arrow-zone .icon {

    display: block;

    height: 6px;

    margin: 0;

    width: 6px;

    transition: all 120msms ease-in-out 0s;

}

.select .select-arrow-zone:hover > .icon,

.select.is-open .icon {

    fill: #fff;

}

.select-input {

    -webkit-appearance: none;

    appearance: none;

    background: 0 0;

    border: 0;

    box-shadow: none;

    color: #fff;

    cursor: default;

    display: inline-block;

    font-family: inherit;

    font-size: inherit;

    height: 38px;

    margin: 0;

    outline: 0;

    padding: 0 20px;

    vertical-align: middle;

}

.select-input.is-focused {

    cursor: text;

}

.select-menu-outer {

    border-bottom-left-radius: 12px;

    border-bottom-right-radius: 12px;

    background-color: #1d1d1d;

    border: 1px solid #ff3332;

    border-top-color: #5a2d88;

    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 5px #5f5f61;

    box-sizing: border-box;

    margin-top: -1px;

    max-height: 220px;

    overflow: hidden;

    position: absolute;

    top: 100%;

    width: 100%;

    z-index: 501;

}

.select-option {

    box-sizing: border-box;

    color: #fff;

    cursor: pointer;

    display: block;

    height: 40px;

    line-height: 20px;

    padding: 10px;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.select-option:last-child {

    border-bottom-left-radius: 12px;

    border-bottom-right-radius: 12px;

}

.select-option.is-focused {

    background-color: #050506;

    color: #fff;

}

.select-no-result,

.select-option.disabled {

    color: #fff;

    cursor: default;

}

.select-no-result {

    box-sizing: border-box;

    display: block;

    padding: 10px;

}

.select-menu .scroll-bar-container {

    max-height: 218px;

}

.is-multiple.is-for-native-controls .select-value {

    padding-right: 5px;

}

.is-multiple .select-control .select-arrow-zone,

.is-multiple.is-for-native-controls .select-value-icon {

    display: none;

}

.is-multiple .select-control {

    align-items: center;

    display: flex;

    flex-flow: row wrap;

    height: auto;

}

.is-multiple .select-input {

    padding-left: 10px;

    vertical-align: middle;

}

.is-multiple.has-value .select-input {

    padding-left: 10px;

}

.is-multiple .select-value {

    background-color: #464646;

    border-radius: 19px;

    color: #fff;

    display: inline-block;

    flex-shrink: 1;

    font-size: 0.85714rem;

    font-weight: 500;

    margin-left: 10px;

    min-height: 25px;

    padding: 5px 20px 5px 5px;

    position: relative;

    vertical-align: top;

}

.is-multiple .select-value-icon,

.is-multiple .select-value-label {

    display: inline-block;

    vertical-align: middle;

}

.is-multiple .select-value-label {

    border-bottom-right-radius: 19px;

    border-top-right-radius: 19px;

    cursor: default;

    padding: 0 10px;

}

.is-multiple a.select-value-label {

    color: #fff;

    cursor: pointer;

    text-decoration: none;

}

.is-multiple .select-value-icon {

    cursor: pointer;

    position: absolute;

    right: 5px;

    top: 50%;

    transform: translateY(-50%);

}

.is-multiple .select-value-icon .icon {

    fill: #6e6e6e;

    margin: 0;

    pointer-events: none;

}

.is-multiple .select-value-icon:focus .icon,

.is-multiple .select-value-icon:hover .icon {

    fill: #d72c37;

}

.is-multiple.disabled {

    opacity: 0.33;

}

.is-multiple.disabled .select-value-icon {

    cursor: not-allowed;

}

.select.error .select-control {

    border: 1px solid #fd3a5b;

}

.select.error .select-control .select-input {

    color: #fd3a5b;

}

.select.error .select-menu-outer {

    border: 1px solid #fd3a5b;

    border-top-color: #872637;

    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px rgba(253, 58, 91, 0.75);

}

.select.error.is-focused .select-control {

    color: #d5444e;

}

.select.error.is-focused .select-control,

.select.error.is-focused .select-menu-outer,

.select.error:hover .select-control {

    border: 1px solid #d5444e;

    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px rgba(213, 68, 78, 0.75);

}

.select.error.is-focused .select-menu-outer {

    border-top-color: #732b31;

}

.select.error:hover .select-control {

    color: #d5444e;

}

.select.select-small {

    font-size: 0.75rem;

}

.select.select-small .select-control {

    border-radius: 15px;

}

.select.select-small .select-placeholder,

.select.select-small:not(.is-multiple) > .select-control .select-value {

    line-height: 30px;

}

.select.select-small .select-input {

    height: 30px;

}

.select.select-small.is-open > .select-control {

    border-bottom-left-radius: 0;

    border-bottom-right-radius: 0;

}

.select.select-small .select-loading-zone {

    width: 14px;

}

.select.select-small .select-loading {

    border: 1px solid transparent;

    height: 14px;

    width: 14px;

}

.select.select-small .select-option {

    height: 30px;

    line-height: 10px;

}

.select.select-small .select-value {

    margin-top: 2px;

}

.select.select-small:not(.is-multiple) .select-control {

    height: 32px;

}

.select.select-small.is-multiple .select-value {

    height: 26px;

    margin-left: 3px;

}

.de {

    background: rgba(0, 0, 0, 0.9);

    bottom: 0;

    left: 0;

    position: fixed;

    top: 0;

    width: 100%;

    z-index: 211;

}

.de__root-showing {

    overflow: initial;

}

.de__big-logo {

    left: 0;

    pointer-events: none;

    position: absolute;

    top: 11px;

}

.de__content {

    bottom: 64px;

    left: 0;

    overflow: hidden;

    position: absolute;

    top: 64px;

    width: 100%;

}

.de__list {

    align-items: center;

    bottom: 0;

    column-gap: 40px;

    display: flex;

    left: 0;

    position: absolute;

    top: 0;

}

.de__close {

    color: #707071;

    cursor: pointer;

    padding: 4px;

    position: absolute;

    right: 18px;

    top: 12px;

}

.de__close:hover {

    color: #cfcfd0;

}

.de__content-mobile {

    align-items: center;

    display: flex;

    height: 100%;

    justify-content: center;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

}

.messenger-chats {

    align-items: flex-end;

    bottom: 0;

    display: flex;

    height: 0;

    overflow: visible;

    position: fixed;

    right: 20px;

    z-index: 104;

}

@media (max-width: 639px) {

    .messenger-chats {

        left: 0;

        right: 0;

        z-index: 202;

    }

}

.feed-my-club__header {

    align-items: center;

    display: flex;

    height: 40px;

    position: absolute;

    right: 0;

    top: 14px;

    z-index: 5;

}

.feed__post-label {

    left: 16px;

    pointer-events: none;

    position: absolute;

    top: 16px;

    z-index: 3;

}

@media screen and (max-width: 767px) {

    .feed__post-label {

        left: 14px;

        top: 14px;

    }

}

.empty-feed-placeholder {

    font-size: 30px;

    margin: 20px 0;

    text-align: center;

}

.empty-feed-placeholder .icon {

    height: 100px;

    margin: 0 auto 40px;

    width: 100px;

}

@media screen and (max-width: 639px) {

    .feed-post .text-post,

    .feed-post .r {

        border-radius: 0;

    }

    .feed-post .feed-content {

        margin: 0-16px;

        padding: 0 0 20px;

    }

    .feed-post .tile-content-info {

        padding: 0 14px;

    }

    .feed-post .text-post .text {

        padding: 0 16px;

    }

    .feed-my-club__header {

        right: 10px;

        top: 4px;

    }

}

.landing-benefits {

    display: flex;

    justify-content: space-between;

    margin-bottom: 156px;

    margin-top: 19px;

}

@media screen and (max-width: 1023px) {

    .landing-benefits {

        flex-wrap: wrap;

        margin-bottom: 116px;

    }

}

@media screen and (max-width: 639px) {

    .landing-benefits {

        flex-direction: column;

        justify-content: flex-start;

        margin-top: 82px;

    }

}

.landing-benefit {

    width: 25%;

}

.landing-benefit__icon-wrapper {

    border: 3px solid rgb(241 16 16 / 20%);

    border-radius: 24px;

    display: inline-block;

    padding: 18px;

}

.landing-benefit__icon-wrapper .icon {

    height: 32px;

    width: 32px;

}

.landing-benefit__title {

    font-weight: 700;

    margin-top: 24px;

    font-size: 1.375rem;

    line-height: 1.65rem;

}

.landing-benefit__subtitle {

    margin-top: 24px;

    opacity: 0.8;

    font-size: 1rem;

    line-height: 1.5rem;

}

@media screen and (max-width: 1023px) {

    .landing-benefit {

        width: 34%;

    }

    .landing-benefit:last-child {

        margin-top: 64px;

    }

}

@media screen and (max-width: 639px) {

    .landing-benefit {

        width: 100%;

        text-align: center;

    }

    .landing-benefit:last-child {

        margin-top: 0;

    }

    .landing-benefit:not(:last-child) {

        margin-bottom: 36px;

    }

}

.landing-abilities__title {

    font-size: 3rem;

    line-height: 3.25rem;

    font-weight: 700;

    margin: 0 0 24px;

}

.landing-abilities__clubs-wrapper .landing-ability__description {

    flex: 2;

}

.landing-abilities__clubs-wrapper .landing-ability__content {

    flex: 3;

}

.landing-abilities__referrals-wrapper {

    margin: 100px 0 0;

}

.landing-abilities__referrals-wrapper .landing-ability__description {

    flex: 2;

    position: relative;

}

.landing-abilities__referrals-wrapper .landing-ability__content {

    flex: 2;

}

.landing-abilities__unlock .landing-ability__content {

    align-items: center;

    display: flex;

    height: 371px;

    margin-right: 50px;

    position: relative;

}

@media screen and (max-width: 639px) {

    .landing-abilities__unlock {

        margin-left: unset;

        width: unset;

    }

}

.landing-abilities__with-margin {

    margin-bottom: 250px;

}

.landing-abilities__height-limited {

    max-height: 650px;

}

.landing-abilities__subtitle {

    color: #cfcfd0;

    padding: 0 24px;

    text-align: center;

    font-size: 1rem;

    line-height: 1.75rem;

}

.landing-abilities__screen {

    background: url(/assets/common/images/promo/screen.webp) center/contain no-repeat;

    border-radius: 6%;

    box-shadow: 1px 1px 68px rgb(87 13 13 / 60%);

    position: absolute;

    right: 0;

    width: 563px;

}

.landing-abilities__screen::after {

    content: "";

    display: block;

    padding-top: 67.8%;

    width: 100%;

}

.landing-abilities__screen-wrapper {

    background-color: #000;

    border-radius: 27px;

    box-shadow: 0 3.0794827938px 110.0915222168px 0 rgba(163, 73, 252, 0.4);

    padding: 14px 11px;

    position: relative;

}

.landing-abilities__screen-wrapper::after {

    background: linear-gradient(180deg, #ff3332 0, #270548 100%);

    border-radius: 30px;

    bottom: -3px;

    content: "";

    left: -3px;

    position: absolute;

    right: -3px;

    top: -3px;

    z-index: -1;

}

.landing-abilities__chat .landing-ability__description {

    max-width: 472px;

}

.landing-abilities__clubs {

    flex: 1;

    height: 510px;

    position: relative;

}

.landing-abilities__clubs-club {

    border: 3px solid #ff3332;

    box-shadow: 0 0 119.787px rgba(163, 73, 252, 0.4);

    overflow: hidden;

    position: absolute;

}

.landing-abilities__clubs-club::after {

    bottom: 0;

    content: "";

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    transition: transform 0.6s;

    width: 100%;

}

.landing-abilities__clubs-club:hover::after {

    transform: scale(1.3);

}

.landing-abilities__clubs-club-1 {

    border-radius: 63.6632px;

    height: 192.66px;

    left: 0;

    top: 69%;

    transform: rotate(-10.44deg);

    width: 192.66px;

}

.landing-abilities__clubs-club-1::after {

    background: url(/assets/common/images/promo/avatar3.webp) center/cover no-repeat;

}

.landing-abilities__clubs-club-2 {

    border-radius: 52.7734px;

    height: 159.16px;

    left: 21.5%;

    top: 13.5%;

    transform: rotate(16.89deg);

    width: 159.16px;

}

.landing-abilities__clubs-club-2::after {

    background: url(/assets/common/images/promo/avatar4.webp) center/cover no-repeat;

}

.landing-abilities__clubs-club-3 {

    border-radius: 28.4809px;

    height: 84px;

    left: 55%;

    top: 11%;

    transform: rotate(4deg);

    width: 84px;

}

.landing-abilities__clubs-club-3::after {

    background: url(/assets/common/images/promo/avatar5.webp) center/cover no-repeat;

}

.landing-abilities__clubs-club-4 {

    border-radius: 42.7213px;

    height: 125.65px;

    left: 53%;

    top: 41%;

    transform: rotate(-11.68deg);

    width: 125.65px;

}

.landing-abilities__clubs-club-4::after {

    background: url(/assets/common/images/promo/avatar6.webp) center/cover no-repeat;

}

.landing-abilities__clubs-club-5 {

    border-radius: 29.3186px;

    height: 83.77px;

    left: 31%;

    top: 56%;

    transform: rotate(10.93deg);

    width: 83.77px;

}

.landing-abilities__clubs-club-5::after {

    background: url(/assets/common/images/promo/avatar7.webp) center/cover no-repeat;

}

.landing-abilities__clubs-club-6 {

    border-radius: 36.02px;

    height: 100.52px;

    left: 76%;

    top: 72%;

    transform: rotate(-6.72deg);

    width: 100.52px;

}

.landing-abilities__clubs-club-6::after {

    background: url(/assets/common/images/promo/avatar8.webp) center/cover no-repeat;

}

.landing-abilities__clubs-club-7 {

    border-radius: 34.3446px;

    height: 100.52px;

    left: 45%;

    top: 87%;

    transform: rotate(11.56deg);

    width: 100.52px;

}

.landing-abilities__clubs-club-7::after {

    background: url(/assets/common/images/promo/avatar9.webp) center/cover no-repeat;

}

.landing-abilities__clubs-club-8 {

    border-radius: 28.4809px;

    bottom: -150px;

    height: 84px;

    left: 170px;

    transform: rotate(-13deg);

    width: 84px;

}

.landing-abilities__clubs-club-8::after {

    background: url(/assets/common/images/promo/avatar5.webp) center/cover no-repeat;

}

.landing-abilities__clubs-club-9 {

    border-radius: 39px;

    height: 120px;

    left: 95%;

    top: 83.5%;

    transform: rotate(16.89deg);

    width: 120px;

}

.landing-abilities__clubs-club-9::after {

    background: url(/assets/common/images/promo/avatar4.webp) center/cover no-repeat;

}

.landing-abilities__clubs-club-10 {

    border-radius: 24px;

    height: 72px;

    left: 38%;

    top: 46%;

    transform: rotate(-11.68deg);

    width: 72px;

}

.landing-abilities__clubs-club-10::after {

    background: url(/assets/common/images/promo/avatar6.webp) center/cover no-repeat;

}

.landing-abilities__clubs-club-11 {

    border-radius: 29.3186px;

    height: 95px;

    left: 70%;

    top: 55%;

    transform: rotate(-17.07deg);

    width: 95px;

}

.landing-abilities__clubs-club-11::after {

    background: url(/assets/common/images/promo/avatar7.webp) center/cover no-repeat;

}

.landing-abilities__clubs-dollar {

    left: 63%;

    position: absolute;

    top: 19%;

}

.landing-abilities__clubs-dollar .smile {

    height: 120px;

    margin: 0;

    width: 120px;

}

.landing-abilities__clubs-club-placeholder {

    background: #ff3332;

    position: absolute;

}

.landing-abilities__clubs-club-placeholder-1 {

    border-radius: 7.53906px;

    height: 20.1px;

    left: 18%;

    opacity: 0.6;

    top: 49.5%;

    transform: rotate(-18.46deg);

    width: 20.1px;

}

.landing-abilities__clubs-club-placeholder-2 {

    border-radius: 5.86371px;

    height: 16.75px;

    left: 33.3%;

    opacity: 0.2;

    top: 79%;

    transform: rotate(-18.46deg);

    width: 16.75px;

}

.landing-abilities__clubs-club-placeholder-3 {

    border-radius: 5.86371px;

    height: 18.43px;

    left: 47.4%;

    opacity: 0.3;

    top: 67.2%;

    transform: rotate(-2.71deg);

    width: 18.43px;

}

.landing-abilities__clubs-club-placeholder-4 {

    border-radius: 9.21441px;

    height: 26.81px;

    left: 69%;

    opacity: 0.5;

    top: 89.7%;

    transform: rotate(6.11deg);

    width: 26.81px;

}

.landing-abilities__clubs-club-placeholder-5 {

    border-radius: 13.4028px;

    height: 40.21px;

    left: 71.3%;

    opacity: 0.3;

    top: 34%;

    transform: rotate(-18.46deg);

    width: 40.21px;

}

.landing-abilities__clubs-club-placeholder-6 {

    border-radius: 7.53906px;

    height: 18.43px;

    left: 78.5%;

    opacity: 0.5;

    top: 55.5%;

    transform: rotate(-18.46deg);

    width: 18.43px;

}

.landing-abilities__mobile-screen {

    background: url(../images/mobile.png) center/contain no-repeat;

    flex: 1;

    height: 655px;

}

.landing-abilities__mobile-screen::after {

    background: linear-gradient(180deg, rgba(5, 5, 6, 0) 0, rgba(5, 5, 6, 0.84) 33.45%, #050506 54.01%, #050506 100%);

    bottom: 0;

    content: "";

    height: 287px;

    pointer-events: none;

    position: absolute;

    width: 100%;

}

@media screen and (max-width: 767px) {

    .landing-abilities__earn .landing-ability__content,

    .landing-abilities__earn .landing-ability__description {

        width: 50%;

    }

    .landing-abilities__with-margin {

        margin-bottom: 180px;

    }

}

@media screen and (max-width: 1023px) {

    .landing-abilities__clubs-wrapper .landing-ability__content {

        margin: 0 auto;

        width: 60%;

    }

    .landing-abilities__clubs {

        height: unset;

        margin-top: 40px;

        min-height: 350px;

        min-width: 500px;

        position: relative;

    }

    .landing-abilities__clubs .landing-ability__description {

        flex: 2;

    }

    .landing-abilities__clubs .landing-ability__content {

        flex: 3;

    }

    .landing-abilities__clubs-club {

        border: 2.1px solid #ff3332;

        position: absolute;

    }

    .landing-abilities__clubs-club-1 {

        border-radius: 40.67px;

        height: 123.1px;

        top: 63%;

        width: 123.1px;

    }

    .landing-abilities__clubs-club-2 {

        border-radius: 33.71px;

        height: 101.69px;

        left: 21%;

        width: 101.69px;

    }

    .landing-abilities__clubs-club-3 {

        border-radius: 18.19px;

        height: 53.52px;

        left: 53.5%;

        top: 0;

        width: 53.52px;

    }

    .landing-abilities__clubs-club-4 {

        border-radius: 27.29px;

        height: 80.28px;

        left: 51.7%;

        top: 31%;

        width: 80.28px;

    }

    .landing-abilities__clubs-club-5 {

        border-radius: 18.73px;

        height: 53.52px;

        left: 30%;

        top: 47%;

        width: 53.52px;

    }

    .landing-abilities__clubs-club-6 {

        border-radius: 23px;

        height: 64.23px;

        left: 67.3%;

        top: 65.2%;

        width: 64.23px;

    }

    .landing-abilities__clubs-club-7 {

        border-radius: 22px;

        height: 64.23px;

        left: 44%;

        top: 75.5%;

        width: 64.23px;

    }

}

@media screen and (max-width: 767px) {

    .landing-abilities__clubs-wrapper .landing-ability__content,

    .landing-abilities__earn .landing-ability__content,

    .landing-abilities__earn .landing-ability__description {

        width: 100%;

    }

    .landing-abilities__force-up-move {

        margin-top: -25vw;

    }

    .landing-abilities__height-limited {

        max-height: unset;

    }

    .landing-abilities__with-margin {

        margin-bottom: 100px;

    }

    .landing-abilities__title {

        font-size: 2rem;

        line-height: 2.438rem;

        margin: 0 0 20px;

    }

    .landing-abilities__subtitle {

        font-size: 1rem;

        line-height: 1.625rem;

        color: #a0a0a1;

        margin-bottom: 64px;

        padding: 0;

    }

    .landing-abilities__screen {

        margin-top: 62px;

        max-width: 100%;

        position: relative;

        width: 100%;

    }

    .landing-abilities__mobile-screen {

        margin-top: 40px;

        max-height: 440px;

        width: 100%;

    }

    .landing-abilities__mobile-screen::after {

        height: 174px;

    }

    .landing-abilities__referrals-wrapper {

        margin: 140px 0 0;

    }

    .landing-abilities__referrals-wrapper .landing-abilities__clubs-club,

    .landing-abilities__referrals-wrapper .landing-ability__content {

        display: none;

    }

}

@media screen and (max-width: 639px) {

    .landing-abilities__with-margin {

        margin-bottom: 60px;

    }

}

.no-webp .landing-abilities__mobile-screen {

    background-image: url(/assets/common/images/promo/mobile-screen.png);

}

.no-webp .landing-abilities__screen {

    background-image: url(/assets/common/images/promo/screen.png);

}

.no-webp .landing-abilities__clubs-club-1 {

    background-image: url(/assets/common/images/promo/avatar3.png);

}

.no-webp .landing-abilities__clubs-club-2 {

    background-image: url(/assets/common/images/promo/avatar4.png);

}

.no-webp .landing-abilities__clubs-club-3 {

    background-image: url(/assets/common/images/promo/avatar5.png);

}

.no-webp .landing-abilities__clubs-club-4 {

    background-image: url(/assets/common/images/promo/avatar6.png);

}

.no-webp .landing-abilities__clubs-club-5 {

    background-image: url(/assets/common/images/promo/avatar7.png);

}

.no-webp .landing-abilities__clubs-club-6 {

    background-image: url(/assets/common/images/promo/avatar8.png);

}

.no-webp .landing-abilities__clubs-club-7 {

    background-image: url(/assets/common/images/promo/avatar9.png);

}

.no-webp .landing-abilities__clubs-club-8 {

    background-image: url(/assets/common/images/promo/avatar5.png);

}

.no-webp .landing-abilities__clubs-club-9 {

    background-image: url(/assets/common/images/promo/avatar4.png);

}

.no-webp .landing-abilities__clubs-club-10 {

    background-image: url(/assets/common/images/promo/avatar6.png);

}

.become-part {

    align-items: center;

    background-color: rgba(255, 255, 255, 0.08);

    border-radius: 22px;

    display: flex;

    justify-content: space-between;

    margin: 80px 0 95px;

    padding: 24px 40px;

    width: 100%;

}

.become-part__input {

    background: 0 0;

    border: 0;

    box-shadow: none;

    font-size: inherit;

    font-weight: inherit;

    line-height: inherit;

    outline: 0;

    padding: 0;

}

.become-part__title {

    font-size: 1.75rem;

    font-weight: 500;

    line-height: 2.137rem;

}

.become-part__form {

    display: flex;

    height: 56px;

}

.become-part__form .btn {

    background: #d60908;

    border-radius: 16px;

    padding: 17px 33.5px;

    font-size: 1.125rem;

    line-height: 1.375rem;

}

.become-part__input-composite {

    align-items: center;

    background-color: rgba(255, 255, 255, 0.15);

    border-radius: 16px;

    display: flex;

    font-weight: 500;

    margin-right: 20px;

    padding: 18px 22px;

    font-size: 1.375rem;

    line-height: 1.25rem;

}

.become-part__input-composite .input-wrapper input,

.become-part__input-composite .input-wrapper input:focus {

    background: 0 0;

    border: 0;

    box-shadow: none;

    font-weight: 500;

    padding: 0;

    font-size: 1.375rem;

    line-height: 1.25rem;

}

@media screen and (max-width: 1023px) {

    .become-part {

        flex-direction: column;

        margin: 64px 0 132px;

        max-width: 458px;

        padding: 16px;

    }

    .become-part__title {

        font-size: 1.75rem;

        line-height: 2.137rem;

    }

    .become-part__input-composite {

        font-size: 1rem;

        line-height: 1.25rem;

        margin-right: 0;

    }

    .become-part__input-composite .input-wrapper input,

    .become-part__input-composite .input-wrapper input:focus {

        font-size: 1rem;

        line-height: 1.25rem;

        height: auto;

    }

    .become-part__form {

        flex-direction: column;

        height: auto;

        margin-top: 20px;

        width: 100%;

    }

    .become-part__form .btn {

        margin-top: 20px;

    }

}

@media screen and (max-width: 639px) {

    .become-part {

        margin: 60px 0 100px;

    }

}

.tooltip {

    display: table;

    font-size: 11px;

    line-height: 1.2rem;

    padding: 5px;

    position: fixed;

    text-align: left;

    user-select: auto;

    white-space: normal;

    z-index: 599;

}

.tooltip--not-clickable {

    pointer-events: none;

}

.tooltip--pure {

    border-radius: 0;

    padding: 0;

}

.tooltip-inner {

    background: #fff;

    border-color: #fff;

    border-radius: 6px;

    box-shadow: 0 0 4px rgba(255, 255, 255, 0.2);

    color: #000;

    display: inline-block;

    font-weight: 500;

    padding: 6px 10px;

    position: relative;

    text-shadow: none;

    text-transform: none;

}

.tooltip-inner--pure {

    background: 0 0;

    border: 0;

    box-shadow: none;

    padding: 0;

}

.tooltip-inner--arrow::before {

    border-color: transparent;

    border-style: solid;

    content: "";

    height: 0;

    position: absolute;

    width: 0;

}

.tooltip-title {

    text-align: center;

    font-size: 0.875rem;

}

.tooltip-close {

    color: #fff;

    cursor: pointer;

    margin: 0;

    opacity: 0.5;

    padding: 6px 8px;

    position: absolute;

    right: 0;

    top: 0;

}

.tooltip-close .icon {

    height: 14px;

    margin: 0;

    width: 14px;

}

.tooltip-close:hover {

    opacity: 8;

}

.tooltip.one-line {

    display: inline-block;

    line-break: auto;

    white-space: nowrap;

}

.tooltip.one-line > .tooltip-inner {

    max-width: 100%;

    overflow: hidden;

    text-overflow: ellipsis;

    vertical-align: top;

}

.tooltip.one-line:hover {

    white-space: normal;

    width: 250px !important;

    z-index: 102;

}

.tooltip::before {

    box-sizing: border-box;

}

.tooltip.bottom > .tooltip-inner::before {

    border-bottom-color: inherit;

    border-width: 0 5px 5px;

    bottom: 100%;

    left: calc(50% - 5px);

}

.tooltip.left > .tooltip-inner::before {

    border-left-color: inherit;

    border-width: 5px 0 5px 5px;

    margin-top: -5px;

    right: -5px;

    top: 50%;

}

.tooltip.right > .tooltip-inner::before {

    border-right-color: inherit;

    border-width: 5px 5px 5px 0;

    margin-top: -5px;

    right: 100%;

    top: 50%;

}

.tooltip.top > .tooltip-inner::before {

    border-top-color: inherit;

    border-width: 5px 5px 0;

    left: calc(50% - 5px);

    top: 100%;

}

.tooltip.bottom-left > .tooltip-inner::before {

    border-bottom-color: inherit;

    border-width: 0 5px 5px;

    margin-top: 2px;

    right: 5px;

    top: 0;

}

.tooltip.bottom-right > .tooltip-inner::before {

    border-bottom-color: inherit;

    border-width: 0 5px 5px;

    left: 5px;

    margin-top: 2px;

    top: 0;

}

.tooltip.top-left > .tooltip-inner::before {

    border-top-color: inherit;

    border-width: 5px 5px 0;

    bottom: 0;

    margin-bottom: 2px;

    right: 5px;

}

.tooltip.top-right > .tooltip-inner::before {

    border-top-color: inherit;

    border-width: 5px 5px 0;

    bottom: 0;

    left: 5px;

    margin-bottom: 2px;

}

.tooltip.error.left > .tooltip-inner::before {

    border-left-color: #d21b4c;

}

.tooltip.error.right > .tooltip-inner::before {

    border-right-color: #d21b4c;

}

.tooltip.error.top > .tooltip-inner::before {

    border-top-color: #d21b4c;

}

.tooltip.error.bottom > .tooltip-inner::before {

    border-bottom-color: #d21b4c;

}

.tooltip.error .tooltip-inner {

    background-color: #d21b4c;

    color: #000;

}

.tooltip.error .tooltip-inner a,

.tooltip.error .tooltip-inner a:active,

.tooltip.error .tooltip-inner a:visited {

    color: #000;

    text-decoration: underline;

}

.tooltip-animated {

    opacity: 0;

    pointer-events: none;

    transition: opacity 500ms;

}

.tooltip-animated-exit-done {

    opacity: 0;

}

.tooltip-animated-enter-done {

    opacity: 1;

}

.calculator {

    margin-top: 40px;

}

.calculator__prefix {

    display: inline-block;

    font-size: 28px;

    font-style: normal;

    font-weight: 300;

    line-height: 45px;

    margin: 0 0 100px 15%;

    padding: 0 1.8em 0 0;

    position: relative;

}

.calculator__prefix-text {

    font-family: Rubik;

    transform: rotate(-6deg) translate(-10px, 32px);

}

.calculator__prefix-diamond {

    background: url(/assets/common/images/promo/diamond.webp) center/contain no-repeat;

    height: 48px;

    position: absolute;

    right: 0;

    top: 0;

    width: 48px;

}

.calculator__prefix-arrow {

    background: url(/assets/common/images/promo/arrow-1.svg) center/contain no-repeat;

    height: 50px;

    left: 6.4em;

    margin: 1.5em 0 0;

    position: absolute;

    top: 100%;

    width: 50px;

}

.calculator__postfix {

    border: 1px dashed #ff3332;

    border-radius: 17px;

    font-size: 16px;

    line-height: 140%;

    margin: 9px auto;

    max-width: 100%;

    padding: 18px 16px 16px;

}

.calculator__postfix--first {

    margin-bottom: 130px;

    transform: rotate(-6.07deg);

    width: 354px;

}

.calculator__postfix--second {

    margin-bottom: 120px;

    transform: rotate(6.07deg);

    width: 300px;

}

.calculator__postfix-text {

    color: #bbb;

}

.calculator__postfix-text--second {

    align-items: center;

    display: flex;

}

.calculator__postfix-text-left {

    font-size: 38px;

    font-weight: 500;

    line-height: 22px;

    margin: 0 8px 0 0;

}

.calculator__postfix-arrow {

    background: url(/assets/common/images/promo/arrow-2.svg) center/contain no-repeat;

    height: 62px;

    position: absolute;

    top: 137%;

    transform: rotate(26.07deg);

    width: 52px;

}

.calculator__postfix-arrow--first {

    left: 50%;

    position: absolute;

    top: 137%;

    transform: rotate(-37.93deg) scaleX(-1);

}

.calculator__postfix-arrow--second {

    left: 40%;

    position: absolute;

    top: 137%;

    transform: rotate(33.07deg);

}

.calculator__postfix-smile {

    left: 50%;

    margin: 0 0 0-20px;

    position: absolute;

    top: -26px;

}

.calculator__postfix-smile .smile {

    height: 45px;

    margin: 0;

    width: 45px;

}

.calculator__postfix-footer {

    bottom: -162px;

    color: rgba(255, 255, 255, 0.9);

    font-size: 44px;

    font-weight: 700;

    left: 189px;

    line-height: 54px;

    position: absolute;

    transform: rotate(-5.93deg);

}

.calculator__title {

    font-size: 2.75rem;

    line-height: 3.125rem;

    font-weight: 700;

    margin: 0 0 20px;

    text-align: center;

}

.calculator__subtitle {

    color: #cfcfd0;

    font-weight: 500;

    line-height: 160%;

    margin-bottom: 59px;

    text-align: center;

    font-size: 1rem;

}

.calculator__amount {

    font-size: 90px;

    font-weight: 700;

    line-height: 98px;

    text-align: center;

}

.calculator__sliders {

    display: flex;

    justify-content: space-between;

    margin-top: 86px;

    padding: 0 40px;

}

.calculator__sliders-slider-wrapper {

    width: 45%;

}

.calculator__sliders-slider-wrapper-title {

    font-weight: 700;

    margin-top: 42px;

    text-align: center;

    font-size: 1.625rem;

    line-height: 1.5rem;

}

.calculator__sliders-slider-wrapper-subtitle {

    font-size: 1rem;

    line-height: 1.375rem;

    margin-top: 10px;

    opacity: 0.5;

    text-align: center;

}

.calculator__sliders-slider {

    align-items: center;

    display: flex;

    width: 100%;

}

.calculator__sliders-slider-thumb {

    background-color: #fff;

    border: 10px solid #d60908;

    border-radius: 20px;

    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.07), 0 0 15px 0 rgba(0, 0, 0, 0.05);

    box-sizing: content-box;

    height: 12px;

    width: 12px;

}

.calculator__sliders-slider-subs-track,

.calculator__sliders-slider-track {

    background-color: rgba(255, 255, 255, 0.4);

    border-radius: 3px;

    height: 6px;

    position: relative;

}

.calculator__sliders-slider-subs-track-0 {

    background-color: #ff3332;

}

.calculator__sliders-slider-mark {

    background-color: #fff;

    border: 3px solid #0b0313;

    border-radius: 6px;

    bottom: calc(50% - 6px);

    box-sizing: content-box;

    height: 6px;

    margin: 0 8px;

    width: 6px;

}

@media screen and (max-width: 1023px) {

    .calculator__sliders {

        flex-direction: column;

        justify-content: flex-start;

    }

    .calculator__sliders-slider-wrapper {

        width: 100%;

    }

    .calculator__sliders-slider-wrapper:not(:last-child) {

        margin-bottom: 55px;

    }

    .calculator__postfix {

        margin: 72px auto 110px;

    }

    .calculator__postfix-arrow {

        left: 24%;

        top: 112%;

        transform: rotate(34.07deg);

    }

    .calculator__postfix-footer {

        left: 130px;

    }

}

@media screen and (max-width: 639px) {

    .calculator {

        text-align: center;

    }

    .calculator__title {

        font-size: 2rem;

        line-height: 2.2rem;

    }

    .calculator__subtitle {

        font-size: 1rem;

        line-height: 1.6rem;

        margin-bottom: 40px;

    }

    .calculator__amount {

        font-size: 2.5rem;

        line-height: 2.625rem;

    }

    .calculator__prefix {

        font-size: 18px;

        line-height: 29px;

        margin: 0 auto 100px;

    }

    .calculator__prefix-diamond {

        height: 34px;

        top: 10px;

        width: 34px;

    }

    .calculator__postfix-footer {

        bottom: -115px;

        font-size: 32px;

        left: 120px;

    }

    .calculator__sliders {

        flex-direction: column;

        justify-content: flex-start;

        margin-top: 40px;

    }

    .calculator__sliders-slider-wrapper {

        width: 100%;

    }

    .calculator__sliders-slider-wrapper:not(:last-child) {

        margin-bottom: 35px;

    }

}

.login-messages {

    display: flex;

    flex-direction: column;

    margin-right: 40px;

}

@media screen and (max-width: 1023px) {

    .login-messages {

        margin-right: 20px;

    }

}

@media screen and (max-width: 639px) {

    .login-messages {

        margin: 0 auto 40px;

    }

}

.login-message-wrapper:not(:last-child) {

    margin-bottom: 15px;

}

@media screen and (max-width: 639px) {

    .login-message-wrapper:not(:last-child) {

        margin-bottom: 9.32px;

    }

}

.login-message {

    align-items: center;

    background: #100202;

    border-radius: 30px;

    box-shadow: 0 0 200px rgb(173 28 28 / 60%);

    display: inline-flex;

    padding: 20px;

    position: relative;

}

.login-message__dynamic {

    min-width: 424px;

    padding-right: 0;

}

.login-message__small {

    padding: 29.5px 53px;

}

.login-message__small-margin {

    margin-left: 1.4vw;

}

.login-message__medium-margin {

    margin-left: 90px;

}

.login-message__huge-margin {

    margin-left: 350px;

}

.login-message__avatar {

    border-radius: 22px;

    height: 64px;

    margin-right: 20px;

    width: 64px;

}

.login-message__first-avatar {

    background: url(/assets/common/images/promo/avatar1.webp) center/cover no-repeat;

}

.login-message__second-avatar {

    background: url(/assets/common/images/promo/avatar2.webp) center/cover no-repeat;

}

.login-message__text {

    font-size: 1.75rem;

    line-height: 1.925rem;

    align-items: center;

    display: flex;

    font-weight: 700;

    text-shadow: 0 0 10px rgba(0, 0, 0, 0.2);

}

.login-message__inline-emoji {

    background-repeat: no-repeat;

    background-size: contain;

    display: block;

    height: 44px;

    margin-left: 12px;

    width: 44px;

}

.login-message__absolute-emoji {

    height: 66px;

    position: absolute;

    right: 33.46px;

    top: -33.46px;

    width: 66px;

}

@media screen and (max-width: 1279px) {

    .login-message__huge-margin,

    .login-message__medium-margin,

    .login-message__small-margin {

        margin-left: 0;

    }

    .login-message__text {

        font-size: 1.163rem;

        line-height: 1.279rem;

    }

    .login-message__dynamic {

        min-width: 320px;

    }

    .login-message__avatar {

        border-radius: 14.96px;

        height: 42.51px;

        margin-right: 13.28px;

        width: 42.51px;

    }

    .login-message__absolute-emoji {

        height: 44px;

        right: 13.46px;

        top: -22.46px;

        width: 44px;

    }

    .login-message__inline-emoji {

        height: 28.23px;

        margin-left: 7.97px;

        width: 28.23px;

    }

}

@media screen and (max-width: 639px) {

    .login-message__huge-margin,

    .login-message__medium-margin,

    .login-message__small-margin {

        margin-left: 0;

    }

    .login-message__text {

        font-size: 1.088rem;

        line-height: 1.197rem;

    }

    .login-message__dynamic {

        min-width: 300px;

    }

    .login-message__avatar {

        border-radius: 13.6px;

        height: 40px;

        margin-right: 12.43px;

        width: 40px;

    }

    .login-message__absolute-emoji {

        height: 42px;

        right: 13.46px;

        top: -22.46px;

        width: 42px;

    }

    .login-message__inline-emoji {

        height: 26px;

        margin-left: 7.46px;

        width: 26px;

    }

}

.user-status-icon {

    align-items: center;

    background: #050506;

    border-radius: 50%;

    display: flex;

    justify-content: center;

    pointer-events: none;

}

.user-status-icon::after {

    background-color: #9fe20d;

    border-radius: 50%;

    content: "";

    display: block;

    height: 50%;

    width: 50%;

}

.text-s10-w700-ls0_5-upper {

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 0.5px;

    line-height: normal;

    text-transform: uppercase;

}

.text-s10-w500 {

    font-size: 10px;

    font-weight: 400;

    letter-spacing: normal;

    line-height: normal;

}

.text-s11-w400,

.text-s11-w500,

.text-s11-w700-ls0_5-upper {

    font-size: 11px;

    font-weight: 400;

    letter-spacing: normal;

    line-height: normal;

}

.text-s11-w500,

.text-s11-w700-ls0_5-upper {

    font-weight: 500;

}

.text-s11-w700-ls0_5-upper {

    font-weight: 700;

    letter-spacing: 0.5px;

    text-transform: uppercase;

}

.text-s12-w400 {

    font-size: 12px;

    font-weight: 400;

    letter-spacing: normal;

    line-height: normal;

}

.text-s12-w500,

.text-s12-w700,

.text-s12-w700-ls0_6-upper {

    font-size: 12px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: normal;

}

.text-s12-w700,

.text-s12-w700-ls0_6-upper {

    font-weight: 700;

}

.text-s12-w700-ls0_6-upper {

    letter-spacing: 0.6px;

    text-transform: uppercase;

}

.text-s13-w400 {

    font-size: 13px;

    font-weight: 400;

    letter-spacing: normal;

    line-height: normal;

}

.text-s13-w400-lh18,

.text-s13-w700,

.text-s13-w700-lh1_4 {

    font-size: 13px;

    font-weight: 400;

    letter-spacing: normal;

    line-height: 18px;

}

.text-s13-w700,

.text-s13-w700-lh1_4 {

    font-weight: 700;

    line-height: normal;

}

.text-s13-w700-lh1_4 {

    line-height: 1.4;

}

.text-s14-w400,

.text-s14-w400-lh1_3,

.text-s14-w400-lh20 {

    font-size: 14px;

    font-weight: 400;

    letter-spacing: normal;

    line-height: normal;

}

.text-s14-w400-lh1_3,

.text-s14-w400-lh20 {

    line-height: 1.3;

}

.text-s14-w400-lh20 {

    line-height: 20px;

}

.text-s14-w500,

.text-s14-w700,

.text-s15-w500,

.text-s15-w500-lh20 {

    font-size: 14px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: normal;

}

.text-s14-w700,

.text-s15-w500,

.text-s15-w500-lh20 {

    font-weight: 700;

}

.text-s15-w500,

.text-s15-w500-lh20 {

    font-size: 15px;

    font-weight: 500;

}

.text-s15-w500-lh20 {

    line-height: 20px;

}

.text-s15-w400,

.text-s15-w400-ls0_5,

.text-s15-w400-ls1 {

    font-size: 15px;

    font-weight: 400;

    letter-spacing: normal;

    line-height: normal;

}

.text-s15-w400-ls0_5,

.text-s15-w400-ls1 {

    letter-spacing: 0.5px;

}

.text-s15-w400-ls1 {

    letter-spacing: 1px;

}

.text-s15-w700,

.text-s16-w400,

.text-s16-w500 {

    font-size: 15px;

    font-weight: 700;

    letter-spacing: normal;

    line-height: normal;

}

.text-s16-w400,

.text-s16-w500 {

    font-size: 16px;

    font-weight: 400;

}

.text-s16-w500 {

    font-weight: 500;

}

.text-s16-w500-lh24,

.text-s16-w700,

.text-s17-w500-lh1_5 {

    font-size: 16px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: 24px;

}

.text-s16-w700,

.text-s17-w500-lh1_5 {

    font-weight: 700;

    line-height: normal;

}

.text-s17-w500-lh1_5 {

    font-size: 17px;

    font-weight: 500;

    line-height: 1.5;

}

.text-s18-w400,

.text-s18-w600 {

    font-size: 18px;

    font-weight: 400;

    letter-spacing: normal;

    line-height: normal;

}

.text-s18-w600 {

    font-weight: 600;

}

.text-s20-w500-lh1_5,

.text-s20-w700-lh24 {

    font-size: 20px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: 1.5;

}

.text-s20-w700-lh24 {

    font-weight: 700;

    line-height: 24px;

}

.text-s22-w700,

.text-s24-w400,

.text-s24-w700 {

    font-size: 24px;

    font-weight: 400;

    letter-spacing: normal;

    line-height: normal;

}

.text-s22-w700,

.text-s24-w700 {

    font-weight: 700;

}

.text-s22-w700 {

    font-size: 22px;

}

.text-s26-w500,

.text-s28-w600,

.text-s30-w500 {

    font-size: 26px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: normal;

}

.text-s28-w600,

.text-s30-w500 {

    font-size: 28px;

    font-weight: 600;

}

.text-s30-w500 {

    font-size: 30px;

    font-weight: 500;

}

.text-s32-w600,

.text-s40-w600,

.text-s44-w500,

.text-title-l0 {

    font-size: 32px;

    font-weight: 600;

    letter-spacing: normal;

    line-height: normal;

}

.text-s40-w600,

.text-s44-w500,

.text-title-l0 {

    font-size: 40px;

}

.text-s44-w500,

.text-title-l0 {

    font-size: 44px;

    font-weight: 500;

}

.text-title-l0 {

    font-size: 30px;

}

@media screen and (max-width: 639px) {

    .text-title-l0 {

        font-size: 26px;

        font-weight: 500;

        letter-spacing: normal;

        line-height: normal;

    }

}

.text-title-l1 {

    font-size: 34px;

    font-weight: 600;

    letter-spacing: normal;

    line-height: normal;

}

@media screen and (max-width: 639px) {

    .text-title-l1 {

        font-size: 20px;

        font-weight: 500;

        letter-spacing: normal;

        line-height: 1.5;

    }

}

.text-title-l2 {

    font-size: 24px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: normal;

}

@media screen and (max-width: 639px) {

    .text-title-l2 {

        font-size: 18px;

        font-weight: 500;

        letter-spacing: normal;

        line-height: normal;

    }

}

.title-ds {

    align-items: flex-end;

    color: #fff;

    display: flex;

    justify-content: space-between;

    margin: 0;

}

.title-ds.with-icon {

    align-items: center;

    justify-content: flex-start;

}

.title-ds.with-icon .icon {

    color: #fff;

    fill: #fff;

    height: 43px;

    margin-right: 22px;

    width: 43px;

}

@media screen and (max-width: 639px) {

    .title-ds.with-icon .icon {

        height: 32px;

        margin-right: 12px;

        width: 32px;

    }

}

.transfer-logos {

    align-items: center;

    display: flex;

}

.transfer-logos__logo-st {

    height: 36px;

    width: 186px;

}

.transfer-logos__fans {

    font-weight: 500;

}

.transfer-logos__fans--size--small {

    font-size: 20px;

}

.transfer-logos__fans--size--medium {

    font-size: 29px;

}

.transfer-logos__logo-arrow {

    display: block;

    margin: 0 12px 0 20px;

    opacity: 0.6;

}

.transfer-logos > .site-logo--size--large {

    margin: 0 0 0 8px;

    max-width: none;

}

.signup-form {

    display: flex;

    flex-direction: column;

    width: 100%;

}

.signup-form__field {

    margin-bottom: 16px;

}

.signup-form__input.input {

    background: rgba(255, 255, 255, 0.15);

    transition: all ease 0.25s;

    width: 100%;

}

.signup-form__submit-button {

    width: 100%;

}

.signup-form__terms-warning {

    align-self: center;

    color: rgba(255, 255, 255, 0.4);

    margin-bottom: 32px;

    font-size: 0.688rem;

    line-height: 1rem;

}

.signup-form__terms-warning .link {

    color: rgba(255, 255, 255, 0.4);

    text-decoration-line: underline;

    transition: all ease 0.25s;

}

.signup-form__terms-warning .link:hover {

    color: rgba(255, 255, 255, 0.6);

}

.signup-form__login-suggestion {

    align-self: center;

    color: rgba(255, 255, 255, 0.4);

    margin-top: 32px;

    transition: all ease 0.25s;

    font-size: 0.813rem;

}

.signup-form__login-suggestion .link {

    color: #ff3332;

}

.login-form .login-form__signup-description .link:hover,

.signup-form__login-suggestion .link:hover {

    color: #9e40fd;

}

.referral-program-benefits__title {

    color: #707071;

    font-size: 14px;

    font-weight: 400;

    line-height: 17px;

    margin-bottom: 12px;

}

.referral-program-benefits__benefit {

    align-items: start;

    color: #fff;

    display: grid;

    grid-auto-flow: column;

    grid-column-gap: 12px;

    justify-content: start;

    margin-bottom: 12px;

}

.referral-program-benefits__bullet {

    background: #d60908;

    border-radius: 8px;

    color: #fff;

    display: grid;

    font-size: 12px;

    font-weight: 700;

    height: 24px;

    place-items: center;

    width: 24px;

}

.referral-program-benefits__benefit-text {

    font-weight: 400;

    margin-top: 4px;

    max-width: 260px;

}

.login-form {

    display: flex;

    flex-direction: column;

    max-width: 100%;

    width: 320px;

}

.login-form .login-form__field {

    margin-bottom: 16px;

}

.login-form .login-form__input.input {

    background: rgba(255, 255, 255, 0.1);

    transition: all ease 0.25s;

    width: 100%;

}

.login-form .login-form__submit-button {

    width: 100%;

}

.login-form .login-form__forgot-password-link {

    align-self: center;

    color: rgba(255, 255, 255, 0.4);

    margin-bottom: 32px;

    text-decoration-line: underline;

    transition: all ease 0.25s;

    font-size: 0.813rem;

}

.login-form .login-form__forgot-password-link:hover,

.personal-notifications-modal-panel .header-notifications-action a {

    color: rgba(255, 255, 255, 0.8);

}

.login-form .login-form__signup-description {

    align-self: center;

    color: rgba(255, 255, 255, 0.4);

    margin-top: 32px;

    transition: all ease 0.25s;

    font-size: 0.813rem;

}

.login-form .login-form__signup-description .link {

    color: #ff3332;

}

.user-fan-club-subscription-list {

    display: grid;

    gap: 10px;

    grid-template-columns: repeat(1, 1fr);

}

@media screen and (min-width: 640px) {

    .user-fan-club-subscription-list {

        grid-template-columns: repeat(2, 1fr);

    }

}

@media screen and (min-width: 1024px) {

    .user-fan-club-subscription-list {

        gap: 20px;

        grid-template-columns: repeat(3, 1fr);

    }

}

@media screen and (min-width: 1366px) {

    .user-fan-club-subscription-list {

        grid-template-columns: repeat(4, 1fr);

    }

}

.smile {

    border: 0;

    display: inline-block;

    margin: 0 4px;

}

.smile--size--small {

    height: 20px;

    margin: 0 4px;

    width: 20px;

}

.smile--size--medium {

    height: 32px;

    margin: 0 10px;

    width: 32px;

}

.smile--size--big-x {

    height: 80px;

    margin: 0 4px;

    width: 80px;

}

.active-smile {

    display: inline-block;

    line-height: 16px;

    padding: 5px;

}

.active-smile:hover > .smile {

    filter: contrast(150%);

    transform: scale(1.2);

}

.active-smile > .smile {

    margin: 0;

    transition: transform 0.2s ease, filter 0.2s;

}

.document-safe-upload-success {

    background: #2f2f2f;

    border-radius: 6px;

    display: grid;

    font-weight: 500;

    grid-gap: 20px;

    justify-items: center;

    max-width: 350px;

    padding: 30px;

    text-align: center;

    -webkit-user-select: none;

    user-select: none;

}

.document-safe-upload-success .icon {

    color: #34b353;

    height: 48px;

    margin: 0;

    width: 48px;

}

.document-safe-upload-success__title {

    font-size: 1.063rem;

    color: #fff;

    font-weight: 500;

    margin: 0;

}

.document-safe-upload-success__description {

    font-size: 0.813rem;

    color: rgba(255, 255, 255, 0.6);

    margin: 0;

}

.document-safe-upload-success .btn {

    margin: 10px 0 0;

    width: 105px;

}

.comments-gallery,

.comments-gallery__wrapper {

    display: flex;

    flex-direction: column;

    max-height: 100%;

}

.comments-gallery__wrapper {

    background: #1b1b1d;

    bottom: 0;

    left: 0;

    position: absolute;

    width: 100%;

}



.comments-gallery__wrapper {

    background: #1b1b1d;

    bottom: 0;

    left: 0;

    position: absolute;

    width: 100%;

}



.liveMobileMain{

    

}

.liveMobileMain .comments-gallery__wrapper{

    background: linear-gradient(0deg, rgba(0, 0, 0, 0.45) 0, transparent 100%);

}



.liveMobileMain .comments-gallery__wrapper{

    top: 65px!important;

    bottom: auto;

}



.liveMobileMain .media-gallery__aside-panel--mobile{

    height: 100vh!important;

}



.comments-gallery__recaptcha-wrapper {

    margin: 0 13px 0 16px;

    position: relative;

    z-index: 2;

}

.comments-gallery__replying-to {

    align-items: center;

    background: #343437;

    bottom: 100%;

    color: #a0a0a1;

    display: flex;

    font-size: 13px;

    justify-content: space-between;

    line-height: 18px;

    margin: 0 0 6px;

    min-height: 30px;

    padding: 4px 16px 4px 12px;

    position: absolute;

    width: 100%;

    word-break: break-word;

    z-index: 2;

}

.comments-gallery__content {

    flex-grow: 1;

    padding: 0 0 20px;

}

.comments-gallery__close {

    cursor: pointer;

    margin: 14px auto 0;

    opacity: 0.2;

    text-align: center;

    -webkit-user-select: none;

    user-select: none;

}

.comments-gallery__count {

    border-bottom: 2px solid rgba(255, 255, 255, 0.03);

    border-top: 2px solid rgba(255, 255, 255, 0.03);

    color: #fff;

    font-size: 14px;

    font-weight: 500;

    height: 44px;

    line-height: 20px;

    padding: 10px 16px;

}

.comments-gallery__header {

    margin: 2px 16px;

    position: relative;

}

.comments-gallery__header .displayname__name {

    font-weight: 400;

}

.comments-gallery__header-menu {

    height: 32px;

    position: absolute;

    right: 0;

    top: 14px;

    width: 32px;

}

.comments-gallery__header-menu .icon-three-dots {

    color: #707071;

    transform: rotate(90deg);

}

.comments-gallery__text {

    margin: 0 0 14px;

    max-height: 4.5vh;

    overflow-x: hidden;

    overflow-y: auto;

    white-space: pre-wrap;

    word-break: break-word;

}

.comments-gallery__text--hidden {

    filter: blur(3px);

}

.comments-gallery__load-more.btn {

    align-items: center;

    background: #232325;

    border: 0;

    border-radius: 5px;

    color: #a0a0a1;

    cursor: pointer;

    display: flex;

    height: 30px;

    justify-content: center;

    margin: 15px 0;

    padding: 0;

    width: 100%;

}

.comments-gallery__load-more.btn:hover {

    background: #343437;

    color: #fff;

}

.comments-gallery__empty {

    align-items: center;

    color: #a0a0a1;

    display: flex;

    flex-direction: column;

    font-size: 13px;

    gap: 22px;

    line-height: 18px;

}

.comments-gallery__comments {

    margin: 0 16px;

}

.comments-gallery__comments--empty {

    align-items: center;

    display: flex;

    justify-content: center;

    min-height: 100%;

    padding: 16px 0 0;

}

.comments-gallery__footer {

    display: block;

    position: relative;

}

.comments-gallery .chat-controls::before {



}

@media screen and (max-width: 639px) {

    .comments-gallery__recaptcha-wrapper {

        min-height: 84px;

    }

    .comments-gallery__recaptcha-wrapper:empty {

        min-height: auto;

    }

}

.bread-crumbs {

    align-items: center;

    display: flex;

    font-size: 32px;

    font-weight: 700;

}

.bread-crumbs__icon {

    height: 44px;

    margin: 0 30px 0 0;

    min-width: 44px;

    width: 44px;

}

.bread-crumbs__item {

    align-items: center;

    display: flex;

    text-decoration: none;

}

.bread-crumbs__item--grow {

    flex: 1;

    max-width: 100%;

}

.bread-crumbs__item .avatar {

    height: 40px;

    margin: 0 8px 0 0;

    width: 40px;

}

.bread-crumbs__right {

    margin: 0 0 0 auto;

}

.bread-crumbs__splitter {

    color: #fff;

    display: block;

    margin: 0 8px;

}

@media screen and (max-width: 639px) {

    .bread-crumbs {

        font-size: 20px;

        margin: 0 10px;

    }

    .bread-crumbs__icon {

        height: 32px;

        margin-right: 12px;

        min-width: 32px;

        width: 32px;

    }

    .settings-navbar{

        margin: 0 10px;

    }

}

.bread-crumbs-back {

    align-items: center;

    background: rgba(255, 255, 255, 0.1);

    border-radius: 50%;

    display: flex;

    height: 33px;

    justify-content: center;

    margin: 0 16px 0 4px;

    min-width: 33px;

    text-decoration: none;

}

.bread-crumbs-back__icon {

    color: #a0a0a1;

    height: 16px;

    width: 16px;

}

.tile-button {

    align-items: center;

    border-radius: 11px;

    cursor: pointer;

    display: flex;

    font-size: 13px;

    justify-content: center;

    margin: 0;

    padding: 0 8px;

    position: relative;

    transition: background 0.25s;

    -webkit-user-select: none;

    user-select: none;

}

.tile-button--disabled {

    background: #343437;

    pointer-events: none;

}

.tile-button--color--apply {

    background: #d60908;

    color: #fff;

}

.tile-button--color--apply:hover {

    background: #9e40fd;

    color: #fff;

}

.tile-button--color--pale {

    background: #232325;

    color: #a0a0a1;

}

.tile-button--color--pale:hover {

    background: #424248;

    color: #fff;

}

.tile-button--color--dark {

    background: #111113;

    color: #fff;

}

.tile-button--color--dark:hover {

    background: #232325;

}

.tile-button--color--regular {

    background: #343437;

    color: #fff;

}

.tile-button--color--regular:hover {

    background: #424248;

}

.tile-button--color--white {

    background: #424248;

    color: #fff;

}

.tile-button--color--transparent {

    background: rgba(5, 5, 6, 0.6);

    color: #fff;

}

.tile-button--color--transparent:hover {

    background: #343437;

}

.tile-button--color--goal {

    background: linear-gradient(263.02deg, #21b062 0, #9cb93d 100%);

    color: #fff;

    transition: none;

}

.tile-button--color--goal:hover {

    background: #21b062;

}

.tile-button--size--small {

    border-radius: 11px;

    height: 36px;

}

.tile-button--size--regular {

    border-radius: 12px;

    height: 40px;

    min-width: 40px;

    padding: 0 12px;

}

.tile-button__icon {

    margin: 0;

}

.tile-button__icon--size--regular,

.tile-button__icon--size--small {

    height: 20px;

    width: 20px;

}

.tile-button__icon--size--large {

    height: 32px;

    width: 32px;

}

.tile-button__count,

.tile-button__text {

    margin: 0 0 0 6px;

}

.tile-button__tooltip {

    margin-top: -5px;

}

.mobile-sticker-back-header {

    align-items: center;

    background: #000;

    display: flex;

    height: 64px;

    width: 100%;

}

.mobile-sticker-back-header::after {

    background: rgba(255, 255, 255, 0.05);

    bottom: 0;

    content: "";

    height: 2px;

    left: 16px;

    pointer-events: none;

    position: absolute;

    right: 16px;

}

.mobile-sticker-back-header__right {

    margin: 0 0 0 auto;

}

.mobile-sticker-back-header .avatar {

    height: 40px;

    margin: 0 12px 0 0;

    width: 40px;

}

.ch {

    box-sizing: content-box;

    color: #fff;

    display: grid;

    font-weight: 500;

    grid-gap: 20px;

    justify-items: center;

    max-width: 400px;

    padding: 30px;

    text-align: center;

}

.ch__upload-icon {

    fill: rgba(255, 255, 255, 0.6);

    height: 48px;

    width: 40px;

}

.ch__title {

    font-size: 1.25rem;

    font-weight: 500;

}

.ch__description {

    font-size: 0.813rem;

    color: rgba(255, 255, 255, 0.8);

}

.ch__divider {

    background-color: rgba(255, 255, 255, 0.2);

    height: 1px;

    width: 100%;

}

.ch__declaimer {

    align-items: center;

    display: grid;

    grid-auto-flow: column;

    grid-gap: 10px;

}

.ch__declaimer-icon {

    fill: rgba(255, 255, 255, 0.4);

    height: 16px;

    width: 12px;

}

.ch__declaimer-text {

    font-size: 0.75rem;

    color: rgba(255, 255, 255, 0.6);

}

.personal-notifications-modal-panel {

    align-items: center;

    align-self: stretch;

    position: relative;

    display: flex;

    flex-direction: row;

}

.personal-notifications-modal-panel__counter {

    color: rgba(255, 255, 255, 0.6);

    font-size: 13px;

    margin: 0 2px 0 0;

}

.personal-notifications-modal-panel-footer {

    align-items: center;

    border-top: 1px solid rgba(255, 255, 255, 0.1);

    bottom: 0;

    color: rgba(255, 255, 255, 0.6);

    display: flex;

    font-size: 13px;

    justify-content: space-between;

    padding: 10px 20px;

}

@media screen and (min-width: 640px) {

    .personal-notifications-modal-panel-footer.empty-on-desktop {

        display: none;

    }

}

.personal-notifications-modal-panel-footer-action {

    color: rgba(255, 255, 255, 0.8);

    cursor: pointer;

}

.personal-notifications-modal-panel-footer-action.disabled {

    opacity: 0.6;

    pointer-events: none;

}

.personal-notifications-modal-panel-footer-action:hover {

    color: #fff;

}

.personal-notifications-modal-panel-footer-action .icon-chart {

    position: relative;

    top: -1px;

}

.personal-notifications-modal-panel-footer-left,

.personal-notifications-modal-panel-footer-right {

    align-items: center;

    display: flex;

}

.personal-notifications-modal-panel-footer-item {

    align-items: center;

    display: flex;

    margin: 0 0 0 8px;

}

.personal-notifications-modal-panel-empty {

    align-items: center;

    display: flex;

    flex: 1;

    justify-content: center;

    opacity: 0.6;

    padding: 0 30px;

    text-align: center;

}

.personal-notifications-modal-panel-empty .icon {

    color: #fff;

    fill: #fff;

    height: 66px;

    margin: 0 0 12px;

    width: 66px;

}

.personal-notifications-modal-panel-empty-title {

    font-size: 20px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: 1.5;

    color: #fff;

    margin: 0 0 14px;

}

.personal-notifications-modal-panel-empty-description {

    font-size: 13px;

    font-weight: 400;

    letter-spacing: normal;

    line-height: 18px;

    color: rgba(255, 255, 255, 0.6);

    margin: 0 auto;

    max-width: 80%;

}

.media-gallery__root > body,

.personal-notifications-modal-panel .content {

    overflow: hidden;

}

.personal-notifications-modal-panel .header-notifications-subscription {

    border-top: 1px solid #545558;

    position: relative;

    font-size: 0.75rem;

    line-height: 1rem;

}

.personal-notifications-modal-panel .header-notifications-subscription-content {

    background-color: #3e3f42;

    justify-content: space-between;

    opacity: 1;

    padding: 12px 18px;

    border-bottom-left-radius: 3px;

    border-bottom-right-radius: 3px;

    display: flex;

    flex-direction: row;

    transition: opacity 200ms "ease-in-out" 500ms;

}

.personal-notifications-modal-panel .header-notifications-subscription-content:nth-of-type(2) {

    position: absolute;

    top: 0;

    width: 100%;

    z-index: 1;

}

.personal-notifications-modal-panel .header-notifications-subscription-content.header-notifications-subscription-content-exit {

    opacity: 0;

}

.personal-notifications-modal-panel .header-notifications-title {

    opacity: 0.6;

    flex: 1;

    flex-basis: auto;

    flex-grow: 1;

    flex-shrink: 1;

}

.personal-notifications-modal-panel .header-notifications-tooltip {

    display: inline-block;

    padding-left: 5px;

    flex: 1;

    flex-basis: auto;

    flex-grow: 0;

    flex-shrink: 0;

}

.personal-notifications-modal-panel .header-notifications-tooltip .icon {

    height: 14px;

    margin: 0;

    opacity: 0.6;

    width: 14px;

}

.personal-notifications-modal-panel .header-notifications-tooltip:hover .icon {

    opacity: 1;

}

.personal-notifications-modal-panel .header-notifications-action {

    flex: 1;

    flex-basis: auto;

    flex-grow: 0;

    flex-shrink: 0;

}

.personal-notifications-modal-panel .dropdown-link {

    align-items: center;

    align-self: stretch;

    color: rgba(255, 255, 255, 0.6);

    display: block;

    justify-content: center;

    max-width: 72px;

    position: relative;

    text-decoration: none;

    transition: color 120ms 120ms;

    width: 56px;

    display: flex;

    flex-direction: row;

    flex: 1;

    flex-basis: auto;

    flex-grow: 1;

    flex-shrink: 1;

}

.personal-notifications-modal-panel .dropdown-link .icon {

    height: 24px;

    width: 24px;

}

.personal-notifications-modal-panel .dropdown-link .icon-notifications {

    height: 16px;

    margin: 0;

    width: 16px;

}

.dropdown-link.has-unread-notifications:after {

    background-color: #e12947;

    border: 2px solid #111113;

    border-radius: 10px;

    content: "";

    height: 12px;

    position: absolute;

    right: 14px;

    top: 14px;

    width: 12px;

}

.personal-notifications-modal-panel .dropdown-link.has-new-notifications .icon-notifications {

    animation: ring 2s ease 1;

}

.personal-notifications-modal-panel .dropdown-link.has-scheduled-posts::after,

.personal-notifications-modal-panel .dropdown-link.has-unread-messages::after {

    background-color: #e12947;

    border: 2px solid #111113;

    border-radius: 10px;

    content: "";

    height: 12px;

    position: absolute;

    right: 13px;

    top: 13px;

    width: 12px;

}

.personal-notifications-modal-panel .dropdown-link.disabled {

    pointer-events: none;

}

@media screen and (max-width: 479px) {

    .personal-notifications-modal-panel {

        flex-grow: 0;

        flex-shrink: 0;

        position: static;

    }

    .personal-notifications-modal-panel .header-dropdown-content-wrapper {

        left: 0;

        right: 0;

    }

    .personal-notifications-modal-panel-controls-online {

        display: none;

    }

    .personal-notifications-modal-panel .dropdown-link {

        padding: 14px;

        width: unset;

    }

}

.personal-notifications-modal-panel-tabs {

    align-items: center;

    display: grid;

    grid-auto-flow: column;

    grid-column-gap: 20px;

    justify-content: start;

    max-width: min(264px, 65%);

}

.personal-notifications-modal-panel-tabs-item {

    cursor: pointer;

    font-size: 20px;

    font-weight: 700;

    opacity: 0.4;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.personal-notifications-modal-panel-tabs-item.active {

    opacity: 1;

    pointer-events: none;

}

@media screen and (max-width: 639px) {

    .personal-notifications-modal-panel-tabs-item {

        font-size: 16px;

    }

}

.personal-notifications-modal-panel .personal-notification-body .avatar {

    border: 0;

    flex-shrink: 0;

    height: 44px;

    margin: 0 12px 0 0;

    width: 44px;

}

.personal-notifications-modal-panel .personal-notification-body .avatar .online {

    background: #232325;

    height: 12px;

    left: -3px;

    top: -3px;

    width: 12px;

}

.personal-notifications-modal-panel-content h3 {

    font-size: 16px;

    font-weight: 700;

    letter-spacing: normal;

    line-height: normal;

    color: #fff;

    margin: 20px;

}

.personal-notifications-modal-panel-header-text {

    font-size: 13px;

    font-weight: 400;

    letter-spacing: normal;

    line-height: 1.5;

    background: #343437;

    border-radius: 8px;

    color: rgba(255, 255, 255, 0.6);

    margin: 10px 20px 20px;

    padding: 10px 12px;

}

.personal-notifications-modal-panel .personal-notification {

    padding: 10px 30px 10px 20px;

}

.personal-notifications-modal-panel__mass-message-button-wrapper {

    display: flex;

    margin-bottom: 16px;

    padding: 0 20px;

}

@media screen and (max-width: 639px) {

    .personal-notifications-modal-panel__mass-message-button-wrapper {

        padding: 0 12px;

    }

}

.personal-notifications-modal-panel__mass-message-button {

    align-items: center;

    display: flex;

    flex: 1;

    gap: 10px;

}

.chats-filter {

    margin: 0 8px;

    padding-bottom: 12px;

}

.header-dropdown-content-item {

    position: relative;

}

.header-dropdown-content-item:not(:last-child) {

    border-bottom: none;

}

.request-menu-notification-icon {

    color: #a0a0a1;

    margin-right: 8px;

    position: relative;

}

.request-menu-notification-icon.has-unresolved-requests:after {

    background-color: #e12947;

    border: 2px solid #111113;

    border-radius: 50%;

    content: "";

    height: 8px;

    position: absolute;

    right: -4px;

    top: -2px;

    width: 8px;

}

.request-menu-notification-icon.active:after {

    border-color: #343437;

}

.profile-cover-wrapper {

    margin-bottom: 64px;

}

@media screen and (max-width: 767px) {

    .profile-cover-wrapper {

        margin-bottom: 32px;

    }

}



.bs--opened {

    max-height: none

}



.bs__text {

    font-size: inherit;

    font-weight: inherit;

    line-height: inherit;

    margin: 0;

    padding: 0

}



.bs__shadow-text {

    opacity: 0;

    pointer-events: none;

    position: absolute;

    visibility: hidden

}



@media screen and (max-width:1023px) {

    .bs {

        width: 100%

    }

}

.bs--reposition {

    -webkit-user-select: none;

    user-select: none;

}

.bs__video-parent {

    position: absolute;

    right: 0;

    top: 0;

    transform-origin: left top;

    width: 100%;

}

.bs__avatar-flag {

    align-items: center;

    background: #232325;

    border-radius: 50%;

    display: flex;

    height: 34px;

    justify-content: center;

    position: absolute;

    right: -4px;

    top: 0;

    width: 34px;

}

.bs__st-link {

    align-items: center;

    display: inline-flex;

}

.bs__st-link-content {

    margin-bottom: 2px;

    overflow: hidden;

    position: relative;

}

@media screen and (max-width: 360px) {

    .bs__st-link-content:after {

        background: linear-gradient(270deg, #050506 0, rgba(5, 5, 6, 0) 100%);

        content: "";

        display: block;

        height: 20px;

        position: absolute;

        right: 0;

        top: 0;

        width: 24px;

    }

}

.bs__live {

    align-items: center;

    background: #d21b4c;

    border-radius: 6px;

    color: #fff;

    column-gap: 4px;

    display: flex;

    font-size: 13px;

    font-weight: 700;

    height: 20px;

    margin: 0 0 0 8px;

    padding: 0 8px 0 4px;

    white-space: nowrap;

}

.bs__live:hover {

    background: #d9023c;

}

.bs__media {

    max-height: 100%;

    overflow: hidden;

    pointer-events: none;

    position: absolute;

    right: 0;

    top: 0;

    width: min(1144px, 100%);

}

.bs__media-background-cover {

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

}

.bs__media-background-cover--blured {

    filter: blur(20px);

}

.bs__media--no-cover::before {

    background: linear-gradient(180deg, rgba(5, 5, 6, 0) 0, #050506 100%), radial-gradient(50% 200%at 50% 50%, #3c185e 0, rgba(60, 24, 94, 0) 100%), linear-gradient(0deg, #050506, #050506),

        linear-gradient(270deg, #050506 0, rgba(5, 5, 6, 0) 50.03%), linear-gradient(95.78deg, #050506 4.6%, rgba(5, 5, 6, 0) 50.04%), linear-gradient(180deg, rgba(5, 5, 6, 0) 0, #050506 100%);

    content: "";

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

}

.bs__media--shadow::after {

    background: linear-gradient(270deg, #050506 0, rgba(5, 5, 6, 0) 50.03%), linear-gradient(95.78deg, #050506 4.6%, rgba(5, 5, 6, 0) 50.04%), linear-gradient(180deg, rgba(5, 5, 6, 0) 0, #050506 100%);

    content: "";

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

}

.bs__media-aspect-ratio {

    display: block;

    visibility: hidden;

    width: 100%;

}

.bs__media-cover-image {

    left: 0;

    position: absolute;

    top: 0;

    transform-origin: left top;

    width: 100%;

}

.bs__mobile-top-button {

    position: absolute;

    right: 15px;

    top: 70px;

    z-index: 4;

}

.bs__reposition-controls {

    bottom: 95px;

    position: absolute;

    right: 83px;

    z-index: 5;

}

.bs__reposition-controls--mobile {

    display: none;

}

.bs__info {

    margin: 0 auto;

    max-width: 1280px;

    padding: 64px 83px 0;

    position: relative;

    width: 100%;

    z-index: 3;

}

@media screen and (max-width: 1023px) {

    .bs__info {

        padding: 80px 15px 0;

    }

}

.bs__stories {

    margin: 0 auto;

    max-width: 100vw;

    padding: 0 16px;

    position: relative;

    width: 642px;

}

.bs__name-wrapper {

    margin-top: 16px;

}

.bs__name-wrapper .displayname__name {

    word-break: break-word;

}

.bs__username {

    color: #fff;

    opacity: 0.6;

}

.bs__avatar-wrapper {

    position: relative;

    width: 124px;

    z-index: 4;

}

.bs__profile-counters {

    color: rgba(255, 255, 255, 0.8);

    font-weight: 400;

    margin-top: 20px;

    opacity: 0.8;

    font-size: 1rem;

}

.bs__content-counters-wrapper {

    align-items: center;

    box-sizing: border-box;

    display: flex;

    height: 72px;

    justify-content: space-between;

    margin-top: 40px;

    padding: 7px 16px;

    position: relative;

    width: 100%;

    z-index: 5;

}

.bs__content-counters-wrapper::before {

    backdrop-filter: blur(34px);

    background: rgba(255, 255, 255, 0.08);

    border-radius: 20px;

    bottom: 0;

    content: "";

    left: 0;

    pointer-events: none;

    position: absolute;

    top: 0;

    width: 100%;

}

.bs__actions {

    display: flex;

    position: relative;

    width: 100%;

}

.bs .dropdown-content {

    padding: 4px 0;

}

.bs__tabs.tabs-ds {

    border-color: 1px solid rgba(255, 255, 255, 0.08);

    justify-content: center;

    margin: 44px 0 0;

    white-space: nowrap;

    width: 100%;

    z-index: 1;

}

.bs__tabs.tabs-ds::after,

.bs__tabs.tabs-ds::before {

    background: rgba(255, 255, 255, 0.08);

    content: "";

    height: 1px;

    pointer-events: none;

    position: absolute;

    top: 100%;

    width: 1200px;

}

.bs__tabs.tabs-ds::before {

    box-sizing: border-box;

    right: 100%;

}

.bs__tabs.tabs-ds::after {

    left: 100%;

}

.bs__content-counters-wrapper--mobile {

    align-items: center;

    backdrop-filter: blur(10px);

    background: rgba(0, 0, 0, 0.2);

    border-radius: 20px;

    display: flex;

    padding: 14px 16px;

    position: absolute;

    right: 80px;

    top: 60px;

    z-index: 1;

}

@media screen and (max-width: 1023px) {

    .bs__content-counters-wrapper--mobile {

        right: 15px;

    }

}

@media (max-width: 1079px) {

    .bs__media--shadow::after {

        background: linear-gradient(0deg, #050506 0, rgba(5, 5, 6, 0.9) 24%, rgba(5, 5, 6, 0.75) 40%, rgba(5, 5, 6, 0.5) 60%, rgba(5, 5, 6, 0) 100%);

    }

    .bs__avatar-wrapper {

        width: 80px;

    }

    .bs__avatar-wrapper .avatar {

        height: 80px;

        min-width: 80px;

        width: 80px;

    }

    .bs__name-wrapper {

        align-items: flex-start;

        flex-direction: column;

    }

    .bs__username {

        margin-left: 0;

    }

    .bs .displayname.displayname--big .displayname__name {

        font-size: 1.75rem;

    }

    .bs__profile-counters {

        font-size: 0.875rem;

    }

    .bs__content-counters-wrapper {

        height: auto;

        margin-top: 16px;

        padding: 0;

    }

    .bs__content-counters-wrapper::before {

        display: none;

    }

    .bs .bs__tabs {

        margin-top: 32px;

    }

    .bs__reposition-controls {

        display: none;

        position: relative;

    }

    .bs__reposition-controls--mobile {

        display: block;

    }

}

.bs__onboarding-badge {

    left: 90px;

    position: absolute;

    top: -10px;

}

.bs .tab-interactive-active-ds .white-color-text-2 {

    color: #a0a0a1;

}

.bs .tabs-ds {

    column-gap: 48px;

}

.bs .tab-ds {

    margin: 0;

}

@media screen and (max-width: 1023px) {

    .bs__onboarding-badge {

        left: 54px;

        top: -4px;

    }

}

@media screen and (max-width: 639px) {

    .bs .tabs-ds {

        column-gap: 32px;

    }

}

@media screen and (max-width: 320px) {

    .bs .tabs-ds {

        column-gap: 24px;

    }

}

.media-processing {

    align-items: center;

    display: flex;

    flex-direction: column;

    left: 50%;

    position: absolute;

    top: 200px;

    transform: translateX(-50%);

    z-index: 5;

}

@media screen and (max-width: 1023px) {

    .media-processing {

        top: 32%;

    }

}

.media-processing .loader-text {

    color: #fff;

    margin-top: 10px;

    max-width: 210px;

    opacity: 0.6;

    text-align: center;

}

.video-player,

.video-player__play {

    display: flex;

    justify-content: center;

    overflow: hidden;

}

.video-player {

    background-position: center;

    background-repeat: no-repeat;

    background-size: contain;

    height: 100%;

    position: relative;

    width: 100%;

}

.video-player__play {

    align-items: center;

    background: rgba(0, 0, 0, 0.4);

    border: 0;

    border-radius: 50%;

    color: #fff;

    cursor: pointer;

    height: 96px;

    left: 50%;

    outline: 0;

    padding: 0;

    position: absolute;

    top: 50%;

    transform: translateX(-50%) translateY(-50%);

    transition: background 0.3s, opacity 0.3s;

    width: 96px;

    z-index: 4;

}

.video-player__play--hidden {

    opacity: 0;

    pointer-events: none;

}

.video-player__play--animation-show-hide {

    animation: video-player-animation-play-desktop 0.6s;

}

.video-player__main-control-icon {

    height: 56px;

    opacity: 0.8;

    width: 56px;

}

.video-player__children {

    bottom: 0;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 4;

}

.video-player__video {

    background-color: transparent;

    display: block;

    flex: 1;

    max-height: 100%;

    max-width: 100%;

    position: relative;

    object-fit: cover;

}

.video-player__video--hidden {

    pointer-events: none;

    visibility: hidden;

}

.video-player__controls {

    background: linear-gradient(0deg, rgba(0, 0, 0, 0.72) 0, transparent 100%);

    bottom: 0;

    left: 0;

    padding: 40px 10px 16px;

    position: absolute;

    right: 0;

    transition: opacity 0.3s;

    user-select: none;

    z-index: 4;

}

.video-player__controls--hidden {

    opacity: 0;

    pointer-events: none;

}

.video-player__controls-progress {

    cursor: pointer;

    height: 12px;

    position: absolute;

    width: 100%;

    bottom: -9px;

    z-index: 5;

    left: 0;

}

.video-player__controls-progress::before {

    background: rgba(248, 248, 248, 0.4);

    border-radius: 2px;

    content: "";

    cursor: pointer;

    height: 4px;

    left: 0;

    position: absolute;

    width: 100%;

}

.video-player__controls-progress::after {

    content: "";

    height: 35px;

    left: 0;

    position: absolute;

    top: -15px;

    width: 100%;

}

.video-player__controls-progress:hover > .video-player__controls-progress-button {

    pointer-events: auto;

    transform: scale(1);

}

.video-player__controls-progress-line {

    background: #fa0103;

    border-radius: 2px;

    cursor: pointer;

    height: 4px;

    position: relative;

}

.video-player__controls-progress-button {

    background: #fff;

    border: 0;

    border-radius: 50%;

    box-shadow: 0 0 4px rgba(0, 0, 0, 0.25);

    cursor: pointer;

    display: block;

    height: 12px;

    padding: 0;

    pointer-events: none;

    position: absolute;

    top: 0;

    transform: scale(0);

    transition: transform 0.15s;

    width: 12px;

    z-index: 2;

}

.video-player__controls-progress-button--active {

    pointer-events: auto;

    transform: scale(1);

}

.video-player__controls-actions {

    align-items: center;

    color: #fff;

    display: flex;

    font-size: 13px;

    font-weight: 700;

    justify-content: space-between;

    margin: 12px 4px 0;

}

.video-player__controls-actions-block {

    align-items: center;

    display: flex;

}

.video-player__pause {

    cursor: pointer;

    margin: 0 14px 0 0;

}

.video-player__pause > svg {

    display: block;

    height: 17px;

    width: 17px;

}

.video-player__right-control {

    margin: 0-2px 0 24px;

    padding: 2px;

}

.video-player__right-control:first-child {

    margin-left: 0;

}

.video-player__mute {

    cursor: pointer;

}

.video-player__mute > svg {

    display: block;

    height: 16px;

    transform: scale(1.3);

    width: 18px;

}

.video-player__fullscreen {

    cursor: pointer;

    display: flex;

}

.video-player__controls-actions-block {

    color: #fff;

}

.video-player__timer {

    white-space: nowrap;

}

.video-player--mobile .video-player__controls-progress-button {

    pointer-events: auto;

    transform: scale(1);

}

.video-player--mobile .video-player__play {

    height: 64px;

    width: 64px;

}

.video-player--mobile .video-player__main-control-icon {

    height: 36px;

    width: 36px;

}

.video-player--desktop .video-player__play {

    background: rgba(0, 0, 0, 0.6);

}

.video-player--desktop .video-player__fullscreen,

.video-player--desktop .video-player__mute,

.video-player--desktop .video-player__pause {

    transition: opacity 0.3s;

}

.video-player--desktop .video-player__fullscreen:hover,

.video-player--desktop .video-player__mute:hover,

.video-player--desktop .video-player__pause:hover {

    opacity: 0.5    ;

}

.ci {

    align-items: center;

    display: flex;

    flex-wrap: nowrap;

    gap: 8px;

    justify-content: flex-start;

}

.ci__icon {

    margin-right: 4px;

}

.n__extra {

    animation: opacity-fade-show 0.5s;

}

.n__extra--hide {

    display: none;

}

.n__more {

    align-items: center;

    cursor: pointer;

    display: flex;

    gap: 4px;

}

.n__shadow-text {

    display: block;

    opacity: 0;

    pointer-events: none;

    position: absolute;

    visibility: hidden;

}

.n__icon--rotate {

    transform: rotate(180deg);

}

.tab-ds,

.tabs-ds {

    align-items: center;

    display: flex;

}

.tabs-ds {

    border-bottom: 1px solid rgba(255, 255, 255, 0.13);

    margin: 0;

    position: relative;

}

.tab-ds {

    background: 0 0;

    border: 0;

    color: rgba(255, 255, 255, 0.6);

    justify-content: center;

    list-style-type: none;

    margin: 0 28px;

    outline: 0;

    overflow: visible;

    -webkit-user-select: none;

    user-select: none;

}

.tab-ds:first-child {

    margin-left: 0;

}

.tab-ds:last-child {

    margin-right: 0;

}

.tab-ds:hover {

    color: rgba(255, 255, 255, 0.8);

}

@media (max-width: 639px) {

    .tab-ds--adaptive {

        flex: 1;

        margin: 0;

    }

}

.tab-interactive-ds {

    align-items: center;

    display: flex;

    position: relative;

}

.tab-interactive-medium-ds,

.tab-interactive-small-ds {

    font-weight: 400;

    letter-spacing: normal;

    line-height: normal;

}

.tab-interactive-small-ds {

    font-size: 13px;

    margin-right: 30px;

    padding: 9px 0;

}

.tab-interactive-medium-ds {

    font-size: 15px;

    height: 50px;

    padding: 0 0 12px;

}

.tab-interactive-active-ds {

    color: #fff;

}

.tab-interactive-active-ds:active,

.tab-interactive-active-ds:focus,

.tab-interactive-active-ds:hover {

    color: #fff;

}

.tab-interactive-active-ds::after {

    background: var(--primary-border);

    border-radius: 3px;

    bottom: -1px;

    content: "";

    height: 3px;

    left: 0;

    position: absolute;

    width: 100%;

}

.tab-link-ds {

    flex: 1;

    justify-content: center;

}

.tab-link-ds,

.tab-link-ds:active,

.tab-link-ds:hover {

    text-decoration: none;

}

.tab-link-ds:focus {

    text-decoration: inherit;

}

.not-found-wrapper {

    align-items: center;

    justify-content: center;

    display: flex;

    flex-direction: column;

}

.not-found-wrapper .not-approved-model,

.not-found-wrapper .not-found-error {

    justify-content: space-around;

    margin: 100px 0;

    max-width: 900px;

    width: 100%;

    display: flex;

    flex-direction: column;

}

.not-found-wrapper .description-wrapper,

.not-found-wrapper .icon-wrapper,

.not-found-wrapper .text-wrapper {

    justify-content: center;

    flex: 1;

    flex-basis: 50%;

    flex-grow: 1;

    flex-shrink: 0;

}

.not-found-wrapper .icon-wrapper,

.not-found-wrapper .text-wrapper {

    display: flex;

    flex-direction: row;

}

.not-found-wrapper .text-wrapper {

    color: #fff;

    font-weight: 700;

    font-size: 4.5rem;

    line-height: 5.438rem;

    letter-spacing: 0.27rem;

}

.not-found-wrapper .description-wrapper {

    align-items: center;

    margin-left: 10px;

    margin-top: 16px;

    display: flex;

    flex-direction: column;

}

.not-found-wrapper .description {

    color: rgba(255, 255, 255, 0.8);

    font-weight: 500;

    margin-bottom: 32px;

    max-width: 100%;

    font-size: 1.5rem;

    line-height: 1.813rem;

}

.not-found-wrapper .icon-blocked {

    fill: #f8f8f8;

    height: 160px;

    width: 160px;

}

@media screen and (max-width: 1023px) {

    .not-found-wrapper .not-found-error .description-wrapper {

        flex: 1;

        flex-basis: 40%;

        flex-grow: 1;

        flex-shrink: 0;

    }

    .not-found-wrapper .not-found-error .description {

        font-size: 1.25rem;

        line-height: 1.625rem;

    }

}

@media screen and (max-width: 639px) {

    .not-found-wrapper .not-approved-model,

    .not-found-wrapper .not-found-error {

        align-items: center;

        margin: 60px 0;

    }

    .not-found-wrapper .not-approved-model .icon-blocked,

    .not-found-wrapper .not-found-error .icon-blocked {

        height: 120px;

        width: 120px;

    }

    .not-found-wrapper .not-approved-model .description-wrapper,

    .not-found-wrapper .not-found-error .description-wrapper {

        align-items: center;

        margin-left: 0;

        margin-top: 50px;

    }

    .not-found-wrapper .not-approved-model .description,

    .not-found-wrapper .not-found-error .description {

        text-align: center;

        font-size: 1.125rem;

        line-height: 1.375rem;

    }

}

.user-tags-list-gallery,

.user-tags-list-gallery__wrapper {

    display: flex;

    flex-direction: column;

    max-height: 100%;

}

.user-tags-list-gallery__wrapper {

    background: #1b1b1d;

    bottom: 0;

    left: 0;

    position: absolute;

    width: 100%;

}

.user-tags-list-gallery__close {

    cursor: pointer;

    margin: 14px auto 0;

    opacity: 0.2;

    -webkit-user-select: none;

    user-select: none;

}

.modal-ds-overlay {

    align-items: center;

    display: flex;

    height: 100%;

    justify-content: center;

    left: 0;

    padding: 20px;

    position: fixed;

    top: 0;

    width: 100vw;

    z-index: 500;

}

.modal-ds-overlay__background {

    animation: opacity-fade-show 0.5s;

    background: rgba(0, 0, 0, 0.8);

    height: 100%;

    left: 0;

    pointer-events: none;

    position: absolute;

    top: 0;

    width: 100%;

    z-index: -1;

}

.modal-ds-overlay__background--hide {

    animation: opacity-fade-hide 0.5s;

    opacity: 0;

}

.modal-ds-overlay--fullscreen-mobile .modal-ds-body {

    background-color: #1b1b1d;

    bottom: 0;

    height: auto;

    left: 0 !important;

    margin-top: 0 !important;

    max-width: 100vw;

    min-height: auto;

    position: absolute !important;

    right: 0 !important;

    top: 0 !important;

    transform: none !important;

    width: 100%;

}

.modal-ds-overlay--fullscreen-mobile .modal-ds-body--black {

    background: #000;

}

.modal-ds-overlay--fullscreen-mobile .modal-ds-body .modal-ds-footer {

    background: 0 0 !important;

}

.modal-ds-overlay--fullscreen-mobile .modal-ds-content {

    background: 0 0;

    display: flex;

    height: 100%;

}

.modal-ds-overlay .modal-ds-close-icon-in-header {

    margin-left: auto;

}

@media screen and (max-width: 767px) {

    .modal-ds-overlay {

        padding-left: 14px;

        padding-right: 14px;

    }

}

.modal-ds-body {

    align-items: stretch;

    animation: opacity-fade-show-modal 0.5s ease;

    color: #fff;

    cursor: initial;

    display: flex;

    flex-direction: column;

    flex-wrap: nowrap;

    justify-content: flex-start;

    margin: 0 auto;

    max-height: 100%;

}

.modal-ds-body--disabled {

    opacity: 0.3;

    pointer-events: none;

}

.modal-ds-body--size--small {

    max-width: min(100vw - 32px, 460px);

}

.modal-ds-body--size--regular {

    max-width: calc(100vw - 32px);

    width: 500px;

}

.modal-ds-body--size--goal,

.modal-ds-body--size--wide {

    max-width: calc(100vw - 20px);

}

.modal-ds-body--size--goal {

    width: 328px;

}

.modal-ds-body--background--dark {

    background: #1b1b1d;

}

.modal-ds-body--background--none {

    background: 0 0;

}

.modal-ds-body--hide {

    animation: opacity-fade-hide-modal 0.5s ease;

    opacity: 0;

}

.modal-ds-close-icon:hover {

    color: #f8f8f8;

}

.modal-ds-header {

    align-items: center;

    display: flex;

    flex-direction: row;

    flex-wrap: nowrap;

    justify-content: flex-start;

    overflow: hidden;

    padding: 5px;

}

.modal-ds-close-icon-disabled {

    opacity: 0;

}

.modal-ds-content {

    display: flex;

    flex-direction: column;

    overflow: hidden;

    position: relative;

    width: 100%;

}

.modal-ds-content--vertical-center {

    justify-content: center;

}

.modal-ds-content--spaced {

    padding: 24px;

}

.modal-ds-content--background--dark {

    background: #1b1b1d;

}

.modal-ds-content--background--regular {

    background: #232325;

}

.modal-ds-content--radius--small {

    border-radius: 12px;

}

.modal-ds-content--radius--middle {

    border-radius: 16px;

}

.modal-ds-content--radius--big {

    border-radius: 22px;

}

.modal-body {

    flex-basis: content;

}

.modal-body--padding--regular {

    padding: 24px;

}

.modal-ds-close-icon {

    color: rgba(248, 248, 248, 0.4);

}

.modal-ds-close-icon-top-right {

    position: absolute;

    right: 4px;

    top: 4px;

}

.modal-ds-footer {

    -webkit-backdrop-filter: blur(2px);

    backdrop-filter: blur(2px);

    bottom: 0;

    left: 0;

    min-height: 74px;

    overflow: hidden;

    position: absolute;

    width: 100%;

    z-index: 1;

}

.modal-ds-footer--background--dark {

    background: rgba(27, 27, 29, 0.7);

}

.modal-ds-footer-placeholder {

    height: 74px;

}

.y {

    position: relative;

    width: 100%;

}

@media only screen and (max-width: 639px) {

    .y {

        display: flex;

        flex: 1;

        flex-direction: column;

        height: 100%;

    }

}

.y__header {

    margin: -20px -20px 20px;

}

.y .info {

    font-size: 13px;

    margin-bottom: 20px;

    margin-top: 10px;

    opacity: 0.6;

}

.y .photo-cut-frame-wrapper {

    display: none;

}

.y .photo-cut-source-container {

    min-height: 250px;

    padding: 0 30px;

    position: relative;

    width: 100%;

}

@media only screen and (max-width: 640px) {

    .y .photo-cut-source-container {

        flex: 1;

    }

}

.y .photo-cut-source-container .photo-cut-canvas-video {

    border-radius: 12px;

    display: block;

    margin: 0 auto;

    max-width: 100%;

}

@media only screen and (max-width: 640px) {

    .y .photo-cut-source-container .photo-cut-canvas-video {

        height: 100%;

        object-fit: cover;

    }

}

.y__devices-control {

    margin-bottom: 8px;

}

.y__camera-placeholder {

    align-items: center;

    display: flex;

    flex-direction: column;

    left: 50%;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

}

.y__camera-blocked-error {

    align-items: center;

    background: #000;

    display: flex;

    flex-direction: column;

    height: 250px;

    justify-content: center;

    left: 0;

    position: absolute;

    right: 0;

    z-index: 1;

}

.y__camera-blocked-error-icon {

    color: #fff;

    fill: currentColor;

    height: 40px;

    width: 40px;

}

.y__placeholder-text {

    line-height: 18px;

    margin-top: 16px;

    text-align: center;

}

.y__video-devices-select {

    margin-bottom: 10px;

    margin-top: -10px;

    max-width: 351px;

    width: 100%;

}

.create-content-menu {

    background: #232325;

    border-radius: 16px;

    box-shadow: 0 20px 30px rgba(0, 0, 0, 0.3);

    color: #cfcfd0;

    overflow: hidden;

    text-align: left;

    white-space: nowrap;

}

.create-content-menu__item {

    align-items: center;

    cursor: pointer;

    display: flex;

    font-size: 15px;

    font-weight: 400;

    line-height: 18px;

    min-height: 56px;

    padding: 4px 20px;

}

.create-content-menu__item--disabled {

    color: #707071;

    pointer-events: none;

}

.create-content-menu__item:hover {

    background: #343437;

}

.create-content-menu__icon {

    margin: 0 20px 0 0;

}

.create-content-menu__icon--style--teaser {

    color: #fccf49;

}

.create-content-menu__description {

    color: #707071;

    font-size: 12px;

}

.bg {

    height: 56px;

}

.bg__header-top {

    align-items: stretch;

    display: flex;

    height: 56px;

    justify-content: center;

    left: 0;

    position: fixed;

    right: 0;

    top: var(--pwa-notification-height);

    z-index: 11;

}

.bg__header-top--theme--purple {

    background: #290e3f;

}

.bg__header-top--theme--purple .btn-outline-pale {

    background: #290e3f;

    border-color: #5f5f61;

    transition: border-color 200ms linear;

}

.bg__header-top--theme--purple .btn-outline-pale:focus {

    border-color: #5f5f61;

}

.bg__header-top--theme--purple .btn-outline-pale:active,

.bg__header-top--theme--purple .btn-outline-pale:hover {

    background: #290e3f;

    border-color: #a0a0a1;

}

.bg__header-top--theme--dark {

    background: #111113;

}

.bg__nav-left {

    align-items: center;

    display: flex;

    flex: 1;

    justify-items: flex-start;

}

@media screen and (max-width: 479px) {

    .bg__nav-left {

        flex: 1 1 50%;

    }

}

.bg__nav-center {

    align-items: center;

    display: flex;

    flex: 1;

    justify-content: center;

    margin: 0 8px;

}

@media screen and (max-width: 767px) {

    .bg__nav-center {

        justify-content: flex-end;

    }

}

.bg__nav-right {

    align-items: stretch;

    display: flex;

    justify-content: flex-end;

}

@media screen and (min-width: 640px) {

    .bg__nav-right {

        flex: 1;

    }

}

.bg__login-buttons {

    align-items: center;

    display: grid;

    grid-auto-flow: column;

    grid-column-gap: 12px;

    justify-content: flex-end;

    margin: 0 20px;

    min-width: 90px;

    transition: opacity 250ms;

}

.bg__navigation {

    align-items: center;

    display: flex;

    justify-items: flex-start;

    margin-left: 18px;

}

.bg__logo-wrapper {

    align-items: center;

    display: flex;

    justify-content: flex-start;

}

@media screen and (max-width: 479px) {

    .bg__logo-wrapper {

        flex: 1;

    }

}

.bg__link {

    align-items: center;

    color: #a0a0a1;

    cursor: pointer;

    display: inline-flex;

    font-size: 15px;

    height: 56px;

    margin: 0 16px;

    position: relative;

    white-space: nowrap;

}

.bg__link--theme--purple {

    color: #d4cfd9;

}

.bg__link:hover {

    color: #fff;

}

.bg__link--split {

    margin-left: 32px;

}

.bg__link--split::after {

    background: rgba(255, 255, 255, 0.1);

    bottom: 12px;

    content: "";

    left: -24px;

    position: absolute;

    top: 12px;

    width: 1px;

}

.bg__link.active::before {

    background: var(--primary-border);

    bottom: 0;

    content: "";

    height: 3px;

    left: 0;

    position: absolute;

    width: 100%;

}

.bo {

    align-items: center;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    border-radius: 50%;

    display: flex;

    height: 56px;

    justify-content: center;

    min-width: 56px;

    position: relative;

    transition: 0.3s color;

    width: 56px;

}

.bo::before {

    border: 4px solid currentColor;

    border-radius: 50%;

    bottom: 0;

    content: "";

    left: 0;

    pointer-events: none;

    position: absolute;

    right: 0;

    top: 0;

    transition: 0.3s color;

    z-index: 1;

}

.bo--style--uploading {

    color: #ff3332;

}

.bo--style--uploading::before {

    color: #442068;

}

.bo--style--done {

    color: #21b062;

}

.bo--style--create-failed,

.bo--style--uploading-failed {

    color: #d21b4c;

    cursor: pointer;

}

.bo--style--create-failed::before,

.bo--style--uploading-failed::before {

    color: #570e22;

}

.bo__shadow {

    background: rgba(0, 0, 0, 0.6);

    border-radius: 50%;

    bottom: 0;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

}

.bo__circle {

    bottom: 0;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 2;

}

.bo__status {

    color: #fff;

    font-size: 12px;

    font-weight: 400;

    position: absolute;

}

.bo__count {

    align-items: center;

    background: currentColor;

    border-radius: 8px;

    display: flex;

    font-size: 12px;

    font-weight: 500;

    height: 16px;

    justify-content: center;

    min-width: 16px;

    padding: 0 4px;

    pointer-events: none;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 2;

}

.empty-page-content {

    color: #a0a0a1;

    max-width: 420px;

    text-align: center;

}

.empty-page-content--big {

    margin: 30px auto 120px;

}

.empty-page-content--small {

    margin: 30px auto;

}

.empty-page-content__title {

    margin: 0 0 10px;

}

.empty-page-content__title--big {

    font-size: 24px;

    font-weight: 500;

}

.empty-page-content__description {

    max-width: 360px;

}

.empty-page-content__description--big {

    margin: 20px auto 0;

}

.empty-page-content__description--small {

    margin: 0 auto;

}

.empty-page-content__icon {

    color: #707071;

}

.empty-page-content__icon,

.empty-page-content__icon--big {

    height: 74px;

    margin: 0 auto 30px;

    width: 74px;

}

.empty-page-content__icon--small {

    height: 32px;

    margin: 0 auto 12px;

    width: 32px;

}

.notification-texts-referral {

    align-items: center;

    display: flex;

    font-size: 16px;

    font-weight: 500;

    justify-content: center;

    line-height: 20px;

    min-height: 52px;

    padding: 6px 20px;

}

.notification-texts-referral__left {

    margin: 0 10px 0 0;

}

.notification-texts-referral__left .smile {

    height: 24px;

    width: 24px;

}

.notification-texts-referral__right {

    margin: 0 0 0 8px;

}

.notification-texts-referral__right .smile {

    height: 32px;

    width: 32px;

}

.header-notification .notification-texts-referral {

    padding: 0;

    text-align: left;

}

.bf {

    --search-width: 340px;

    padding: 0 0 0 8px;

}

.bf--type--compact-phone {

    cursor: pointer;

}

.bf--type--compact {

    cursor: pointer;

    position: relative;

}

.bf--theme--purple .bf__wrapper {

    background: #3f2753;

}

@media screen and (max-width: 479px) {

    .bf--theme--purple .bf__wrapper {

        box-shadow: 0 2px 0#d60908;

    }

    .br__stories {

        padding-left: 10px!important;

    }   

    .bp--style--pinned{

        margin-top: 15px!important;

    } 

}

.bf--theme--purple .bf__wrapper--focused,

.bf--theme--purple .bf__wrapper:hover {

    border-color: #3f2753;

}

.bf--theme--purple .island-block {

    background: #290e3f;

}

.bf--theme--purple .username-inline-card:hover {

    background: #3f2753;

}

.bf--theme--purple .header-search-result__button {

    background: rgba(255, 255, 255, 0.1);

}

.bf--theme--purple .header-search-result__button:hover {

    background: rgba(255, 255, 255, 0.2);

}

.bf--landing .bf__wrapper {

    z-index: 11;

}

.bf__wrapper {

    background: #232325;

    border: 2px solid transparent;

    border-radius: 12px;

    color: #fff;

    height: 36px;

    position: relative;

    transition: border-color 0.3s;

}

.bf__wrapper:hover {

    border-color: #343437;

}

.bf__wrapper--focused {

    background: #343437;

}

.bf__wrapper--type--compact-phone {

    border: 0;

    border-radius: 0;

    height: 44px;

    left: 0;

    position: absolute;

    top: 56px;

    width: 100vw;

}

.bf__wrapper--type--compact {

    margin: 20px 0 0;

    max-width: 100vw;

    position: absolute;

    right: 0;

    top: 100%;

    width: var(--search-width);

}

.bf__wrapper--type--big-laptop {

    width: 220px;

}

.bf__wrapper--type--big-desktop {

    width: 340px;

}

.bf__label {

    align-items: center;

    color: inherit;

    display: flex;

    height: 100%;

    padding: 0 12px;

    position: relative;

    width: 100%;

}

.bf__input {

    background: 0 0;

    border: 0;

    border-radius: 0;

    color: inherit;

    flex: 1;

    font-size: 13px;

    margin: 0 0 0 8px;

    padding: 0;

}

.bf__input::-webkit-search-cancel-button {

    display: none;

}

.bf__icon {

    color: #a0a0a1;

    height: 20px;

    min-width: 20px;

    width: 20px;

}

.bf__icon-compact {

    color: #a0a0a1;

    height: 24px;

    width: 24px;

}

.bf__reset {

    align-items: center;

    border-radius: 4px;

    color: #a0a0a1;

    cursor: pointer;

    display: flex;

    height: 20px;

    justify-content: center;

    position: absolute;

    right: 10px;

    width: 20px;

}

.bf__reset:hover {

    background: rgba(255, 255, 255, 0.1);

    color: #fff;

}

.bJ__header {

    align-items: center;

    display: flex;

    gap: 16px;

    justify-content: space-between;

    margin: 48px 0 32px;

}

@media screen and (max-width: 767px) {

    .bJ__header {

        align-items: stretch;

        flex-direction: column;

    }

}

.bJ__tabs-container {

    min-width: 240px;

}

.bJ__tabs-container .pill-page-tabs {

    margin: 0;

}



#modelsResult {

    grid-template-columns: repeat(6, 1fr);

}



.liveModels{

  grid-template-columns: repeat(8, 1fr)!important;  

}





.discoverPosts{

  grid-template-columns: repeat(7, 1fr)!important;  

}



.discoverPosts.bl{ 

    padding: 1px;

    grid-gap: 1px!important;

}



.discoverPosts .bL__item{

    height: 190px!important;

}



.discoverPosts .bL__item .a{

    border-radius: 1px!important;

}



.discoverPosts .bL__item .a .a__bottom-shadow{

    background: linear-gradient(180deg, transparent 0, rgb(0 0 0 / 51%) 100%);

    border-bottom-left-radius: 1px;

    border-bottom-right-radius: 1px;

}



.discoverPosts .a__bottom-avatar{

    position: absolute;

    bottom: 5px;

}



.discoverModels{

 

}

.discoverModels .a{

    height: 320px!important;

}

.discoverModels .a .avatar{

    --avatar-size: 40px;

}

.discoverReels{

 

} 

.discoverReels .bL__item{

    height: 210px!important;

}

#reelsResult {

    grid-template-columns: repeat(8, 1fr);

}

.reelsPage{

    display: flex;

}

.reelsLeft{

    flex-basis: 100%;

    display: inline-block;

    height: 100vh;

    overflow: auto;

}

.reelsRight{

    flex-basis: 45%;

    display: inline-block;

    height: 100vh;

}



@media (max-width: 640px) {

    .bJ__header {

        margin: 20px 0;

        padding-left: 10px;

        padding-right: 10px;

    }

    #modelsResult {

        grid-template-columns: repeat(2, 1fr);

        padding: 1px;

        grid-gap: 1px!important;

    }

    #reelsResult {

        grid-template-columns: repeat(4, 1fr);

    }    

    .discoverReels .bL__item{

        height: 160px!important;

    }    

    .liveModels{

      grid-template-columns: repeat(3, 1fr)!important; 

      padding: 1px!important; 

    }

    .liveModels .a__controls {

        display: none;

    }  



    .discoverPosts{

      grid-template-columns: repeat(3, 1fr)!important;  

    }



    .discoverPosts .bL__item{

        height: 160px!important;

    }



    .discoverPosts  .displayname__name{

        font-size: 12px !important;

    }



    .discoverModels .a{

        height: 280px!important;

        border-radius: 0!important;

    }

    .discoverModels .a .avatar{

        --avatar-size: 36px;

    }   

    .g {

        padding: 5px;

        height: 310px!important;

    } 

    .a__bottom-shadow{

        border-radius: 0!important;

    }

    .a--squad{

        border-radius: 0!important;

    }

    .user-status-icon {

        top:-8%!important;

        left: -5%!important;

        width: 30%!important;

        height: 30%!important;

        background: none!important;

    }      

}



@media (min-width: 768px) and (max-width: 1024px){ 

    #modelsResult {

        grid-template-columns: repeat(4, 1fr);

        padding: 1px;

        grid-gap: 1px!important;

    }  

    .liveModels{

      grid-template-columns: repeat(4, 1fr)!important; 

      padding: 1px!important; 

    }

    .a__bottom-shadow{

        border-radius: 0!important;

    }

    .a--squad{

        border-radius: 0!important;

    }   

    .discoverModels .a{

        height: 280px!important;

        border-radius: 0!important;

    }    

    .liveModels .a__controls {

        display: none;

    }  



    .discoverPosts{

      grid-template-columns: repeat(4, 1fr)!important;  

    }



    .discoverPosts .bL__item{

        height: 200px!important;

    }



    .a{

        border-radius: 1px!important;

    } 

    .user-status-icon {

        top:-8%!important;

        left: -5%!important;

        width: 30%!important;

        height: 30%!important;

        background: none!important;

    }        

}



.settings-content {

    position: relative;

}

.settings-content__sub-title {

    color: #a0a0a1;

    font-size: 13px;

    font-weight: 400;

    line-height: 16px;

    margin: 16px 0;

}

.settings-wrapper {

    display: flex;

}

.settings-left,

.settings-right {

    flex-basis: 50%;

    min-width: 0;

}

.settings-right {

    padding-left: 20px;

}

.settings-form__actions {

    border-top: 2px solid rgba(255, 255, 255, 0.05);

    display: flex;

    justify-content: flex-end;

    padding-top: 20px;

}

.settings-form__actions .btn-large {

    margin: 0 0 0 16px;

}

.settings-form.settings-form-privacy .select {

    width: 100%;

}

.settings-field {

    margin-bottom: 20px;

}

@media screen and (max-width: 480px) {

    .settings-field {

        justify-content: space-between;

    }

}

.settings-field__tooltip {

    margin-left: 8px;

}

@media screen and (max-width: 480px) {

    .settings-field {

        flex-wrap: wrap;

    }

}

.settings-label {

    color: rgba(255, 255, 255, 0.9);

    display: block;

    font-weight: 700;

    font-size: 0.813rem;

}

.settings-hint,

.settings-label .input-optional {

    color: rgba(255, 255, 255, 0.6);

}

.settings-hint {

    font-size: 0.688rem;

}

.settings-label {

    margin-bottom: 6px;

}

.settings-input {

    margin-bottom: 10px;

}

.settings-input .input-wrapper {

    width: 100%;

}

.settings-input,

.settings-label {

    align-items: center;

    padding-bottom: 0;

    text-align: left;

    display: flex;

    flex-direction: row;

}

.settings-input:last-child,

.settings-label:last-child {

    padding-bottom: 0;

}

.settings-input {

    position: relative;

}

@media screen and (max-width: 480px) {

    .settings-input.settings-input-switcher {

        flex: 0;

    }

}

@media screen and (max-width: 1023px) {

    .settings-wrapper {

        flex-direction: column;

    }

    .settings-left {

        flex-basis: auto;

    }

    .settings-right {

        flex-basis: auto;

        padding: 20px 0 0;

    }

}

.settings-navbar {

    border-bottom: 1px solid rgba(255, 255, 255, 0.2);

    margin-bottom: 40px;

}

.settings-navbar__tabs.tabs-ds {

    border: 0;

    white-space: nowrap;

}

.settings-navbar__alert-badge {

    left: 100%;

    margin: 0 0 0 2px;

    position: absolute;

    top: 4px;

}

.media-gallery {

    bottom: 0;

    left: 0;

    position: fixed;

    top: 0;

    width: 100vw;

    z-index: 211;

    background: rgb(5 5 6 / 70%);

}

.media-gallery__root {

    min-height: 100vh;

    overflow: hidden;

}

.media-gallery--desktop .media-gallery__content-wrapper {

    transition: right 0.2s;



}

.media-gallery--desktop .media-gallery__thumb {

    overflow: hidden;

}



.streamingWrapper .fluid_video_wrapper video {

    border-radius: 16px;

}

.media-gallery--desktop{

    max-width: 1460px;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    height: 100vh;

}

.media-gallery--desktop .media-gallery__content {

    background-position: center;

    background-repeat: no-repeat;

    background-size: contain;

    bottom: 84px;

    left: 0px;

    right: 0px;

    top: 0px;

    border-radius: 16px;

    max-width: 1200px;



}

.media-gallery--desktop .media-gallery__aside-panel {

    bottom: 18px;

    right: 66px;

    top: 24px;

    width: 300px;

}

.media-gallery--desktop.media-gallery--aside .media-gallery__content-wrapper {

    right: 374px;

}

.media-gallery--desktop .media-gallery__info {

    align-items: center;

    bottom: 21px;

    display: flex;

    font-size: 13px;

    height: 36px;

    left: 40px;

}

.media-gallery--desktop .media-gallery__close {

    opacity: 0.5;

    right: 95px;

    top: 44px;

}

.media-gallery--desktop .media-gallery__controls-panel {

    bottom: 20px;

    right: 20px;

}

.media-gallery--desktop .media-gallery__info-sub-title {

    display: none;

}

.media-gallery__bottom-shadow {

    background: linear-gradient(0deg, rgba(0, 0, 0, 0.72) 0, transparent 100%);

    bottom: 0;

    left: 0;

    pointer-events: none;

    position: absolute;

    transition: opacity 0.3s;

    width: 100%;

    z-index: 1;

}

.media-gallery--mobile-portrait .media-gallery__info {

    background: linear-gradient(180deg, rgba(0, 0, 0, 0.72) 0, transparent 100%);

    box-sizing: border-box;

    display: flex;

    font-size: 16px;

    height: 175px;

    justify-content: center;

    left: 0;

    padding: 34px 0 0;

    top: 0;

    width: 100%;

}

.media-gallery--mobile-portrait .media-gallery__close {

    opacity: 0.6;

    right: 26px;

    top: 32px;

}

.media-gallery--mobile-portrait .media-gallery__content {

    bottom: 0;

    left: 0;

    right: 0;

    top: 0;

}

.media-gallery--mobile-portrait .media-gallery__controls-panel {

    bottom: 24px;

    left: 10px;

    right: 10px;

}

.media-gallery--mobile-portrait .media-gallery__bottom-shadow {

    height: 175px;

}

.media-gallery--mobile-portrait .media-gallery__info-icon {

    display: none;

}

.media-gallery--mobile-portrait .media-gallery__info-title {

    bottom: 80px;

    left: 16px;

    position: fixed;

}

.media-gallery--mobile-portrait .video-player__controls {

    padding-bottom: 74px;

}

.media-gallery--mobile-landscape .media-gallery__content {

    bottom: 0;

    left: 0;

    right: 0;

    top: 0;

}

.media-gallery--mobile-landscape .media-gallery__info-title {

    bottom: 24px;

    left: 16px;

    position: fixed;

}

.media-gallery--mobile-landscape .media-gallery__counter {

    opacity: 0.8;

}

.media-gallery--mobile-landscape .media-gallery__info-icon {

    display: none;

}

.media-gallery--mobile-landscape .media-gallery__info {

    font-size: 16px;

    left: 16px;

    top: 24px;

}

.media-gallery--mobile-landscape .media-gallery__bottom-shadow {

    height: 100px;

}

.media-gallery--mobile-landscape .media-gallery__close {

    opacity: 0.6;

    right: 22px;

    top: 24px;

}

.media-gallery--mobile-landscape .media-gallery__controls-panel {

    bottom: 10px;

    right: 10px;

    top: 10px;

}

.media-gallery__content-wrapper {

    left: 50px;

    position: absolute;

    background: #000;

    bottom: 18px;

    right: 66px;

    top: 24px;

    border-radius: 16px;

}

.media-gallery__content {

    position: absolute;

}

.media-gallery__aside-panel {

    position: absolute;

    z-index: 3;

}

.media-gallery__aside-panel--mobile {

    bottom: 0px;

    left: 0;

    right: 0;

    height: 200px;

}

.media-gallery__aside-panel-expand {

    color: #fff;

    cursor: pointer;

    margin: 0 16px 0 0;

    opacity: 0.4;

    position: absolute;

    right: 100%;

    top: 0;

    transition: opacity 0.3s;

}

.media-gallery__aside-panel-expand:hover,

.media-gallery__thumb:hover {

    opacity: 1;

}

.media-gallery__image-desktop,

.media-gallery__play {

    align-items: center;

    display: flex;

    justify-content: center;

}

.media-gallery__play {

    background: rgba(0, 0, 0, 0.6);

    border-radius: 50%;

    height: 20px;

    width: 20px;

}

.media-gallery__image-desktop {

    background-position: center;

    background-repeat: no-repeat;

    background-size: contain;

    bottom: 0;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

}

.media-gallery__controls-panel {

    align-items: center;

    box-sizing: border-box;

    display: flex;

    position: absolute;

    transition: opacity 0.3s;

    z-index: 3;

}

.media-gallery__image-thumbs {

    bottom: 22px;

    height: 36px;

    left: 50%;

    max-width: calc(100% - 200px);

    overflow: hidden;

    position: absolute;

    transform: translateX(-50%);

}

.media-gallery__image-thumbs::after,

.media-gallery__image-thumbs::before {

    background: linear-gradient(270deg, transparent 0, rgba(0, 0, 0, 0.7) 52.29%, #000 100%);

    bottom: 0;

    content: "";

    pointer-events: none;

    position: absolute;

    top: 0;

    transition: opacity 0.3s;

    width: 36px;

    z-index: 2;

}

.media-gallery__image-thumbs::after {

    left: 0;

}

.media-gallery__image-thumbs::before {

    right: 0;

    transform: rotate(180deg);

}

.media-gallery__image-thumbs--left-edge::after,

.media-gallery__image-thumbs--right-edge::before {

    opacity: 0;

}

.media-gallery__info-sub-title {

    font-size: 12px;

    font-weight: 700;

    margin: 4px 0 0;

    opacity: 0.8;

}

.media-gallery__image-thumbs-scroll {

    display: flex;

    height: 80px;

    overflow-x: auto;

    overflow-y: hidden;

}

.media-gallery__thumb {

    align-items: center;

    background: no-repeat center;

    background-size: cover;

    border-radius: 12px;

    color: #fff;

    cursor: pointer;

    display: flex;

    flex: 1;

    height: 36px;

    justify-content: center;

    margin: 0 4px;

    min-width: 36px;

    opacity: 0.4;

    pointer-events: none;

    position: relative;

    transition: opacity 0.3s;

}

.media-gallery__thumb--clickable {

    pointer-events: auto;

}

.media-gallery__arrow:hover,

.media-gallery__close:hover,

.media-gallery__thumb--active {

    opacity: 1;

}

.media-gallery__arrow {

    align-items: center;

    bottom: 70px;

    color: #fff;

    display: flex;

    justify-content: center;

    opacity: 0;

    pointer-events: none;

    position: absolute;

    top: 0;

    transition: opacity 0.3s;

    width: 120px;

}

.media-gallery__arrow--active {

    cursor: pointer;

    opacity: 0.6;

    pointer-events: auto;

}

.media-gallery__arrow--left {

    left: 0;

}

.media-gallery__arrow--right {

    right: 0;

}

.media-gallery__info {

    color: #fff;

    display: flex;

    font-size: 13px;

    font-weight: 700;

    height: 36px;

    position: absolute;

    transition: opacity 0.3s;

    z-index: 3;

}

.media-gallery__info-icon {

    align-items: center;

    display: flex;

    height: 32px;

    justify-content: center;

    margin: 0 10px 0 0;

    width: 32px;

}

.media-gallery__counter {

    color: #fff;

    white-space: pre;

}

.media-gallery__counter-text {

    color: #fff;

}

.media-gallery__close {

    color: #fff;

    cursor: pointer;

    position: absolute;

    transition: opacity 0.3s;

    z-index: 5;

}

.media-gallery__close,

.media-gallery__close > svg {

    height: 18px;

    width: 18px;

}

.media-gallery__image-swiper {

    bottom: 0;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

}

.media-gallery__image-swiper .image-swiper__arrow {

    display: none;

}

.media-gallery--no-controls .media-gallery__bottom-shadow,

.media-gallery--no-controls .media-gallery__close,

.media-gallery--no-controls .media-gallery__controls-panel,

.media-gallery--no-controls .media-gallery__info {

    opacity: 0;

    pointer-events: none;

}

.cB {

    background-color: #1b1b1d;

    border-radius: 8px;

    max-width: 100%;

    padding: 20px 30px;

    width: 680px;

}

.cB .controls {

    display: flex;

    gap: 16px;

    justify-content: flex-end;

}

.username-input-wrapper .username-input-wrapper-input {

    position: relative;

}

.username-input-wrapper .username-input-wrapper-input .input {

    padding-right: 40px;

}

.username-input-wrapper .username-input-wrapper-input > .icon {

    position: absolute;

    right: 15px;

    top: 50%;

    transform: translateY(-50%);

}

.username-input-wrapper .username-input-wrapper-input > .icon.icon-check-1 {

    color: #629a54;

}

.username-input-wrapper .username-input-wrapper-input > .icon.icon-close-5 {

    fill: #d54d3e;

}

@media screen and (max-width: 1023px) {

    .one-time-tooltip {

        display: block;

    }

}

.progress-bar {

    position: relative;

    display: flex;

    flex-direction: column;

}

.progress-bar__range {

    justify-content: space-between;

    margin-bottom: 5px;

    display: flex;

    flex-direction: row;

}

.progress-bar__progress-range-item {

    color: rgba(255, 255, 255, 0.4);

    font-size: 0.625rem;

    line-height: 0.75rem;

}

.progress-bar__progress-wrapper {

    overflow: hidden;

    position: relative;

    display: flex;

    flex-direction: row;

}

.progress-bar__bubble {

    align-items: center;

    background: #21b062;

    border-radius: 16px;

    display: flex;

    font-size: 11px;

    font-weight: 500;

    height: 16px;

    padding: 0 6px;

    pointer-events: none;

    position: absolute;

    text-shadow: 0 0 1px rgba(0, 0, 0, 0.6);

    top: -5px;

    transform: translateX(-50%);

}

.progress-bar__progress {

    transition: flex 0.2s linear;

    flex: 1;

    flex-basis: auto;

    flex-grow: 0;

    flex-shrink: 1;

}

.progress-bar__text-wrapper {

    align-items: center;

    color: rgba(255, 255, 255, 0.7);

    justify-content: center;

    bottom: 0;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

    display: flex;

    flex-direction: row;

    font-size: 0.75rem;

}

.progress-bar.completed {

    background-color: #4b6b46;

    border-color: #83a266;

    padding: 0;

    transition: all 0.2s ease-in-out 0s;

}

.progress-bar.completed .progress-bar__progress {

    background: #4b6b46;

}

.progress-bar.completed .progress-bar__text-wrapper {

    align-items: center;

    color: #fff;

    display: flex;

    flex-direction: row;

}

.progress-bar.type-striped .progress-bar__progress-wrapper {

    background-color: rgba(24, 24, 24, 0.5);

    border: 1px solid rgba(255, 255, 255, 0.2);

    height: 30px;

    padding: 2px;

}

.progress-bar.type-striped .progress-bar__progress {

    background: #424242 linear-gradient(135deg, rgba(0, 0, 0, 0.15) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.15) 50%, rgba(0, 0, 0, 0.15) 75%, transparent 75%, transparent);

    background-size: 1rem 1rem;

}

.progress-bar.type-line .progress-bar__progress-wrapper {

    border-radius: 4px;

    height: 6px;

    padding: 0;

}

.progress-bar.type-line .progress-bar__progress {

    border-radius: 4px;

}

.progress-bar.color-green .progress-bar__progress-wrapper {

    background: #3b3b3b;

}

.progress-bar.color-green .progress-bar__progress {

    background: #21b062;

}

.progress-bar.color-yellow .progress-bar__progress-wrapper {

    background: #3b3b3b;

}

.progress-bar.color-yellow .progress-bar__progress {

    background: #ffc107;

}

.progress-bar.color-red .progress-bar__progress-wrapper {

    background: #3b3b3b;

}

.progress-bar.color-red .progress-bar__progress {

    background: #d21b4c;

}

.progress-bar.color-white .progress-bar__progress-wrapper {

    background: rgba(255, 255, 255, 0.2);

}

.progress-bar.color-white .progress-bar__progress {

    background: #fff;

}

.progress-bar.color-goal .progress-bar__progress-wrapper {

    background: rgba(255, 255, 255, 0.2);

}

.progress-bar.color-goal .progress-bar__progress {

    background: linear-gradient(263.02deg, #21b062 0, #9cb93d 100%);

}

.progress-bar.color-default .progress-bar__progress-wrapper {

    background: rgba(24, 24, 24, 0.5);

}

.progress-bar.animated .progress-bar__progress {

    animation: moving-stripes 1s linear infinite;

}

.pagination {

    display: flex;

    justify-content: center;

    margin-top: 20px;

    width: 100%;

    -webkit-user-select: none;

    user-select: none;

}

.pagination .page-button {

    font-size: 0.75rem;

}

.pagination .page-button .icon {

    height: 10px;

    width: 10px;

}

.pagination .page-button .icon:first-child {

    margin-right: 6px;

}

.pagination .page-button .icon:last-child {

    margin-left: 6px;

}

.pagination .page-button:hover,

.pagination .page-button:hover .icon {

    transition: all 60ms ease-in-out 0s;

}

.pagination .page-button.active {

    background: #d60908;

    border: 0;

    color: #fff;

}

@media screen and (max-width: 1023px) {

    .pagination .page-button .icon {

        height: 12px;

        width: 12px;

    }

}

@media (max-width: 600px) and (orientation: landscape) {

    .pagination .page-button.page-button-next,

    .pagination .page-button.page-button-prev {

        padding: 0;

    }

}

.scroll-bar-container {

    overflow: auto;

    position: relative;

}

.scroll-bar-container--overflow-x {

    overflow: auto hidden;

}

.scroll-bar-container.always-visible .ps__rail-x,

.scroll-bar-container.always-visible .ps__rail-y {

    opacity: 0.6;

}

.scroll-bar-container__shadow {

    opacity: 0;

    pointer-events: none;

    position: absolute;

    transition: opacity 0.3s;

    z-index: 2;

}

.scroll-bar-container__shadow--top {

    background: linear-gradient(180deg, #1b1b1d 0, rgba(27, 27, 29, 0) 100%);

    height: 26px;

    left: 0;

    top: 0;

    width: 100%;

}

.scroll-bar-container__shadow--bottom {

    background: linear-gradient(0, #1b1b1d 0%, rgba(27, 27, 29, 0) 100%);

    bottom: 0;

    height: 26px;

    left: 0;

    width: 100%;

}

.scroll-bar-container__shadow--left {

    background: linear-gradient(90deg, #050506 0, rgba(5, 5, 6, 0.9) 22.97%, rgba(5, 5, 6, 0.01) 100%);

    bottom: 0;

    height: auto;

    left: 0;

    top: 0;

    width: 56px;

}

.scroll-bar-container__shadow--right {

    background: linear-gradient(270deg, #050506 0, rgba(5, 5, 6, 0.9) 22.97%, rgba(5, 5, 6, 0.01) 100%);

    bottom: 0;

    height: auto;

    right: 0;

    top: 0;

    width: 62px;

}

.scroll-bar-container__arrow:hover,

.scroll-bar-container__shadow--visible {

    opacity: 1;

}

.scroll-bar-container__arrow {

    align-items: center;

    color: #fff;

    cursor: pointer;

    display: flex;

    justify-content: center;

    opacity: 0;

    pointer-events: none;

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    transition: opacity 0.3s;

    z-index: 2;

}

.scroll-bar-container__arrow--left {

    left: 7px;

    transform: translateY(-50%) rotate(180deg);

}

.scroll-bar-container__arrow--right {

    right: 7px;

}

.scroll-bar-container__arrow--visible {

    opacity: 0.7;

    pointer-events: auto;

}

.scroll-bar-container-wrapper {

    position: relative;

}

.media-uploader {

    background-color: #1b1b1d;

    border-radius: 8px;

    max-width: 100%;

}

.media-uploader--size--big {

    padding: 20px 30px;

    width: 680px;

}

.media-uploader__subtitle {

    font-size: 0.813rem;

    line-height: 1.125rem;

    color: #f8f8f8;

    margin-top: 10px;

}

.media-uploader .title {

    font-size: 22px;

    font-weight: 700;

}

@media (max-width: 767px) {

    .media-uploader .title {

        font-size: 20px;

    }

}

.media-uploader .price {

    background-color: #272727;

    border-radius: 8px;

    display: flex;

    justify-content: space-between;

    margin: 28px 0 16px;

    padding: 12px 20px;

}

.media-uploader .price-label {

    color: #fff;

    font-size: 13px;

    font-weight: 700;

    opacity: 0.6;

}

.media-uploader .price-value {

    color: #ff3332;

    font-weight: 700;

}

.media-uploader .price-value .icon {

    fill: currentColor;

}

.media-uploader .free-price {

    color: #fff;

    font-weight: 700;

}

.media-uploader .uploading-form {

    display: none;

}

.media-uploader .camera-icon {

    height: 30px;

    width: 34px;

}

.media-uploader .file-icon {

    fill: currentColor;

    height: 30px;

    width: 34px;

}

.media-uploader .upload-label {

    font-size: 14px;

    font-weight: 700;

    margin-top: 10px;

}

.media-uploader .policy {

    color: #707071;

    font-size: 12px;

    line-height: 15px;

    margin-top: 20px;

    text-align: left;

}

.media-uploader .controls {

    display: flex;

    justify-content: flex-end;

    margin-top: 20px;

}

.media-uploader .controls-with-divider {

    border-top: 1px solid rgba(255, 255, 255, 0.1);

    padding-top: 20px;

}

.media-uploader .control-button {

    margin-bottom: 0;

    margin-left: 20px;

}

@media screen and (max-width: 767px) {

    .media-uploader--size--big {

        padding: 10px 14px;

    }

}

.toast-notification {

    display: flex;

    flex-direction: column;

    justify-content: flex-end;

    position: relative;

    transition: height 0.5s;

    width: 100%;

}

.toast-notification--disabled {

    filter: grayscale(1);

    opacity: 0.5;

}

.toast-notification__content {

    flex: 1;

    padding-right: 8px;

}

.toast-notification__wrapper {

    animation-duration: 0.5s;

    animation-fill-mode: forwards;

    background: #232325;

    border-radius: 12px;

    box-shadow: 0 0 12px rgba(0, 0, 0, 0.22), 0 19px 38px rgba(0, 0, 0, 0.3);

    color: #fff;

    display: flex;

    padding: 16px 20px;

    position: relative;

    width: 100%;

}

.toast-notification__wrapper--hidden {

    bottom: 0;

    position: absolute;

}

.toast-notification__wrapper--show-animate {

    animation-name: toast-animation-show;

}

.toast-notification__wrapper--hide-animate {

    animation-name: toast-animation-hide;

}

.toast-notification__wrapper--hide-animate .toast-notification__close {

    display: none;

}

.toast-notification__icon-wrapper {

    min-width: 40px;

    width: 40px;

}

.toast-notification__icon--size--small {

    height: 20px;

    width: 20px;

}

.toast-notification__icon--size--medium {

    height: 24px;

    width: 24px;

}

.toast-notification__icon--accent {

    color: #ff3332;

}

.toast-notification__icon.icon-message {

    color: rgba(255, 255, 255, 0.8);

}

.toast-notification__icon.icon-check-round-fill {

    color: #21b062;

}

.toast-notification__icon.icon-wrong-triangle-fill {

    color: #ffc107;

}

.toast-notification__icon.icon-blocked-fill {

    color: #d21b4c;

}

.toast-notification__title {

    font-size: 16px;

    font-weight: 700;

    line-height: 20px;

}

.toast-notification__description {

    color: #a0a0a1;

    font-size: 12px;

    line-height: 16px;

    margin: 8px 0 0;

}

.toast-notification__actions {

    display: flex;

    justify-content: flex-end;

    margin: 16px 0 0;

}

.toast-notification__button {

    margin-left: 16px;

}

.toast-notification__close {

    align-items: center;

    cursor: pointer;

    display: flex;

    justify-content: center;

    opacity: 0.4;

    padding: 4px;

    position: absolute;

    right: 10px;

    top: 10px;

    transition: opacity 0.3s;

}

.toast-notification__close:hover {

    opacity: 1;

}

.toast-notification__close-icon {

    height: 11px;

    width: 11px;

}

.cm__content {

    padding: 60px;

}

@media screen and (max-width: 639px) {

    .cm__content {

        padding: 40px 20px 20px;

    }

}

.cm__card {

    background: #232325;

    border-radius: 12px;

    display: flex;

    flex-direction: column;

    gap: 16px;

    padding: 20px;

}

.cm__card--size--s {

    gap: 14px;

}

.cm__row {

    color: #a0a0a1;

    font-size: 14px;

    font-weight: 400;

    line-height: 140%;

}

.cD {

    max-width: 100%;

    padding: 20px;

}

.cD__icon-container {

    color: #21b062;

    display: flex;

    justify-content: center;

    margin-bottom: 16px;

}

.cD__title {

    margin: 0;

    text-align: center;

    white-space: pre-line;

}

.cD__iframe {

    margin-top: 20px;

    position: relative;

}

.cD__loader {

    left: 50%;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

}

.tip-modal__content {

    padding: 0 20px 12px;

}

.tip-modal__content .textarea {

    margin: 12px 0 0;

    min-height: 80px;

}

.tip-modal__content .radio-pill-controls {

    column-gap: 12px;

    display: grid;

    grid-template-columns: repeat(6, 1fr);

    margin: 0 0 12px;

    row-gap: 12px;

}



.founds-modal__content .radio-pill-controls {

    grid-template-columns: repeat(3, 1fr)!important;

    padding-left: 30px;

    padding-right: 30px;

}

.tip-modal__content .radio-pill-controls .radio-pill-controls__item {

    margin: 0;

    padding: 0;

}

.tip-modal__content .radio-pill-controls .radio-pill-controls__item:last-child {

    padding: 0 24px;

}



.tip-modal__user {

    align-items: center;

    display: flex;

    padding: 20px 20px 32px;

    margin-left: 30px;

}



@media screen and (max-width: 639px) {

    .tip-modal__content .radio-pill-controls {

        grid-template-columns: repeat(3, 1fr);

        padding-left: 0px;

        padding-right: 0px;        

    }

    .tip-modal__user {

        margin-left: 0;

    }    

}



.tip-modal__user .avatar {

    height: 64px;

    width: 64px;

}

.tip-modal__user-meta {

    margin-left: 12px;

}

.tip-modal__user-subtitle {

    color: #707071;

    font-size: 14px;

    font-weight: 500;

    line-height: 17px;

    margin: 0 0 4px;

}

.tip-modal__submit {

    margin: 32px auto 12px;

    width: 280px;

}

.tip-modal__vat {

    color: #707071;

    display: block;

    font-size: 12px;

    font-weight: 500;

    line-height: 15px;

}

@media screen and (max-width: 639px) {

    .tip-modal__user {

        padding-bottom: 20px;

    }

    .tip-modal__user .avatar {

        height: 40px;

        width: 40px;

    }

    .tip-modal__user .displayname__name {

        font-size: 0.875rem;

        line-height: 1.063rem;

    }

    .tip-modal__user-subtitle {

        font-size: 12px;

        font-weight: 500;

        line-height: 15px;

    }

}

.improve-my-club {

    max-width: 100%;

    padding: 20px;

}

.improve-my-club__icon-container {

    color: #21b062;

    display: flex;

    justify-content: center;

    margin-bottom: 16px;

}

.improve-my-club__title {

    margin: 0;

    text-align: center;

    white-space: pre-line;

}

.improve-my-club__iframe {

    margin-top: 20px;

    position: relative;

}

.improve-my-club__loader {

    left: 50%;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

}

.trial-subscribe-error-modal__description {

    max-width: 300px;

}

.creator-lists-modal__body {

    display: flex;

    flex: 1;

    flex-direction: column;

    margin: 0 auto;

    max-width: 100%;

    min-height: 500px;

    overflow-y: auto;

    width: 500px;

}

.creator-lists-modal__title {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.creator-lists-modal__content {

    flex: 1;

}

.creator-lists-modal__input-wrapper {

    padding: 20px 20px 0;

}

.creator-lists-modal__lists-wrapper {

    height: 304px;

    padding: 0 20px;

}

.creator-lists-modal__list-item {

    align-items: center;

    border-bottom: 1px solid rgba(255, 255, 255, 0.05);

    display: flex;

    gap: 10px;

    justify-content: space-between;

    padding: 10px 0;

}

.creator-lists-modal__list-item--last {

    border: 0;

}

.creator-lists-modal__list-info {

    max-width: 50%;

}

.creator-lists-modal__list-title {

    align-items: center;

    display: flex;

    flex-wrap: nowrap;

    gap: 5px;

    margin-bottom: 2px;

}

.creator-lists-modal__description,

.creator-lists-modal__name {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.creator-lists-modal__description {

    color: #a0a0a1;

}

.creator-lists-modal__right-part {

    align-items: center;

    display: flex;

    gap: 20px;

    justify-content: flex-end;

}

.creator-lists-modal__actions {

    display: grid;

    place-items: center;

    width: 70px;

}

.creator-lists-modal__users-count {

    color: #a0a0a1;

    white-space: nowrap;

}

.on-boarding {

    background: radial-gradient(104.18% 126.71%at 69.22% 14.96%, #481974 0, #060506 100%), #050506;

    max-width: 592px;

    position: relative;

}

.on-boarding::before {

    background: url(/assets/common/components/ui/OnBoarding/mark.svg) no-repeat;

    content: "";

    height: 289px;

    opacity: 0.06;

    pointer-events: none;

    position: absolute;

    right: 0;

    top: 0;

    width: 228px;

}

.on-boarding__scroll {

    overflow: hidden;

    width: 100%;

}

.on-boarding__content {

    display: grid;

}

.on-boarding__counter {

    font-size: 18px;

    font-weight: 400;

    left: 72px;

    line-height: 22px;

    position: absolute;

    top: 64px;

}

.on-boarding__controls {

    bottom: 44px;

    display: flex;

    left: 72px;

    position: absolute;

}

.on-boarding__control {

    align-items: center;

    background: var(--primary-border);

    border: 0;

    border-radius: 50%;

    color: #000;

    cursor: pointer;

    display: flex;

    height: 32px;

    justify-content: center;

    padding: 0 0 0 2px;

    transition: opacity 0.3s;

    width: 32px;

}

.on-boarding__control:hover {

    background: #9e40fd;

}

.on-boarding__control--prev {

    margin: 0 15px 0 0;

    transform: rotate(180deg);

}

.on-boarding__control:disabled {

    background: rgba(177, 56, 255, 0.6);

    pointer-events: none;

}

.on-boarding__show-later {

    bottom: 52px;

    color: #fff;

    cursor: pointer;

    font-size: 11px;

    font-weight: 400;

    line-height: 13px;

    opacity: 0.4;

    position: absolute;

    right: 72px;

    text-transform: uppercase;

}

.on-boarding__show-later--mobile {

    display: inline-block;

    margin: 0 0 32px;

    position: static;

}

.on-boarding__show-later.active,

.on-boarding__show-later:hover {

    opacity: 0.8;

}

.on-boarding__copy-link {

    margin: 26px 0 0;

    max-width: 366px;

}

@media screen and (max-width: 767px) {

    .on-boarding {

        text-align: center;

    }

    .on-boarding__content {

        display: block;

        width: auto !important;

    }

    .on-boarding::before,

    .on-boarding__controls,

    .on-boarding__counter,

    .on-boarding__show-later--desktop {

        display: none;

    }

}

.cE__header {

    align-items: center;

    border-bottom: 2px solid rgba(255, 255, 255, 0.05);

    display: flex;

    gap: 20px;

    justify-content: flex-start;

    padding: 20px;

}

.cE__content {

    padding: 0 20px;

}

.cE__items-list {

    height: 320px;

}

.cE__footer {

    border-top: 2px solid rgba(255, 255, 255, 0.05);

    display: grid;

    min-height: 100px;

    padding: 20px;

    place-items: center;

}

.cE__footer-content {

    align-items: center;

    display: flex;

    flex-direction: column;

    gap: 12px;

    justify-content: center;

    max-width: 320px;

}

.cE__my-club-icon {

    color: #ff3332;

    margin-right: 4px;

    transform: rotate(-30deg);

}

.cV {

    background: #303030;

}

.cV__body,

.cV__content {

    display: flex;

    flex: 1;

    flex-direction: column;

    margin: 0 auto;

    overflow: hidden;

    width: 100%;

}

.cV__content {

    max-height: 100%;

    padding: 20px;

    position: relative;

}

.cV__thumbs-wrapper {

    flex: 1;

    height: 70px;

    position: relative;

    transition: opacity 0.3s;

}

.cV__thumbs-wrapper--disabled {

    opacity: 0.6;

    pointer-events: none;

}

.cV__thumbs-wrapper .buttons-form-list {

    padding: 8px 0 0;

}

.cV__thumbs {

    bottom: 0;

    column-gap: 12px;

    display: flex;

    height: inherit;

    left: -10px;

    overflow: auto;

    padding: 10px 0 0 10px;

    position: absolute;

    top: 0;

    width: 100%;

}

.cV__thumb-add {

    align-items: center;

    background: #343437;

    border-radius: 8px;

    color: #707071;

    cursor: pointer;

    display: flex;

    height: 60px;

    justify-content: center;

    min-width: 36px;

    position: relative;

    width: 36px;

}

.cV__thumb-add:hover {

    color: #cfcfd0;

}

.cV__mobile-back {

    align-items: center;

    backdrop-filter: blur(4px);

    background: rgba(5, 5, 6, 0.4);

    border: 0;

    border-radius: 50%;

    color: #fff;

    display: flex;

    height: 48px;

    justify-content: center;

    left: 12px;

    position: absolute;

    top: 12px;

    width: 48px;

}

.cV__mobile-submit-button.btn {

    border-radius: 60px;

    height: 48px;

    padding: 12px 20px;

}

.cV__tag-creators {

    min-height: 316px;

}

.cV__add-dropdown {

    animation: opacity-fade-top-show 0.3s;

    position: fixed;

    z-index: 500;

}

.cV__move-border {

    border: 1px dashed #fff;

    border-radius: 16px;

    bottom: 11%;

    left: 3%;

    pointer-events: none;

    position: absolute;

    right: 3%;

    top: 11%;

    transition: opacity 0.3s;

}

.cV__move-border--hidden {

    opacity: 0;

}

.cV__error-banner {

    align-items: center;

    background: rgba(0, 0, 0, 0.6);

    border-radius: 20px;

    bottom: 12px;

    display: flex;

    gap: 18px;

    left: 12px;

    padding: 4px 18px;

    position: absolute;

    right: 12px;

}

@media (min-height: 580px) {

    .cV__body .upload-media__button {

        height: 242px;

    }

}

.cV__bottom-drawer-wrapper {

    bottom: 0;

    display: flex;

    flex-direction: column;

    justify-content: end;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 3;

}

.cV__bottom-drawer {

    animation: move-bottom-right 0.25s;

    background: #1b1b1d;

    height: 50%;

    max-height: 50vh;

    padding: 20px;

}

.cV__body .upload-media__actions {

    display: flex;

    flex-direction: column;

    gap: 20px;

}

.cV__body .upload-media__button {

    height: 130px;

}

.cJ__action-container {

    align-items: center;

    display: flex;

    gap: 16px;

    justify-content: flex-end;

}

.cJ__action-container--success {

    justify-content: center;

}

.post-editor-modal .tile-header {

    pointer-events: none;

}

.post-editor-modal__content {

    flex: 1;

    margin: 0 auto;

    overflow: hidden;

    padding: 20px;

    position: relative;

    width: 100%;

}

.post-editor-modal__content--min-height {

    min-height: min(380px, 50vh);

}

.post-editor-modal__content--webcam {

    display: flex;

}

.post-editor-modal__settings-items > .cs:not(:first-child) {

    border-top: 1px solid rgba(255, 255, 255, 0.05);

}

.post-editor-modal__tagged-users-list {

    color: #707071;

    font-size: 14px;

    font-weight: 500;

    max-width: 100%;

    overflow: hidden;

    text-align: end;

    text-overflow: ellipsis;

    white-space: nowrap;

    width: 190px;

}

.post-editor-modal-wrapper .p__button {

    display: none;

}

.post-editor-modal-wrapper .p__content {

    padding-right: 20px;

}

.post-editor-modal-wrapper .modal-content {

    max-width: 100%;

}

.post-editor-modal-wrapper .inner-form-title {

    align-items: center;

    display: flex;

    margin: 0 0 12px;

}

.post-editor-modal-wrapper .form-description {

    font-size: 14px;

    font-weight: 400;

    letter-spacing: normal;

    line-height: 1.3;

    margin-bottom: 20px;

    opacity: 0.6;

}

.post-editor-modal-wrapper .panel-image label {

    color: rgba(255, 255, 255, 0.4);

    font-size: 0.813rem;

}

.post-editor-modal-wrapper .panel-image button {

    margin-right: 0;

}

.post-editor-modal-wrapper .panel-image .icon-close-2 {

    color: rgba(255, 255, 255, 0.6);

    height: 16px;

    margin: 0;

    width: 16px;

}

.post-editor-modal-wrapper--section .footer-actions-container {

    visibility: hidden;

}

.post-editor-modal-wrapper .panel-body textarea {

    min-height: 110px;

}

.post-editor-modal-wrapper--preview {

    align-self: center;

}

.post-editor-modal-wrapper--preview form > :not(.footer-actions-container) {

    display: none;

}

.post-editor-modal-wrapper--webcam-opened .footer-actions-container,

.post-editor-modal-wrapper--webcam-opened .form-description,

.post-editor-modal-wrapper--webcam-opened .panel-body,

.post-editor-modal-wrapper--webcam-opened .panel-field-optional,

.post-editor-modal-wrapper--webcam-opened .panel-image > label,

.post-editor-modal-wrapper--webcam-opened .panel-preview-toggle,

.post-editor-modal-wrapper--webcam-opened .panel-title,

.post-editor-modal-wrapper--webcam-opened > .inner-form-title {

    display: none;

}

.post-editor-modal-wrapper__footer-actions {

    display: grid;

    grid-auto-flow: row;

    grid-row-gap: 20px;

    width: 100%;

}

.post-editor-modal-wrapper__footer-actions .modal-footer-bottom {

    display: flex;

    flex-wrap: nowrap;

    justify-content: space-between;

    width: 100%;

}

.post-editor-modal-wrapper__submit-button {

    min-width: 122px;

    transition: opacity 0.3s;

}

.post-editor-modal-wrapper__preview-header {

    display: flex;

    gap: 10px;

}

.post-editor-modal-wrapper__preview-body-wrapper {

    flex: 1;

}

.panel-preview-toggle {

    align-self: center;

    display: inline-flex;

}

.panel-preview-toggle button {

    align-content: center;

    align-items: center;

    background-color: transparent;

    border: 0;

    color: rgba(255, 255, 255, 0.8);

    cursor: pointer;

    display: inline-flex;

    outline: 0;

    padding: 0;

    font-size: 0.813rem;

}

.panel-preview-toggle button .icon {

    fill: rgba(255, 255, 255, 0.8);

    height: 18px;

    margin-right: 7px;

    width: 18px;

}

.panel-preview-toggle button:hover .icon {

    fill: #fff;

}

.panel-preview-toggle__title {

    display: inline;

}

@media screen and (max-width: 390px) {

    .panel-preview-toggle__title {

        display: none;

    }

}

.panel-preview-toggle button:hover,

.post-editor-modal-wrapper .scheduled-button-active {

    color: #fff;

}

.panel-preview-toggle button:active {

    transform: translateY(1px);

}

.panel-preview-toggle button[disabled] {

    opacity: 0.33;

    pointer-events: none;

}

.panel-field__counters-info {

    border-radius: 6px;

    font-size: 13px;

    line-height: 18px;

    margin: 12px 0 24px;

    padding-top: 10px;

    text-align: center;

}

.panel-field label {

    color: rgba(255, 255, 255, 0.9);

    display: block;

    margin-bottom: 12px;

    text-align: left;

    font-size: 0.813rem;

}

.panel-field label .input-optional {

    color: rgba(255, 255, 255, 0.6);

}

.panel-field textarea {

    border-radius: 12px;

    height: 60px;

    width: 100%;

}

.panel-field + .panel-field {

    margin-top: 20px;

}

.panel-field.disabled {

    opacity: 0.2;

    pointer-events: none;

}

.panel-field-invalid .input,

.panel-field-invalid .textarea {

    border: 1px solid #fa5365;

}

.teaser-post-settings {

    align-items: start;

    display: grid;

    grid-auto-flow: row;

    grid-row-gap: 8px;

    margin-bottom: 24px;

    margin-top: -16px;

}

.teaser-post-settings__title {

    font-size: 13px;

    font-weight: 500;

}

.landing-ability {

    position: relative;

}

.landing-ability__observer {

    pointer-events: none;

    position: absolute;

    top: 40vh;

}

.landing-ability__content-wrapper {

    align-items: center;

    display: flex;

    justify-content: space-between;

}

.landing-ability__content-wrapper--is-right .landing-ability__description,

.landing-ability__is-right .landing-ability__description {

    margin-left: 40px;

    margin-right: 0;

}

.landing-ability__description {

    flex: 1;

    margin-right: 40px;

}

.landing-ability__content {

    flex: 1;

    position: relative;

}

.landing-ability__suptitle {

    color: #707071;

    font-size: 24px;

    line-height: 28px;

    margin-bottom: 20px;

}

.landing-ability__title {

    font-size: 2.75rem;

    line-height: 3.125rem;

    font-weight: 700;

    margin: 0 0 20px;

}

.landing-ability__subtitle {

    color: #cfcfd0;

    margin-bottom: 18px;

    font-size: 1rem;

    line-height: 1.75rem;

}

.landing-ability__tell-me-more {

    align-items: center;

    color: #a0a0a1;

    cursor: pointer;

    display: inline-flex;

    text-decoration: none;

    transition: color 0.3s;

    font-size: 1rem;

    line-height: 1.75rem;

}

.landing-ability__tell-me-more:hover {

    color: #fff;

    text-decoration: none;

}

.landing-ability__tell-me-more:hover > .arrow-down-animated {

    background-color: #d60908;

    border-color: rgba(138, 24, 252, 0.3);

}

.landing-ability__tell-me-more:hover > .arrow-down-animated > .arrow-down-animated__content--animated-hover {

    animation: arrow-down-animated-move 0.5s;

}

@media screen and (max-width: 1023px) {

    .landing-ability__title {

        font-size: 1.5rem;

        line-height: 2.375rem;

    }

    .landing-ability__subtitle {

        line-height: 1.6rem;

    }

}

@media screen and (max-width: 767px) {

    .landing-ability__content-wrapper {

        align-items: flex-start;

        flex-direction: column;

        justify-content: flex-start;

    }

    .landing-ability__content-wrapper--is-right {

        flex-direction: column-reverse;

    }

    .landing-ability:not(:last-child) {

        margin-bottom: 20px;

    }

    .landing-ability__content {

        width: 100%;

    }

    .landing-ability__suptitle {

        font-size: 1.125rem;

        line-height: 1.75rem;

    }

    .landing-ability__title {

        font-size: 1.375rem;

        line-height: 1.688rem;

        font-weight: 700;

    }

    .landing-ability__content-wrapper--is-right .landing-ability__description,

    .landing-ability__description {

        margin: 0;

        max-width: calc(100vw - 48px);

    }

    .landing-ability__subtitle {

        font-size: 1rem;

        line-height: 1.625rem;

        font-weight: 400;

    }

}

.landing-ability--animated--is-waiting .landing-ability__content,

.landing-ability--animated--is-waiting .landing-ability__description {

    opacity: 0;

}

.landing-ability--animated--type-1 .landing-ability__content {

    animation-duration: 0.5s;

    animation-name: ability-animation-for-left;

}

.landing-ability--animated--type-1 .landing-ability__description,

.landing-ability--animated--type-2 .landing-ability__content {

    animation-duration: 0.5s;

    animation-name: ability-animation-for-right;

}

.landing-ability--animated--type-2 .landing-ability__description {

    animation-duration: 0.5s;

    animation-name: ability-animation-for-left;

}

.range {

    align-items: center;

    display: flex;

    position: relative;

}

.range__virtual-track {

    background: 0 0;

    cursor: pointer;

    height: 32px;

    left: 0;

    margin-top: -13px;

    position: absolute;

    top: 0;

    width: 100%;

}

.range__track {

    background-color: rgba(255, 255, 255, 0.4);

    border-radius: 3px;

    cursor: pointer;

    height: 6px;

    width: 100%;

}

.range__track-active {

    background-color: #ff3332;

    position: absolute;

}

.range__marks-wrapper {

    align-items: center;

    cursor: pointer;

    display: flex;

    height: 100%;

    justify-content: space-around;

    left: 0;

    position: absolute;

    width: 100%;

}

.range__mark {

    background-color: #fff;

    border: 3px solid #0b0313;

    border-radius: 6px;

    bottom: calc(50% - 6px);

    box-sizing: content-box;

    height: 6px;

    margin: 0 8px;

    width: 6px;

}

.range__handle-wrapper {

    align-items: center;

    background-color: #d60908;

    border-radius: 16px;

    box-shadow: 0 0 15px rgba(0, 0, 0, 0.05), 0 2px 4px rgba(0, 0, 0, 0.07);

    cursor: pointer;

    display: flex;

    height: 32px;

    justify-content: center;

    position: absolute;

    transition: left 0.05s ease;

    width: 32px;

}

.range__handle,

.range__marker {

    background-color: #fff;

    border-radius: 6px;

    height: 12px;

    width: 12px;

}

.range__marker {

    border: 3px solid #303030;

    border-radius: 5px;

    height: 9px;

    width: 9px;

}

@media screen and (max-width: 1023px) {

    .range__handle-wrapper {

        transition: none;

    }

}

.bA {

    height: 100%;

    left: 0;

    pointer-events: none;

    position: absolute;

    top: 0;

    width: 100%;

}

.bA__svg {

    display: block;

}

.displayname {

    align-items: center;

    display: flex;

    flex-wrap: wrap;

    min-width: 0;

}

.displayname__name {

    color: #fff;

    font-weight: 500;

    margin: 0;

    white-space: initial;

    z-index: 1;

}

.displayname__name--text-overflow,

.displayname__name-text--accent {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.displayname__name-text--accent {

    background: #ff3332;

    border-radius: 6px;

    color: #fff;

    display: inline-block;

    padding: 2px 6px;

}

.displayname--size--big > .displayname__name {

    font-size: 3rem;

}

.displayname--size--big .icon {

    height: 32px;

    pointer-events: auto;

    vertical-align: baseline;

    width: 32px;

}

.displayname--size--medium > .displayname__name {

    font-size: 1.125rem;

}

.displayname--size--medium .icon {

    height: 16px;

    pointer-events: auto;

    vertical-align: baseline;

    width: 16px;

}

.displayname--size--medium-ll > .displayname__name {

    font-size: 28px;

}

.displayname--size--medium-ll .icon {

    height: 20px;

    pointer-events: auto;

    vertical-align: baseline;

    width: 20px;

}

.displayname--size--medium-l > .displayname__name {

    font-size: 1.375rem;

}

.displayname--size--medium-l .icon {

    height: 20px;

    pointer-events: auto;

    vertical-align: baseline;

    width: 20px;

}

.displayname--size--small > .displayname__name {

    font-size: 1rem;

}

.displayname--size--small .icon {

    height: 20px;

    pointer-events: auto;

    position: relative;

    top: -5px;

    width: 20px;

    display: inline-flex;

}

.displayname--size--small-x > .displayname__name {

    font-size: 15px;

}

.displayname--size--small-x .icon {

    height: 20px;

    pointer-events: auto;

    position: relative;

    top: -2px;

    width: 20px;

}

.displayname--size--small-xx > .displayname__name {

    font-size: 13px;

    line-height: 120%;

}

.displayname--size--small-xx .icon {

    height: 14px;

    pointer-events: auto;

    position: relative;

    top: -1px;

    width: 14px;

}

.displayname--size--small-xx .displayname__verified--accent .icon {

    top: -6px;

}

.displayname--size--small-xxx > .displayname__name {

    font-size: 12px;

}

.displayname--size--small-xxx .icon {

    height: 12px;

    pointer-events: auto;

    position: relative;

    top: -1px;

    width: 12px;

}

.displayname__official-tooltip {

    backdrop-filter: blur(2px);

    background: rgba(35, 35, 37, 0.9);

    border-radius: 12px;

    max-width: 220px;

    padding: 20px;

    position: relative;

}

.displayname__official-tooltip::before {

    backdrop-filter: blur(2px);

    background: inherit;

    border-bottom-left-radius: 2px;

    clip-path: polygon(0 0, 0 100%, 100% 100%);

    content: "";

    height: 10px;

    left: 50%;

    position: absolute;

    top: 100%;

    transform: translateY(-50%) translateX(-50%) rotate(-45deg);

    width: 10px;

}

.bottom .displayname__official-tooltip::before {

    bottom: 100%;

    top: auto;

    transform: translateY(50%) translateX(-50%) rotate(135deg);

}

.left .displayname__official-tooltip::before {

    left: 100%;

    top: 50%;

    transform: translateY(-50%) translateX(-50%) rotate(-135deg);

}

.right .displayname__official-tooltip::before {

    left: auto;

    right: 100%;

    top: 50%;

    transform: translateY(-50%) translateX(-50%) rotate(45deg);

}

.displayname__official-tooltip-header {

    align-items: center;

    display: flex;

    gap: 16px;

    justify-content: center;

    margin-bottom: 20px;

    padding-left: 10px;

}

.displayname__official-tooltip-title {

    color: #fff;

    font-size: 16px;

    font-weight: 500;

    line-height: 125%;

}

.displayname__official-tooltip-description {

    color: #a0a0a1;

    font-size: 12px;

    font-weight: 400;

    line-height: 140%;

    text-align: center;

}

.displayname__official-tooltip-icon {

    height: 48px;

    width: 48px;

}

.displayname__short-name {

    display: inline-block;

    max-width: 156px;

    overflow: hidden;

    text-overflow: ellipsis;

    vertical-align: text-bottom;

    white-space: nowrap;

}

.display-full-name {

    font-size: 0.85rem;

    color: rgba(255, 255, 255, 0.85);

    flex-grow: 1;

    margin: 0;

}

.display-full-name__nickname {

    display: block;

    margin: 2px 0 0;

}

.display-full-name__nickname--text-overflow {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.display-full-name .username {

    font-size: 0.938rem;

    margin: -1px 0 3px;

}

.my-collection-content {

    margin: 44px 0 24px;

}

.my-collection-model > a,

.my-collection-model > a:hover {

    color: #fff;

    display: block;

    position: relative;

    text-decoration: none !important;

}

.my-collection-model .head {

    padding-bottom: 10px;

    display: flex;

    flex-direction: row;

}

.my-collection-model .head .avatar {

    height: 40px;

    width: 40px;

}

.my-collection-model .head .left {

    flex: 1;

    flex-basis: auto;

    flex-grow: 0;

    flex-shrink: 1;

}

.my-collection-model .head .right {

    align-self: center;

    margin-left: 12px;

    flex: 1;

    flex-basis: auto;

    flex-grow: 1;

    flex-shrink: 0;

}

.my-collection-model .head .name {

    color: var(--primary-light);

    margin: 0 0 2px;

    font-size: 0.875rem;

}

.my-collection-model .head .details {

    opacity: 0.5;

    font-size: 0.75rem;

}

.my-collection-model .preview {

    background-position: center;

    background-size: cover;

    border-radius: 18px;

    padding-bottom: 75%;

    position: relative;

}

.my-collection-model .preview.empty {

    background-color: #4f4f4f;

}

.my-collection-model .preview.empty .icon {

    left: 50%;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

    fill: #fff;

    opacity: 0.2;

}

.my-collection-model .preview .details-wrapper {

    background-image: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, 0.75) 100%);

    bottom: 0;

    left: 0;

    padding: 10px;

    pointer-events: none;

    position: absolute;

    right: 0;

}

.my-collection-model .preview .details {

    color: #fff;

    display: flex;

    flex-direction: row;

    text-shadow: 1px 1px rgba(0, 0, 0, 0.4);

}

.my-collection-model .preview .left {

    line-height: 16px;

    overflow: hidden;

    flex: 1;

    flex-basis: auto;

    flex-grow: 1;

    flex-shrink: 1;

}

.my-collection-model .preview .right {

    align-self: flex-end;

    line-height: 16px;

    flex: 1;

    flex-basis: auto;

    flex-grow: 0;

    flex-shrink: 1;

}

.ff {

    height: 100%;

    position: relative;

}

.f__content-wrapper {

    background: #232325;

    border-radius: 16px;

    height: 100%;

    overflow: hidden;

}

.f__counters {

    color: #a0a0a1;

    font-size: 12px;

    padding: 12px 20px 20px;

}

.f__price {

    color: #fff;

    font-size: 10px;

    font-weight: 700;

    margin: 0 0 4px;

    text-transform: uppercase;

}

.f__nickname {

    display: block;

    margin: 0 0 16px;

}

.f__info {

    font-size: 0.75rem;

    color: rgba(255, 255, 255, 0.6);

    flex-grow: 1;

    margin: 0;

}

.f__info .username {

    font-size: 0.938rem;

    margin: -1px 0 3px;

}

.f__actions {

    display: flex;

    flex-direction: row;

    align-items: center;

    border-top: 1px solid rgba(255, 255, 255, 0.05);

    justify-content: flex-end;

    margin: 16px 0 0;

    padding: 16px 0 0;

}

.f__actions .icon {

    height: 16px;

    margin: 0 12px 0 0;

    min-width: 16px;

    width: 16px;

}

.f__actions .btn {

    align-items: center;

    display: flex;

    margin: 0 0 0 6px;

}

.f__link {

    color: rgba(255, 255, 255, 0.4);

    cursor: pointer;

    transition: all 0.15s linear;

    font-size: 0.75rem;

}

.f__link:hover {

    color: rgba(255, 255, 255, 0.6);

}

.f__status {

    font-size: 0.75rem;

    margin-bottom: 10px;

}

.f__status.active {

    color: #40d364;

}

.f__status.canceled,

.f__status.inactive {

    color: rgba(255, 255, 255, 0.6);

}

.f__status.suspended {

    color: #fa5365;

}

.f .favorite-button {

    position: absolute;

    right: 20px;

    top: 12px;

}

@media screen and (max-width: 479px) {

    .f {

        flex-flow: column;

    }

}

.ff__content {

    padding: 0 20px 20px;

}

.auth-form {

    display: flex;

    flex: 1;

    flex-direction: column;

    justify-content: center;

}

.auth-form__fading-input {

    max-height: 100px;

}

.auth-form__fading-input:not(:last-child) {

    margin-bottom: 16px;

}

.auth-form__title {

    font-size: 1.375rem;

    line-height: 1.679rem;

    font-weight: 500;

    margin-bottom: 24px;

    text-align: center;

}

.auth-form__social-login {

    column-gap: 12px;

    display: grid;

    grid-template-columns: repeat(2, 1fr);

}

.auth-form__social-login .icon {

    margin-right: 10px;

}

.auth-form__divider {

    margin: 24px 0;

    padding: 0 76px;

    text-align: center;

    font-size: 0.75rem;

    line-height: 0.938rem;

}

.auth-form__divider-text {

    opacity: 0.4;

}

.auth-form__hint {

    font-size: 0.688rem;

    line-height: 1rem;

    color: #707071;

    font-weight: 400;

    margin-top: 10px;

    text-align: center;

}

.auth-form__hint a {

    color: #707071;

    text-decoration: underline;

}

.auth-form__hint a:hover {

    color: #cfcfd0;

    text-decoration: none;

}

.auth-form__join {

    margin-top: 16px;

}

.auth-form__form-switcher {

    color: #a0a0a1;

    margin-top: 32px;

    text-align: center;

    font-size: 0.813rem;

    line-height: 1rem;

}

.auth-form__form-switcher .btn {

    border-radius: 0;

    color: #ff3636;

    vertical-align: baseline;

    font-size: 0.813rem;

    line-height: 1rem;

}

@media screen and (max-width: 639px) {

    .auth-form__title {

        font-size: 1.375rem;

        line-height: 1.679rem;

    } 

}

.auth-form .recaptcha {

    display: flex;

    justify-content: center;

    margin: 20px auto 0;

}

.header-notifications {

    left: 0;

    position: absolute;

    top: 100%;

    width: 100%;

}

.header-notification {

    align-items: center;

    overflow: hidden;

    position: relative;

    text-overflow: ellipsis;

    display: flex;

    flex-direction: row;

}

.header-notification--success {

    background: #21b062;

}

.header-notification--error {

    background: #c5201f;

}

.header-notification--cover-moderation {

    background: #fccf49;

}

.header-notification--cover-moderation .icon {

    margin: 0 12px 0 0;

}

.header-notification--cover-moderation .header-notification-body {

    align-items: center;

    color: #000;

    display: flex;

    font-size: 13px;

    font-weight: 500;

    justify-content: center;

    line-height: 16px;

    padding: 4px 0;

}

.header-notification--recommendation {

    background: #f4f4f4;

}

.header-notification--recommendation .header-notification-body {

    align-items: center;

    color: #2b2b2b;

    justify-content: center;

    display: flex;

    flex-direction: row;

}

.header-notification--recommendation .icon-close-5 {

    cursor: pointer;

    fill: rgba(43, 43, 43, 0.5);

    height: 14px;

    margin-right: 20px;

    pointer-events: auto;

    width: 14px;

    flex: 1;

    flex-basis: auto;

    flex-grow: 0;

    flex-shrink: 0;

}

.header-notification--recommendation .icon-close-5:hover {

    fill: rgba(43, 43, 43, 0.8);

}

.header-notification--warning {

    background-color: #ffc107;

}

.header-notification--warning a,

.header-notification--warning-light a {

    color: inherit;

}

.header-notification--warning svg,

.header-notification--warning-light svg {

    color: #050506 !important;

}

.header-notification--warning > .header-notification-body {

    color: #050506;

    font-size: 15px;

    padding: 8px 0;

}

.header-notification--warning .icon-close {

    color: #1b1b1d;

}

.header-notification--warning .icon-close:hover {

    color: #050506;

}

.header-notification--warning-light {

    background-color: #755e8d;

}

.header-notification--warning-light > .header-notification-body {

    color: #fff;

    font-size: 15px;

    padding: 8px 0;

}

.header-notification--warning-light .icon-close {

    color: #a0a0a1;

}

.header-notification--push .header-notification-body.white,

.header-notification--warning-light .icon-close:hover {

    color: #fff;

}

.header-notification--push {

    background-color: #59c5e6;

}

.header-notification--push .header-notification-body {

    align-items: center;

    color: #2b2b2b;

    justify-content: center;

    padding: 10px;

    display: flex;

    flex-direction: row;

}

.header-notification--push .header-notification-title {

    align-items: center;

    font-weight: 700;

    justify-content: center;

    line-height: 1.25rem;

    font-size: 0.875rem;

    display: flex;

    flex-direction: row;

}

.header-notification--push .icon-notifications {

    margin-right: 15px;

    margin-top: 2px;

    min-width: 18px;

}

.header-notification--push .close-button {

    cursor: pointer;

}

.header-notification--push .close-button .icon-close-2 {

    fill: rgba(0, 0, 0, 0.3);

}

.header-notification--push .close-button:hover .icon-close-2 {

    fill: rgba(0, 0, 0, 0.5);

}

.header-notification--push .btn {

    margin: 0 0 0 20px;

    padding: 0 30px;

}

@media screen and (max-width: 1023px) {

    .header-notification--push {

        max-height: 175px;

    }

}

@media screen and (max-width: 600px) {

    .header-notification--push {

        max-height: 175px;

    }

}

@media screen and (max-width: 1023px) {

    .header-notification--push .header-notification-body {

        align-items: flex-start;

    }

    .header-notification--push .header-notification-body .icon-notifications {

        margin-top: 2px;

    }

    .header-notification--push .header-notification-title {

        align-items: flex-start;

        text-align: left;

        display: flex;

        flex-direction: column;

    }

    .header-notification--push .btn {

        margin: 10px 0 0;

    }

    .header-notification--push .close-button {

        align-self: flex-start;

        cursor: pointer;

        margin: 10px 10px 0 0;

    }

}

.header-notification--modelPush {

    background-color: #2f87cc;

    cursor: default;

}

.header-notification--modelPush .header-notification-body {

    color: #fff;

    padding: 10px;

    font-size: 0.813rem;

}

.header-notification--modelPush .header-notification-body,

.header-notification--modelPush .header-notification-content {

    align-items: center;

    justify-content: center;

    display: flex;

    flex-direction: row;

}

.header-notification--modelPush .header-notification-content-icon {

    margin: 0 60px 0 0;

}

.header-notification--modelPush .header-notification-title {

    opacity: 0.8;

    line-height: 1.25rem;

}

.header-notification--modelPush .header-notification-link {

    margin: 0 0 0 16px;

    opacity: 0.5;

    text-decoration: none;

}

.header-notification--modelPush .header-notification-link:active,

.header-notification--modelPush .header-notification-link:focus,

.header-notification--modelPush .header-notification-link:hover {

    opacity: 1;

}

.header-notification--modelPush .btn-white-outline {

    text-decoration: none;

}

.header-notification--modelPush .icon-notifications {

    height: 20px;

    margin-bottom: 3px;

    margin-right: 15px;

    min-width: 18px;

    opacity: 0.7;

}

.header-notification--modelPush .header-notification-controls {

    align-items: center;

    margin: 0 0 0 20px;

    display: flex;

    flex-direction: row;

}

.header-notification--modelPush .header-notification-controls .btn {

    margin: 0;

}

.header-notification--modelPush .close-button {

    cursor: pointer;

}

.header-notification--modelPush .close-button .icon {

    color: #fff;

    height: 10px;

    width: 10px;

}

@media screen and (max-width: 1023px) {

    .header-notification--modelPush {

        max-height: none;

    }

    .header-notification--modelPush .header-notification-body .icon-notifications {

        margin-top: 2px;

    }

    .header-notification--modelPush .header-notification-content {

        align-items: flex-start;

        display: flex;

        flex-direction: column;

    }

    .header-notification--modelPush .header-notification-controls {

        margin: 10px 0 0;

    }

    .header-notification--modelPush .close-button {

        align-self: flex-start;

        cursor: pointer;

        margin: 10px 10px 0 0;

    }

}

@media screen and (max-width: 639px) {

    .header-notification--modelPush .header-notification-title {

        text-align: left;

    }

}

.header-notification--payments-settings {

    max-height: 150px;

}

.header-notification--payments-settings .notification-buttons {

    margin-top: 10px;

}

.header-notification--payments-settings .notification-buttons > .btn {

    margin-bottom: 0;

}

.header-notification a {

    color: #fff;

    text-decoration: underline;

}

.header-notification > .icon-close {

    color: rgba(255, 255, 255, 0.3);

    height: 22px;

    pointer-events: auto;

}

.header-notification > .icon-close:hover {

    fill: rgba(241, 241, 241, 0.5);

}

.header-notification .close-button,

.header-notification > .icon-close {

    cursor: pointer;

    margin-right: 20px;

    width: 22px;

    flex: 1;

    flex-basis: auto;

    flex-grow: 0;

    flex-shrink: 0;

}

@media screen and (max-width: 1023px) {

    .header-notification {

        max-height: 75px;

        padding: 0 0 0 20px;

    }

    .header-notification--payments-settings {

        max-height: 180px;

    }

}

@media screen and (max-width: 600px) {

    .header-notification {

        max-height: 125px;

        padding: 0 4px 0 20px;

    }

    .header-notification .header-notification-body {

        font-size: 0.875rem;

        text-align: left;

    }

}

.header-notification--color {

    background: #4c88bc;

}

.header-notification-body {

    color: #fff;

    display: inline-block;

    padding: 15px 0;

    text-align: center;

    flex: 1;

    flex-basis: auto;

    flex-grow: 1;

    flex-shrink: 1;

    font-size: 1rem;

}

.header-notification-report {

    color: #fff;

    text-decoration: underline;

}

.footer-actions-container {

    align-items: center;

    border-top: solid 1px rgba(255, 255, 255, 0.08);

    display: flex;

    flex-wrap: wrap;

    padding: 16px 0;

}

.footer-actions-container--spaced-x {

    padding: 16px 20px max(env(safe-area-inset-bottom), 16px);

}

.footer-actions-container--spaced-top {

    padding: 20px 0 0;

}

.footer-actions-container--position--right {

    justify-content: flex-end;

}

.footer-actions-container--position--space-between {

    justify-content: space-between;

}

.footer-actions-container--position--center {

    justify-content: center;

}

.pill-page-tabs {

    font-size: 14px;

    font-weight: 500;

    overflow: auto;

    white-space: nowrap;

    -webkit-user-select: none;

    user-select: none;

}

.pill-page-tabs--style--short {

    display: flex;

    max-width: 550px;

}

.pill-page-tabs--style--center {

    margin: 0 auto 40px;

    max-width: 508px;

}

.pill-page-tabs--style--primary {

    margin: 0 0 48px;

    width: 100%;

}

.pill-page-tabs .icon {

    height: 18px;

    margin: 0 8px 0 0;

    width: 18px;

}

@media screen and (max-width: 767px) {

    .pill-page-tabs--style--center,

    .pill-page-tabs--style--short {

        margin-bottom: 40px;

    }

    .pill-page-tabs--style--primary {

        margin-bottom: 0;

    }

}

.common-sign-up-grid {

    display: flex;

    position: relative;

}

.common-sign-up-grid__modal {

    background: none;

    height: 100%;

    left: 0;

    pointer-events: none;

    position: absolute;

    top: 0;

    width: 100%;

    z-index: 2;

}

.common-sign-up-grid__left {

    max-width: 100%;

    padding: 24px 40px;

    position: relative;

    width: 400px;

    z-index: 3;

    background: #050506;

}

.common-sign-up-grid__right-image {

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    bottom: 0;

    position: absolute;

    right: 0;

    top: 0;

    width: 500px;

    z-index: 1;

}

.common-sign-up-grid__right-image::after {

    bottom: 45px;

    content: "";

    left: 0;

    position: absolute;

    top: 45px;

    width: 1px;

}

.common-sign-up-grid__right-image::before {

    background: linear-gradient(90deg, #050506 0.5%, rgb(0 0 0 / 52%) 39.94%, transparent 100%)!important;

    bottom: 0;

    content: "";

    height: 100%;

    left: 0;

    pointer-events: none;

    position: absolute;

    width: 100%;

}

.common-sign-up-grid__right {

    position: relative;

    width: 500px;

    z-index: 2;

}

.common-sign-up-grid__right--min-fixed {

    min-height: 466px;

}

.common-sign-up-grid__right-content {

    bottom: 0;

    padding: 0 20px 40px 40px;

    position: absolute;

}

@media screen and (max-width: 1023px) {

    .common-sign-up-grid__modal,

    .common-sign-up-grid__right,

    .common-sign-up-grid__right-image {

        display: none;

    }

    .common-sign-up-grid__left {

        padding: 0;

        width: auto;

    }

}

.modal-ds-content .common-sign-up-grid {

    background: #050506;

    max-width: 100%;

    padding: 24px 40px;

    width: 400px;

}

@media screen and (min-width: 1024px) {

    .modal-ds-content .common-sign-up-grid--model-content {

        background: 0 0;

        padding: 0;

        width: 900px;

    }

}

.buttons-form-list {

    display: flex;

    gap: 16px;

    justify-content: flex-end;

}

.bt {

    color: #fff;

    margin: 20px 0 12px;

    max-height: 84px;

    opacity: 0.8;

    overflow: hidden;

    position: relative;

    white-space: pre-line;

    width: 67%;

    word-break: break-word;

    font-size: 0.875rem;

    line-height: 1.063rem;

}

.bt--opened {

    max-height: none;

}

.bt__text {

    font-size: inherit;

    font-weight: inherit;

    line-height: inherit;

    margin: 0;

    padding: 0;

}

.bt__shadow-text {

    opacity: 0;

    pointer-events: none;

    position: absolute;

    visibility: hidden;

}

@media screen and (max-width: 1023px) {

    .bt {

        width: 100%;

    }

}

.user-media-content {

    

}

.geo-ban-profile-stub {

    margin: 100px auto;

    max-width: calc(100vw - 32px);

    width: 642px;

}

.geo-ban-profile-stub__container {

    align-items: center;

    display: flex;

    flex-direction: column;

    margin-bottom: 132px;

}

.geo-ban-profile-stub__avatar {

    height: 80px;

    margin-bottom: 24px;

    position: relative;

    width: 80px;

}

.geo-ban-profile-stub__block-icon {

    background: #000;

    border-radius: 50%;

    bottom: -5px;

    color: #fff;

    display: grid;

    height: 46px;

    place-items: center;

    position: absolute;

    right: -5px;

    width: 46px;

}

.geo-ban-profile-stub__title {

    font-size: 24px;

    font-weight: 500;

    line-height: 29px;

    margin-bottom: 16px;

}

.H {

    margin-top: 12px;

}

.H__button {

    align-items: center;

    background-color: #343437;

    border-radius: 12px;

    color: #fff;

    column-gap: 10px;

    cursor: pointer;

    display: flex;

    justify-content: center;

    min-height: 60px;

    padding: 6px 10px;

    text-align: center;

    transition: all ease 0.25s;

}

.H__button:hover {

    background-color: #424248;

}

.H__buttons-group {

    align-items: center;

    display: flex;

    gap: 1px;

}

.H__buttons-group .H__button {

    flex: 1;

}

.H__buttons-group .H__button--position--left {

    border-bottom-right-radius: 0;

    border-top-right-radius: 0;

}

.H__buttons-group .H__button--position--right {

    border-bottom-left-radius: 0;

    border-top-left-radius: 0;

}

.H__title {

    font-size: 12px;

}

.H__actions {

    display: grid;

    grid-column-gap: 10px;

    grid-template-columns: repeat(2, 1fr);

}

.H__actions--grouped {

    grid-template-columns: 4fr 3fr;

}

.H__actions .icon {

    color: #fff;

    margin: 0;

}

.H__actions--disabled {

    opacity: 0.5;

}

.H__actions--disabled .upload-media__button {

    cursor: not-allowed;

}

.image-swiper:hover > .image-swiper__arrow--active:hover,

.H__actions--disabled .upload-media__button:hover {

    opacity: 1;

}

.H__errors {

    color: #e12947;

    margin-top: 10px;

    font-size: 0.688rem;

    line-height: 0.813rem;

}

.H__error-title {

    margin: 0 0 0 8px;

}

.H__error-title::before {

    content: "â€¢";

    display: inline-block;

    font-size: 28px;

    margin: 0 4px 0 0;

    vertical-align: text-bottom;

}

.user-avatar-editable .dropdown-content::after {

    display: none;

}

.user-avatar-editable .avatar-wrapper:not(.is-loading):hover .avatar-upload {

    display: flex;

}

.user-avatar-editable__dropdown .dropdown-menu-item {

    align-items: center;

    background: 0 0;

    border: 0;

    color: rgba(255, 255, 255, 0.8);

    cursor: pointer;

    display: flex;

    margin: 5px 0;

    padding: 8px 15px;

    transition: all ease 0.25s;

    white-space: nowrap;

    width: 100%;

}

.user-avatar-editable__dropdown .dropdown-menu-item .icon {

    color: rgba(255, 255, 255, 0.8);

    fill: rgba(255, 255, 255, 0.8);

    margin: 0 10px 0 0;

}

.user-avatar-editable__dropdown .dropdown-menu-item:hover {

    background: #343437;

    color: #fff;

    fill: #fff;

}

.bv__tooltip hr,

.user-avatar-editable hr {

    background-color: #b9b9b9;

    margin: 10px;

    opacity: 0.6;

}

.bw {

    flex-shrink: 0;

    position: relative;

    width: 100%;

}

.bw--mobile {

    display: flex;

    flex-direction: column;

    gap: 12px;

}

.bw__row {

    display: flex;

    gap: 12px;

}

.bw__row > a,

.bw__row > button,

.bw__row > div {

    flex-grow: 1;

    justify-content: center;

    text-align: center;

}

@media (min-width: 479px) {

    .bw__row {

        display: flex;

        gap: 12px;

    }

    .bw__row > a,

    .bw__row > button,

    .bw__row > div {

        flex-basis: 50%;

    }

}

.bw__favorite {

    display: flex;

    flex-direction: column;

    gap: 12px;

    position: absolute;

    right: 15px;

    top: 70px;

    z-index: 4;

}

.bw__dropdown {

    color: #fff;

    font-size: 13px;

    min-width: 153px;

}

.bw__dropdown-footer {

    border-top: 1px solid rgba(255, 255, 255, 0.05);

    margin: 12px 0 0;

    padding: 12px 0 0;

}

.bw__dropdown-header {

    align-items: center;

    column-gap: 16px;

    display: flex;

    justify-content: space-between;

}

.bw__edit-request-menu-button {

    align-items: center;

    gap: 12px;

}

.bw__edit-request-menu-button.btn {

    padding: 0 16px;

}

.bw__actions-settings {

    align-items: center;

    display: flex;

}

.bw__actions-settings-icon--padded {

    margin: 0 8px 0 0;

}

.bw__right {

    display: flex;

    gap: 12px;

    margin: 0 0 0 auto;

}

.bw__title {

    align-items: center;

    display: flex;

    font-size: 14px;

    font-weight: 700;

    white-space: nowrap;

}

.bw__date {

    font-size: 14px;

    margin: 6px 0 0;

    opacity: 0.4;

    white-space: nowrap;

}

.bw__date--warning {

    color: #d21b4c;

    opacity: 1;

}

@media screen and (max-width: 639px) {

    .bw {

        padding: 10px 0;

        width: 100%;

    }

    .bw .action-buttons-container .user-fan-club-status-btn {

        height: 31px;

        justify-content: center;

        margin: 0 0 20px;

        width: 100%;

    }

    .bw .splitter {

        display: none;

    }

}

.bw__icon-wrapper {

    position: relative;

}

.bw__icon-decorator {

    color: #2e1d3e;

    height: 12px;

    position: absolute;

    right: 7px;

    top: -3px;

    width: 12px;

}

.bw .icon-diamond-colored,

.bw .icon-diamond-flat,

.bw .icon-diamond-rotate {

    height: 20px;

    margin: 0 10px 0 0;

    width: 20px;

}

.action-buttons-container {

    align-items: center;

    display: flex;

    flex-wrap: wrap;

    gap: 12px;

}

.action-buttons-container .button-dropdown__button {

    white-space: nowrap;

    font-weight: bold;

}

.action-buttons-container .btn {

    display: flex;

    flex-shrink: 0;

}

.action-buttons-container .btn .icon {

    height: 18px;

    width: 18px;

}

.action-buttons-container .menu-button-dots .tile-button {

    background: 0 0;

    height: auto;

    min-width: auto;

    padding: 0;

}

@media screen and (max-width: 479px) {

    .action-buttons-container__right {

        display: flex;

        gap: 12px;

    }

    .action-buttons-container .button-dropdown__button {

        font-size: 13px;

        padding: 0 10px;

    }

    .action-buttons-container .btn {

        font-size: 13px;

        padding: 0 8px;

    }

}

.arrow-down-animated {

    align-items: center;

    background: #ff3332;

    background-clip: padding-box;

    border: 6px solid rgba(163, 73, 252, 0.2);

    border-radius: 14px;

    color: #fff;

    display: flex;

    height: 36px;

    justify-content: center;

    margin-left: 11px;

    overflow: hidden;

    padding: 4px;

    position: relative;

    transition: background-color 0.3s, border-color 0.3s;

    width: 36px;

}

.arrow-down-animated__content {

    align-items: center;

    display: flex;

    flex-direction: column;

    height: 46px;

    justify-content: space-between;

    left: 0;

    overflow: hidden;

    position: absolute;

    top: -26px;

    width: 100%;

}

.arrow-down-animated__content--animated {

    animation-duration: 3s;

    animation-iteration-count: infinite;

    animation-name: arrow-down-animated-move-infinity;

}

.arrow-down-animated:hover {

    background-color: #d60908;

    border-color: rgba(138, 24, 252, 0.3);

}

.arrow-down-animated:hover > .arrow-down-animated__content--animated-hover {

    animation: arrow-down-animated-move 0.5s;

}

.arrow-down-animated .icon {

    height: 16px;

    width: 16px;

}

.icon-alert-decorated {

    align-items: center;

    display: inline-flex;

    justify-content: center;

    position: relative;

}

.icon-alert-decorated__icon,

.site-logo {

    position: relative;

}

.icon-alert-decorated::before {

    background: #000;

    content: "";

    height: 80%;

    position: absolute;

    width: 50%;

}

.site-logo {

    background: url(../logo.png) no-repeat left center;

    background-size: contain;

    margin-left: 18px;

}

.site-logo--size--small {

    height: 23px;

    width: 104px;

}

.site-logo--size--medium {

    height: 34px;

    max-width: 146px;

    width: 146px;

}

.site-logo--size--large {

    height: 70px;

    width: 165px;

}

.site-logo--size--large-x {

    height: 70px;

    width: 205px;

}

.header-dropdown-content-split {

    margin-top: 16px;

    padding-top: 16px !important;

}

.header-dropdown-content-split::before {

    background: rgba(255, 255, 255, 0.1);

    content: "";

    height: 1px;

    left: 18px;

    position: absolute;

    right: 18px;

    top: 0;

}

.header-dropdown-content-split.invisible-mode-switch {

    margin-top: 16px;

    padding-top: 0 !important;

}

.header-dropdown-content-split.invisible-mode-switch::before {

    top: -8px;

}

.header-dropdown-content__icon {

    height: 24px;

    margin-left: 0;

    margin-right: 20px;

    width: 24px;

}

.header-dropdown-content__icon.icon-verified {

    margin: 0;

}

.header-dropdown-content__banner {

    display: flex;

    gap: 12px;

    margin: 18px 0-4px;

    padding: 0 18px;

}

.header-dropdown-content__banner--grid {

    display: grid;

    grid-template-columns: 1fr 1fr;

}

.header-dropdown-content__verify {

    background: #343437;

    border-radius: 10px;

    flex: 1;

    padding: 8px 8px 4px;

    white-space: normal;

}

.header-dropdown-content__verify:hover {

    background: #424248;

}

.header-dropdown-content__verify-content {

    color: #cfcfd0;

    display: flex;

    font-size: 12px;

    gap: 6px;

    justify-content: space-between;

}

.header-dropdown-content__chip-beta {

    height: 24px;

    margin-left: 6px;

}

.account-container {

    line-height: normal;

    max-width: 100%;

    padding: 6px 0 0 10px;

}

.account-container .displayname__name {

    opacity: 0.8;

}

.crop-image {

    overflow: hidden;

    padding: 0 24px;

    -webkit-user-select: none;

    user-select: none;

}

.crop-image--disabled {

    pointer-events: none;

}

.crop-image__content {

    align-items: center;

    display: flex;

    height: 330px;

    justify-content: center;

    position: relative;

}

.crop-image__aspect-ratio {

    visibility: hidden;

    width: 100%;

}

.crop-image__wrapper {

    position: relative;

}

.crop-image__wrapper--type--horizontal {

    width: 100%;

}

.crop-image__wrapper--type--vertical {

    height: 100%;

}

.crop-image__crop-border {

    border: 2px solid #fff;

    bottom: 0;

    box-shadow: 0 0 0 500px rgba(0, 0, 0, 0.6);

    content: "";

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

}

.crop-image__image {

    display: block;

    left: 0;

    pointer-events: none;

    position: absolute;

    top: 0;

    transform-origin: left top;

    width: 100%;

}

.crop-image__image--ghost {

    opacity: 0.4;

    pointer-events: none;

}

.crop-image__button {

    align-items: center;

    background: rgba(0, 0, 0, 0.6);

    border: 0;

    border-radius: 50%;

    color: #fff;

    cursor: pointer;

    display: flex;

    height: 38px;

    justify-content: center;

    position: absolute;

    width: 38px;

    z-index: 2;

}

.crop-image__button:disabled {

    opacity: 0.4;

    pointer-events: none;

}

.crop-image__button:hover {

    background: rgba(0, 0, 0, 0.8);

}

.crop-image__button--type--rotate {

    bottom: 10px;

    left: 10px;

}

.crop-image__button--type--minus {

    bottom: 10px;

    right: 58px;

}

.crop-image__button--type--plus {

    bottom: 10px;

    right: 10px;

}

.crop-image__modal.modal-ds-body {

    max-width: 540px;

}

.crop-image__modal.modal-ds-body .modal-ds-content {

    padding: 0 24px;

}

.crop-image__modal-content,

.form-fields .settings-field > div.settings-value .select,

.form-fields .settings-field > div.settings-value input,

.form-fields .settings-field > div.settings-value textarea {

    width: 100%;

}

.crop-image__modal-wrapper {

    margin: 0-24px;

}

.w {

    align-items: center;

    display: flex;

    gap: 10px;

    justify-content: center;

    padding-top: 20px;

}

.w__right-controls {

    display: flex;

    flex: 1;

    justify-content: flex-end;

    position: relative;

}

.w__record-button {

    align-items: center;

    background: 0 0;

    border: 2px solid currentColor;

    border-radius: 50%;

    color: #fff;

    cursor: pointer;

    display: flex;

    height: 49px;

    justify-content: center;

    outline: 0;

    padding: 0;

    position: relative;

    width: 49px;

}

.w__left-controls {

    align-items: center;

    display: flex;

    flex: 1;

    justify-content: flex-end;

}

.w__reverse-button {

    align-items: center;

    background: #343437;

    border: 0;

    border-radius: 50%;

    color: #fff;

    cursor: pointer;

    display: flex;

    height: 32px;

    justify-content: center;

    outline: 0;

    transition: transform 150ms ease;

    width: 32px;

}

.w__reverse-button:active {

    transform: scale(0.9);

}



.x__media {

    overflow: hidden;

    padding: 0 30px;

    position: relative;

}

@media only screen and (max-width: 639px) {

    .x__media {

        align-items: center;

        display: flex;

        flex: 1;

    }

}

.x__timer {

    bottom: 10px;

    color: #fff;

    font-size: 12px;

    font-weight: 400;

    left: 50%;

    position: absolute;

    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);

    transform: translateX(-50%);

}

.x__content {

    border-radius: 12px;

    height: auto;

    object-fit: contain;

    width: 100%;

}

@media only screen and (max-width: 639px) {

    .x__content {

        height: 100%;

        object-fit: cover;

    }

}

.x__controls {

    align-items: center;

    animation: controls-appearance 200ms ease;

    display: flex;

    gap: 12px;

    justify-content: space-between;

    margin-top: 20px;

}

.x__button-container {

    align-items: center;

    display: flex;

    flex: 1;

}

.x__button-container--left {

    justify-content: flex-start;

}

.x__button-container--right {

    justify-content: flex-end;

}

.x__play-button {

    align-items: center;

    background: #343437;

    border: 0;

    border-radius: 50%;

    color: #fff;

    cursor: pointer;

    display: flex;

    height: 48px;

    justify-content: center;

    outline: 0;

    padding: 0;

    width: 48px;

}

.modal-form-title {

    border-bottom: 1px solid rgba(255, 255, 255, 0.05);

    justify-content: space-between;

    min-height: 72px;

    padding: 20px;

}

.modal-form-title,

.modal-form-title__back,

.modal-form-title__left {

    align-items: center;

    display: flex;

}

.modal-form-title__back {

    background: #343437;

    border-radius: 50%;

    color: #fff;

    cursor: pointer;

    height: 24px;

    justify-content: center;

    margin: 0 22px 0 0;

    min-width: 24px;

    padding: 0 2px 0 0;

    width: 24px;

}

.modal-form-title__icon {

    padding: 0 20px 0 0;

}

.image-swiper {

    overflow: hidden;

    position: relative;

    user-select: none;

    width: 100%;

}

.image-swiper::before {

    bottom: 0;

    content: "";

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

    visibility: hidden;

    z-index: 2;

}

.image-swiper__root,

.image-swiper__root > body {

    overscroll-behavior-x: none;

}

.image-swiper__root--disabled {

    overflow: hidden;

}

.image-swiper__scroll {

    height: 100%;

    outline: 0;

    overflow: hidden;

    pointer-events: none;

    position: relative;

    width: 100%;

}

.image-swiper__scroll-space {

    height: 1px;

    left: 0;

    pointer-events: none;

    position: absolute;

    top: 0;

    visibility: hidden;

}

.image-swiper__item {

    contain: strict;

    pointer-events: all;

    position: absolute;

    top: 0;

    z-index: 1;

}

.image-swiper__item-image {

    border: 0;

    height: 100%;

    object-position: center;

    outline: 0;

    pointer-events: none;

    position: absolute;

    width: 100%;

}

.image-swiper__item-image--size--cover {

    object-fit: cover;

}

.image-swiper__item-image--size--contain {

    object-fit: contain;

}

.image-swiper:hover > .image-swiper__arrow--active {

    opacity: 0.6;

}

.image-swiper__children {

    bottom: 0;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 1;

}

.image-swiper__arrow {

    align-items: center;

    background: rgba(0, 0, 0, 0.6);

    border-radius: 50%;

    box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);

    cursor: pointer;

    display: flex;

    font-weight: 700;

    height: 30px;

    justify-content: center;

    opacity: 0;

    pointer-events: none;

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    transition: opacity 0.3s, left 0.3s, right 0.3s;

    width: 30px;

    z-index: 3;

}

.image-swiper__arrow--left {

    left: 20px;

}

.image-swiper__arrow--left > svg {

    transform: rotate(180deg);

}

.image-swiper__arrow--right {

    right: 20px;

}

.image-swiper__arrow--active {

    pointer-events: auto;

}

.image-swiper__arrow > svg {

    display: block;

    height: inherit;

    pointer-events: none;

    width: inherit;

}

.image-swiper__points {

    align-items: flex-end;

    background: linear-gradient(180deg, rgba(185, 185, 185, 0) 0, rgba(0, 0, 0, 0.35) 100%);

    bottom: 0;

    display: flex;

    height: 100px;

    justify-content: center;

    left: 0;

    padding: 0 0 20px;

    pointer-events: none;

    position: absolute;

    width: 100%;

    z-index: 3;

}

.image-swiper__points-item {

    background: #fff;

    border-radius: 50%;

    height: 6px;

    margin: 0 2px;

    opacity: 0.5;

    position: relative;

    transition: opacity 0.6s, transform 0.6s;

    width: 6px;

}

.image-swiper__points-item--active {

    opacity: 1;

    transform: scale(1.2);

}

@media (max-width: 1024px) {

    .image-swiper__arrow {

        display: none;

    }

    .image-swiper__points {

        padding-bottom: 12px;

    }

}

.payout-settings.pending {

    opacity: 0.33;

    pointer-events: none;

}

.payout-settings h3 {

    margin-bottom: 20px !important;

}

.payout-settings .page-block {

    margin-bottom: 20px;

}

.payout-settings .notification-euro-link {

    color: #fff;

    text-decoration: underline;

}

.payout-settings .form-description {

    margin-top: 18px;

}

.payout-settings .form-controls {

    margin-top: 20px;

    text-align: right;

}

.payout-settings .form-controls .btn {

    margin-bottom: 0;

}

.form-fields .settings-field > div.settings-label,

.payout-settings-field-input.input.input {

    font-size: 14px;

    font-weight: 400;

    letter-spacing: normal;

    line-height: normal;

}

.form-fields {

    display: table;

    width: 100%;

}

.form-fields .settings-field {

    display: table-row;

}

.form-fields .settings-field > div {

    padding-bottom: 10px;

    vertical-align: middle;

}

.form-fields .settings-field > div.settings-label {

    display: table-cell;

    padding-right: 20px;

    vertical-align: top;

    width: 20%;

    font-size: 12px;

    line-height: 2.5rem;

}

.form-fields .settings-field > div.settings-value {

    display: table-cell;

    width: 100%;

}

.form-fields .settings-field:last-child > div {

    padding-bottom: 0;

}

.cg__description {

    color: #a0a0a1;

    font-size: 14px;

    font-weight: 400;

    margin-bottom: 20px;

}

.cg__notices {

    align-items: flex-start;

    display: flex;

    flex-wrap: wrap;

    gap: 20px;

    margin-bottom: 20px;

}

.cg__notices > .cd {

    flex: 1;

}

.cg__notices > .cd--opened {

    align-self: stretch;

}

.cg__notice-header {

    align-items: center;

    color: #cfcfd0;

    display: flex;

    font-size: 16px;

    font-weight: 500;

    gap: 12px;

    white-space: nowrap;

}

.cg__notice-content-item {

    color: #a0a0a1;

    font-size: 12px;

    line-height: 150%;

    margin: 0 0 12px;

}

.cg__collapse-button {

    align-items: center;

    background: 0 0;

    border: 0;

    color: #707071;

    cursor: pointer;

    display: flex;

    justify-content: center;

    margin-left: auto;

    outline: 0;

}

.cg__collapse-button-icon {

    transform: rotate(180deg);

    transition: transform 150ms ease-in-out;

}

.cg__collapse-button-icon--opened {

    transform: rotate(0);

}

div.cg__content--collapsed {

    padding: 0;

}

.username-inline-card {

    align-items: center;

    display: inline-grid;

    grid-template-columns: auto minmax(0, 1fr);

    max-width: 100%;

    position: relative;

    text-align: left;

    white-space: nowrap;

}

.username-inline-card--full-width {

    display: grid;

}

.username-inline-card--spaced {

    padding: 8px 16px;

}

.username-inline-card--active,

.username-inline-card--spaced:hover {

    background: #424248;

}

.username-inline-card:hover {

    text-decoration: none;

}

.username-inline-card__avatar-wrapper--space-size--medium {

    margin: 0 12px 0 0;

}

.username-inline-card__avatar-wrapper--space-size--small {

    margin: 0 8px 0 0;

}

.user-tags-gallery {

    align-items: center;

    cursor: pointer;

    display: flex;

    gap: 6px;

    height: 24px;

    justify-content: flex-start;

    margin-top: 6px;

}

.user-tags-gallery:hover .user-tags-gallery__badge {

    background-color: rgba(255, 255, 255, 0.2);

}

.user-tags-gallery__delete-tag-button-wrapper {

    align-items: center;

    display: flex;

    flex-wrap: nowrap;

    gap: 6px;

}

.user-tags-gallery__delete-tag-button {

    background-color: #5f5f67;

    border: 0;

    border-radius: 50%;

    color: #a0a0a1;

    cursor: pointer;

    display: grid;

    height: 14px;

    padding: 0;

    place-items: center;

    width: 14px;

}

.user-tags-gallery__delete-tag-button:hover {

    background-color: #d21b4c;

    color: #fff;

}

.user-tags-gallery__badge {

    background: rgba(255, 255, 255, 0.1);

    border-radius: 6px;

    color: #cfcfd0;

    font-size: 12px;

    font-weight: 500;

    padding: 4px 8px;

}

.dropdown-wrapper {

    max-width: 440px;

    position: absolute;

    top: calc(100% + 6px);

    z-index: 501;

}

.dropdown-wrapper--mobile {

    max-width: 100%;

    position: relative;

    width: 100%;

}

.dropdown-content {

    border-radius: 12px;

    box-sizing: border-box;

    color: rgba(255, 255, 255, 0.8);

    overflow: hidden;

    text-align: left;

}

.dropdown-content--shadow {

    box-shadow: 0 2px 16px rgba(0, 0, 0, 0.46);

}

.dropdown-content--background--strong {

    background: #1b1b1d;

}

.dropdown-content--background--strong::after {

    border-color: #1b1b1d;

}

.dropdown-content--background--light {

    background: #232325;

}

.dropdown-content--background--light::after {

    border-color: #232325;

}

.dropdown-content--spaced {

    padding: 20px;

}

.menu-button-dots,

.menu-button-dots__menu-button {

    align-items: center;

    display: flex;

    justify-content: center;

}

.menu-button-dots__menu-button {

    background: 0 0;

    border: 0;

    border-radius: 6px;

    color: #fff;

    cursor: pointer;

    filter: drop-shadow(0 0 6px rgba(0, 0, 0, 0.3));

    transition: background 0.15s ease-in-out;

}

.menu-button-dots__menu-button--theme--default.menu-button-dots__menu-button--active,

.menu-button-dots__menu-button--theme--default:hover {

    background: rgba(0, 0, 0, 0.6);

}

.menu-button-dots__menu-button--theme--light.menu-button-dots__menu-button--active,

.menu-button-dots__menu-button--theme--light:hover {

    background: #343437;

}

.menu-button-dots__menu-button--theme--light-grey {

    border-radius: 10px;

    color: #a0a0a1;

}

.menu-button-dots__menu-button--theme--light-grey.menu-button-dots__menu-button--active,

.menu-button-dots__menu-button--theme--light-grey:hover {

    background: #343437;

    color: #fff;

}

.menu-button-dots__menu-button--theme--filled {

    background: #343437;

    border-radius: 12px;

    color: #fff;

}

.menu-button-dots__menu-button--theme--filled.menu-button-dots__menu-button--active,

.menu-button-dots__menu-button--theme--filled:hover {

    background: #424248;

}

.menu-button-dots__menu-button--theme--transparent {

    background: 0 0;

    color: #707071;

}

.menu-button-dots__menu-button--theme--transparent.menu-button-dots__menu-button--active,

.menu-button-dots__menu-button--theme--transparent:hover {

    color: #fff;

}

.menu-button-dots__menu-button--size--small {

    height: 24px;

    width: 24px;

}

.menu-button-dots__menu-button--size--normal {

    height: 32px;

    width: 32px;

}

.menu-button-dots__menu-button--size--large {

    height: 40px;

    width: 48px;

}

.menu-button-dots__icon-wrapper--vertical {

    transform: rotate(90deg);

}

.BZ {

    margin: 20px 0;

    text-align: left;

}

.BZ__row {

    display: flex;

    gap: 10px;

    position: relative;

}

.BZ__cell {

    display: flex;

    min-height: 64px;

    min-width: 64px;

    padding: 20px 0 0;

    word-break: break-word;

}

.BZ__cell--first {

    width: 200px;

}

.BZ__cell--type--color-top,

.BZ__cell--type--top {

    align-items: center;

    border-bottom: 1px #29292b solid;

    font-size: 16px;

    font-weight: 600;

    padding: 0;

}

.BZ__cell--type--color-top {

    background: #232325;

    border-radius: 12px 12px 0 0;

    flex: 1;

    justify-content: center;

}

.BZ__cell--type--color-bottom {

    background: #232325;

    border-radius: 0 0 12px 12px;

    flex: 1;

    justify-content: center;

}

.BZ__cell--type--color {

    align-items: center;

    background: #232325;

    flex: 1;

    justify-content: center;

}

.creator-lists__tabs-container {

    margin-bottom: 40px;

    max-width: 540px;

}



.B {

    align-items: center;

    display: flex;

    flex-direction: column;

    gap: 10px;

    left: 50%;

    pointer-events: none;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

    width: 60%;

}

@media screen and (max-width: 1023px) {

    .B--style--album {

        flex-direction: row;

        justify-content: center;

        top: 30%;

        width: 80%;

    }

    .B--style--album .B__label {

        max-width: 98px;

        text-align: left;

    }

}

@media screen and (max-width: 639px) {

    .B--style--album {

        flex-direction: column;

        top: 50%;

        width: 60%;

    }

    .B--style--album .B__label {

        max-width: 120px;

        text-align: center;

        white-space: normal;

    }

}

.B__label {

    color: #fff;

    font-size: 14px;

    font-weight: 400;

    max-width: 120px;

    text-align: center;

    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.2), 0 1px 20px rgba(0, 0, 0, 0.4);

}

@media screen and (max-width: 639px) {

    .B__label {

        font-size: 12px;

    }

}

.B__icon {

    color: #fff;

    filter: drop-shadow(0 1px 20px rgba(0, 0, 0, 0.4));

    height: 32px;

    width: 32px;

}

@media screen and (max-width: 1023px) {

    .B__icon {

        height: 24px;

        width: 24px;

    }

}

.B__avatar {

    filter: drop-shadow(0 1px 20px rgba(0, 0, 0, 0.2));

}

.B__avatar.avatar {

    height: 48px;

    width: 48px;

}

@media screen and (max-width: 639px) {

    .B__avatar.avatar {

        height: 36px;

        width: 36px;

    }

}

.B__avatar--adaptive.avatar {

    height: 64px;

    width: 64px;

}

@media (max-width: 639px) {

    .B__avatar--adaptive.avatar {

        height: 48px;

        width: 48px;

    }

}

@media (max-width: 479px) {

    .B__avatar--adaptive.avatar {

        height: 36px;

        width: 36px;

    }

}



@media screen and (max-width: 639px) {

    .creator-lists__tabs-container {

        margin-bottom: 24px;

    }

}

.creator-lists__add-users-icon {

    height: 14px;

    margin-right: 10px;

    width: 14px;

}

.creator-lists__sort .creator-lists__sort-item--ghost {

    border: 2px dashed #343437;

    border-radius: 16px;

    height: 80px;

}

@media screen and (max-width: 639px) {

    .creator-lists__sort .creator-lists__sort-item--ghost {

        height: 120px;

    }

}

.creator-lists__sort .creator-lists__sort-item--ghost .bk__content {

    display: none;

}

.creator-lists__skeleton {

    animation: skeleton-animation;

    animation-duration: 1s;

    animation-iteration-count: infinite;

    animation-timing-function: ease-in-out;

    background: #1b1b1d;

    border-radius: 16px;

    height: 80px;

    margin-bottom: 20px;

}

.creator-lists__skeleton:nth-child(2n) {

    animation-delay: 300ms;

}

@media screen and (max-width: 639px) {

    .creator-lists__skeleton {

        height: 120px;

        margin-bottom: 10px;

    }

}

.creator-list-name {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.creator-lists-delete-modal__name {

    word-break: break-all;

}

.landing-monetization,

.page-button {

    align-items: center;

    justify-content: center;

}

.page-button {

    border: 2px solid #343437;

    border-radius: 32px;

    color: rgba(255, 255, 255, 0.6);

    display: inline-flex;

    font-size: 13px;

    font-weight: 500;

    height: 32px;

    margin: 0 6px 10px;

    min-width: 32px;

}

.page-button:hover {

    background: rgba(255, 255, 255, 0.3);

    border-color: transparent;

    color: #fff;

    text-decoration: none;

}

.page-button:hover .icon {

    fill: #fff;

}

.page-button.page-button-ellipsis {

    border: 0 !important;

    color: rgba(255, 255, 255, 0.5);

    pointer-events: none;

}

.page-button.page-button-beginning,

.page-button.page-button-next {

    padding: 8px 12px;

}

.page-button.page-button-beginning {

    min-width: 124px;

}

.page-button.page-button-next {

    min-width: 68px;

}

.page-button .shift-nav-button {

    align-items: center;

    display: flex;

    flex-direction: row;

}

.page-button .icon {

    fill: rgba(255, 255, 255, 0.6);

    height: 14px;

    margin: 0;

    width: 14px;

}

.page-button.hidden {

    opacity: 0;

    pointer-events: none;

}

.landing-monetization {

    display: flex;

    min-height: max(100vh, 400px);

    position: relative;

}

.landing-monetization__logo {

    display: flex;

    justify-content: center;

    margin: 0 auto 50px;

}

.landing-monetization__logo .site-logo {

    margin: 0;

}

.landing-monetization__title {

    color: #fff;

    font-size: 80px;

    font-weight: 700;

    position: relative;

}

.landing-monetization__benefit-list {

    line-height: 160%;

    margin: 20px 0 0;

}

.landing-monetization__benefit-list--dotted {

    list-style: disc;

    margin: 30px 0 0 20px;

    max-width: 400px;

}

.landing-monetization__benefit-list-item {

    margin: 10px 0;

}

.landing-monetization__benefit-list-item--icon-marker {

    display: flex;

}

.landing-monetization__benefit-list-icon {

    margin: 0 10px 0 0;

}

.landing-monetization__wing {

    display: flex;

    justify-content: center;

    position: absolute;

    right: 30px;

    top: -35px;

}

.landing-monetization__wing .smile {

    height: 104px;

    width: 104px;

}

.landing-monetization__bubble {

    background: #ff3332;

    position: absolute;

}

.landing-monetization__bubble--1 {

    border-radius: 7.53906px;

    height: 20.1px;

    left: 18%;

    opacity: 0.6;

    top: 70.5%;

    transform: rotate(-18.46deg);

    width: 20.1px;

}

.landing-monetization__bubble--2 {

    border-radius: 5.86371px;

    height: 16.75px;

    left: 33.3%;

    opacity: 0.2;

    top: 79%;

    transform: rotate(-18.46deg);

    width: 16.75px;

}

.landing-monetization__bubble--3 {

    border-radius: 5.86371px;

    height: 18.43px;

    left: 47.4%;

    opacity: 0.3;

    top: 89%;

    transform: rotate(-2.71deg);

    width: 18.43px;

}

.landing-monetization__bubble--4,

.landing-monetization__bubble--5 {

    border-radius: 7px;

    height: 18px;

    left: 69%;

    opacity: 0.5;

    top: 89.7%;

    transform: rotate(6.11deg);

    width: 18px;

}

.landing-monetization__bubble--5 {

    left: 71.3%;

    opacity: 0.3;

    top: 43%;

    transform: rotate(-18.46deg);

}

.landing-monetization__bubble--6,

.landing-monetization__bubble--7 {

    border-radius: 7.53906px;

    height: 18.43px;

    left: 78.5%;

    opacity: 0.5;

    top: 55.5%;

    transform: rotate(-18.46deg);

    width: 18.43px;

}

.landing-monetization__create-post {

    position: relative;

}

.landing-monetization__create-post > img {

    max-width: 105%;

    width: 476px;

}

.landing-monetization__create-post::after,

.landing-monetization__mass-messenger::after {

    content: "";

    height: 1px;

    pointer-events: none;

    position: absolute;

    top: 50%;

    width: 1px;

    z-index: -1;

}

.landing-monetization__create-post::after {

    border-radius: 15%;

    box-shadow: 0 0 150px 246px rgba(138, 24, 252, 0.3);

    left: 45%;

}

.landing-monetization__invite-and,

.landing-monetization__mass-messenger,

.landing-monetization__payout-methods {

    background-repeat: no-repeat;

    background-size: contain;

    position: relative;

}

.landing-monetization__mass-messenger > img {

    max-width: 100%;

    width: 530px;

}

.landing-monetization__mass-messenger::after {

    bottom: 70px;

    box-shadow: 0 0 150px 182px rgba(138, 24, 252, 0.3);

    left: 50%;

}

.landing-monetization__invite-and > img {

    max-width: 140%;

    position: relative;

    width: 556px;

}

.landing-monetization__payout-methods {

    height: 420px;

    max-width: 100%;

    width: 420px;

}

.landing-monetization__payout-methods::after {

    border-radius: 50%;

    box-shadow: 0 0 150px 382px rgba(138, 24, 252, 0.2);

    content: "";

    height: 1px;

    left: 50%;

    pointer-events: none;

    position: absolute;

    top: 39%;

    width: 1px;

    z-index: -1;

}

@media screen and (max-width: 767px) {

    .landing-monetization__title {

        font-size: 30px;

    }

    .landing-monetization__wing {

        position: static;

    }

    .landing-monetization__invite-and {

        margin-left: -20%;

    }

}

.data-table {

    color: #fff;

    font-weight: 400;

    min-height: 380px;

    min-width: min-content;

    width: 100%

}



.data-table__small-text {

    opacity: .6

}



.data-table .top-align-center {

    align-items: center;

    display: flex

}



.data-table .align-center {

    justify-content: center;

    text-align: center

}



.data-table .align-right {

    justify-content: flex-end;

    text-align: right

}



.data-table-head {

    font-size: .688rem;

    background: #1b1b1d;

    border-radius: 12px 12px 0 0;

    text-transform: uppercase

}



.data-table-head-row {

    line-height: 1.125rem;

    align-items: center;

    background: 0 0;

    display: flex;

    flex-flow: row nowrap;

    padding: 15px 20px;

    width: 100%

}



.data-table-head-cell {

    font-size: .688rem;

    color: rgba(255, 255, 255, .4);

    white-space: nowrap

}



.data-table-head-cell .searchable-head {

    margin: -9px 0

}



.data-table-footer {

    font-size: .813rem;

    background-color: #111113

}



.data-table-footer-row {

    line-height: 1.125rem;

    align-items: center;

    background: 0 0;

    display: flex;

    flex-flow: row nowrap;

    padding: 15px 20px;

    width: 100%

}



.data-table-body,

.data-table-footer-cell {

    font-size: .813rem

}



.data-table-body-row {

    align-items: center;

    background: #111113;

    display: flex;

    flex-flow: row nowrap;

    min-height: 44px;

    padding: 8px 20px;

    width: 100%;

    line-height: 1.125rem

}



.data-table-body-row:nth-child(even) {

    background: #1b1b1d

}



.data-table-body-row:last-child {

    border-radius: 0 0 12px 12px

}



.data-table-body-row.selectable-body-row {

    cursor: pointer

}



.data-table-body-cell,

.data-table-footer-cell,

.data-table-head-cell {

    align-items: center;

    display: flex;

    flex-grow: 1;

    flex-shrink: 1;

    margin-right: 10px;

    min-width: 125px;

    word-break: break-word

}



.data-table-body-cell--size-l {

    min-width: 180px

}



.data-table-body-cell:last-child,

.data-table-footer-cell:last-child,

.data-table-head-cell:last-child {

    margin-right: 0

}



.data-table-body-cell-content {

    align-items: center;

    display: flex;

    gap: 12px

}



.data-table-body-cell-content--vertical {

    align-items: flex-start;

    flex-direction: column;

    gap: 0

}



.data-table-body-cell-content--left {

    align-items: flex-start

}



.data-table-body-cell-content--right {

    align-items: flex-end

}



.data-table-body-cell-content--size-s {

    gap: 4px

}



.data-table-body-cell-content--size-l {

    gap: 20px

}



.data-table-header-cell {

    align-items: center;

    display: flex;

    gap: 5px;

    justify-content: start

}



.data-table-body-error {

    font-size: .875rem;

    color: #f44;

    justify-content: center;

    padding: 50px 0

}



.data-table-text-empty {

    opacity: .8

}



.data-table-loader {

    align-items: center;

    display: flex;

    height: 300px;

    justify-content: center

}

.earnings-table {

    min-height: 260px;

}

.creators-onboarding-page-content {

    display: flex;

    gap: 20px;

}

.creators-onboarding-page-content__onboarding-items {

    flex: 1 0 418px;

}

.creators-onboarding-page-content__recommendations {

    align-items: center;

    display: flex;

    flex-wrap: wrap;

    gap: 10px;

    justify-content: flex-start;

}

.creators-onboarding-page-content__info {

    flex: 0 1 418px;

    margin-top: 38px;

}

.creators-onboarding-page-content__complete-account {

    background-color: #232325;

    border-radius: 12px;

    margin-bottom: 42px;

    padding: 16px 16px 16px 20px;

}

.creators-onboarding-page-content__info-item {

    background-color: #111113;

    border-radius: 10px;

    display: flex;

    flex-direction: column;

    gap: 10px;

    margin-bottom: 20px;

    padding: 16px;

    white-space: break-spaces;

}

@media screen and (max-width: 767px) {

    .creators-onboarding-page-content {

        flex-direction: column;

    }

    .creators-onboarding-page-content__onboarding-items {

        order: 2;

    }

    .creators-onboarding-page-content__info {

        flex: 0;

        margin-top: 0;

        order: 1;

    }

    .creators-onboarding-page-content__complete-account {

        margin-bottom: 32px;

    }

    .creators-onboarding-page-content__info-items-list {

        display: flex;

        max-width: 100%;

        overflow: auto;

        white-space: nowrap;

        width: 100%;

    }

    .creators-onboarding-page-content__info-item {

        display: inline-flex;

        flex: 1;

        margin-bottom: 10px;

        margin-right: 20px;

        max-width: 327px;

        min-width: calc(100% - 36px);

    }

}

.creators-onboarding-page-content__pwa-popup-button {

    color: #ff3332;

    cursor: pointer;

}

.help-tooltip {

    align-items: center;

    cursor: default;

    display: inline-flex;

    font-weight: 400;

    height: 16px;

    justify-content: center;

    line-height: 15px;

    min-width: 16px;

    text-align: center;

    width: 16px;

    font-size: 0.625rem;

}

.help-tooltip:hover {

    color: #fff;

}

.help-tooltip--border {

    border: 1px solid currentColor;

    border-radius: 50%;

}

.help-tooltip--border:hover {

    background-color: #fff;

    border-color: #fff;

    color: #2b2b2b;

}

.help-tooltip__tooltip .tooltip-inner {

    padding: 8px 10px;

}

.ps {

    overflow: hidden !important;

    overflow-anchor: none;

    touch-action: auto;

}

.ps__rail-x,

.ps__rail-y {

    display: none;

    opacity: 0;

    position: absolute;

    transition: background 0.2s linear, opacity 0.2s linear;

}

.ps__rail-x {

    bottom: 0;

    height: 15px;

}

.ps__rail-y {

    right: 0;

    width: 15px;

}

.ps--active-x > .ps__rail-x,

.ps--active-y > .ps__rail-y {

    background: 0 0;

    display: block;

}

.ps--focus > .ps__rail-x,

.ps--focus > .ps__rail-y,

.ps--scrolling-x > .ps__rail-x,

.ps--scrolling-y > .ps__rail-y,

.ps:hover > .ps__rail-x,

.ps:hover > .ps__rail-y {

    opacity: 0.6;

}

.ps > .ps__rail-x.ps--clicking,

.ps > .ps__rail-x:focus,

.ps > .ps__rail-x:hover,

.ps > .ps__rail-y.ps--clicking,

.ps > .ps__rail-y:focus,

.ps > .ps__rail-y:hover {

    background: #eee;

    opacity: 0.9;

}

.ps__thumb-x,

.ps__thumb-y {

    background: #aaa;

    border-radius: 6px;

    position: absolute;

}

.ps__thumb-x {

    bottom: 2px;

    height: 6px;

    transition: background 0.2s linear, height 0.2s ease-in-out;

}

.ps__thumb-y {

    right: 2px;

    transition: background 0.2s linear, width 0.2s ease-in-out;

    width: 6px;

}

.ps__rail-x.ps--clicking .ps__thumb-x,

.ps__rail-x:focus > .ps__thumb-x,

.ps__rail-x:hover > .ps__thumb-x {

    background: #999;

    height: 11px;

}

.ps__rail-y.ps--clicking .ps__thumb-y,

.ps__rail-y:focus > .ps__thumb-y,

.ps__rail-y:hover > .ps__thumb-y {

    background: #999;

    width: 11px;

}

.cl__iframe-wrapper {

    background: #fff;

    position: relative;

    width: calc(100vw - 32px);

}

.cl__iframe {

    border: 0;

    display: block;

    height: calc(100vh - 40px);

    width: 100%;

}

.cl__benefits-list {

    margin: 8px 0 0;

}

.cl__benefit {

    align-items: center;

    color: #000;

    font-size: 12px;

    font-weight: 500;

    line-height: 20px;

    margin: 0;

    display: flex;

    flex-direction: row;

}

.cl__benefit .icon-check-1 {

    color: #d60908;

    height: 12px;

    margin: 0 16px 0 0;

    min-width: 12px;

    width: 12px;

}

.cl__benefit .icon-gift {

    fill: currentColor;

    margin-right: 14px;

}

.cl__benefits {

    background: 0 0;

    border-radius: 12px;

    padding: 0;

}

.cl__header {

    column-gap: 20px;

    display: flex;

    flex-wrap: wrap;

    margin: 0 auto;

    max-width: 100%;

    padding: 20px 12px 0;

    row-gap: 10px;

    width: 924px;

}

.cl__header .displayname__name {

    color: #000;

}

.cl__header .display-full-name__nickname {

    color: rgba(5, 5, 6, 0.4);

    font-size: 10px;

}

.cl__header .user-status-icon {

    background: #fff;

}

.cl__header-block {

    background: rgba(212, 212, 212, 0.2);

    border-radius: 6px;

    min-height: 104px;

    padding: 12px 16px;

}

.cl__header-block--size--big {

    flex: 1;

}

.cl__header-block--size--small {

    width: 340px;

}

.cl__header-title {

    color: rgba(5, 5, 6, 0.4);

    font-size: 10px;

    text-transform: uppercase;

}

.cl__logo {

    background: url(/assets/common/images/myclub-logo-black.svg) no-repeat center;

    background-size: contain;

    height: 20px;

    margin: 0 0 12px;

    width: 68px;

}

@media screen and (max-width: 1023px) {

    .cl {

        width: 100%;

    }

}

@media screen and (max-width: 942px) {

    .cl__header {

        background: #343437;

        left: 0;

        padding: 0;

        position: absolute;

        top: 0;

    }

    .cl__header .displayname__name {

        color: #fff;

    }

    .cl__header .display-full-name__nickname {

        color: #a0a0a1;

    }

    .cl__logo {

        display: none;

    }

    .cl__iframe-wrapper--with-header {

        padding-top: 72px;

    }

    .cl__header-block {

        background: 0 0;

        min-height: 60px;

        min-width: 100%;

        padding: 12px;

    }

    .cl__header-block--size--small {

        display: none;

    }

}

.modal-information {

    max-width: calc(100vw - 32px);

    padding: 10px 16px 24px;

    text-align: center;

    width: 456px;

}

.modal-information__icon {

    display: block;

    margin: 0 0 12px;

}

.modal-information__icon.icon-mail {

    fill: #fff;

    margin-top: 20px;

}

.modal-information__description {

    color: #fff;

    font-size: 13px;

    font-weight: 500;

    line-height: 20px;

    margin: 10px 0 16px;

}

.modal-information .modal-body {

    text-align: center;

    width: 480px;

}

@media screen and (max-width: 600px) {

    .modal-information .modal-body {

        width: calc(100vw - 20px);

    }

}

.global-loader {

    align-items: center;

    -webkit-backdrop-filter: blur(3px);

    backdrop-filter: blur(3px);

    background: rgba(0, 0, 0, 0.4);

    bottom: 0;

    display: flex;

    justify-content: center;

    left: 0;

    position: fixed;

    right: 0;

    top: 0;

    z-index: 100;

}

.list-round-marker {

    color: #cfcfd0;

    font-size: 13px;

    font-weight: 500;

    line-height: 18px;

}

.list-item-round-marker {

    display: flex;

    margin: 10px 0;

}

.list-item-round-marker__content {

    padding: 4px 0 0;

}

.list-item-round-marker__marker {

    align-items: center;

    background: rgba(255, 255, 255, 0.1);

    border-radius: 7px;

    color: #fff;

    display: flex;

    height: 24px;

    justify-content: center;

    margin: 2px 12px 0 0;

    width: 24px;

}

.list-item-round-marker__description {

    color: rgba(255, 255, 255, 0.5);

    font-size: 12px;

    font-weight: 400;

    line-height: 15px;

}

.list-item-round-marker__title {

    font-size: 15px;

    font-weight: 400;

    line-height: 18px;

    margin: 0 0 4px;

}

.cW {

    max-width: 100%;

    padding: 24px;

    width: 600px;

}

.cW__title {

    line-height: 27px;

    margin: 0 0 10px;

}

.cW__description {

    margin-bottom: 24px;

    opacity: 0.6;

}

.cW__sources {

    display: flex;

    flex-direction: column;

}

.cW__link {

    color: #fff;

    cursor: pointer;

    font-size: 22px;

    font-weight: 500;

    margin-bottom: 10px;

}

.cW__link:focus,

.cW__link:hover {

    text-decoration: none;

}

.cW__link:last-child {

    margin-bottom: 0;

}

.cW__divider {

    border-top: 1px solid rgba(255, 255, 255, 0.15);

    margin: 20px 0;

}

.cW__footer {

    display: flex;

    justify-content: flex-end;

}

.b5 .title {

    margin-bottom: 14px;

}

.b5 .description {

    font-size: 0.938rem;

    line-height: 1.5rem;

    color: rgba(255, 255, 255, 0.8);

    font-weight: 400;

    margin: 0 0 30px;

}

.b5 .scroll-bar-container {

    white-space: nowrap;

}

.b5__header-cell {

    align-items: center;

    display: flex;

    gap: 5px;

    justify-content: start;

}

.b5__cell {

    align-items: flex-end;

    display: flex;

    gap: 12px;

}

.b5__cell--vertical {

    flex-direction: column;

    gap: 0;

}

.b5__cell--center {

    align-items: center;

}

.b5__cell--left {

    align-items: flex-start;

}

.b5__icon-wrapper {

    background: #343437;

    border-radius: 10px;

    display: grid;

    height: 32px;

    place-items: center;

    width: 32px;

}

.b5__my-flag {

    align-items: center;

    background: linear-gradient(180deg, #b672fb 0, #8a19fc 100%);

    color: #fff;

    display: flex;

    height: 17px;

    justify-content: center;

    width: 24px;

}

.b5__title {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.b5__beta {

    background: #343437;

    border-radius: 6px;

    display: flex;

    font-size: 13px;

    font-weight: 500;

    line-height: 16px;

    margin-left: 10px;

    padding: 4px 8px;

    width: 44px;

}

.transfer-stepper {

    margin: 0 auto;

    max-width: 504px;

}

.transfer-stepper__logo {

    display: flex;

    justify-content: center;

    margin: 0 0 20px;

}

.transfer-stepper__title {

    font-size: 32px;

    font-weight: 500;

    line-height: 39px;

    margin: 0 0 12px;

    text-align: center;

}

.transfer-stepper__description {

    color: #a0a0a1;

    font-size: 13px;

    line-height: 20px;

    margin: 0 0 34px;

    text-align: center;

}

.Z {

    padding: 20px;

}

.Z__benefits-list {

    display: flex;

    flex-wrap: wrap;

    gap: 10px;

    margin: 5px 0;

}

.Z__benefit {

    align-items: center;

    background: #232325;

    border-radius: 12px;

    color: rgba(255, 255, 255, 0.6);

    flex: 1 0 224px;

    font-size: 12px;

    line-height: 120%;

    min-height: 48px;

    padding: 10px 13px;

    width: 224px;

    display: flex;

    flex-direction: row;

}

.Z__benefit .icon-check-1 {

    color: #d60908;

    height: 16px;

    min-width: 12px;

    width: 16px;

}

.Z__benefit .icon-gift {

    fill: currentColor;

    margin-right: 14px;

}

@media (max-width: 540px) {

    .Z__benefit {

        width: 100%;

    }

}

.Z__icon {

    color: #d60908;

    margin-right: 12px;

}

.Z__actions--sticked {

    backdrop-filter: blur(2px);

    background: rgba(27, 27, 29, 0.8);

    border-radius: 0 0 12px 12px;

    bottom: 0;

    left: 0;

    padding: 20px;

    position: absolute;

    width: 100%;

}

@media screen and (max-height: 760px) {

    .Z__actions--sticked {

        border-top: 1px solid rgba(255, 255, 255, 0.05);

    }

}

.Z__actions > .btn {

    margin-top: 10px;

    width: 100%;

}

.Z__actions > .btn > .icon-diamond-colored,

.Z__actions > .btn > .icon-diamond-flat {

    height: 16px;

    margin: 0 6px 0 0;

    width: 16px;

}

.Z__actions > .btn:first-child:last-of-type {

    margin-top: 0;

}

.Z__actions-description {

    color: #f8f8f8;

    font-size: 11px;

    font-weight: 500;

    line-height: 13px;

    margin: 12px 0 0;

    opacity: 0.4;

    text-align: center;

}

@media screen and (max-width: 479px) {

    .Z {

        padding: 0 20px 20px;

    }

    .Z__benefits-list {

        gap: 0;

        margin: 20px 0 0;

    }

    .Z__benefit {

        border-radius: 0;

        min-height: auto;

    }

    .Z__benefit:first-child {

        border-radius: 12px 12px 0 0;

    }

    .Z__benefit:last-child {

        border-radius: 0 0 12px 12px;

    }

}

.smiles-dropdown {

    --dropdown-max-height: 300px;

    align-items: center;

    display: flex;

    line-height: 40px;

    margin-right: 8px;

    pointer-events: all;

}

.smiles-dropdown__list {

    background: #161616;

    border-top-left-radius: 8px;

    border-top-right-radius: 8px;

    display: block;

    margin: 0;

    position: absolute;

    transition: top 0.15s ease, left 0.15s ease;

    visibility: hidden;

    z-index: 501;

}

.smiles-dropdown__list--visible {

    visibility: visible;

}

.smiles-dropdown__list .smile {

    height: 26px;

    width: 26px;

}

.smiles-dropdown__list .scroll-bar-container {

    display: grid;

    grid-template-columns: repeat(7, 1fr);

    max-height: var(--dropdown-max-height);

    padding: 8px;

}

.smiles-dropdown__icon {

    color: #fff;

    display: inline-flex;

    opacity: 0.6;

    position: relative;

    width: 20px;

}

.smiles-dropdown__icon--active,

.smiles-dropdown__icon:hover {

    opacity: 1;

}

.cn {

    align-items: center;

    display: grid;

    grid-column-gap: 20px;

    grid-template-columns: minmax(168px, 1fr) auto auto;

}

.cn__input-label {

    position: relative;

}

.cn__input-label .input {

    padding-left: 38px;

}

.cn__input-label--error .scheduled-post-settings__input-icon {

    color: #fd3a5b;

}

.cn__input-icon {

    align-items: center;

    bottom: 0;

    color: rgba(255, 255, 255, 0.6);

    display: flex;

    left: 14px;

    pointer-events: none;

    position: absolute;

    top: 0;

}

.cn__clear-button {

    align-items: center;

    background-color: #5b5b5b;

    border: 3px solid #1b1b1d;

    border-radius: 50%;

    cursor: pointer;

    display: flex;

    height: 24px;

    justify-content: center;

    margin: auto;

    transition: all ease 0.25s;

    width: 24px;

}

.cn__clear-button-icon {

    color: #fff;

    fill: #fff;

    margin: 0;

}

.cn__clear-button:hover {

    background-color: #af262f;

}

.cn__input-invisible {

    border: 0;

    border-radius: 12px;

    bottom: 0;

    left: 0;

    max-width: 100%;

    opacity: 0;

    position: absolute;

    top: 0;

    width: 200px;

    z-index: 1;

}

.N {

    background-color: #232325;

    border-radius: 8px 8px 0 0;

    box-shadow: 0 20px 30px rgba(0, 0, 0, 0.3);

    display: flex;

    flex-direction: column;

    padding-bottom: env(safe-area-inset-bottom);

    position: relative;

    transition: width 200ms;

    width: 250px;

}

@media (max-width: 639px) {

    .N {

        border-radius: 0;

        bottom: var(--tap-bar-height);

        left: 0;

        position: fixed;

        right: 0;

        top: var(--pwa-notification-height);

    }

}

.N:not(:first-child) {

    margin-left: 20px;

}

.N__content {

    display: flex;

    flex-direction: column;

    height: 0;

    justify-content: flex-end;

    position: relative;

    transition: height 200ms;

}

.N__content--expanded {

    height: 430px;

    max-height: calc(100vh - 100px);

}

@media (max-width: 639px) {

    .N__content--expanded {

        flex: 1;

    }

}

@media screen and (max-width: 639px) {

    .N__content--expanded {

        height: auto;

        max-height: none;

        overflow: hidden;

    }

}

.N .chat-header-username {

    max-width: 160px;

}

.N--expanded {

    overflow: inherit;

    width: 360px;

}

@media (max-width: 639px) {

    .N--expanded {

        width: 100%;

    }

}

.N--expanded .messenger-chat-header {

    border-color: transparent;

    border-bottom-color: rgba(255, 255, 255, 0.1);

}

.N--expanded .chat-header-username {

    max-width: 180px;

}

.N__skeleton-wrapper {

    flex: 1;

    max-height: 100%;

}

.see-last-message {

    align-items: center;

    background-color: #fff;

    border-radius: 50%;

    bottom: 87px;

    color: #101010;

    display: flex;

    height: 32px;

    justify-content: center;

    left: 50%;

    opacity: 0.8;

    position: absolute;

    transform: rotate(270deg);

    width: 32px;

}

.see-last-message:hover {

    opacity: 1;

}

.see-last-message-icon {

    margin: 0;

}

.message-request-reply-note {

    align-items: center;

    background-color: #343437;

    border-radius: 8px;

    color: rgba(255, 255, 255, 0.6);

    display: flex;

    justify-content: center;

    margin: 16px 12px 12px;

    padding: 12px 14px;

    text-align: center;

}

.feed {

    position: relative;

}

.feed .feed-loader-wrapper {

    align-items: center;

    justify-content: center;

    display: flex;

    flex-direction: row;

    height: 90px;

}

.feed .feed-info {

    width: 642px;

}

@media screen and (max-width: 639px) {

    .feed .feed-info {

        padding: 0 20px;

    }

}

.feed .feed-info-title {

    font-size: 20px;

    font-weight: 700;

    letter-spacing: normal;

    line-height: 24px;

    color: #fff;

}

.feed .feed-info-description {

    font-size: 14px;

    font-weight: 400;

    letter-spacing: normal;

    line-height: normal;

    color: rgba(255, 255, 255, 0.6);

    margin-top: 20px;

}

.feed__tabs {

    max-width: calc(100vw - 32px);

    width: 100%;

}

.feed__tabs .pill-page-tabs {

    max-width: 100%;

}

.feed-content {

    align-items: center;

    display: flex;

    flex-direction: column;

    margin: 0 auto;

    max-width: 100vw;

    position: relative;

    width: 742px;

}

@media screen and (max-width: 639px) {



}

.feed-post {

    margin-bottom: 20px;

    width: 100%;

}

.feed-post:last-child {

    margin-bottom: 0;

}

.feed-post:last-child .tile-footer::after {

    display: none;

}

.c2__checkbox-container {

    align-items: flex-start;

    display: grid;

    grid-auto-flow: column;

    grid-column-gap: 8px;

    justify-content: start;

}

.c2__checkbox-title {

    color: #fff;

    font-size: 14px;

    word-break: break-all;

}

.user-fan-club-subscribe {

    border-radius: 16px;

    max-width: min(100vw - 32px, 100%);

    overflow: hidden;

    padding: 0;

    width: 500px;

}

.select-tooltip {

    left: 0;

    position: fixed;

    top: 0;

    z-index: 599;

}

.cX,

.cX__button {

    display: flex;

    flex-direction: column;

    gap: 20px;

}

.cX__button {

    align-items: center;

    background: 0 0;

    border: 0;

    color: #fff;

    cursor: pointer;

    filter: drop-shadow(0 1px 10px rgba(0, 0, 0, 0.4));

    font-size: 12px;

    gap: 4px;

    position: relative;

    text-shadow: 0 0 2px rgba(0, 0, 0, 0.1);

    transition: 0.3s color;

}

.cX__button--style--like:hover,

.cX__button--style--liked {

    color: #f44;

}

.cX__button--style--follow:hover,

.cX__button--style--followed {

    color: #fccf49;

}

.cX__button--style--tip:hover {

    color: #cfcfd0;

}

.cX__button--style--joined {

    color: #ff3332;

    pointer-events: none;

}

.cX__button--style--joined .icon-check-round-fill {

    position: relative;

}

.cX__button--style--joined::before {

    background: #fff;

    content: "";

    height: 17px;

    position: absolute;

    top: 8px;

    width: 19px;

}

.cX__button--style--join:hover {

    color: #ff3332;

}

.cX__menu {

    background: #1b1b1d;

    border-radius: 12px;

    bottom: 12px;

    left: 12px;

    opacity: 0;

    overflow: hidden;

    position: absolute;

    right: 12px;

    transform: translateY(100%);

    transition: 0.3s transform, 0.3s opacity;

    z-index: 2;

}

.cX__menu--visible {

    opacity: 1;

    transform: translateY(0);

}

.cX__menu-item {

    align-items: center;

    column-gap: 6px;

    cursor: pointer;

    display: flex;

    height: 48px;

    padding: 0 20px;

}

.cX__menu-item:hover {

    background: #232325;

}

.cX__controls {

    aspect-ratio: 0.5625;

    bottom: 0;

    height: 100%;

    left: 50%;

    pointer-events: none;

    position: absolute;

    transform: translateX(-50%);

    z-index: 3;

    -webkit-user-select: none;

    user-select: none;

}

.cX__controls--mobile {

    left: auto;

    position: static;

    right: 0;

    transform: none;

}

.cX__arrow {

    border-radius: 50%;

    color: #a0a0a1;

    cursor: pointer;

    margin-top: -12px;

    overflow: hidden;

    pointer-events: auto;

    position: absolute;

    top: 50%;

    transition: 0.3s color;

}

.cX__arrow:hover {

    color: #fff;

}

.cX__arrow--style--left {

    margin-right: 24px;

    right: 100%;

    transform: rotate(180deg);

}

.cX__arrow--style--right {

    left: 100%;

    margin-left: 24px;

}

.cX__controls-aside {

    bottom: 0;

    left: 100%;

    margin: 0 0 0 24px;

    pointer-events: auto;

    position: absolute;

    width: 32px;

}

.cX__controls-aside--mobile {

    bottom: 70px;

    left: auto;

    margin: 0;

    right: 14px;

}

@media (max-height: 750px) {

    .cX__arrow--not-own-left {

        color: rgba(0, 0, 0, 0.6);

        left: 14px;

        margin: 0;

        right: auto;

    }

    .cX__arrow--not-own-left:hover,

    .cX__arrow--not-own-right:hover {

        color: rgba(0, 0, 0, 0.8);

    }

    .cX__arrow--not-own-right {

        color: rgba(0, 0, 0, 0.6);

        left: auto;

        margin: 0;

        right: 14px;

    }

}

@media (max-height: 480px) {

    .cX__arrow {

        color: rgba(0, 0, 0, 0.6);

    }

    .cX__arrow:hover {

        color: rgba(0, 0, 0, 0.8);

    }

    .cX__arrow--style--left {

        left: 14px;

        margin-right: 24px;

        right: auto;

    }

    .cX__arrow--style--right {

        left: auto;

        margin-left: 24px;

        right: 14px;

    }

}

.bz {

    margin-bottom: 160px;

    min-height: min(100vh, 1000px);

}

.bz__arrows {

    height: 120px;

    position: relative;

}

.bz__arrows--with-margin {

    margin-top: -200px;

}

.bz__arrow {

    background-size: contain;

    height: 104px;

    margin: 1.5em 0 0;

    position: absolute;

    top: 100%;

    width: 100px;

}

.bz__arrow--first {

    background: url(/assets/common/images/promo/arrow-thin-2.svg) center/contain no-repeat;

    left: 60%;

    top: -2rem;

}

.bz__arrow--second {

    background: url(/assets/common/images/promo/arrow-thin-1.svg) center/contain no-repeat;

    left: 20%;

    top: -4rem;

}

.bz__title {

    font-size: 2.75rem;

    line-height: 3.125rem;

    font-weight: 700;

    margin: 0 0 52px;

    text-align: center;

}

.bz__footer {

    align-items: center;

    display: flex;

    flex-direction: column;

}

.bz__footer-title {

    font-size: 2.125rem;

    line-height: 2.625rem;

    font-weight: 700;

    margin: 0 0 20px;

}

.bz__footer-actions {

    align-items: center;

    display: flex;

    flex-direction: column;

}

.bz__arrow-wrapper {

    cursor: pointer;

}

.bz__arrow-wrapper .arrow-down-animated {

    margin-left: 0;

}

.bz .footer-button {

    align-items: center;

    border-radius: 16px;

    display: grid;

    grid-auto-flow: column;

    grid-column-gap: 8px;

    justify-content: center;

    margin-bottom: 12px;

    max-width: 144px;

    min-height: 50px;

    width: 100%;

    font-size: 1.125rem;

}

@media screen and (max-width: 767px) {

    .bz__arrows--with-margin {

        margin: -30px;

    }

}

.favorite-button {

    z-index: 2;

}

.favorite-button.favorited {

    color: #d60908;

}

.favorite-button--active {

    z-index: 3;

}

.favorite-button__content {

    color: #fff;

}

.bBB {

    flex: 1;

    position: relative;

    width: 100%;

}

.bBB__size {

    aspect-ratio: 5/4;

    display: block;

    visibility: hidden;

    width: 100%;

}

.bBB__shadow-box {

    border-radius: 50%;

    box-shadow: 0 0 200px rgba(163, 73, 252, 0.6);

    pointer-events: none;

    position: absolute;

}

.bBB__shadow-box--face--1 {

    left: 20%;

    padding-top: 31%;

    top: 74%;

    width: 31%;

}

.bBB__shadow-box--face--2 {

    left: 30%;

    padding-top: 44%;

    top: 10%;

    width: 48%;

}

.bBB__face {

    position: absolute;

}

.bBB__face--face--1 {

    left: 14%;

    top: 73%;

    width: 38%;

}

.bBB__face--face--2 {

    left: 30%;

    top: 5%;

    width: 60%;

}

.bBB__face--chat {

    position: absolute;

}

.bBB__face--chat--1 {

    left: 14%;

    top: 0;

    width: 41%;

}

.bBB__face--chat--2 {

    left: 53%;

    top: 100%;

    width: 47%;

}

.bBB__face--shadow {

    border-radius: 20px;

    box-shadow: 0 0 200px rgba(163, 73, 252, 0.6);

}

.bBB__smile {

    left: 87%;

    position: absolute;

    top: 95%;

    width: 8%;

}

@media screen and (max-width: 767px) {

    .bBB {

        margin-top: 20px;

    }

}

.third-party-authorization .third-party-authorization-separator {

    color: rgba(255, 255, 255, 0.7);

    margin: 5px 0;

    padding: 5px 0;

    position: relative;

    font-size: 0.75rem;

    line-height: 0.938rem;

    display: flex;

    flex-direction: row;

}

.third-party-authorization .third-party-authorization-separator .third-party-authorization-separator-label {

    font-weight: 500;

    padding: 3px 15px;

    flex: 1;

    flex-basis: auto;

    flex-grow: 0;

    flex-shrink: 0;

}

.third-party-authorization .third-party-authorization-separator:after,

.third-party-authorization .third-party-authorization-separator:before {

    border-top: 1px solid rgba(255, 255, 255, 0.3);

    content: " ";

    margin: 10px 0;

    flex: 1;

    flex-basis: auto;

    flex-grow: 1;

    flex-shrink: 1;

}

.third-party-authorization .google-authorization {

    background: #e0535c;

    border: 2px solid transparent;

    align-items: center;

    border-radius: 4px;

    cursor: pointer;

    justify-content: space-between;

    max-width: 300px;

    min-height: 38px;

    padding: 5px 0;

    width: 100%;

    display: flex;

    flex-direction: row;

    transition: all 120msms ease-in-out 0s;

}

.third-party-authorization .google-authorization .google-authorization-icon {

    border-right: 1px solid rgba(255, 255, 255, 0.5);

    padding: 0 15px 0 20px;

}

.third-party-authorization .google-authorization .google-authorization-label {

    color: #fff;

    font-weight: 700;

    justify-content: center;

    opacity: 0.8;

    text-align: center;

    font-size: 0.938rem;

    line-height: 1.188rem;

    display: flex;

    flex-direction: row;

    flex: 1;

    flex-basis: auto;

    flex-grow: 1;

    flex-shrink: 1;

}

.third-party-authorization .google-authorization:hover {

    background: #ea5f69;

}

.third-party-authorization .twitter-auth-wrapper {

    margin-top: 12px;

}

.third-party-authorization .twitter-auth {

    background: #4691d0;

    border: 2px solid transparent;

    align-items: center;

    border-radius: 4px;

    cursor: pointer;

    justify-content: space-between;

    max-width: 300px;

    min-height: 38px;

    padding: 5px 0;

    width: 100%;

    display: flex;

    flex-direction: row;

    transition: all 120msms ease-in-out 0s;

}

.third-party-authorization .twitter-auth .twitter-auth-icon {

    border-right: 1px solid rgba(255, 255, 255, 0.5);

    color: #f8f8f8;

    padding: 0 15px 0 20px;

}

.third-party-authorization .twitter-auth .twitter-auth-label {

    color: #f8f8f8;

    font-weight: 700;

    justify-content: center;

    opacity: 0.8;

    text-align: center;

    font-size: 0.938rem;

    line-height: 1.188rem;

    display: flex;

    flex-direction: row;

    flex: 1;

    flex-basis: auto;

    flex-grow: 1;

    flex-shrink: 1;

}

.third-party-authorization .twitter-auth:hover {

    background: #449dda;

}

.abilitie-tip {

    flex: 1;

    margin: 20px 0 20px auto;

    max-width: 600px;

    overflow: hidden;

    position: relative;

}

.abilitie-tip::after {

    bottom: 70px;

    box-shadow: 0 0 150px 182px rgba(138, 24, 252, 0.3);

    content: "";

    height: 1px;

    left: 50%;

    pointer-events: none;

    position: absolute;

    top: 50%;

    width: 1px;

    z-index: 10;

}

.abilitie-tip__message {

    align-items: center;

    display: flex;

    height: 100%;

    justify-content: center;

    left: 0;

    pointer-events: none;

    position: absolute;

    top: 0;

    width: 100%;

    z-index: 11;

}

.abilitie-tip__message > .login-message-wrapper {

    opacity: 0;

    transform: scale(0);

    transition: opacity 0.5s, transform 0.5s;

}

.abilitie-tip__message::before {

    background: rgba(0, 0, 0, 0.4);

    content: "";

    height: 100%;

    left: 0;

    opacity: 0;

    position: absolute;

    top: 0;

    transition: opacity 0.3s;

    width: 100%;

}

.abilitie-tip__message--visible {

    pointer-events: auto;

}

.abilitie-tip__message--visible > .login-message-wrapper {

    opacity: 1;

    transform: scale(1);

}

.abilitie-tip__message--visible > .login-message-wrapper .login-message__inline-emoji {

    animation: animation-ability-tip 2.5s ease;

}

.abilitie-tip__message--visible::before {

    opacity: 1;

}

@media screen and (max-width: 1023px) {

    .abilitie-tip .tip-modal__content .radio-pill-controls {

        grid-template-columns: repeat(3, 1fr);

    }

}

@media screen and (max-width: 639px) {

    .abilitie-tip {

        width: 100%;

    }

}

@media screen and (max-width: 767px) {

    .abilitie-tip {

        margin: 30px auto;

        max-width: 100%;

    }

}

.media-list-editor {

    align-items: center;

    background: #232325;

    border-radius: 12px;

    bottom: 12px;

    box-shadow: 0 0 12px rgba(0, 0, 0, 0.22), 0 19px 38px rgba(0, 0, 0, 0.3);

    color: #fff;

    display: flex;

    justify-content: space-between;

    left: 20px;

    min-height: 64px;

    padding: 0 24px;

    position: fixed;

    right: 20px;

    z-index: 3;

}

.media-list-editor__left {

    font-size: 15px;

    font-weight: 700;

}

.media-list-editor__left .red-color-text {

    display: inline-block;

    min-width: 30px;

}

.media-list-editor__left,

.media-list-editor__right {

    align-items: center;

    display: flex;

}

.media-list-editor__left > .btn,

.media-list-editor__right > .btn {

    margin: 0 16px 0 0;

}

.media-list-editor__left > .btn:last-child,

.media-list-editor__right > .btn:last-child {

    margin-right: 0;

}

.media-list-editor__select-all {

    min-width: 96px;

}

.media-list-editor__progress {

    align-items: center;

    background: #232325;

    border-radius: 12px;

    bottom: 32px;

    box-shadow: 0 0 12px rgba(0, 0, 0, 0.22), 0 19px 38px rgba(0, 0, 0, 0.3);

    color: #fff;

    display: flex;

    left: 32px;

    max-width: calc(100% - 64px);

    min-height: 64px;

    padding: 0 16px;

    position: fixed;

    width: 362px;

    z-index: 3;

}

.media-list-editor__progress-icon {

    height: 18px;

    margin: 0 16px 0 0;

    width: 18px;

}

@media screen and (max-width: 1023px) {

    .media-list-editor {

        bottom: 0;

        left: 0;

        right: 0;

    }

    .media-list-editor__progress {

        bottom: 16px;

        left: 16px;

    }

}

@media screen and (max-width: 639px) {

    .media-list-editor__select-all {

        display: none !important;

    }

}

.tile-header {

    display: flex;

    padding: 14px 0 14px;

    position: relative;

}

.tile-header .avatar-wrapper {

    position: relative;

    z-index: 1;

}

.tile-header .avatar-border {

    border: 0;

}

.tile-header .content-wrapper {

    display: flex;

    flex: 1 1 auto;

    flex-direction: column;

    justify-content: center;

    margin: 0 0 2px 14px;

}

.tile-header .content {

    align-items: flex-start;

    display: flex;

    flex-direction: column;

    justify-content: flex-start;

    padding: 0 30px 0 0;

    word-break: break-all;

}

.tile-header .scheduled-at {

    align-items: center;

    color: #fccf49;

    display: inline-grid;

    font-size: 12px;

    font-weight: 700;

    grid-auto-flow: column;

    grid-column-gap: 6px;

}

.tile-header-fan-club {

    font-size: 12px;

    font-weight: 400;

    letter-spacing: normal;

    line-height: normal;

    align-items: center;

    background: #363636;

    border-radius: 62px;

    display: flex;

    height: 32px;

    padding: 0 8px;

    pointer-events: none;

}

@media screen and (max-width: 639px) {

    .tile-header-fan-club .icon {

        margin: 0;

    }

}

.posted-at {

    color: #fff;

    font-size: 12px;

    margin-top: 2px;

    opacity: 0.6;

}

.posted-at:hover {

    opacity: 0.8;

}

.picture-album-grid {

    column-gap: 12px;

    display: grid;

    grid-template-columns: repeat(2, 1fr);

    row-gap: 24px;

}

@media screen and (min-width: 480px) {

    .picture-album-grid {

        grid-template-columns: repeat(3, 1fr);

    }

}

@media screen and (min-width: 640px) {

    .picture-album-grid {

        column-gap: 20px;

        grid-template-columns: repeat(4, 1fr);

        row-gap: 40px;

    }

}

@media screen and (min-width: 1366px) {

    .picture-album-grid {

        grid-template-columns: repeat(5, 1fr);

    }

}

.a11y-button {

    background: 0 0;

    border: 0;

    color: inherit;

    cursor: pointer;

    font-size: inherit;

    font-weight: inherit;

    letter-spacing: inherit;

    padding: 0;

    -webkit-user-select: none;

    user-select: none;

}

.a11y-button--icon {

    border-radius: 2px;

    padding: 2px;

}

.a11y-button--icon:hover {

    background: rgba(248, 248, 248, 0.1);

    color: #fff;

}

.my-collection-album__sub-title {

    margin: 8px 0 36px;

}

.bn {

    color: #fff;

    min-height: 48px;

    padding: 0 18px;

}

.bn--type--default {

    background-color: #755e8d;

}

.bn--type--warning {

    background-color: #ffc107;

    color: #050506;

}

.bn--type--warning .bn__button-view-request {

    border-color: rgba(5, 5, 6, 0.4);

}

.bn--type--alert {

    background-color: #d21b4c;

}

.bn__icon {

    min-width: 20px;

}

.bn__body {

    align-items: center;

    display: flex;

    font-size: 14px;

    font-weight: 700;

    gap: 10px;

    justify-content: center;

    line-height: 17px;

    margin: 0 auto;

    padding: 8px 0;

}

.bn__button-view-request {

    background: 0 0;

    border: 2px solid rgba(255, 255, 255, 0.4);

    border-radius: 10px;

    color: inherit;

    cursor: pointer;

    font-size: 13px;

    padding: 6px 16px;

    white-space: nowrap;

}

.bn__close-button-container {

    color: inherit;

    padding: 0 14px;

}

.bn__close-button {

    background: 0 0;

    border: 0;

    color: inherit;

    cursor: pointer;

    padding: 2px;

}

.creators-complete-account-badge {

    align-items: center;

    -webkit-backdrop-filter: blur(3.23077px);

    backdrop-filter: blur(3.23077px);

    background: rgba(52, 52, 55, 0.4);

    border-radius: 44px;

    color: #fff;

    cursor: pointer;

    display: inline-flex;

    height: 44px;

    padding: 2px 16px;

    transition: max-width 200ms linear;

}

.creators-complete-account-badge:hover .creators-complete-account-badge__icon-wrapper {

    opacity: 1;

    width: 38px;

}

.creators-complete-account-badge__content {

    align-items: center;

    display: flex;

    justify-content: space-between;

}

.creators-complete-account-badge__title {

    font-size: 12px;

    font-weight: 700;

    margin-bottom: 6px;

    white-space: nowrap;

}

.creators-complete-account-badge__percent {

    font-size: 24px;

    font-weight: 700;

    margin-left: 20px;

}

.creators-complete-account-badge__icon-wrapper {

    align-items: center;

    display: flex;

    justify-content: flex-end;

    opacity: 0;

    overflow: hidden;

    transition: opacity 200ms linear 50ms, width 200ms linear 50ms;

    width: 0;

}

@media screen and (max-width: 1023px) {

    .creators-complete-account-badge {

        height: 32px;

        padding: 4px 12px;

    }

    .creators-complete-account-badge__icon {

        display: none;

    }

    .creators-complete-account-badge__title {

        font-size: 10px;

        margin-bottom: 2px;

    }

}

.user-photo-upload-cut-modal {

    border-radius: 3px;

    display: inline-flex !important;

    flex-direction: column;

    height: 800px;

    max-height: calc(100% - 10px * 2);

    max-width: calc(100% - 10px * 2);

    width: 692px;

}

.user-photo-upload-cut-modal.is-pending {

    opacity: 0.33;

    pointer-events: none;

}

@media screen and (max-width: 480px) {

    .user-photo-upload-cut-modal {

        height: calc(100% - 10px * 2);

        min-height: 0;

        min-width: 0;

        width: calc(100% - 10px * 2);

    }

}

.user-photo-upload-cut-modal .modal-ds-content {

    display: inline-flex !important;

    flex-direction: column;

    height: 100%;

    padding: 10px 20px 20px !important;

}

.user-photo-upload-cut-modal .modal-ds-content .text {

    display: block;

    font-size: 0.875rem;

    line-height: 1.25rem;

}

.user-photo-upload-cut-modal .modal-ds-footer {

    display: flex;

    justify-content: flex-end;

}

.user-photo-upload-cut-modal .modal-ds-footer .btn-default-outline {

    color: #fff;

}

.user-photo-upload-cut-modal .modal-ds-footer .btn + .btn {

    margin-left: 20px;

}

.user-photo-upload-cut-modal .photo-cut-source-container {

    cursor: move;

    display: block;

    flex-grow: 1;

    flex-shrink: 1;

    margin: 10px 0;

    overflow: hidden;

    position: relative;

    text-align: left;

    -webkit-user-select: none;

    user-select: none;

    font-size: 0.875rem;

    line-height: 1.25rem;

}

.user-photo-upload-cut-modal .photo-cut-source-container .photo-cut-canvas {

    left: 0;

    position: absolute;

    top: 0;

}

.user-photo-upload-cut-modal .photo-cut-source-container .photo-cut-canvas-video {

    top: 50%;

    transform: translateY(-50%);

    width: 100%;

}

.user-photo-upload-cut-modal .photo-cut-source-container .photo-cut-frame-wrapper {

    left: 50%;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

}

.user-photo-upload-cut-modal .photo-cut-source-container .photo-cut-frame-wrapper .photo-cut-filler {

    margin-top: 100%;

}

.br {

    display: flex;

    flex-direction: column;

    position: relative;

    z-index: 4

}



.br--reposition {

    -webkit-user-select: none;

    user-select: none

}



.br__video-parent {

    position: absolute;

    right: 0;

    top: -10%;

    transform-origin: left top;

    width: 100%

}



.br__avatar-flag {

    align-items: center;

    background: #232325;

    border-radius: 50%;

    display: flex;

    height: 34px;

    justify-content: center;

    position: absolute;

    right: -4px;

    top: 0;

    width: 34px

}



.br__st-link {

    align-items: center;

    display: inline-flex

}



.br__st-link-content {

    margin-bottom: 2px;

    overflow: hidden;

    position: relative

}



@media screen and (max-width:360px) {

    .br__st-link-content:after {

        background: linear-gradient(270deg, #050506 0, rgba(5, 5, 6, 0) 100%);

        content: "";

        display: block;

        height: 20px;

        position: absolute;

        right: 0;

        top: 0;

        width: 24px

    }

}



.br__live {

    align-items: center;

    background: #d21b4c;

    border-radius: 6px;

    color: #fff;

    column-gap: 4px;

    display: flex;

    font-size: 13px;

    font-weight: 700;

    height: 20px;

    margin: 0 0 0 8px;

    padding: 0 8px 0 4px;

    white-space: nowrap

}



.br__live:hover {

    background: #d9023c

}



.br__media {

    max-height: 100%;

    overflow: hidden;

    pointer-events: none;

    position: absolute;

    right: 0;

    top: 0;

    width: min(1144px, 100%)

}



.br__media-background-cover {

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%

}



.br__media-background-cover--blured {

    filter: blur(20px)

}



.br__media--no-cover::before {

    background: linear-gradient(180deg, rgba(5, 5, 6, 0)0, #050506 100%), radial-gradient(50% 200%at 50% 50%, #582424eb 0, rgba(60, 24, 94, 0) 100%), linear-gradient(0deg, #050506, #050506), linear-gradient(270deg, #050506 0, rgba(5, 5, 6, 0) 50.03%), linear-gradient(95.78deg, #050506 4.6%, rgba(5, 5, 6, 0) 50.04%), linear-gradient(180deg, rgba(5, 5, 6, 0)0, #050506 100%);

    content: "";

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%

}



.br__media--shadow::after {

    background: linear-gradient(270deg, #050506 0, rgba(5, 5, 6, 0) 50.03%), linear-gradient(95.78deg, #050506 4.6%, rgba(5, 5, 6, 0) 50.04%), linear-gradient(180deg, rgba(5, 5, 6, 0)0, #050506 100%);

    content: "";

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%

}



.br__media-aspect-ratio {

    display: block;

    visibility: hidden;

    width: 100%;

    height: 580px;

}



.br__media-cover-image {

    left: 0;

    position: absolute;

    top: -30%;

    transform-origin: left top;

    width: 100%

}



.br__mobile-top-button {

    position: absolute;

    right: 15px;

    top: 70px;

    z-index: 4

}



.br__reposition-controls {

    bottom: 95px;

    position: absolute;

    right: 83px;

    z-index: 5

}



.br__reposition-controls--mobile {

    display: none

}



.br__info {

    margin: 0 auto;

    max-width: 1280px;

    padding: 64px 83px 0;

    position: relative;

    width: 100%;

    z-index: 3

}



@media screen and (max-width:1023px) {

    .br__info {

        padding: 80px 15px 0

    }

}



.br__tabs.tabs-ds {

    border-color: 1px solid rgba(255, 255, 255, .08);

    justify-content: center;

    margin: 44px 0 0;

    white-space: nowrap;

    width: 100%;

    z-index: 1

}



.br__tabs.tabs-ds::after,

.br__tabs.tabs-ds::before {

    background: rgba(255, 255, 255, .08);

    content: "";

    height: 1px;

    pointer-events: none;

    position: absolute;

    top: 100%;

    width: 1200px

}



.br__tabs.tabs-ds::before {

    box-sizing: border-box;

    right: 100%

}



.br__tabs.tabs-ds::after {

    left: 100%

}



.br__content-counters-wrapper--mobile {

    align-items: center;

    backdrop-filter: blur(10px);

    background: rgba(0, 0, 0, .2);

    border-radius: 20px;

    display: flex;

    padding: 14px 16px;

    position: absolute;

    right: 80px;

    top: 60px;

    z-index: 1

}



@media screen and (max-width:1023px) {

    .br__content-counters-wrapper--mobile {

        right: 15px

    }

}



@media (max-width:1079px) {

    .br__media--shadow::after {

        background: linear-gradient(0deg, #050506 0, rgba(5, 5, 6, .9) 24%, rgba(5, 5, 6, .75) 40%, rgba(5, 5, 6, .5) 60%, rgba(5, 5, 6, 0) 100%)

    }

    .br__avatar-wrapper {

        width: 80px

    }

    .br__avatar-wrapper .avatar {

        height: 80px;

        min-width: 80px;

        width: 80px

    }

    .br__name-wrapper {

        align-items: flex-start;

        flex-direction: column

    }

    .br__username {

        margin-left: 0;

        font-weight: bold;

    }

    .br .displayname.displayname--big .displayname__name {

        font-size: 1.75rem

    }

    .br__profile-counters {

        font-size: .875rem

    }

    .br__content-counters-wrapper {

        height: auto;

        margin-top: 16px;

        padding: 0

    }

    .br__content-counters-wrapper::before {

        display: none

    }

    .br .br__tabs {

        margin-top: 32px

    }

    .br__reposition-controls {

        display: none;

        position: relative

    }

    .br__reposition-controls--mobile {

        display: block

    }

}



.br__onboarding-badge {

    left: 90px;

    position: absolute;

    top: -10px

}



.br .tab-interactive-active-ds .white-color-text-2 {

    color: #a0a0a1

}



.br .tabs-ds {

    column-gap: 48px

}



.br .tab-ds {

    margin: 0

}



@media screen and (max-width:1023px) {

    .br__onboarding-badge {

        left: 54px;

        top: -4px

    }

}



@media screen and (max-width:639px) {

    .br .tabs-ds {

        column-gap: 32px

    }

}



@media screen and (max-width:320px) {

    .br .tabs-ds {

        column-gap: 24px

    }

}



.media-processing {

    align-items: center;

    display: flex;

    flex-direction: column;

    left: 50%;

    position: absolute;

    top: 200px;

    transform: translateX(-50%);

    z-index: 5

}



@media screen and (max-width:1023px) {

    .media-processing {

        top: 32%

    }

}



.media-processing .loader-text {

    color: #fff;

    margin-top: 10px;

    max-width: 210px;

    opacity: .6;

    text-align: center

}



.tab-ds,

.tabs-ds {

    align-items: center;

    display: flex

}



.tabs-ds {

    border-bottom: 1px solid rgba(255, 255, 255, .13);

    margin: 0;

    position: relative

}



.tab-ds {

    background: 0 0;

    border: 0;

    color: rgba(255, 255, 255, .6);

    justify-content: center;

    list-style-type: none;

    margin: 0 28px;

    outline: 0;

    overflow: visible;

    -webkit-user-select: none;

    user-select: none

}



.tab-ds:first-child {

    margin-left: 0

}



.tab-ds:last-child {

    margin-right: 0

}



.personal-notifications-modal-panel .header-notifications-action a,

.tab-ds:hover {

    color: rgba(255, 255, 255, .8)

}



@media (max-width:639px) {

    .tab-ds--adaptive {

        flex: 1;

        margin: 0

    }



}



.tab-interactive-ds {

    align-items: center;

    display: flex;

    position: relative

}



.tab-interactive-medium-ds,

.tab-interactive-small-ds {

    font-weight: 400;

    letter-spacing: normal;

    line-height: normal

}



.tab-interactive-small-ds {

    font-size: 13px;

    margin-right: 30px;

    padding: 9px 0

}



.tab-interactive-medium-ds {

    font-size: 15px;

    height: 50px;

    padding: 0 0 12px

}



.tab-interactive-active-ds {

    color: #fff

}



.tab-interactive-active-ds:active,

.tab-interactive-active-ds:focus,

.tab-interactive-active-ds:hover {

    color: #fff

}



.tab-interactive-active-ds::after {

    background: var(--primary-border);

    border-radius: 3px;

    bottom: -1px;

    content: "";

    height: 3px;

    left: 0;

    position: absolute;

    width: 100%

}



.tab-link-ds {

    flex: 1;

    justify-content: center

}



.tab-link-ds,

.tab-link-ds:active,

.tab-link-ds:hover {

    text-decoration: none

}



.tab-link-ds:focus {

    text-decoration: inherit

}





.br__stories {

    margin: 0 auto;

    max-width: 100vw;

    padding: 0 16px;

    position: relative;

    width: 742px;

    padding: 0;

}



.br__name-wrapper {

    margin-top: 16px

}



.br__name-wrapper .displayname__name {

    word-break: break-word

}



.br__username {

    color: #fff;

    opacity: .6;

    font-size: 16px;

}



.br__avatar-wrapper {

    position: relative;

    width: 124px;

    z-index: 4

}



.br__profile-counters {

    color: rgba(255, 255, 255, .8);

    font-weight: 400;

    margin-top: 20px;

    opacity: .8;

    font-size: 1rem

}



.br__content-counters-wrapper {

    align-items: center;

    box-sizing: border-box;

    display: flex;

    height: 72px;

    justify-content: space-between;

    margin-top: 40px;

    padding: 7px 16px;

    position: relative;

    width: 100%;

    z-index: 5

}



.br__content-counters-wrapper::before {

    backdrop-filter: blur(38px);

    background: rgba(255, 255, 255, .05);

    border-radius: 20px;

    bottom: 0;

    content: "";

    left: 0;

    pointer-events: none;

    position: absolute;

    top: 0;

    width: 100%

}



.br__actions {

    display: flex;

    position: relative;

    width: 100%

}



.br .dropdown-content {

    padding: 4px 0

}



.br__tabs.tabs-ds {

    border-color: 1px solid rgba(255, 255, 255, .08);

    justify-content: center;

    margin: 44px 0 0;

    white-space: nowrap;

    width: 100%;

    z-index: 1

}



.br__tabs.tabs-ds::after,

.br__tabs.tabs-ds::before {

    background: rgba(255, 255, 255, .08);

    content: "";

    height: 1px;

    pointer-events: none;

    position: absolute;

    top: 100%;

    width: 1200px

}



.br__tabs.tabs-ds::before {

    box-sizing: border-box;

    right: 100%

}



.br__tabs.tabs-ds::after {

    left: 100%

}



.br__content-counters-wrapper--mobile {

    align-items: center;

    backdrop-filter: blur(10px);

    background: rgba(0, 0, 0, .2);

    border-radius: 20px;

    display: flex;

    padding: 14px 16px;

    position: absolute;

    right: 80px;

    top: 60px;

    z-index: 1

}



@media screen and (max-width:1023px) {

    .br__content-counters-wrapper--mobile {

        right: 15px

    }

}



@media (max-width:1079px) {

    .br__media--shadow::after {

        background: linear-gradient(0deg, #050506 0, rgba(5, 5, 6, .9) 24%, rgba(5, 5, 6, .75) 40%, rgba(5, 5, 6, .5) 60%, rgba(5, 5, 6, 0) 100%)

    }

    .br__avatar-wrapper {

        width: 80px

    }

    .br__avatar-wrapper .avatar {

        height: 100px;

        min-width: 100px;

        width: 100px

    }

    .br__name-wrapper {

        align-items: flex-start;

        flex-direction: column

    }

    .br__username {

        margin-left: 0

    }

    .br .displayname.displayname--big .displayname__name {

        font-size: 1.75rem

    }

    .br__profile-counters {

        font-size: .875rem

    }

    .br__content-counters-wrapper {

        height: auto;

        margin-top: 16px;

        padding: 0

    }

    .br__content-counters-wrapper::before {

        display: none

    }

    .br .br__tabs {

        margin-top: 32px

    }

    .br__reposition-controls {

        display: none;

        position: relative

    }

    .br__reposition-controls--mobile {

        display: block

    }

}



.br__onboarding-badge {

    left: 90px;

    position: absolute;

    top: -10px

}



.br .tab-interactive-active-ds .white-color-text-2 {

    color: #a0a0a1

}



.br .tabs-ds {

    column-gap: 48px

}



.br .tab-ds {

    margin: 0

}



@media screen and (max-width:1023px) {

    .br__onboarding-badge {

        left: 54px;

        top: -4px

    }

}



@media screen and (max-width:639px) {

    .br .tabs-ds {

        column-gap: 32px

    }

}



@media screen and (max-width:320px) {

    .br .tabs-ds {

        column-gap: 24px

    }

}



.media-processing {

    align-items: center;

    display: flex;

    flex-direction: column;

    left: 50%;

    position: absolute;

    top: 200px;

    transform: translateX(-50%);

    z-index: 5

}



@media screen and (max-width:1023px) {

    .media-processing {

        top: 32%

    }

}



.media-processing .loader-text {

    color: #fff;

    margin-top: 10px;

    max-width: 210px;

    opacity: .6;

    text-align: center

}

.br__progress-title {

    align-items: center;

    display: flex;

    font-size: 14px;

    gap: 4px;

    justify-content: space-between;

    margin: 0 0 10px;

    text-shadow: 0 1px 20px rgba(0, 0, 0, 0.2);

}

.br__title-text {

    color: #cfcfd0;

    font-weight: 500;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.br__left {

    display: flex;

    flex: 1;

    flex-direction: column;

    justify-content: center;

    max-width: calc(100% - 56px);

}

.bx {

    color: #707071;

    column-gap: 24px;

    display: flex;

    flex-wrap: wrap;

    margin: 20px 0 0;

    overflow: hidden;

    row-gap: 10px;

}

.bx__item {

    align-items: center;

    column-gap: 6px;

    display: flex;

    font-size: 16px;

    font-weight: 500;

    position: relative;

}

.bx__item::after {

    background: rgba(255, 255, 255, 0.2);

    border-radius: 50%;

    content: "";

    height: 4px;

    left: -13px;

    position: absolute;

    width: 4px;

}

.bx__link {

    color: #a0a0a1;

}

.bx__link:hover {

    color: #cfcfd0;

}

.bv {

    position: relative;

}

.bv__tooltip {

    width: 145px;

}

.bv__tooltip .tooltip-inner {

    display: flex;

    flex-direction: column;

}

.bv__button {

    align-items: center;

    background: #111113;

    border: 0;

    border-radius: 12px;

    color: #fff;

    cursor: pointer;

    display: flex;

    font-weight: 500;

    gap: 12px;

    height: 40px;

    justify-content: center;

    padding: 11px 20px;

    transition: background 0.3s;

    width: 100%;

}

.bv__button:hover {

    background: #232325;

}

@media screen and (max-width: 767px) {

    .bv__button {

        padding: 11px;

    }

}

.bv__action {

    align-items: center;

    background: 0 0;

    border: 0;

    color: rgba(255, 255, 255, 0.8);

    cursor: pointer;

    display: flex;

    font-size: 14px;

    font-weight: 400;

    line-height: 20px;

    min-height: 38px;

    padding: 7px 22px 7px 15px;

    transition: all ease 0.25s;

    white-space: nowrap;

    width: 145px;

}

.bv__action .icon {

    fill: rgba(255, 255, 255, 0.8);

    margin-right: 10px;

}

.bv__action.profile-cover-dropdown__action--active,

.bv__action:hover {

    background: #343437;

    color: #fff;

}

.text-post-tile {

    position: relative;

}

.text-post-live-preview {

    position: absolute;

    right: 12px;

    top: 12px;

    width: 25%;

    z-index: 1;

}

.text-post-live-preview + .tile-header {

    max-width: calc(75% - 12px);

}

.text-post {

    border-radius: 12px 12px 0 0;

    overflow: hidden;

    position: relative;

}

.text-post--own-single-text {

    padding-top: 40px;

}

@media screen and (min-width: 640px) {

    .text-post--own-single-text .feed__post-label {

        left: 0;

    }

}

.text-post.locked {

    min-height: 300px;

}

.text-post .text {

    color: #9b9b9b;

    font-size: 15px;

    line-height: 20px;

    margin: 20px 0 0;

    padding: 0;

    text-align: left;

    letter-spacing: .021rem;

}

.text-post .text.hidden-text {

    filter: blur(3px);

    pointer-events: none;

    -webkit-user-select: none;

    user-select: none;

}

.text-post .image-skeleton {

    animation: skeleton-animation 3s infinite linear;

    background: linear-gradient(90deg, #383838 20%, #404040 28%, #454545 35%, #404040 42%, #383838 50%);

    background-size: 300% 100%;

    will-change: background-position;

    height: 256px;

    width: 642px;

}

.close-icon {

    color: rgba(248, 248, 248, 0.6);

    cursor: pointer;

    margin: 0;

    pointer-events: initial;

    transition: color 0.05s ease-in-out;

}

.close-icon:hover {

    color: rgba(248, 248, 248, 0.88);

}

.close-icon-small {

    height: 20px;

    padding: 4px;

    width: 20px;

}

.close-icon-medium {

    height: 24px;

    width: 24px;

}

.close-icon-large {

    height: 28px;

    width: 28px;

}

.close-button-ds {

    background: 0 0;

    border: 0;

    color: #a0a0a1;

    cursor: pointer;

    padding: 4px;

}

.payout-settings-info-alert.payout-settings-info-alert {

    font-size: 14px;

    font-weight: 400;

    letter-spacing: normal;

    line-height: normal;

    margin-top: 7px;

    padding: 10px;

}

.bH {

    align-items: center;

    border-radius: 12px;

    column-gap: 20px;

    display: flex;

    justify-content: center;

    margin: 20px 0;

    min-height: 108px;

    overflow: hidden;

    padding: 20px 10px;

}

.bH--style--dark {

    background: #111113;

}

.bH--style--light {

    background: #232325;

}

.bH__content {

    column-gap: 40px;

    display: flex;

    flex-wrap: wrap;

    row-gap: 16px;

}

.bH__icon {

    height: 48px;

    max-width: 48px;

    position: relative;

    width: 48px;

}

.bH__icon::before {

    content: "";

    height: 192px;

    left: 50%;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

    width: 192px;

}

.bH__icon--style--done::before,

.bH__icon::before {

    background: radial-gradient(50% 50%at 50% 50%, rgba(46, 123, 230, 0.2) 0, rgba(27, 27, 29, 0) 100%);

}

.bH__icon--style--pending {

    color: #fccf49;

}

.bH__icon--style--pending::before {

    background: radial-gradient(50% 50%at 50% 50%, rgba(252, 207, 73, 0.1) 0, rgba(27, 27, 29, 0) 100%);

}

.bH__icon--style--failed {

    color: #d21b4c;

}

.bH__icon--style--failed::before {

    background: radial-gradient(50% 50%at 50% 50%, rgba(210, 27, 76, 0.2) 0, rgba(27, 27, 29, 0) 100%);

}

@media (max-width: 479px) {

    .bH {

        align-items: flex-start;

        justify-content: flex-start;

    }

}

.photo-album-tile {

    position: relative;

}

.photo-album-live-preview {

    position: absolute;

    right: 12px;

    top: 12px;

    width: 25%;

    z-index: 1;

}

.photo-album-live-preview + .tile-header {

    max-width: calc(75% - 12px);

}

.photo-album {

    display: flex;

    height: 100%;

    width: 100%;

}

.photo-album.photo-loading .photo-wrapper {

    animation: skeleton-animation 3s infinite linear;

    background: linear-gradient(90deg, #383838 20%, #404040 28%, #454545 35%, #404040 42%, #383838 50%);

    background-size: 300% 100%;

    will-change: background-position;

}

.photo-album,

.photo-album__swiper {

    position: relative;

}

.photo-album .photo {

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    height: 100%;

    width: 100%;

}

.photo-album .counter-wrapper {

    background-color: rgba(0, 0, 0, 0.6);

    border-radius: 8px;

    bottom: 16px;

    padding: 16px;

    position: absolute;

    right: 16px;

}

@media screen and (max-width: 639px) {

    .photo-album .counter-wrapper {

        bottom: 8px;

        padding: 8px;

        right: 8px;

    }

}

.photo-album .counter {

    color: #fff;

    font-size: 28px;

    font-weight: 700;

}

@media screen and (max-width: 639px) {

    .photo-album .counter {

        font-size: 12px;

    }

}



.island-value-link {

    background: #2e2e30;

    border-radius: 10px;

    display: block;

    padding: 6px 12px;

    width: 100%;

}

.island-value-link:hover {

    background: #343437;

    text-decoration: none;

}

.island-value-link__content {

    align-items: center;

    display: flex;

    justify-content: space-between;

    min-height: 30px;

}

.island-value-link__name,

.island-value-link__value {

    align-items: center;

    color: #cfcfd0;

    display: flex;

    font-size: 15px;

    font-weight: 500;

}

.island-value-link__value {

    color: #a349fc;

    font-size: 18px;

}

.island-value-link__bottom {

    font-size: 12px;

    line-height: 16px;

    margin: 4px 0 0;

}



.settings-island {

    background-color: #1b1b1d;

    border-radius: 12px;

    margin-bottom: 20px;

}

.settings-island--grow {

    flex: 1;

    height: 100%;

}

.settings-island__sub-title {

    align-items: center;

    display: flex;

    font-size: 20px;

    font-weight: 700;

    gap: 8px;

    justify-content: flex-start;

    margin-bottom: 10px;

}

.settings-island__add-request {

    display: flex;

}

.settings-island__add-request-button {

    flex: 1;

}

.settings-island__add-request-icon {

    margin-right: 12px;

}

.settings-island-title-wrapper--size--medium {

    padding: 12px 22px 0;

}

.settings-island-title-wrapper--size--big {

    padding: 22px;

}

.settings-island-title-wrapper .settings-island-title {

    font-size: 1rem;

}

.settings-island-title-wrapper--line {

    border-bottom: 2px solid rgba(255, 255, 255, 0.05);

}

.settings-island-title-wrapper .settings-island-icon {

    color: #fff;

    fill: #fff;

    margin-right: 16px;

}

.settings-island-content {

    padding: 20px;

}

.settings-island:last-child {

    margin-bottom: 0;

}

.settings-island.settings-island-locked > .settings-island-content {

    padding-top: 5px;

    text-align: center;

}

.settings-island > .settings-island-title-wrapper {

    align-items: center;

    overflow: hidden;

    position: relative;

    text-overflow: ellipsis;

    display: flex;

    flex-direction: row;

}

.settings-island > .settings-island-title-wrapper > .settings-island-title {

    margin-bottom: 0;

    overflow: hidden;

    text-overflow: ellipsis;

    vertical-align: middle;

    white-space: nowrap;

}

.settings-island > .settings-island-content {

    position: relative;

    width: 100%;

}

.settings-island .settings-island-tooltip {

    display: inline-block;

    margin-left: 10px;

}

.settings-island .settings-island-tooltip-icon {

    color: #9b9b9b;

}

.settings-island .radio-container {

    margin-bottom: 10px;

}

.settings-island-title__additional {

    position: absolute;

    right: 22px;

    top: 20px;

}

.settings-title-email {

    display: inline-block;

    font-size: 13px;

    vertical-align: middle;

}

.settings-title-email-status {

    display: inline-block;

    margin: 0 10px;

}

.settings-title-email-status__report-icon {

    color: #fccf49;

}

.settings-title-email-status > .icon {

    margin-bottom: 5px;

}

.settings-title-email-status > .badge-alert-medium {

    display: inline-block;

}

.settings-title-email.confirmed {

    color: #41bea6;

}

.settings-title-email.confirmed .icon {

    fill: #41bea6;

}

.settings-island-content-button-container {

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    padding-top: 10px;

}

.settings-island-content-button-container > .btn {

    

}

.cf__content {

    color: #a0a0a1;

    font-size: 13px;

}

.cf__input-wrapper {

    margin-top: 20px;

}

.cf__input.input::placeholder {

    color: #707071;

}

.circle-progress {

    display: block;

    height: 100%;

    position: relative;

    width: 100%;

}

.circle-progress-border {

    border: 1px solid #515151;

    border-radius: 50%;

    bottom: 0;

    left: 0;

    pointer-events: none;

    position: absolute;

    right: 0;

    top: 0;

}

.circle-progress-svg {

    height: 100%;

    pointer-events: none;

    width: 100%;

}

.circle-progress-circle {

    fill: none;

    stroke: currentColor;

    stroke-dasharray: 314%;

    stroke-linecap: round;

    transform-origin: center;

}

.user-tags-list {

    display: flex;

    flex-direction: column;

    padding-top: 8px;

}

.user-tags-list--mobile .user-tags-list__list {

    max-height: 60vh;

    width: 100%;

}

.user-tags-list__header {

    color: #707071;

    font-size: 11px;

    font-weight: 500;

    line-height: 13px;

    padding: 10px 18px;

    text-transform: uppercase;

}

.user-tags-list__list {

    flex-grow: 1;

    max-height: 320px;

    max-width: 100%;

    min-height: 300px;

    width: 320px;

}

.user-tags-list__list-item {

    align-items: center;

    display: flex;

    justify-content: space-between;

    padding: 8px 18px;

}

.user-tags-list__list-item:hover {

    background-color: #424248;

}

.guest-header-menu__login-buttons button :not(:last-child),

.user-tags-list__list-item:not(:last-child) {

    margin-bottom: 16px;

}

.documents-page {

    margin-bottom: 20px;

}

.documents-page__form-error {

    font-size: 12px;

    margin: 6px 0 0;

}

.documents-page .submit-block {

    padding: 20px;

    text-align: center;

}

.documents-page__field-notice {

    background: #232325;

    border-radius: 12px;

    color: #a0a0a1;

    display: flex;

    gap: 8px;

    line-height: 140%;

    margin: 20px 0 10px;

    padding: 12px 16px;

}

.documents-page .message {

    border-radius: 4px;

    display: flex;

    margin-top: 20px;

    padding: 10px 20px;

    font-size: 0.875rem;

}

.documents-page .message .message__icon {

    margin-right: 10px;

    font-size: 1.25rem;

}

.documents-page .message.message--success {

    background-color: #1b1b1d;

    color: #fff;

}

.documents-page .message.message--success .message__icon {

    fill: #078a36;

}

.documents-page .message.message--info {

    background-color: #6f8643;

}

.documents-page .message.message--danger .message__icon,

.documents-page .message.message--info .message__icon {

    fill: #fff;

}

.documents-page .message.message--danger {

    background-color: #9a272b;

}

.documents-page__accent-button {

    align-items: center;

    background: 0 0;

    border: 0;

    color: #ff3332;

    cursor: pointer;

    display: flex;

    gap: 6px;

    margin: 10px 0 12px;

    outline: 0;

}

.page-row {

    display: flex;

    gap: 20px;

    margin-top: 20px;

}

.guest-header-menu__login-buttons button,

.page-row__item {

    flex: 1;

}

@media screen and (max-width: 1023px) {

    .page-row {

        flex-direction: column;

    }

}

.agreement-block {

    align-items: center;

    background: #1b1b1d;

    border: 0;

    border-radius: 12px;

    color: #fff;

    cursor: pointer;

    display: flex;

    font-size: 14px;

    justify-content: center;

    margin-top: 20px;

    min-height: 40px;

    padding: 4px 20px;

    text-align: center;

    width: 100%;

}

.agreement-block:hover {

    text-decoration: underline;

}

.guest-header-menu {

    position: relative;

}

.guest-header-menu__menu-button {

    align-items: center;

    color: #a0a0a1;

    cursor: pointer;

    display: flex;

    flex: 1;

    height: 100%;

    justify-content: center;

    transition: color 150ms linear;

    width: 56px;

}

.guest-header-menu__menu-button--active {

    color: #fff;

}

.guest-header-menu__dropdown-wrapper {

    animation: opacity-fade-show 0.2s forwards;

    border-radius: 16px;

    left: auto;

    max-height: calc(100vh - 100px - var(--pwa-notification-height) - var(--tap-bar-height) / 2);

    overflow: auto;

    position: absolute;

    right: 8px;

    top: calc(100% + 8px);

    z-index: 201;

}

.guest-header-menu__dropdown-content {

    margin: 0;

    min-width: 300px;

    padding: 16px 0;

}

.guest-header-menu__login-buttons {

    display: flex;

    padding: 0 24px;

}

.guest-header-menu__menu-item {

    position: relative;

}

.guest-header-menu__menu-item > a {

    align-items: center;

    color: rgba(255, 255, 255, 0.8);

    display: flex;

    font-size: 15px;

    font-weight: 500;

    line-height: 42px;

    padding: 0 24px;

    text-decoration: none;

    text-overflow: ellipsis;

}

.guest-header-menu__menu-item__icon {

    height: 24px;

    margin-right: 20px;

    width: 24px;

}

.guest-header-menu__menu-item--split {

    margin-top: 16px;

    padding-top: 16px;

}

.guest-header-menu__menu-item--split::before {

    background: rgba(255, 255, 255, 0.1);

    content: "";

    height: 1px;

    left: 18px;

    position: absolute;

    right: 18px;

    top: 0;

}

.guest-header-menu--theme--purple .guest-header-menu__dropdown-content {

    background: #290e3f;

}

.guest-header-menu--theme--purple .guest-header-menu__menu-item > a:hover {

    background: #3f2753;

    color: #fff;

}

.guest-header-menu--theme--purple .guest-header-menu__menu-button--active {

    background: #3f2753;

}

.guest-header-menu--theme--dark .guest-header-menu__dropdown-content {

    background: #111113;

}

.guest-header-menu--theme--dark .guest-header-menu__menu-item > a:hover {

    background: #343437;

    color: #fff;

}

.guest-header-menu--theme--dark .guest-header-menu__menu-button--active {

    background: #343437;

}

.guest-header-menu__banner {

    cursor: pointer;

    padding: 0 20px;

}

.be {

    left: -2px;

    margin: 6px 0 0;

    position: absolute;

    right: -2px;

    top: 100%;

}

.be--landing {

    z-index: 11;

}

.be--compact {

    left: 0;

    margin: 2px 0 0;

    right: 0;

}

.be__empty {

    color: #707071;

    font-size: 13px;

    font-weight: 500;

    line-height: 16px;

    margin: 20px 0;

    text-align: center;

}

.be__sub-title {

    color: #707071;

    font-size: 11px;

    margin: 20px 16px 10px;

    text-transform: uppercase;

}

.be__title-link {

    text-transform: none;

}

.be__button {

    margin: 0 10px 10px;

    width: calc(100% - 20px);

}

.be__verify {

    align-items: center;

    background: #232325;

    border-radius: 10px;

    display: flex;

    gap: 12px;

    margin: 20px 16px;

    padding: 8px 12px;

}

.bL {

    display: grid;

    grid-gap: 10px;

}

.bL--squad {

    grid-gap: 2px;

}

.bL__item--squad {

    position: relative;

}

.bL__item--squad > .a {

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

}

.bL__item--squad::before {

    content: "";

    display: block;

    padding-top: 100%;

}

.bI {

    --grid-item-size: 100px;

    margin-bottom: 20px;

    width: 100%;

}

.bI:hover .bI__content {

    background-color: #343437;

}

.bI--stub {

    background-color: #232325;

    border-radius: 16px;

    min-height: 140px;

}

@media screen and (max-width: 639px) {

    .bI--stub {

        min-height: 160px;

    }

}

.bI__content {

    align-items: center;

    background-color: #1b1b1d;

    border-radius: 16px;

    display: flex;

    gap: 12px;

    justify-content: space-between;

    min-height: 140px;

    overflow: hidden;

    padding: 20px 20px 20px 40px;

}

@media screen and (max-width: 1023px) {

    .bI__content {

        padding: 20px;

    }

}

@media screen and (max-width: 639px) {

    .bI__content {

        align-items: flex-start;

        flex-direction: column;

        gap: 16px;

        padding: 12px 0 12px 16px;

    }

}

.bI__hashtag {

    color: #fff;

    font-size: 40px;

    font-weight: 700;

    margin: 0;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

@media screen and (max-width: 639px) {

    .bI__hashtag {

        font-size: 18px;

    }

}

.bI__hashtag-info {

    align-items: center;

    display: flex;

    gap: 8px;

}

.bI__posts-counter {

    color: #a0a0a1;

    font-size: 16px;

    font-weight: 400;

}

.bI__left-part {

    flex: 0 1 390px;

    max-width: 30%;

}

@media screen and (max-width: 639px) {

    .bI__left-part {

        flex: 1;

        max-width: 100%;

    }

}

.bI__right-part {

    display: grid;

    flex: 1;

    grid-auto-flow: column;

    grid-auto-rows: 0;

    grid-gap: 20px;

    grid-template-rows: var(--grid-item-size);

    justify-content: end;

    overflow-y: hidden;

}

@media screen and (max-width: 1023px) {

    .bI__right-part {

        --grid-item-size: 80px;

    }

}

@media screen and (max-width: 639px) {

    .bI__right-part {

        grid-auto-flow: unset;

        grid-gap: 10px;

        grid-template-columns: repeat(5, var(--grid-item-size));

        justify-content: start;

        overflow: hidden;

        width: 100%;

    }

}

.bI__media-container {

    display: grid;

    width: var(--grid-item-size);

}

@media screen and (min-width: 480px) {

    .bI__media-container--with-cover {

        width: calc(var(--grid-item-size) + 34px);

    }

}

.bI__cover {

    align-items: center;

    background: linear-gradient(0deg, rgba(35, 35, 37, 0.8), rgba(35, 35, 37, 0.8));

    bottom: 0;

    color: #fff;

    display: flex;

    font-size: 14px;

    font-weight: 500;

    justify-content: center;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

}

.bI__top-right-block-icon {

    height: 24px;

    pointer-events: none;

    position: absolute;

    right: 8px;

    top: 8px;

    width: 24px;

}

.a {

    align-items: flex-end;

    background: #424248;

    border-radius: 16px;

    display: flex;

    height: 314px;

    max-height: 100%;

    min-height: 100%;

    overflow: hidden;

    padding: 12px;

    position: relative;

    transform: translateZ(0);

    -webkit-user-select: none;

    user-select: none;

}

.a--squad {

    border-radius: 2px;

}

.a--hover:hover > .a__cover--image {

    transform: scale(1.2);

}

.a--live-stream:hover {

    transform: scale(1.1);

    z-index: 99;

    box-shadow: 0 0 25px 2px #000;

}

.a--live-stream:hover > .a__controls {

    display: none;

}

.a--hover:hover .avatar {

    border-color: rgba(255, 255, 255, 0.6);

}

.a--hover:hover .avatar:hover {

    border-color: #fff;

}

.a--hover:hover .a__description {

    opacity: 1;

    transform: translateY(0);

}

.a--clickable {

    cursor: pointer;

}

.a--bordered::before {

    border: 3px solid #ff3332;

    border-radius: inherit;

    bottom: 0;

    content: "";

    left: 0;

    pointer-events: none;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 1;

}

.a__controls {

    align-items: center;

    bottom: 6px;

    color: rgba(255, 255, 255, 0.8);

    display: flex;

    gap: 12px;

    left: 8px;

    position: absolute;

    z-index: 2;

}

.a__comments:hover,

.a__controls > .likes-counter:hover {

    color: #fff;

}

.a__comments {

    align-items: center;

    background: 0 0;

    border: 0;

    color: rgba(255, 255, 255, 0.8);

    cursor: pointer;

    display: flex;

    font-weight: 700;

    gap: 5px;

    padding: 2px;

}

.a__cover {

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

}

.a__cover--image {

    object-fit: cover;

    object-position: center;

    transition: transform 0.3s;

}

.a__followers {

    align-items: center;

    color: rgba(255, 255, 255, 0.7);

    display: flex;

    font-size: 12px;

    margin: 2px 0 0;

}

.a__top-right-block {

    pointer-events: none;

    position: absolute;

    right: 8px;

    top: 8px;

    z-index: 1;

}

.a__top-right-block-icon {

    color: rgba(255, 255, 255, 0.8);

    height: 24px;

    width: 24px;

}

@media screen and (max-width: 639px) {

    .a__top-right-block-icon {

        height: 16px;

        width: 16px;

    }

}

.a__bottom-shadow {

    background: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, 0.3) 100%);

    border-bottom-left-radius: 16px;

    border-bottom-right-radius: 16px;

    bottom: 0;

    height: 56px;

    left: 0;

    pointer-events: none;

    position: absolute;

    right: 0;

    z-index: 1;

}

.a__download {

    background: #232325;

    border-radius: 4px;

    cursor: pointer;

    left: 10px;

    position: absolute;

    top: 10px;

    transform: rotate(90deg);

}

.a--top-shadow::before {

    background: linear-gradient(180deg, rgba(0, 0, 0, 0.4) 0, transparent 100%);

    content: "";

    height: 60px;

    left: 0;

    pointer-events: none;

    position: absolute;

    top: 0;

    width: 100%;

    z-index: 1;

}

.a__top-avatar {

    left: 8px;

    position: absolute;

    right: 40px;

    top: 8px;

    z-index: 1;

}

.a__description {

    align-items: flex-end;

    background: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, 0.6) 100%);

    bottom: 0;

    display: flex;

    filter: drop-shadow(0 1px 10px rgba(0, 0, 0, 0.4));

    height: 200px;

    left: 0;

    opacity: 0;

    padding: 0 8px 40px;

    pointer-events: none;

    position: absolute;

    right: 0;

    transform: translateY(30px);

    transition: transform 150ms ease, opacity 100ms ease;

    z-index: 1;

}

.a__description-text {

    -webkit-box-orient: vertical;

    color: rgba(255, 255, 255, 0.8);

    display: -webkit-box;

    font-size: 14px;

    font-weight: 400;

    -webkit-line-clamp: 2;

    overflow: hidden;

    word-break: break-all;

}

.a__description-link {

    color: rgba(255, 255, 255, 0.8);

}

.textarea-autosize-wrapper {

    position: relative;

    width: 100%;

}

.textarea-autosize-wrapper .textarea-autosize {

    display: block;

    overflow: hidden;

    resize: none;

    width: 100%;

}

.textarea-autosize-wrapper .textarea-autosize[disabled] {

    cursor: not-allowed;

    opacity: 0.4;

}

.textarea-autosize-wrapper .textarea-autosize__counter {

    bottom: 6px;

    font-size: 10px;

    opacity: 0.6;

    pointer-events: none;

    position: absolute;

    right: 6px;

}

.textarea-autosize-wrapper .textarea-autosize__error {

    color: #fd3a5b;

    display: block;

    font-size: 12px;

    margin: 4px 0 0;

}

.cA {

    align-items: center;

    border-bottom: 1px solid rgba(255, 255, 255, 0.05);

    display: flex;

    justify-content: space-between;

    min-height: 72px;

    padding: 20px;

}

.cA__left {

    align-items: center;

    display: flex;

    max-width: 100%;

    min-height: 42px;

}

.cA__inner-title {

    align-items: center;

    display: flex;

    gap: 20px;

    margin: 0 0 40px;

}

.cA__inner-title-text {

    font-size: 24px;

    font-weight: 600;

}

.cA__back {

    align-items: center;

    background: #343437;

    border-radius: 50%;

    color: #fff;

    cursor: pointer;

    display: flex;

    height: 24px;

    justify-content: center;

    margin: 0 22px 0 0;

    padding: 0 2px 0 0;

    width: 24px;

}

.cA__inner-title-left-icon {

    height: 64px;

    width: 64px;

}

.cA__icon {

    padding: 0 22px 0 0;

}

@media (max-width: 479px) {

    .cA__inner-title {

        align-items: center;

        flex-direction: column;

    }

    .cA__inner-title-text {

        text-align: center;

    }

}

.cFF {

    background: #5f5f67;

    border-radius: 6px;

    height: 6px;

    overflow: hidden;

    position: relative;

}

.cFF__spinner {

    background: #67ed27;

    border-radius: 6px;

    box-shadow: 0 0 10px 2px #67ed27;

    height: 100%;

    position: relative;

    width: 10px;

}

.cc__checkbox-group {

    align-items: center;

    display: flex;

    gap: 24px;

}

.cc__checkbox-item {

    align-items: center;

    cursor: pointer;

    display: grid;

    grid-auto-flow: column;

    grid-column-gap: 12px;

    text-align: left;

}

.region-select__radio-buttons {

    align-items: flex-start;

    display: flex;

    flex-direction: column;

    justify-content: center;

}

.region-select .radio-check-block {

    background: 0 0;

}

.region-select .radio-check-block__header {

    padding: 0;

}

.region-select .radio-check-block__title {

    font-size: 14px;

}

.ce__wrapper {

    background: #232325;

    border-radius: 12px;

    padding: 20px;

}

.ce__title {

    color: #707071;

    font-size: 12px;

    font-weight: 400;

    margin-bottom: 10px;

    text-transform: uppercase;

}

.ce__header {

    align-items: center;

    display: flex;

    flex: 1;

}

.ce__actions {

    align-items: center;

    display: flex;

    flex-wrap: wrap;

    gap: 12px;

    justify-content: flex-start;

}

.ce__device {

    align-items: center;

    column-gap: 12px;

    display: flex;

    flex: 1;

    flex-wrap: wrap;

    justify-content: space-between;

    margin-left: 12px;

}

.ce__browser,

.ce__country {

    color: #a0a0a1;

    font-size: 12px;

    font-weight: 400;

    line-height: 150%;

}

.ce__country {

    color: #707071;

}

.ce__verified {

    align-items: center;

    color: #21b062;

    display: flex;

    font-size: 12px;

    font-weight: 700;

    gap: 6px;

    padding: 0 0 12px;

}

.ce__button-content {

    align-items: center;

    display: flex;

    gap: 12px;

}

.ca {

    display: flex;

    min-height: 460px;

}

.ca__controls {

    flex: 1;

}

.ca__preview {

    display: flex;

    flex-direction: column;

    margin-left: 20px;

    max-width: 100%;

    width: 418px;

}

@media screen and (max-width: 1023px) {

    .ca {

        display: block;

    }

    .ca__controls {

        margin-bottom: 20px;

    }

    .ca__preview {

        margin-left: 0;

    }

}

.tile-list-item {

    align-items: center;

    background: #343437;

    border-radius: 12px;

    display: flex;

    justify-content: center;

    padding: 22px;

    position: relative;

    transition: background 250ms;

    width: 100%;

}

.tile-list-item__icon {

    opacity: 0;

    position: absolute;

    right: 20px;

    transition: opacity 250ms;

}

.tile-list-item:hover {

    background: #5f5f67;

}

.tile-list-item:hover .tile-list-item__icon {

    opacity: 1;

}

.model-uploader {

    display: flex;

    margin-top: 20px;

}

@media (max-width: 767px) {

    .model-uploader {

        flex-direction: column;

    }

}

.model-uploader .loading-image-wrapper {

    align-items: center;

    display: flex;

    justify-content: center;

    overflow: hidden;

}

.model-uploader .loading-image-wrapper > .bd {

    height: 172px;

    width: 172px;

}

.model-uploader .loading-image {

    background-color: #424242;

    border-radius: 8px;

    height: 160px;

    object-fit: cover;

    width: 190px;

}

.model-uploader .loading-image.loading {

    filter: blur(10px);

    transform: scale(1.1);

}

.model-uploader .inputs {

    flex: 1;

    margin-left: 24px;

}

@media (max-width: 767px) {

    .model-uploader .inputs {

        margin-left: 0;

        margin-top: 20px;

    }

}

.model-uploader .field-wrapper {

    align-items: center;

    display: flex;

    justify-content: space-between;

    margin-bottom: 12px;

}

.model-uploader .field-wrapper .input-wrapper {

    width: 80%;

}

@media (max-width: 767px) {

    .model-uploader .field-wrapper .input-wrapper {

        width: 100%;

    }

}

.model-uploader .field-wrapper > label {

    align-items: center;

    display: inline-flex;

    flex-flow: row;

    margin: 0;

}

.model-uploader .field-wrapper:last-child {

    margin-bottom: 0;

}

@media (max-width: 767px) {

    .model-uploader .field-wrapper {

        align-items: flex-start;

        flex-direction: column;

    }

}

.model-uploader .input {

    width: 80%;

}

.model-uploader .input.price-input {

    width: 100%;

}

@media (max-width: 767px) {

    .model-uploader .input {

        width: 100%;

    }

}

.model-uploader .video-icon-wrapper {

    align-items: center;

    background-color: #343437;

    border-radius: 8px;

    display: flex;

    height: 160px;

    justify-content: center;

    width: 190px;

}

.model-uploader .video-icon {

    height: 70px;

    margin: 0;

    width: 70px;

}

.model-uploader .uploading-video {

    margin-bottom: 20px;

}

.model-uploader .video-name {

    font-size: 16px;

    font-weight: 700;

    margin-bottom: 10px;

}

.model-uploader .videos-list-item {

    cursor: default;

}

.model-uploader .videos-list-item .video-under-thumb {

    height: auto;

}

.model-uploader .videos-list-item .video-stats {

    display: none;

}

.model-uploader .albums-gallery-root {

    height: 150px;

    width: 150px;

}

.model-uploader .albums-gallery-root .albums-list-item {

    flex-basis: 100%;

    max-width: 100%;

    width: 100%;

}

.model-uploader .content-price-help {

    margin: 0 0 0 4px;

}

.upload-media-info-item {

    align-items: center;

    display: flex;

    grid-column-end: 6;

    grid-column-start: 2;

    position: relative;

}

.upload-media-info-item__content-line {

    position: absolute;

}

.upload-media-info-item__line {

    color: #fff;

    font-size: 13px;

    font-weight: 500;

    line-height: 18px;

}

.GG {

    align-items: center;

    display: grid;

    gap: 10px;

    grid-auto-flow: column;

    height: 100%;

    padding: 10px 20px;

}

.GG__footer-description {

    display: block;

    grid-column: 1/4;

}

.user-uploader {

    margin-top: 20px;

}

.user-uploader .content {

    position: relative;

}

.user-uploader .loader-wrapper {

    background: rgba(0, 0, 0, 0.4);

    left: 50%;

    padding: 10px 20px;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

    z-index: 3;

}

.user-uploader .loader-wrapper .loader {

    position: static;

    transform: none;

}

.user-uploader .loading-image-wrapper {

    align-items: center;

    background-color: #272727;

    display: flex;

    justify-content: center;

    overflow: hidden;

}

.user-uploader .loading-image {

    display: block;

    max-height: 50vh;

    max-width: 100%;

}

.user-uploader .loading-image.loading {

    filter: blur(20px);

}

.cC {

    max-width: 100%;

    width: 500px;

}

.cC__header {

    align-items: center;

    border-bottom: 1px solid rgba(255, 255, 255, 0.05);

    display: flex;

    gap: 20px;

    justify-content: start;

    min-height: 72px;

    padding: 20px;

}

.cC__content {

    padding: 20px;

}

.cC__input-wrapper {

    position: relative;

}

.cC__smiles-wrapper {

    bottom: 6px;

    position: absolute;

    right: 4px;

}

.cC__add-media-button {

    align-items: center;

    background: #343437;

    border-radius: 12px;

    color: #fff;

    cursor: pointer;

    display: flex;

    font-size: 12px;

    font-weight: 500;

    gap: 12px;

    grid-column: 1/6;

    height: 60px;

    justify-content: center;

    width: 100%;

}

.cC__add-media-button:active {

    transform: translateY(1px);

}

.search-input {

    position: relative;

}

.search-input__input.input {

    padding-left: 30px;

}

.search-input__with-right-block .search-input__input.input {

    padding-right: 30px;

}

.search-input__icon,

.search-input__right-content {

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    z-index: 1;

}

.search-input__icon {

    color: #a0a0a1;

    left: 12px;

}

.search-input__right-content {

    right: 12px;

}

.YY {

    border-radius: 12px;

    margin: 10px 0;

    padding: 12px 16px;

    position: relative;

}

.YY--selectable {

    cursor: pointer;

    padding-left: 51px;

}

.YY::before {

    border: 1px solid rgba(255, 255, 255, 0.1);

    border-radius: inherit;

    bottom: 0;

    content: "";

    left: 0;

    pointer-events: none;

    position: absolute;

    right: 0;

    top: 0;

    transition: background 0.3s, border 0.3s;

}

.YY--state--not-selected:hover::before {

    background: #232325;

    border-color: #49494a;

}

.YY--state--not-selected:hover .checkbox-ds__box {

    border-color: #a0a0a1;

}

.YY--state--selected {

    cursor: default;

}

.YY--state--selected::before {

    background: rgba(215, 13, 17, 0.1);

    border: 2px solid #d60908;

}

.YY__title {

    color: #fff;

    font-size: 16px;

    font-weight: 700;

    line-height: 22px;

    margin: 0 0 6px;

    position: relative;

}

.YY__description {

    color: #f8f8f8;

    font-size: 11px;

    font-weight: 500;

    line-height: 13px;

    opacity: 0.4;

}

.YY__discount {

    align-items: center;

    background: #d21b4c;

    border-radius: 6px;

    color: #fff;

    display: flex;

    font-size: 13px;

    font-weight: 700;

    height: 24px;

    padding: 0 8px;

    position: absolute;

    right: 14px;

    top: 10px;

}

.YY__discount--free {

    background: #21b062;

    text-transform: uppercase;

}

.YY__checkbox {

    left: 16px;

    position: absolute;

    top: 12px;

}

.bp {

    align-items: center;

    display: flex;

    flex: 1;

    gap: 20px;

    width: 100%;

}

.bp--style--default {

    background: #343437;

    border-radius: 10px;

    padding: 10px 12px;

}

.bp--style--default:hover {

    background: #424248;

}

.bp--style-light,

.settings-price-option-add__delete-button .a11y-button:hover {

    background-color: transparent;

}

.bp--size--small {

    padding: 6px 8px;

    white-space: normal;

}

.bp__stats {

    flex: 1;

}

.bp__progress {

    margin-top: 8px;

}

.bp__title2 {

    align-items: flex-end;

    display: flex;

    flex: 1;

    gap: 6px;

    justify-content: space-between;

}

.bp__title--size--small {

    align-items: center;

    font-size: 12px;

}

.bp__title--size--medium {

    font-size: 14px;

    font-weight: 500;

}

.bp__title--size--large {

    font-size: 16px;

    font-weight: 700;

}

.bp__percent {

    font-size: 24px;

    font-weight: 700;

}

.bp__percent--size--large {

    font-size: 40px;

}

.bp__percent--size--small {

    font-size: 12px;

}

.bp__percent--color--green {

    color: #21b062;

}

.bp__percent--color--yellow {

    color: #fccf49;

}

.bp__percent--color--red {

    color: #d21b4c;

}

.creators-onboarding-items-list {

    display: flex;

    flex-direction: column;

    gap: 20px;

    width: 100%;

}

.creators-onboarding-items-list--flat-list {

    gap: 10px;

}

.creators-onboarding-items-list__items-group {

    display: flex;

    flex-direction: column;

    gap: 20px;

    justify-content: flex-start;

    margin-bottom: 12px;

}

.creators-onboarding-items-list__items-group-header {

    color: #707071;

    font-size: 14px;

    font-weight: 500;

    text-transform: uppercase;

}

@media screen and (max-width: 767px) {

    .creators-onboarding-items-list__items-group {

        gap: 10px;

    }

}

.highlighted-element {

    animation: animation-element-highlighted;

    animation-duration: 3s;

    animation-timing-function: linear;

}

.creator-lists-editor-modal-content {

    display: flex;

    flex: 1;

    flex-direction: column;

    margin: 0 auto;

    max-width: 100%;

    min-height: 500px;

    overflow-y: auto;

    width: 500px;

}

.creator-lists-editor-modal-content__title {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.creator-lists-editor-modal-content__icon {

    padding: 0 22px 0 0;

}

.creator-lists-editor-modal-content__content {

    display: flex;

    flex: 1;

    flex-direction: column;

}

.creator-lists-editor-modal-content__form {

    height: 100%;

    padding: 20px;

}

.creator-lists-editor-modal-content__footer {

    align-items: center;

    display: flex;

    justify-content: flex-end;

    width: 100%;

}

.creator-lists-editor-modal-content__delete-button {

    margin-right: auto;

}

.creator-lists-editor-modal-content__submit-button {

    width: 140px;

}

.creator-lists-editor-modal-content__description-input,

.creator-lists-editor-modal-content__name-input {

    position: relative;

}

.creator-lists-editor-modal-content__name-input .chat-controls-input--style--single-line {

    padding: 8px 0 0;

}

.creator-lists-editor-modal-content__name-input .creator-lists-editor-modal-content__input-actions {

    border-radius: 0;

    padding: 0;

    top: 1px;

    width: 80px;

}

.creator-lists-editor-modal-content__description-input .creator-lists-editor-modal-content__input-actions {

    bottom: 8px;

}

.creator-lists-editor-modal-content__description-input .chat-controls-input--form {

    height: 44px;

}

.creator-lists-editor-modal-content__input-actions {

    align-items: center;

    background: #111113;

    bottom: 1px;

    display: grid;

    grid-auto-flow: column;

    grid-column-gap: 6px;

    justify-content: end;

    position: absolute;

    right: 8px;

}

.creator-lists-editor-modal-content__smiles-wrapper {

    position: relative;

}

.creator-lists-editor-modal-content__counter {

    color: #a0a0a1;

    font-size: 13px;

    font-weight: 500;

    pointer-events: none;

}

.creator-lists-editor-modal-content__counter--error {

    color: #fd3a5b;

}

.creator-lists-editor-modal-content__list-users {

    color: #707071;

    font-size: 14px;

    font-weight: 500;

    max-width: 194px;

    overflow: hidden;

    text-align: end;

    text-overflow: ellipsis;

    white-space: nowrap;

}

@media screen and (max-width: 424px) {

    .creator-lists-editor-modal-content__list-users {

        max-width: 160px;

    }

}

.cQ {

    position: absolute;

    transform: translateY(-50%) translateX(-50%);

}

.cQ--disabled {

    opacity: 0.8;

    pointer-events: none;

}

.cQ__dots {

    background: rgba(5, 5, 6, 0.4);

    border-radius: 4px;

    color: #707071;

    display: flex;

    height: 16px;

    justify-content: center;

    left: 50%;

    margin: 12px 0 0;

    opacity: 0;

    pointer-events: none;

    position: absolute;

    top: 100%;

    transform: translateX(-50%) translateY(-50%);

    transition: opacity 0.3s;

    width: 22px;

}

.cQ__dots--visible {

    cursor: grab;

    opacity: 1;

    pointer-events: auto;

}

.W {

    background: linear-gradient(0deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), radial-gradient(50% 408.16%at 50% 50%, #21b062 0, #9cb93d 100%);

    border-radius: 12px;

    color: #fff;

    min-height: 220px;

    padding: 20px 16px;

}

.W__title {

    color: rgba(255, 255, 255, 0.6);

    font-size: 12px;

    text-shadow: 0 1px 20px rgba(0, 0, 0, 0.2);

    text-transform: uppercase;

}

.W__goal-title {

    font-size: 16px;

    font-weight: 600;

    text-shadow: 0 1px 20px rgba(0, 0, 0, 0.2);

    word-break: break-word;

}

.W__title-result {

    font-size: 24px;

    font-weight: 700;

    margin: 16px 0 12px;

}

.W__price {

    color: #fff;

    font-size: 24px;

    font-weight: 700;

    height: 24px;

}

.W__amount {

    display: flex;

    font-size: 14px;

    gap: 4px;

    margin: 12px 0 0;

}

.W__amount-count {

    color: #fff;

    font-weight: 700;

}

.W__progress-title {

    align-items: flex-end;

    display: flex;

    justify-content: space-between;

    margin: 16px 0 4px;

}

.W__contributors {

    align-items: center;

    color: rgba(255, 255, 255, 0.6);

    display: flex;

    font-size: 13px;

    gap: 8px;

    margin: 8px 0 16px;

    text-shadow: 0 1px 20px rgba(0, 0, 0, 0.2);

}

.W__form {

    display: flex;

    gap: 12px;

}

.W__input {

    flex: 1;

}

.W__input input.input {

    background: rgba(255, 255, 255, 0.2);

    border: 2px solid transparent;

    color: #fff;

}

.W__input input.input:focus {

    background: rgba(255, 255, 255, 0.2);

    border-color: rgba(255, 255, 255, 0.4);

}

.W__input input.input.error {

    background: #f6d1db;

    border-color: #d21b4c;

    color: #d21b4c;

}

.W__input input.input.error::placeholder {

    color: rgba(210, 27, 76, 0.4);

}

.W__footer {

    color: rgba(255, 255, 255, 0.4);

    font-size: 12px;

    font-weight: 500;

    margin: 16px 0 0;

    text-align: center;

}

.W__success {

    padding: 24px 0 0;

    text-align: center;

}

.settings-price-option-add {

    display: flex;

    margin-bottom: 20px;

    padding: 16px 0;

}

.settings-price-option-add__prime-part {

    display: grid;

    gap: 16px;

    grid-template-columns: repeat(5, 1fr);

}

@media screen and (max-width: 639px) {

    .settings-price-option-add__prime-part {

        display: flex;

        flex-direction: column;

    }

}

.settings-price-option-add__prime-part .chat-controls-input::before {

    max-width: calc(100% - 16px);

    overflow: hidden;

    text-overflow: ellipsis;

}

.settings-price-option-add__left-part {

    display: grid;

    flex: 1;

    grid-gap: 16px;

    grid-template-columns: 1fr 1fr;

    grid-template-rows: 1fr;

    padding: 0 16px;

}

.settings-price-option-add__right-part {

    align-items: center;

    border-left: 1px solid rgba(255, 255, 255, 0.05);

    color: #707071;

    display: flex;

    flex-direction: column;

    justify-content: space-between;

    padding: 0 16px;

}

.settings-price-option-add__right-part--center {

    justify-content: center;

}

.settings-price-option-add__label {

    color: #fff;

    font-size: 12px;

    font-weight: 700;

    line-height: 16px;

    margin-bottom: 8px;

}

.settings-price-option-add__field-group {

    display: flex;

    gap: 16px;

}

.settings-price-option-add__field {

    display: block;

    flex: 1;

    text-align: left;

}

.settings-price-option-add__field .input {

    color: #fff;

    font-size: 13px;

}

.settings-price-option-add__field--title .chat-controls-input__wrapper--style--single-line {

    height: 40px;

}

.settings-price-option-add__field--title .chat-controls-input__wrapper-scroll {

    max-width: calc(100% - 80px);

}

.settings-price-option-add__field--description {

    grid-column-end: 3;

    grid-column-start: 1;

}

.settings-price-option-add__field--description .chat-controls-input {

    height: 44px;

}

.settings-price-option-add__title {

    position: relative;

}

.settings-price-option-add__title .input {

    padding-right: 58px;

}

.settings-price-option-add__dollar-icon {

    color: #707071;

    font-size: 14px;

}

.settings-price-option-add__length-counter {

    color: #a0a0a1;

    font-size: 12px;

    font-weight: 500;

    white-space: nowrap;

}

.settings-price-option-add__length-counter--error {

    color: #fd3a5b;

}

.settings-price-option-add__show-description-button {

    background: 0 0;

    border: 0;

    color: #707071;

    cursor: pointer;

}

.settings-price-option-add__show-description-button:hover {

    color: #fff;

}

.settings-price-option-add__active-checkbox,

.settings-price-option-add__show-description-button {

    align-items: center;

    display: flex;

    gap: 8px;

    justify-content: flex-start;

}

.settings-price-option-add__active-checkbox .switcher.small,

.settings-price-option-add__input-controls .smiles-dropdown {

    margin: 0;

}

.settings-price-option-add__drag-button {

    color: #707071;

    cursor: grab;

    user-select: none;

}

@media screen and (max-width: 639px) {

    .settings-price-option-add {

        flex-direction: column;

    }

    .settings-price-option-add__left-part {

        grid-template-columns: 1fr;

    }

    .settings-price-option-add__right-part {

        border-left: none;

        border-top: 2px solid rgba(255, 255, 255, 0.05);

        flex-direction: row;

        justify-content: space-between;

        margin-top: 16px;

        padding: 16px 16px 0;

    }

    .settings-price-option-add__delete-button {

        margin-left: auto;

    }

    .settings-price-option-add__field--description {

        grid-column-end: 2;

    }

}

.settings-price-option-add__input-controls {

    align-items: center;

    background: rgba(17, 17, 19, 0.8);

    display: flex;

    gap: 8px;

    position: absolute;

    right: 6px;

    top: 50%;

    transform: translateY(-50%);

}

.settings-price-option-add__input-controls--bottom {

    bottom: 6px;

    top: auto;

    transform: none;

}

.settings-price-option-add__reset-icon {

    color: #49494a;

    cursor: pointer;

    margin: 0 0 0-6px;

    padding: 4px;

}

.settings-price-option-add__reset-icon:hover {

    color: #a0a0a1;

}

.U {

    cursor: pointer;

    min-width: 160px;

    position: relative;

    width: 100%;

}

.U__label {

    align-items: center;

    color: #a0a0a1;

    cursor: pointer;

    display: flex;

    gap: 8px;

    height: 40px;

    justify-content: flex-start;

    width: 100%;

    -webkit-user-select: none;

    user-select: none;

}

.U__label:hover .date-picker__input:not(.date-picker__input--focus) {

    border-color: #49494a;

}

.U__input {

    background: #111113;

    border: 2px solid #111113;

    border-radius: 12px;

    color: #cfcfd0;

    font-size: 12px;

    height: 40px;

    padding: 8px 28px 8px 36px;

    pointer-events: none;

    text-overflow: ellipsis;

    width: 100%;

}

.U__input--focus,

.U__input:focus {

    border-color: #d60908;

}

.U__input--error {

    border-color: #fd3a5b;

    border-width: 1px;

    color: #fd3a5b;

}

.U__input::placeholder {

    color: rgba(223, 223, 223, 0.6);

}

.U__icon {

    position: absolute;

}

.U__icon--calendar {

    left: 14px;

}

.U__icon--arrow {

    right: 16px;

}

.U__native-datepicker {

    border: 0;

    border-radius: 12px;

    bottom: 0;

    left: 0;

    min-width: 100%;

    opacity: 0;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 1;

}

.U__calendar-wrapper {

    display: none;

    position: fixed;

    z-index: 500;

}

.U__calendar-wrapper--isVisible,

.searchable-head .icon-container:hover:after {

    display: block;

}

.bb {

    padding: 20px 20px 0;

    position: relative;

    word-break: break-all;

}

.bb--compact {

    display: flex;

}

.bb__avatar {

    display: block;

    height: 80px;

    margin: 20px 10px 16px 0;

    width: 80px;

}

.bb__avatar--size--small {

    height: 64px;

    width: 64px;

}

.bb__avatar--size--medium {

    height: 80px;

    width: 80px;

}

.bb__avatar > .avatar {

    height: inherit;

    width: inherit;

}

.bb__username {

    display: flex;

    position: relative;

}

.bb__cover {

    background-repeat: no-repeat;

    background-size: cover;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

}

.bb__cover--size--small {

    height: 84px;

}

.bb__cover--size--medium {

    height: 100px;

}

.bb__cover--size--large {

    height: 120px;

}

.bb__cover::before {

    background: linear-gradient(80.15deg, #000 0, rgba(0, 0, 0, 0.15) 100%);

    content: "";

    display: block;

    height: inherit;

}

.bb__cover--no-photo::before {

    background: radial-gradient(138.66% 168.3%at 72.8% 11.43%, #2c2057 0, #050506 77.21%), #050506;

}

.ba {

    background: #343437;

    border-radius: 12px;

    box-shadow: 0 1px 20px rgba(0, 0, 0, 0.2);

    margin: 10px 0 0;

    overflow: hidden;

}

.ba--style--dark {

    background: #1b1b1d;

}

.ba__menu-item {

    align-items: center;

    background: 0 0;

    border: 0;

    color: #fff;

    cursor: pointer;

    display: flex;

    font-size: 14px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: normal;

    padding: 10px 18px;

    position: relative;

    transition: background 0.3s;

    white-space: nowrap;

    width: 100%;

}

.ba__menu-item--split {

    margin-bottom: 2px;

}

.ba__menu-item--split::before {

    background: rgba(255, 255, 255, 0.05);

    content: "";

    height: 2px;

    left: 0;

    position: absolute;

    right: 0;

    top: 100%;

}

.ba__menu-item:hover {

    background: #232325;

}

.ba__menu-item:hover::before {

    display: none;

}

.ba__menu-item--selected {

    background: #343437;

    background: #232325;

}

.ba__menu-item-icon {

    height: 16px;

    margin: 0 12px 0 0;

    width: 16px;

}

.cO__overlay {

    animation: opacity-fade-show 0.5s;

    background: rgba(5, 5, 6, 0.4);

    bottom: 0;

    left: 0;

    pointer-events: none;

    position: absolute;

    top: 0;

    width: 100%;

}

.cO__header {

    animation: opacity-fade-bottom-show 0.3s;

    display: flex;

    justify-content: space-between;

    left: 0;

    padding: 12px 8px 0;

    position: absolute;

    top: 0;

    width: 100%;

    z-index: 1;

}

.cO__header-button {

    background: 0 0;

    border: 0;

    color: #fff;

    cursor: pointer;

    font-size: 14px;

    padding: 4px 8px;

}

.cO__actions-list-wrapper {

    animation: opacity-fade-show-modal-strict 0.5s;

    background: rgba(5, 5, 6, 0.6);

    border-radius: 12px;

    color: #fff;

    left: 12px;

    margin: 36px 0 0;

    padding: 16px 12px;

    position: absolute;

    right: 12px;

    top: 40%;

    z-index: 1;

}

.cO__actions-list-title {

    align-items: center;

    display: flex;

    font-size: 12px;

    gap: 6px;

    justify-content: center;

    margin: 0 0 12px;

    min-height: 17px;

    opacity: 0.4;

    transition: opacity 0.3s;

}

.cO__actions-list-title--highlighted {

    opacity: 1;

}

.cO__actions-list-title-text {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.cO__actions-list {

    display: flex;

    gap: 12px;

    justify-content: center;

}

.cO__action-item {

    align-items: center;

    background: rgba(255, 255, 255, 0.1);

    border: 0;

    border-radius: 12px;

    color: #fff;

    cursor: pointer;

    display: flex;

    font-size: 12px;

    gap: 6px;

    height: 24px;

    padding: 0 12px;

}

.cO__action-item:hover {

    background: rgba(255, 255, 255, 0.2);

}

.cR {

    align-items: center;

    aspect-ratio: 0.5625;

    background: #343437;

    border-radius: 16px;

    display: flex;

    height: 100%;

    justify-content: center;

    margin: 0 auto;

    max-height: 100%;

    max-width: 100%;

    overflow: hidden;

    position: relative;

    -webkit-user-select: none;

    user-select: none;

}

.cR__blur {

    background: no-repeat center;

    background-size: cover;

    bottom: 0;

    filter: blur(13px);

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

}

.cR--hidden {

    visibility: hidden;

}

.cR__content {

    flex: 1;

    max-height: 100%;

    max-width: 100%;

    object-fit: contain;

    pointer-events: none;

    position: relative;

    width: 1000px;

}

.cR__no-text {

    color: #cfcfd0;

    font-size: 14px;

    padding: 0 6px;

    text-align: center;

}

.cR__controls {

    bottom: 12px;

    display: flex;

    flex-direction: column;

    gap: 12px;

    opacity: 0;

    pointer-events: none;

    position: absolute;

    right: 12px;

    transition: opacity 0.3s;

}

.cR__controls--visible {

    opacity: 1;

    pointer-events: auto;

}

.cR__button-wrapper {

    cursor: pointer;

    display: flex;

    justify-content: flex-end;

}

.cR__button-wrapper:hover > .cR__button {

    background: rgba(5, 5, 6, 0.6);

    transform: scale(0.8);

}

.cR__button {

    align-items: center;

    backdrop-filter: blur(4px);

    background: rgba(5, 5, 6, 0.4);

    border-radius: 24px;

    color: #fff;

    column-gap: 6px;

    display: inline-flex;

    font-size: 16px;

    height: 48px;

    padding: 0 12px;

    transition: 0.3s background, 0.3s transform;

}

.creator-list-notifications__description {

    display: grid;

    grid-auto-flow: row;

}

.creator-list-notifications__list-item {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.cT {

    display: flex;

    flex-direction: column;

    gap: 20px;

}

.cT__header {

    align-items: center;

    display: flex;

    gap: 10px;

    justify-content: space-between;

}

.cT__title {

    font-size: 14px;

    font-weight: 600;

    text-align: center;

}

.cT__error-message {

    color: #fd3a5b;

    display: block;

    font-size: 12px;

    margin-top: 4px;

}

.cS {

    align-items: center;

    background: #343437 no-repeat center;

    background-size: contain;

    border-radius: 8px;

    color: #707071;

    cursor: pointer;

    display: flex;

    height: 60px;

    justify-content: center;

    min-width: 36px;

    position: relative;

    width: 36px;

}

.cS::before {

    border: 2px solid transparent;

    border-radius: inherit;

    bottom: 0;

    content: "";

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 3;

}

.cS:hover {

    color: #cfcfd0;

}

.cS--active::before {

    border-color: #fff;

}

.cS--over::after {

    background: #d21b4c;

    border-radius: inherit;

    bottom: 0;

    content: "";

    left: 0;

    opacity: 0.6;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 3;

}

.cS__close {

    align-items: center;

    background: rgba(0, 0, 0, 0.6);

    border-radius: 50%;

    color: #a0a0a1;

    cursor: pointer;

    display: flex;

    height: 20px;

    justify-content: center;

    left: -10px;

    position: absolute;

    top: -10px;

    transition: 0.3s color, 0.3s background;

    width: 20px;

    z-index: 4;

}

.cS__close:hover {

    background: #af262f;

    color: #fff;

}

.cU {

    bottom: 0;

    left: 0;

    overflow: hidden auto;

    padding: 0 20px;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 3;

}

.cU__item {

    align-items: center;

    display: flex;

    gap: 20px;

    height: 88px;

    justify-content: space-between;

    overflow: hidden;

    padding: 8px 0;

}

.cU__left {

    align-items: center;

    display: flex;

    font-size: 14px;

    gap: 12px;

    height: 100%;

    overflow: hidden;

}

.cU__left-name {

    overflow: hidden;

}

.chat-controls-input::before,

.cU__filename {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.cU__icon {

    align-items: center;

    background: #343437;

    border-radius: 10px;

    display: flex;

    flex: 1;

    height: 100%;

    justify-content: center;

    min-width: 36px;

    width: 36px;

}

.cU__right {

    align-items: center;

    display: flex;

    font-size: 14px;

    gap: 14px;

}

.cU__close {

    align-items: center;

    background: #000;

    border: 0;

    border-radius: 50%;

    color: rgba(255, 255, 255, 0.6);

    cursor: pointer;

    display: flex;

    height: 20px;

    justify-content: center;

    padding: 0;

    width: 20px;

}

.cU__close:hover {

    background: #d21b4c;

    color: #fff;

}

.DDD {

    display: flex;

    flex: 1;

    flex-direction: column;

    justify-content: flex-start;

}

.DDD--empty {

    justify-content: center;

}

.DDD__title {

    align-items: center;

    color: #a0a0a1;

    display: flex;

    font-size: 14px;

    line-height: 140%;

    margin: 20px 0;

}

.DDD__title-icon {

    align-items: center;

    background: #232325;

    border-radius: 16px;

    display: flex;

    height: 52px;

    justify-content: center;

    margin: 0 14px 0 0;

    min-width: 52px;

    width: 52px;

}

.DDD__list {

    max-height: 328px;

    padding: 0 20px 10px;

}

.DDD__empty-stub {

    align-items: center;

    display: flex;

    flex-direction: column;

    gap: 18px;

    height: 100%;

    justify-content: center;

}

.DDD__empty-stub-icon {

    color: #707071;

}

.DDD__empty-stub-description {

    color: #a0a0a1;

    font-size: 20px;

    font-weight: 700;

    line-height: 24px;

    margin: 0 auto;

    padding: 0 20px;

    text-align: center;

}

.cH,

.cH__content {

    align-items: center;

    display: flex;

    flex: 1;

    flex-direction: column;

}

.cH__content {

    justify-content: center;

    padding: 20px;

    width: 100%;

}

.cH__svg-icon {

    margin-bottom: 16px;

}

.cH__extra-name {

    color: #fff;

    font-size: 24px;

    font-weight: 500;

    margin-bottom: 20px;

}

.cH__description {

    color: #a0a0a1;

    font-size: 14px;

    font-weight: 400;

    margin-bottom: 20px;

    max-width: 240px;

    text-align: center;

}

.cH__add-details {

    align-items: center;

    color: #ff3332;

    column-gap: 12px;

    cursor: pointer;

    display: flex;

    font-size: 14px;

}

.cH__text-form {

    display: flex;

    position: relative;

    width: 100%;

}

.cH__text-form-controls {

    align-items: center;

    bottom: 10px;

    column-gap: 4px;

    display: flex;

    position: absolute;

    right: 5px;

}

.cH__text-form-close {

    align-items: center;

    background: rgba(255, 255, 255, 0.1);

    border-radius: 50%;

    color: #a0a0a1;

    cursor: pointer;

    display: flex;

    height: 20px;

    justify-content: center;

    position: absolute;

    right: 14px;

    top: 10px;

    width: 20px;

}

.cH__text-form-close:hover {

    color: #fff;

}

.cH .chat-controls-input--form {

    height: 48px;

}

.cH__vat {

    color: #707071;

    font-size: 12px;

    margin-bottom: 20px;

}

.chat-controls-input {

    color: #fff;

    line-height: 16px;

    min-width: 100%;

    outline: 0;

}





.chat-controls-input--form {

    height: 70px;

    margin: 0 0 30px;

}

.chat-controls-input--style--multy-line {

    min-height: 28px;

    overflow: auto;

    padding: 10px 0 0;

    position: relative;

    white-space: pre-wrap;

    word-break: break-word;

    text-align: left;

}

.chat-controls-input--style--single-line {

    height: 34px;

    padding: 10px 0 0;

    position: absolute;

}

.chat-controls-input:empty::before {

    content: attr(placeholder);

    max-width: 100%;

    opacity: 0.6;

    pointer-events: none;

    position: absolute;

}

.chat-controls-input--with-content::before {

    display: none;

}

.chat-controls-input__wrapper {

    cursor: text;

    flex: 1;

    font-size: 13px;

    overflow: hidden;

    position: relative;

}

.chat-controls-input__wrapper--dark {

    background: #111113;

}

.chat-controls-input__wrapper--dark:focus-within {

    border-color: #ff3332;

}

.chat-controls-input__wrapper--form {

    border: 1px solid transparent;

    border-radius: 12px;

    color: #fff;

    padding: 0 10px;

}

.chat-controls-input__wrapper--style--single-line {

    height: 34px;

    white-space: nowrap;

}

.chat-controls-input__wrapper--disabled {

    pointer-events: none;

}

.chat-controls-input__wrapper--error {

    border-color: #fd3a5b;

}

.chat-controls-input__wrapper--error:focus-within {

    border-color: #fd3a5b;

}

.chat-controls-input__wrapper-scroll {

    bottom: -50px;

    left: 12px;

    overflow: auto;

    position: absolute;

    right: 12px;

    top: 0;

}

.chat-controls-input__hashtag,

.chat-controls-input__mention {

    color: #ff3332;

}

.chat-controls-input__smile {

    animation: smile-appear 0.3s;

    display: inline-block;

    font-size: 0;

    margin: 0 4px;

    position: relative;

    top: -4px;

    vertical-align: text-top;

    width: 20px;

}

.chat-controls-input__smile--no-animation {

    animation: none;

}

.chat-controls-input__smile--hidden {

    margin: 0;

    opacity: 0;

    width: 1px;

}

.chat-controls-input__smile--flyed {

    animation: none;

    margin: 0;

    pointer-events: none;

    position: fixed;

    z-index: 600;

}

.cI {

    align-items: center;

    display: flex;

    flex-direction: column;

    justify-content: center;

    margin: auto;

}

.cI__icon {

    margin-bottom: 28px;

}

.cI__title {

    color: #fff;

    font-size: 24px;

    font-weight: 700;

    margin-bottom: 20px;

}

.cI__description {

    color: #a0a0a1;

    font-size: 14px;

    font-weight: 500;

    line-height: 20px;

    margin-bottom: 40px;

    max-width: 260px;

    text-align: center;

}

.cI__can-message-badge {

    align-items: center;

    background: #232325;

    border-radius: 12px;

    color: rgba(248, 248, 248, 0.7);

    display: grid;

    grid-auto-flow: column;

    grid-column-gap: 14px;

    justify-content: start;

    min-height: 44px;

    padding: 12px 14px;

}

.F {

    border-radius: 18px;

    overflow: hidden;

    padding-top: 100%;

    position: relative;

    transform: translateZ(0);

    transition: opacity 0.3s;

}

.F--shadow::after {

    background: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, 0.65) 100%);

    content: "";

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    transition: opacity 0.3s;

    width: 100%;

}

.F--locked {

    background: linear-gradient(246.82deg, #3c185e 0, #100415 100%) no-repeat center;

    background-size: cover;

}

.F--locked:hover {

    background-image: linear-gradient(246.82deg, #281f4d 0, #0d071e 100%);

}

.F--clickable {

    cursor: pointer;

}

.F--disabled {

    opacity: 0.6;

    pointer-events: none;

}

.F__image {

    height: 100%;

    left: 0;

    object-fit: cover;

    object-position: center;

    position: absolute;

    top: 0;

    transform: scale(1.01);

    transition: transform 0.3s;

    width: 100%;

}

.F--with-zoom:hover > .F__image {

    transform: scale(1.1);

}

.F__content {

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

    z-index: 1;

}

.tag-creator-settings {

    display: flex;

    flex-direction: column;

    height: 100%;

}

@media screen and (max-width: 639px) {

    .tag-creator-settings {

        height: calc(100vh - 113px);

    }

}

.tag-creator-settings__add-tag-button {

    cursor: pointer;

    left: 50%;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

}

.tag-creator-settings__add-tag-button.btn {

    padding: 10px 12px;

}

.tag-creator-settings__add-tag-button.btn:active {

    transform: translate(-50%, calc(-50% + 1px));

}

.tag-creator-settings__toggle-button {

    background-color: #343437;

    border: 0;

    border-radius: 50%;

    color: #fff;

    cursor: pointer;

    display: grid;

    height: 24px;

    padding: 0;

    place-items: center;

    width: 24px;

}

.tag-creator-settings__toggle-button:active {

    transform: translateY(1px);

}

.tag-creator-settings__counter {

    color: #cfcfd0;

    font-size: 16px;

    font-weight: 700;

    white-space: nowrap;

}

.tag-creator-settings__search-header {

    align-items: center;

    display: flex;

    justify-content: space-between;

    margin-bottom: 18px;

}

.tag-creator-settings__search-back-button {

    background: 0 0;

    border: 0;

    color: #fff;

    cursor: pointer;

    font-size: 13px;

    font-weight: 500;

}

.tag-creator-settings__search-input-wrapper {

    position: relative;

}

.cp__input.input,

.tag-creator-settings__search-input.input {

    padding-left: 30px;

}

.tag-creator-settings__search-icon {

    color: #a0a0a1;

    left: 10px;

    position: absolute;

    top: 12px;

    z-index: 1;

}

.tag-creator-settings__users-list {

    margin-top: 10px;

}

.tag-creator-settings__icon {

    position: absolute;

    z-index: 1;

}

.tag-creator-settings__icon:after {

    bottom: 50%;

    box-shadow: 0 0 40px rgba(0, 0, 0, 0.6);

    content: "";

    display: block;

    height: 1px;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

    width: 1px;

}

.tag-creator-settings__icon--users {

    bottom: 10px;

    left: 10px;

}

.tag-creator-settings__icon--play {

    right: 14px;

    top: 16px;

}

.cp__header {

    align-items: center;

    display: flex;

    justify-content: space-between;

    margin-bottom: 18px;

}

.cp__header-actions {

    align-items: center;

    display: flex;

    gap: 8px;

    justify-content: center;

}

.cp__back-button {

    background: 0 0;

    border: 0;

    color: #fff;

    cursor: pointer;

    font-size: 13px;

    font-weight: 500;

}

.cp__input-wrapper {

    position: relative;

}

.cp__icon {

    color: #a0a0a1;

    left: 10px;

    position: absolute;

    top: 12px;

    z-index: 1;

}

.cp__users-list {

    margin-top: 10px;

}

.cs {

    align-items: center;

    color: #a0a0a1;

    column-gap: 10px;

    display: flex;

    font-size: 14px;

    font-weight: 700;

    justify-content: space-between;

    min-height: 48px;

}

.cs--clickable {

    cursor: pointer;

}

.cs--clickable:hover {

    color: #cfcfd0;

}

.cs__left {

    align-items: center;

    column-gap: 10px;

    display: flex;

    flex: 1;

}

.cs__middle {

    display: flex;

    flex: 1;

    flex-wrap: wrap;

    justify-content: space-between;

}

.cs__icon {

    align-items: center;

    display: flex;

    gap: 10px;

}

.cs__icon--new {

    color: #ff3332;

}

.cs__dot {

    color: #707071;

    margin: 0 0 0 4px;

    position: relative;

    right: -1px;

}

.cs__description {

    color: #707071;

    font-size: 14px;

    font-weight: 400;

}

.cq {

    position: relative;

}

.cq__footer {

    align-items: center;

    bottom: 6px;

    display: flex;

    justify-content: space-between;

    left: 10px;

    position: absolute;

    right: 10px;

}

.cq__footer--disabled {

    opacity: 0.6;

    pointer-events: none;

}

.cq__left {

    align-items: center;

    column-gap: 4px;

    display: flex;

}

.cq__right {

    align-items: center;

    column-gap: 10px;

    display: flex;

}

.cq__button {

    border: 2px solid #424248;

    border-radius: 6px;

    color: #a0a0a1;

    cursor: pointer;

    font-size: 12px;

    height: 20px;

    padding: 0 8px;

}

.cq__button:hover {

    background: #424248;

    color: #cfcfd0;

}

.cq .smiles-dropdown {

    margin: 0;

}

.cq .smiles-dropdown .smiles-list {

    bottom: 25px;

}

.cq__mentions {

    background: #1b1b1d;

    bottom: 0;

    left: 0;

    padding: 20px;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 3;

}

.cq__content {

    background: #111113;

    border-radius: 4px;

    bottom: 8px;

    left: 10px;

    position: absolute;

    right: 80px;

}

.cq__counter {

    background: #111113;

    border-radius: 4px;

    color: #a0a0a1;

    font-size: 10px !important;

    padding: 4px;

    pointer-events: none;

}

.c1 {

    aspect-ratio: 0.5625;

    position: relative;

    transition: 0.6s height;

}

.c1--style--pale {

    cursor: pointer;

    height: 41%;

}

.c1--style--pale .c1__footer,

.c1--style--pale .c1__header {

    opacity: 0;

    pointer-events: none;

}

.c1--style--pale .m {

    display: none;

}

.c1--style--active {

    height: 100%;

    margin: 0 60px;

    opacity: 1;

}

.c1--style--active .c1__user-pale {

    opacity: 0;

}

.c1--mobile {

    height: auto;

    margin: 0;

    max-width: 360px;

    width: 100%;

}

.c1__content-wrapper {

    align-items: center;

    background: #1b1b1d no-repeat center;

    background-size: cover;

    border-radius: 16px;

    bottom: 0;

    display: flex;

    justify-content: center;

    left: 0;

    overflow: hidden;

    position: absolute;

    top: 0;

    width: 100%;

}

.c1__content {

    flex: 1;

    max-height: 100%;

    max-width: 100%;

    pointer-events: none;

    position: relative;

}

.c1__content-image {

    background: no-repeat center;

    background-size: contain;

    bottom: 0;

    left: 0;

    pointer-events: none;

    position: absolute;

    right: 0;

    top: 0;

}

.c1__header {

    background: linear-gradient(180deg, rgba(0, 0, 0, 0.6) 0, transparent 100%);

    left: 0;

    min-height: 78px;

    padding: 12px 12px 0;

    position: absolute;

    top: 0;

    width: 100%;

    z-index: 1;

}

.c1__header .displayname--size--small-xx > .displayname__name {

    font-size: 14px;

}

.c1__sub-header {

    align-items: center;

    display: flex;

    justify-content: space-between;

}

.c1__user {

    align-items: center;

    display: flex;

}

.c1__header-controls {

    align-items: center;

    column-gap: 12px;

    display: flex;

}

.c1__header-button {

    background: 0 0;

    border: 0;

    color: rgba(255, 255, 255, 0.6);

    cursor: pointer;

    filter: drop-shadow(0 1px 10px rgba(0, 0, 0, 0.4));

    padding: 0;

    transition: 0.3s color;

}

.c1__header-button--mobile-close {

    position: absolute;

    right: 16px;

    top: 16px;

}

.c1__header-button:hover {

    color: #fff;

}

.c1__footer {

    background: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, 0.6) 100%);

    bottom: 0;

    left: 0;

    padding: 0 12px 12px;

    position: absolute;

    width: 100%;

    z-index: 1;

}

.c1__footer--mobile {

    bottom: env(safe-area-inset-bottom);

    left: 50%;

    max-width: 360px;

    position: fixed;

    transform: translateX(-50%);

}

.c1__footer-icon {

    align-items: center;

    column-gap: 4px;

    display: inline-flex;

    font-size: 14px;

    font-weight: 700;

}

.c1__user-pale {

    align-items: center;

    background: rgba(0, 0, 0, 0.8);

    bottom: 0;

    display: flex;

    flex-direction: column;

    gap: 6px;

    justify-content: center;

    left: 0;

    pointer-events: none;

    position: absolute;

    top: 0;

    transition: 0.6s opacity;

    width: 100%;

    z-index: 1;

}

.c1__tabs {

    column-gap: 4px;

    display: flex;

    margin: 0 0 12px;

}

.c1__tab {

    background: rgba(255, 255, 255, 0.2);

    border-radius: 2px;

    cursor: pointer;

    flex: 1;

    height: 2px;

    overflow: hidden;

    position: relative;

    transition: 0.3s background, 0.3s box-shadow;

}

.c1__tab:hover {

    background: rgba(255, 255, 255, 0.4);

}

.c1__tab-progress {

    background: rgba(255, 255, 255, 0.8);

    border-radius: 2px;

    flex: 1;

    height: inherit;

    left: 0;

    top: 0;

    width: 0;

}

.c1__moderation {

    align-items: center;

    background: rgba(0, 0, 0, 0.6);

    border-radius: 20px;

    bottom: 12px;

    color: #cfcfd0;

    display: flex;

    font-size: 14px;

    gap: 16px;

    left: 12px;

    padding: 8px 16px;

    position: absolute;

    right: 12px;

    z-index: 1;

}

.c1 .m {

    height: auto;

    left: auto;

    top: auto;

    width: auto;

}

.c1__loader {

    align-items: center;

    color: #707071;

    display: flex;

    flex-direction: column;

    font-size: 14px;

    gap: 10px;

    left: 50%;

    pointer-events: none;

    position: absolute;

    text-align: center;

    top: 50%;

    transform: translateX(-50%) translateY(-50%);

}

.c1__no-available {

    color: #707071;

    font-size: 18px;

    font-weight: 700;

    padding: 0 16px;

    text-align: center;

}

.c1__user-tags {

    bottom: 60px;

    left: 20px;

    position: absolute;

}

.c1__mobile-direction {

    bottom: 0;

    position: absolute;

    top: 0;

}

.c1__mobile-direction--style--left {

    left: 0;

    width: 25%;

}

.c1__mobile-direction--style--right {

    right: 0;

    width: 75%;

}

.scheduled-post-settings {

    align-items: center;

    display: grid;

    grid-column-gap: 20px;

    grid-template-columns: 1fr;

    margin: 0-20px;

    padding: 0 20px 20px;

}

.scheduled-post-settings__error-message {

    color: #fd3a5b;

    display: block;

    font-size: 12px;

    grid-column: 1/3;

    margin: 4px 0 0;

}

.scheduled-post-settings__posts-count-notice {

    color: #a0a0a1;

    font-size: 0.75rem;

    margin-top: 6px;

}

@media screen and (max-width: 479px) {

    .scheduled-post-settings {

        padding: 0 15px 15px;

    }

}

.cz__image {

    align-items: center;

    display: flex;

    flex: 1;

    height: 234px;

    justify-content: center;

    position: relative;

}

.cz__image-photo {

    border-radius: 4px;

    max-height: 100%;

    max-width: 100%;

}

.cz__control {

    align-items: center;

    display: flex;

    gap: 10px;

    position: absolute;

}

.cy {

    -webkit-user-select: none;

    user-select: none;

}

.cy__thumbs-line {

    background: rgba(255, 255, 255, 0.05);

    height: 1px;

    margin: 0 0 19px;

}

.cy__thumb {

    background-clip: content-box;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    border: 2px solid transparent;

    border-radius: 10px;

    cursor: pointer;

    height: 64px;

    min-width: 64px;

    opacity: 0.4;

    position: relative;

    transition: opacity 0.3s;

    width: 64px;

}

.cy__thumb:hover {

    opacity: 1;

}

.cy__thumb--active {

    border-color: #d60908;

    opacity: 1;

    pointer-events: none;

}

.cy__thumb-time {

    align-items: center;

    background: rgba(0, 0, 0, 0.8);

    border-radius: 4px;

    bottom: 4px;

    color: #cfcfd0;

    display: flex;

    font-size: 10px;

    font-weight: 500;

    height: 14px;

    line-height: 13px;

    padding: 0 3px;

    position: absolute;

    right: 4px;

}

.cy__thumb-error {

    display: flex;

    left: 50%;

    position: absolute;

    top: 50%;

    transform: translateY(-50%) translateX(-50%);

}



.bV,

.bY__wrapper-center::before {

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

}

.bV__svg {

    display: block;

}



.bY__wrapper {

    contain: strict;

    left: 0;

    overflow: hidden;

    position: absolute;

    right: 0;

}

.bY__list {

    align-items: center;

    display: flex;

}

.bY__item {

    margin-right: 20px;

    min-width: 190px;

    width: 190px;

}

.bY__shadow {

    bottom: 0;

    pointer-events: none;

    position: absolute;

    top: 0;

    width: 190px;

}

.bY__shadow--right {

    background: linear-gradient(to right, transparent 0, #000 100%);

    right: 0;

}

.bY__shadow--left {

    background: linear-gradient(to left, transparent 0, #000 100%);

    left: 0;

}

.bY__scroll-container {

    display: flex;

    overflow: auto;

    position: relative;

}

@media screen and (max-width: 767px) {

    .bYz__shadow {

        width: 100px;

    }

}



.messages-overlay{

    position: fixed;

    top: 0;

    left: 0;

    z-index: 105;

    background-color: #000;

    opacity: 0.85;

    width: 100%;

    height: 100%;    

}



.messages-container {

    animation: opacity-fade-show 0.3s;

    border-radius: 16px;

    box-shadow: 0 20px 30px rgba(0, 0, 0, 0.3);

    display: flex;

    flex-direction: column;

    height: unset;

    max-height: 100%;

    position: fixed;

    text-align: center;

    top: 100px;

    left: 50%;

    transform: translate(-50%, 0);

    z-index: 106;

    height: 75vh;

    max-width: 960px;

}



.personal-notifications-modal {

    animation: opacity-fade-show 0.3s;

    background: #232325;

    border-radius: 16px;

    bottom: 10px;

    box-shadow: 0 20px 30px rgba(0, 0, 0, 0.3);

    display: flex;

    flex-direction: column;

    height: unset;

    max-height: 100%;

    position: fixed;

    top: 30%;

    right: 18%;

    transform: translate(-35%, -35%);

    width: 422px;

    z-index: 106;

}

.personal-notifications-modal--cookie {

    bottom: 70px;

}

.personal-notifications-modal.is-hiding {

    animation: opacity-fade-hide 0.3s;

}

.personal-notifications-modal__verify {

    align-items: center;

    background: #1b1b1d;

    border-radius: 12px;

    display: flex;

    font-size: 14px;

    gap: 12px;

    line-height: 140%;

    margin: 0 12px 4px;

    padding: 12px 42px 12px 12px;

    position: relative;

}

.personal-notifications-modal__verify-icon {

    align-self: flex-start;

}

.personal-notifications-modal__verify-close {

    color: #707071;

    cursor: pointer;

    font-size: 0;

    padding: 6px;

    position: absolute;

    right: 4px;

    top: 4px;

}

.personal-notifications-modal__verify-close:hover {

    color: #a0a0a1;

}

.personal-notifications-modal .scroll-bar-container {

    display: flex;

    flex-direction: column;

    height: 100%;

    max-height: none;

    max-width: none;

    overflow-x: hidden;

    width: auto;

}

.personal-notifications-modal-title {

    align-items: center;

    border-bottom: 1px solid transparent;

    color: #fff;

    display: flex;

    font-size: 20px;

    font-weight: 700;

    height: 68px;

    margin: 0;

    padding: 20px;

    transition: border-bottom-color 0.5s;

}

@media screen and (max-width: 479px) {

    .personal-notifications-modal-title {

        font-size: 20px;

        font-weight: 500;

        letter-spacing: normal;

        line-height: normal;

        height: 56px;

        padding: 12px;

    }

}

.personal-notifications-modal-title.scrolled {

    border-bottom-color: rgba(255, 255, 255, 0.1);

}

.personal-notifications-modal-title button {

    border-radius: 2px;

    height: 24px;

    width: 24px;

    align-items: center;

    background: 0 0;

    border: 0;

    color: #fff;

    cursor: pointer;

    display: inline-flex;

    justify-content: center;

    margin-right: 12px;

}

.personal-notifications-modal-title button:hover {

    background: rgba(248, 248, 248, 0.1);

}

.personal-notifications-modal-title .icon {

    flex-shrink: 0;

    height: 16px;

    margin: 0;

    width: 16px;

}

.personal-notifications-modal-panel-footer .personal-notifications-modal-panel-controls-btn,

.l:hover::after {

    display: none;

}

@media (max-width: 639px) {

    .personal-notifications-modal {

        border-radius: 0;

        height: calc(100% - var(--pwa-notification-height));

        right: 0;

        top: var(--pwa-notification-height);

        width: 100%;

    }

    .personal-notifications-modal h2 {

        display: none;

    }

    .personal-notifications-modal-panel-footer .personal-notifications-modal-panel-controls-btn {

        display: block;

        margin: 0;

    }

}

@media screen and (max-width: 479px) {

    .personal-notifications-modal {

        animation: none;

        height: calc(100% - var(--tap-bar-height) - env(safe-area-inset-bottom));

    }

}

.user-media-content-sub-title.title-ds {

    align-items: center;

    display: flex;

    justify-content: space-between;

    margin: 40px 0 20px;

}

.user-media-content-sub-title__title {

    align-items: center;

    display: flex;

    white-space: break-spaces;

}

.user-media-content-sub-title__title--loading {

    opacity: 0;

}

.user-media-content-sub-title__title-count {

    padding: 0 0 0 14px;

}

.user-media-content-sub-title__controls {

    align-items: center;

    display: flex;

    white-space: break-spaces;

}

.user-media-content-sub-title__control-item {

    color: #fff;

    cursor: pointer;

    margin: 0 0 0 12px;

    opacity: 0.6;

    transition: opacity 0.3s;

}

.pill-control.in-animation > .pill-control__ghost,

.user-media-content-sub-title__control-item:hover {

    opacity: 1;

}

.user-media-content-sub-title__controls-icon {

    display: block;

    height: 20px;

    margin: 0;

    opacity: 0.6;

    width: 20px;

}

.my-collection-albums__content {

    display: block;

    overflow: auto hidden;

    white-space: nowrap;

}

.my-collection-albums__content > .bc {

    display: inline-block;

    margin: 0 12px 0 0;

    width: 285px;

}

@media screen and (min-width: 480px) {

    .my-collection-albums__content {

        column-gap: 12px;

        display: grid;

        grid-template-columns: repeat(2, 1fr);

        overflow: visible;

        row-gap: 12px;

        white-space: normal;

    }

    .my-collection-albums__content > .bc {

        display: block;

        margin: 0;

        width: auto;

    }

}

@media screen and (min-width: 640px) {

    .my-collection-albums__content {

        column-gap: 20px;

        grid-template-columns: repeat(3, 1fr);

        row-gap: 20px;

    }

}

@media screen and (min-width: 1366px) {

    .my-collection-albums__content {

        grid-template-columns: repeat(5, 1fr);

    }

}

.my-collection-albums__skeleton-item {

    background: #343437;

    border-radius: 18px;

    padding-bottom: 75%;

}

.pill-control {

    align-items: center;

    border-radius: 12px;

    display: flex;

    position: relative;

    -webkit-user-select: none;

    user-select: none;

}

.pill-control--disabled {

    opacity: 0.4;

    pointer-events: none;

}

.pill-control--style--default {

    background: #1c1c1c;

}

.pill-control--style--default-dark,

.pill-control--style--primary {

    background: #111113;

}

.pill-control.multi-lines {

    flex-wrap: wrap;

}

.pill-control.in-animation,

.upload-file-list .upload-media-item-add--chosen .z__indicators,

.upload-file-list .z--chosen .z__indicators {

    pointer-events: none;

}

.pill-control__item {

    align-items: center;

    border-radius: 8px;

    cursor: pointer;

    display: flex;

    flex: 1;

    height: 32px;

    justify-content: center;

    margin: 4px;

    opacity: 0.6;

    padding: 0 12px;

    position: relative;

    transition: opacity 0.3s;

}

.pill-control__item--active {

    opacity: 1;

    pointer-events: none;

}

.pill-control__item--active.pill-control__item--style--default,

.pill-control__item--active.pill-control__item--style--default-dark {

    background: #343437;

}

.pill-control__item--active.pill-control__item--style--primary {

    background: #d60908;

}

.pill-control__item--next-active,

.pill-control__item:hover {

    opacity: 1;

}

.pill-control__item.multi-lines {

    flex: auto;

}

.pill-control__ghost {

    border-radius: 8px;

    opacity: 0;

    pointer-events: none;

    position: absolute;

}

.pill-control__ghost--style--default,

.pill-control__ghost--style--default-dark {

    background: #343437;

}

.pill-control__ghost--style--primary {

    background: #d60908;

}

@media screen and (max-width: 639px) {

    .pill-control__item {

        height: 32px;

    }

}

.upload-file-list {

    column-gap: 12px;

    display: grid;

    grid-template-columns: repeat(5, 1fr);

    padding: 0;

    row-gap: 12px;

}

.upload-file-list .upload-media-item-add,

.upload-file-list .z {

    height: auto;

    margin: 0;

    padding-top: 100%;

    width: auto;

}

.upload-file-list .upload-media-item-add--drag,

.upload-file-list .z--drag {

    padding-top: 0;

}

.upload-file-list .upload-media-item-add--drag .z__cover-badge,

.upload-file-list .upload-media-item-add--ghost,

.upload-file-list .z--drag .z__cover-badge,

.upload-file-list .z--ghost {

    opacity: 0;

}

@media screen and (max-width: 639px) {

    .upload-file-list {

        grid-template-columns: repeat(4, 1fr);

    }

}

@media screen and (max-width: 320px) {

    .upload-file-list {

        grid-template-columns: repeat(3, 1fr);

    }

}

.bu {

    display: flex;

    position: relative;

}

.bu__button {

    align-items: center;

    background: #2a244b;

    border: 0;

    border-radius: 12px;

    color: #fff;

    cursor: pointer;

    display: flex;

    flex-grow: 1;

    font-size: 14px;

    font-weight: 500;

    gap: 12px;

    height: 40px;

    justify-content: center;

    padding: 11px 20px;

}

@media screen and (max-width: 1023px) {

    .bu__button {

        padding: 11px;

    }

}

.bu__dropdown-icon {

    color: #a0a0a1;

    transition: transform 0.15s linear;

}

.bu__dropdown-icon--rotated {

    transform: rotate(180deg);

}

.bu__dropdown-content {

    padding: 12px 16px;

}

.bu__prising {

    align-items: center;

    border-bottom: 2px solid rgba(255, 255, 255, 0.05);

    column-gap: 12px;

    display: flex;

    flex-wrap: nowrap;

    margin-bottom: 12px;

    padding-bottom: 12px;

}

.bu__club-prices {

    display: flex;

    flex-direction: column;

    gap: 4px;

}

.bu__price {

    color: #fff;

    white-space: nowrap;

}

.bh,

.bu__bundles {

    color: #707071;

    white-space: nowrap;

}

.bh {

    align-items: center;

    border-radius: 6px;

    color: #fff;

    display: inline-flex;

    font-size: 13px;

    font-weight: 700;

    justify-content: center;

    padding: 2px 8px;

}

.bh--style--primary {

    background: #d60908;

}

.bh--style--alert {

    background: #d21b4c;

}

.island-value-link {

    background: #2e2e30;

    border-radius: 10px;

    display: block;

    padding: 6px 12px;

    width: 100%;

}

.island-value-link:hover {

    background: #343437;

    text-decoration: none;

}

.island-value-link__content {

    align-items: center;

    display: flex;

    justify-content: space-between;

    min-height: 30px;

}

.island-value-link__name,

.island-value-link__value {

    align-items: center;

    color: #cfcfd0;

    display: flex;

    font-size: 15px;

    font-weight: 500;

}

.island-value-link__value {

    color: #ff3332;

    font-size: 18px;

}

.island-value-link__bottom {

    font-size: 12px;

    line-height: 16px;

    margin: 4px 0 0;

}

.l {

    overflow: hidden;

    position: relative;

}

.l--animated {

    transform: translateZ(0);

}

.l--animated::after {

    animation: flareAnimation 5s infinite ease-in alternate;

    background: linear-gradient(90deg, transparent 0, #d60908 50%, transparent 100%);

    bottom: 0;

    content: "";

    left: 0;

    pointer-events: none;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 0;

}

.l__text {

    margin-left: 11px;

    z-index: 1;

}

.l__icon {

    z-index: 1;

}

.chat-controls {

    padding: 0 6px 8px;

    position: relative;

    touch-action: none;

}

.chat-controls::before {



    bottom: 100%;

    content: "";

    height: 8px;

    left: 0;

    pointer-events: none;

    position: absolute;

    width: 100%;

}

.chat-controls--hidden,

.r img[src=""] {

    visibility: hidden;

}

.chat-controls--mobile {

    background: #232325;

    bottom: calc(var(--tap-bar-height) + env(safe-area-inset-bottom));

    left: 0;

    position: fixed;

    width: 100%;

}

.chat-controls__shatter {

    align-items: center;

    display: flex;

    font-size: 12px;

    gap: 3px;

    height: 100%;

    left: 12px;

    position: absolute;

    right: 12px;

    top: 0;

}

.chat-controls__ghost {

    min-height: 40px;

}

.chat-controls .chat-controls-input {

    max-height: 80px;

    padding: 6px 0;

}

.chat-controls .chat-controls-input__wrapper {

    margin: 0 0 0 14px;

}

.chat-controls .chat-controls-content,

.chat-controls .input-wrapper {

    align-items: flex-end;

    display: flex;

}

.chat-controls .input-wrapper {

    background: #343437;

    border: 1px solid transparent;

    border-radius: 18px;

    flex: 1;

    margin: 0 8px;

    position: relative;

}

.chat-controls .input-wrapper.focus {

    border-color: rgba(248, 248, 248, 0.1);

}

.chat-controls input.chat-input {

    background: 0 0;

    border: 0;

    border-radius: 15px;

    box-shadow: none;

    color: #fff;

    flex: 1;

    font-size: 13px;

    height: 34px;

    line-height: 16px;

    outline: 0;

    padding: 0 12px;

}

.chat-controls input.chat-input:focus {

    background: 0 0;

    border: 0;

    box-shadow: none;

    outline: 0;

}

.chat-controls input.chat-input::placeholder {

    color: #fff;

    opacity: 0.5;

}

.chat-controls .input-buttons {

    align-items: center;

    display: flex;

    margin: 0 0 3px;

    min-height: 22px;

}

.chat-controls .upload-icon-wrapper {

    height: 30px;

    margin-right: 0;

    padding: 0 4px;

}

.chat-controls .upload-icon-wrapper .icon {

    margin: 0;

}

.chat-controls .smiles-dropdown .trigger {

    color: #fff;

    height: 30px;

    width: auto;

}

.chat-controls .smiles-dropdown .trigger .icon,

.chat-controls .smiles-dropdown .trigger:hover .icon {

    fill: #fff;

    opacity: 0.6;

    position: static;

}

.chat-controls .control-button {

    padding: 6px;

    position: relative;

}

.chat-controls .control-button--dotted::after {

    background: #e12947;

    border: 2px solid #232325;

    border-radius: 10px;

    content: "";

    height: 10px;

    position: absolute;

    right: 1px;

    top: 1px;

    width: 10px;

}

.chat-controls .control-button--rounded {

    align-items: center;

    background: #343437;

    border-radius: 50%;

    display: flex;

    height: 32px;

    justify-content: center;

    padding: 0;

    width: 32px;

}

.chat-controls .control-button:hover .tip-icon {

    color: #e9a63b;

    opacity: 1;

}

.chat-controls .control-button__label {

    align-items: center;

    background: #d60908;

    border-radius: 6px;

    color: #fff;

    display: flex;

    font-size: 13px;

    font-weight: 700;

    height: 20px;

    padding: 0 8px;

}

.chat-controls .send-button {

    cursor: default;

}

.chat-controls .send-button.non-empty-input {

    cursor: pointer;

}

.chat-controls .send-button.non-empty-input .send-icon {

    opacity: 1;

}

.chat-controls .send-button.non-empty-input:hover .send-icon {

    transform: scale(1.1, 1.1);

}

.chat-controls .control-icon {

    color: #fff;

    fill: currentColor;

    height: 20px;

    margin: 0;

    opacity: 0.6;

    width: 20px;

}

.chat-controls .smiles-dropdown .smiles-list {

    bottom: 40px;

    top: auto;

}

@media (max-width: 639px) {

    .chat-controls .smiles-dropdown .smiles-list {

        left: auto;

        right: 0;

    }

}

.k {

    column-gap: 20px;

    display: grid;

    grid-template-columns: repeat(2, 1fr);

    row-gap: 10px;

}

.k__field-row--long {

    grid-column: span 2;

}

.k__row-split {

    background: rgba(255, 255, 255, 0.05);

    grid-column: span 2;

    height: 1px;

    margin: 6px 0 0;

}

.k__field-label {

    flex-basis: 40%;

    line-height: 30px;

    text-align: left;

    white-space: nowrap;

    font-size: 0.75rem;

}

.k__field-input {

    flex-basis: 60%;

    font-size: 0.75rem;

}

.k__field-tooltip {

    margin-left: 10px;

}

.k__field-input-optional {

    align-items: center;

    display: flex;

}

.k__field-delete-button {

    background: 0 0;

    border: 0;

    color: #707071;

    cursor: pointer;

    margin: 0 11px;

    outline: 0;

    padding: 0;

}

@media (max-width: 639px) {

    .k {

        display: block;

    }

}

.error-message {

    color: #fd3a5b;

    display: block;

    flex: 1;

    font-size: 12px;

    margin: 4px 0 0;

    text-align: left;

}

.j {

    display: flex;

    flex-wrap: wrap;

    gap: 20px;

}

.j__item {

    background: #232325;

    border: 0;

    border-radius: 10px;

    cursor: pointer;

    flex: 1;

    flex-direction: column;

    gap: 20px;

    min-height: 240px;

    overflow: hidden;

    padding: 0 20px;

    transition: background 0.3s;

}

.j__item:hover {

    background: #343437;

}

.j__icon,

.j__item {

    align-items: center;

    display: flex;

    justify-content: center;

}

.j__icon::before {

    background: radial-gradient(50% 50%at 50% 50%, rgba(81, 53, 255, 0.2) 0, rgba(27, 27, 29, 0) 100%);

    content: "";

    height: 192px;

    position: absolute;

    width: 192px;

}

.j__text {

    color: #fff;

    font-size: 16px;

    font-weight: 600;

}

@media (max-width: 639px) {

    .j {

        flex-direction: column;

    }

    .j__item {

        min-height: 148px;

    }

}

.select-studio-type {

    color: #a0a0a1;

    margin: 0 0 40px;

    max-width: 680px;

}

.select-studio-type .select {

    display: block;

    max-width: 400px;

}

.switcher {

    align-items: flex-end;

    background: #424248;

    border-radius: 20px;

    color: #e1e1e1;

    cursor: pointer;

    height: 100%;

    overflow: hidden;

    padding: 3px;

    position: relative;

    width: 100%;

    display: flex;

    flex-direction: row;

    transition: all 360ms ease-in-out 0s;

}

.switcher--disabled {

    opacity: 0.2;

    pointer-events: none;

}

.switcher .switcher-wrapper {

    display: block;

    font-size: 12px;

    height: 100%;

    line-height: 14px;

    transform: translateX(-14px);

    transition: transform 0.5s ease-in-out;

    width: 100%;

}

.switcher .switcher-wrapper .switcher-label {

    color: #fff;

    display: inline-block;

    opacity: 0;

    text-align: center;

    vertical-align: middle;

    width: calc(100% - 15px);

}

.switcher .switcher-wrapper .switcher-switch {

    background: #fff;

    border-radius: 50%;

    color: #424248;

    display: inline-block;

    transition: all 0.5s;

    vertical-align: middle;

}

.switcher .switcher-wrapper .switcher-switch ~ .switcher-label {

    text-align: right;

}

.switcher .switcher-wrapper .switcher-switch .icon {

    height: 100%;

    margin-right: 0;

    transform: scale(0.75);

    width: 100%;

}

.switcher .switcher-wrapper .icon.icon-check {

    margin-bottom: 2px;

    margin-left: -1px;

}

.switcher.on {

    background: #d60908;

}

.switcher.on:hover {

    background: #9e40fd;

}

.switcher.on .switcher-wrapper {

    transform: translateX(0);

}

.switcher.on .switcher-wrapper .switcher-label {

    color: #fff;

    opacity: 1;

}

.switcher.on .switcher-wrapper .switcher-switch {

    color: #d60908;

}

.switcher.light {

    background: #676767;

}

.switcher.light.on {

    background: #d60908;

}

.switcher.light .switcher-wrapper .switcher-switch {

    background: #fff;

}

.switcher.mixed-light {

    background: rgba(0, 0, 0, 0.18);

}

.switcher.mixed-light .switcher-wrapper .switcher-switch {

    background: rgba(255, 255, 255, 0.4);

}

.switcher.mixed-light .switcher-wrapper .switcher-switch .icon {

    color: #252525;

}

.switcher.mixed-light.on {

    background: #79943d;

}

.switcher.mixed-light.on .switcher-wrapper .switcher-switch {

    background: #2f2f2f;

}

.switcher.mixed-light.on .switcher-wrapper .switcher-switch .icon {

    color: #79943d;

}

.switcher.mixed-light.on .switcher-wrapper .switcher-label .icon {

    fill: #2f2f2f;

}

.switcher.default,

.switcher.small {

    height: 22px;

    margin-left: 10px;

    width: 38px;

}

.switcher.default .switcher-wrapper .switcher-label {

    padding: 0 2px 0 1px;

}

.switcher.default .switcher-wrapper .switcher-switch {

    height: 14px;

    width: 14px;

}

.switcher.default .switcher-wrapper .icon.icon-check {

    height: 10px;

    width: 10px;

}

.switcher.small {

    min-width: 35px;

    width: 35px;

}

.switcher.small .switcher-wrapper {

    transform: translateX(-14px);

}

.switcher.small .switcher-wrapper .switcher-label {

    padding: 0 2px;

    visibility: hidden;

    width: calc(100% - 14px);

}

.switcher.small .switcher-wrapper .switcher-switch {

    height: 14px;

    width: 14px;

}

.switcher.small .switcher-wrapper .icon.icon-check {

    height: 7px;

    margin-left: 5px;

    width: 7px;

}

.switcher.small.on .switcher-wrapper {

    transform: translateX(0);

}

.switcher.large,

.switcher.medium {

    height: 30px;

    margin-left: 10px;

    width: 55px;

}

.switcher.medium .switcher-wrapper {

    transform: translateX(-24px);

}

.switcher.medium .switcher-wrapper .switcher-label {

    padding: 0 2px;

    width: calc(100% - 24px);

}

.switcher.medium .switcher-wrapper .switcher-switch {

    height: 24px;

    width: 24px;

}

.switcher.medium .switcher-wrapper .icon.icon-check {

    height: 12px;

    margin-left: 5px;

    width: 12px;

}

.switcher.medium.on .switcher-wrapper {

    transform: translateX(0);

}

.switcher.large {

    height: 33px;

    width: 64px;

}

.switcher.large .switcher-wrapper {

    transform: translateX(-27px);

}

.switcher.large .switcher-wrapper .switcher-label {

    margin-top: 2px;

    padding: 0 2px;

    width: calc(100% - 34px);

}

.switcher.large .switcher-wrapper .switcher-switch {

    height: 27px;

    width: 27px;

}

.switcher.large .switcher-wrapper .icon.icon-check {

    height: 16px;

    margin-bottom: 0;

    margin-left: 5px;

    width: 16px;

}

.switcher.large.on .switcher-wrapper {

    transform: translateX(0);

}

.switcher.large.on .switcher-wrapper .switcher-label {

    width: calc(100% - 28px);

}

.settings-pricing {

    display: flex;

    gap: 20px;

}

.settings-pricing__controls {

    flex: 1;

    grid-area: controls;

}

.settings-pricing__preview {

    display: flex;

    flex-direction: column;

    gap: 20px;

    width: 418px;

}

.settings-pricing__preview .user-fan-club-subscribe {

    background: #1b1b1d;

}

.settings-pricing__trial {

    grid-area: trial;

}

@media screen and (max-width: 1023px) {

    .settings-pricing {

        display: block;

    }

    .settings-pricing__preview {

        margin: 20px 0 0;

        width: auto;

    }

    .settings-pricing__trial {

        margin-top: 20px;

    }

}

.settings-pricing__preview-title {

    font-size: 20px;

    margin: 0 0 10px;

}

.settings-pricing__preview-description {

    font-size: 14px;

    margin: 10px 0 20px;

    opacity: 0.6;

}

.cd {

    background: #232325;

    border-radius: 12px;

}

.cd__header {

    align-items: center;

    cursor: pointer;

    display: flex;

    justify-content: space-between;

    padding: 20px;

    width: 100%;

    font-size: 0.875rem;

    line-height: 1.25rem;

}

.cd__icon-close {

    color: #707071;

    height: 24px;

    padding: 2px;

    transition: transform 0.15s ease-in-out;

    width: 24px;

}

.cd__icon-close--collapsed {

    transform: rotate(180deg);

}

.cd__content {

    padding: 0 20px 20px;

    font-size: 0.75rem;

    line-height: 1rem;

}

.cd__content--collapsed {

    height: 0;

    opacity: 0;

    overflow: hidden;

    padding: 0;

}

.settings-documents-status {

    background: #232325;

    border-radius: 12px;

}

.settings-documents-status--regular {

    padding: 20px;

}

.settings-documents-status--small {

    padding: 12px 20px;

}

.settings-documents-status--warning {

    background: #d21b4c;

}

.settings-documents-status__none .icon {

    margin: -2px 6px 0 0;

}

.settings-documents-status__verified {

    align-items: center;

    display: flex;

    font-size: 16px;

}

.settings-documents-status__verified > .icon {

    height: 20px;

    margin: 0 10px 0 0;

    width: 20px;

}

.settings-documents-status__small-description {

    font-size: 14px;

    opacity: 0.6;

}

.settings-documents-status__description {

    margin: 10px 0 0;

}

.settings-documents-status__description > .icon {

    height: 16px;

    margin: -2px 10px 0 0;

    width: 16px;

}

.settings-documents-status__description > .icon.icon-wrong {

    color: #d21b4c;

}

.notifications-settings-tumblers-block {

    column-gap: 20px;

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    margin: 32px 0 22px;

    row-gap: 20px;

}

@media screen and (max-width: 1023px) {

    .notifications-settings-tumblers-block {

        grid-template-columns: repeat(1, 1fr);

    }

}

.stories-grid-empty-state {

    align-items: center;

    display: flex;

    flex-direction: column;

    gap: 12px;

    margin: 120px auto 0;

}

.stories-grid-empty-state__icon {

    color: #a0a0a1;

    margin-bottom: 4px;

}

.bF {

    align-items: center;

    background: #1b1b1d no-repeat center;

    background-size: cover;

    border-radius: 12px;

    cursor: pointer;

    display: flex;

    position: relative;

}

.bF:hover .bF__pin-button:not(.bF__pin-button--pinned):not(:hover) {

    opacity: 0.4;

}

@media screen and (max-width: 767px) {

    .bF {

        border-radius: 2px;

        height: 50px;

    }

}

.bF::before {

    content: "";

    display: block;

    flex: 1;

    padding-bottom: 180%;

}

.bF__content {

    align-items: center;

    bottom: 0;

    display: flex;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

}

.bF__image {

    height: 100%;

    object-fit: contain;

    width: 100%;

}

.bF__date {

    font-size: 14px;

    font-weight: 500;

    left: 8px;

    line-height: 140%;

    pointer-events: none;

    position: absolute;

    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);

    text-transform: uppercase;

    top: 6px;

    z-index: 2;

}

.bF__views {

    align-items: center;

    bottom: 8px;

    display: flex;

    gap: 8px;

    left: 8px;

    pointer-events: none;

    position: absolute;

    z-index: 2;

}

.bF__shadow-top {

    background: linear-gradient(180deg, rgba(0, 0, 0, 0.6) 0, transparent 100%);

    height: 44px;

    left: 0;

    pointer-events: none;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 1;

}

.bF__shadow-bottom {

    background: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, 0.6) 100%);

    bottom: 0;

    height: 44px;

    left: 0;

    pointer-events: none;

    position: absolute;

    right: 0;

    z-index: 1;

}

.bF__pin-button {

    background: 0 0;

    border: 0;

    color: #fff;

    cursor: pointer;

    opacity: 0;

    outline: 0;

    padding: 0;

    position: absolute;

    right: 8px;

    top: 8px;

    transition: opacity 150ms ease;

    z-index: 2;

}

.bF__pin-button:hover {

    opacity: 0.8;

}

.bF__pin-button--pinned {

    opacity: 1;

}

.bF__pin-icon {

    filter: drop-shadow(0 1px 20px rgba(0, 0, 0, 0.2));

    transform: rotate(20deg);

}

.personal-notification {

    padding: 0.75rem 20px;

    position: relative;

}

.personal-notification__username {

    color: #fff;

}

.personal-notification-body {

    display: flex;

    flex-direction: row;

}

.personal-notification-body-left {

    height: 48px;

    margin-right: 0.75rem;

    width: 48px;

    flex: 1;

    flex-basis: auto;

    flex-grow: 0;

    flex-shrink: 1;

}

.personal-notification-body-middle {

    flex: 1;

    flex-basis: 0;

    flex-grow: 1;

    flex-shrink: 1;

    display: flex;

    flex-direction: column;

    min-width: 0;

    padding: 4px 0 0;

}

.personal-notification-body-middle-body {

    white-space: normal;

}

.personal-notification-body-middle-body.ellipsis {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.personal-notification-body-middle-footer {

    font-size: 0.625rem;

    line-height: 1rem;

}

.personal-notification-body-text {

    color: #a0a0a1;

    font-size: 15px;

    font-weight: 400;

    line-height: 18px;

    word-break: break-word;

}



.personal-notification-body-text a{

    color: #e0e0e2;

}

.personal-notification-body-right {

    align-items: center;

    height: 48px;

    margin-left: 0.75rem;

    display: flex;

    flex-direction: row;

}

.personal-notification-footer {

    justify-content: flex-start;

    margin: 0.375rem 0 0 60px;

    display: flex;

    flex-direction: row;

}

.personal-notification-footer .btn {

    margin-bottom: 0;

}

.personal-notification-counter {

    align-items: center;

    background-color: #fa5465;

    border-radius: 3px;

    color: #fff;

    height: 24px;

    justify-content: center;

    width: 30px;

    font-size: 0.875rem;

    line-height: 1.25rem;

    display: flex;

    flex-direction: row;

}

.personal-notification-image {

    height: 48px;

    width: 48px;

}

.personal-notification-image .user-status-icon {

    background: #232325;

}

.personal-notification__icon {

    height: 24px;

    width: 24px;

}

.personal-notification__icon-wrapper {

    align-items: center;

    border-radius: 16px;

    display: flex;

    height: 48px;

    justify-content: center;

    width: 48px;

}

.personal-notification__icon-wrapper--style--regular {

    background: #1b1b1d;

    color: #a0a0a1;

}

.personal-notification__icon-wrapper--style--warning {

    background: rgba(252, 207, 73, 0.2);

    color: #fccf49;

}

.personal-notification__icon-wrapper--style--positive {

    background: rgba(33, 176, 98, 0.2);

    color: #21b062;

}

.personal-notification__icon-wrapper--style--error {

    background: rgba(210, 27, 76, 0.2);

    color: #d21b4c;

}

.personal-notification-profile-link {

    position: relative;

    z-index: 6;

    display: block;

}

.personal-notification-profile-link:hover {

    opacity: 0.8;

}

.personal-notification-profile-link > .avatar {

    font-size: 2px;

}

.personal-notification-label {

    align-items: center;

    background: #232325;

    border-radius: 50%;

    bottom: -4px;

    display: flex;

    height: 28px;

    justify-content: center;

    position: absolute;

    right: -4px;

    width: 28px;

}

.personal-notification-closer {

    cursor: pointer;

    display: none;

    padding: 0.375rem;

    position: absolute;

    right: 0.375rem;

    top: 15px!important;

    z-index: 6;

}

.personal-notification-closer .icon {

    fill: rgba(255, 255, 255, 0.4);

    height: 10px;

    margin: 0;

    width: 10px;

}

.personal-notification-closer:hover {

    display: flex;

    flex-direction: row;

}

.personal-notification-closer:hover .icon {

    fill: rgba(255, 255, 255, 0.8);

}

.personal-notification-additional-comment {

    border: 1px solid #78797b;

    border-radius: 1px;

    margin-top: 12px;

    padding: 0.625rem;

    position: relative;

    font-size: 0.875rem;

    line-height: 1.25rem;

}

.personal-notification-additional-comment::after,

.personal-notification-additional-comment::before {

    content: "";

    left: 23px;

    position: absolute;

}

.personal-notification-additional-comment::after {

    border-bottom: 5px solid #3e3f42;

    border-left: 5px solid transparent;

    border-right: 5px solid transparent;

    margin-left: -5px;

    top: -4px;

}

.personal-notification-additional-comment::before {

    border-bottom: 6px solid #78797b;

    border-left: 6px solid transparent;

    border-right: 6px solid transparent;

    margin-left: -6px;

    top: -6px;

}

.personal-notification-additional-comment-navigable {

    color: #fff;

    cursor: pointer;

}

.personal-notification-additional-comment-navigable:hover {

    color: #ff6277;

}

.personal-notification-additional-comment-link {

    text-decoration: none;

    bottom: 0;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

}

.personal-notification-additional-comment-inners {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.personal-notification-background-link {

    z-index: 5;

    bottom: 0;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

}

.personal-notification-description-text {

    color: rgba(255, 255, 255, 0.5);

    font-size: 0.625rem;

    line-height: 1rem;

}

.personal-notification-description-text * {

    font-size: 0.625rem;

    line-height: 1rem;

}

.personal-notification:hover .personal-notification-closer {

    display: flex;

    flex-direction: row;

}

.personal-notification .new-fan-club-content-personal-notification-text {

    margin: 1px 0 14px;

    max-width: 260px;

}

.personal-notification.new-fan-club-content-personal-notification .btn {

    margin-bottom: 0;

}

.personal-notification.content-status-changed-personal-notification .personal-notification-image {

    fill: #fa7055;

}

.personal-notification.content-status-changed-personal-notification .personal-notification-body-middle {

    justify-content: center;

}

.personal-notification.tip-personal-notification-with-comment .personal-notification-footer {

    margin-top: 0.75rem;

}

.personal-notification-appearing-trash {

    align-items: center;

    background: #38010f;

    height: 100%;

    justify-content: center;

    width: 72px;

    display: flex;

    flex-direction: row;

}

.personal-notification-appearing-trash .icon {

    color: #d21b4c;

    height: 16px;

    width: 16px;

}

.fan-club-user-joined-personal-notification .personal-notification-body-text {

    color: rgba(255, 255, 255, 0.8);

}

.fan-club-user-joined-personal-notification .personal-notification-body-text .accent {

    color: #fff;

}

.fan-club-subscription-extended-personal-notification-text {

    color: rgba(255, 255, 255, 0.8);

    margin: 1px 0 14px;

}

.fan-club-subscription-extended-personal-notification-text-months {

    color: #fff;

    font-weight: 700;

}

.cb {

    align-items: center;

    display: flex;

    gap: 10px;

    justify-content: flex-start;

    margin-top: 8px;

}

.cb__connect-icon {

    margin-right: 8px;

}

.cb__connect-link {

    align-items: center;

    background: #343437;

    border-radius: 12px;

    color: #fff;

    display: inline-flex;

    font-weight: 400;

    height: 32px;

    padding: 0 20px;

    transition: background 250ms;

}

.cb__connect-link:hover {

    background: #424248;

}

.css-popover {

    position: relative;

}

.css-popover-content-top {

    opacity: 0;

    pointer-events: none;

    position: absolute;

    transition-duration: 0.15s;

    transition-property: opacity, transform;

    transition-timing-function: ease-in-out;

    z-index: 1000;

    left: 50%;

    top: 0;

    transform: translate(-50%, calc(-100% + 10px - 5px));

}

@media (prefers-reduced-motion) {

    .css-popover-content-top {

        transition-property: opacity;

    }

}

.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: 0.15s;

    transition-property: opacity, transform;

    transition-timing-function: ease-in-out;

    z-index: 1000;

    bottom: 0;

    left: 50%;

    transform: translate(-50%, calc(100% - 10px + 5px));

}

@media (prefers-reduced-motion) {

    .css-popover-content-bottom {

        transition-property: opacity;

    }

}

.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: 0.15s;

    transition-property: opacity, transform;

    transition-timing-function: ease-in-out;

    z-index: 1000;

    left: 0;

    top: 50%;

    transform: translate(calc(-100% + 10px - 5px), -50%);

}

@media (prefers-reduced-motion) {

    .css-popover-content-left {

        transition-property: opacity;

    }

}

.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: 0.15s;

    transition-property: opacity, transform;

    transition-timing-function: ease-in-out;

    z-index: 1000;

    right: 0;

    top: 50%;

    transform: translate(calc(100% - 10px + 5px), -50%);

}

@media (prefers-reduced-motion) {

    .css-popover-content-right {

        transition-property: opacity;

    }

}

.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: 0.15s;

    transition-property: opacity, transform;

    transition-timing-function: ease-in-out;

    z-index: 1000;

    right: 0;

    top: 0;

    transform: translate(0, calc(-100% + 10px - 5px));

}

@media (prefers-reduced-motion) {

    .css-popover-content-topleft {

        transition-property: opacity;

    }

}

.css-popover-content-topleft-shown {

    opacity: 1;

    pointer-events: auto;

    transform: translate(0, calc(-100% - 5px));

}

.css-popover-content-topright {

    opacity: 0;

    pointer-events: none;

    position: absolute;

    transition-duration: 0.15s;

    transition-property: opacity, transform;

    transition-timing-function: ease-in-out;

    z-index: 1000;

    left: 0;

    top: 0;

    transform: translate(0, calc(-100% + 10px - 5px));

}

@media (prefers-reduced-motion) {

    .css-popover-content-topright {

        transition-property: opacity;

    }

}

.css-popover-content-topright-shown {

    opacity: 1;

    pointer-events: auto;

    transform: translate(0, calc(-100% - 5px));

}

.css-popover-content-bottomleft {

    opacity: 0;

    pointer-events: none;

    position: absolute;

    transition-duration: 0.15s;

    transition-property: opacity, transform;

    transition-timing-function: ease-in-out;

    z-index: 1000;

    bottom: 0;

    left: 0;

    transform: translate(-10%, calc(100% - 10px + 5px));

}

@media (prefers-reduced-motion) {

    .css-popover-content-bottomleft {

        transition-property: opacity;

    }

}

.css-popover-content-bottomleft-shown {

    opacity: 1;

    pointer-events: auto;

    transform: translate(0, calc(100% + 5px));

}

.css-popover-content-bottomright {

    opacity: 0;

    pointer-events: none;

    position: absolute;

    transition-duration: 0.15s;

    transition-property: opacity, transform;

    transition-timing-function: ease-in-out;

    z-index: 1000;

    right: 0;

    top: 100%;

    transform: translate(10%, -10%);

}

@media (prefers-reduced-motion) {

    .css-popover-content-bottomright {

        transition-property: opacity;

    }

}

.css-popover-content-bottomright-shown {

    opacity: 1;

    pointer-events: auto;

    transform: translate(0, 0);

}

.css-popover-content-middleleft {

    opacity: 0;

    pointer-events: none;

    position: absolute;

    transition-duration: 0.15s;

    transition-property: opacity, transform;

    transition-timing-function: ease-in-out;

    z-index: 1000;

    right: 0;

    top: 100%;

    transform: translate(-23%, calc(-100% - 10px + 5px));

}

@media (prefers-reduced-motion) {

    .css-popover-content-middleleft {

        transition-property: opacity;

    }

}

.css-popover-content-middleleft-shown {

    opacity: 1;

    pointer-events: auto;

    transform: translate(-23%, calc(-100% + 5px));

}

.css-popover-content-middleright {

    opacity: 0;

    pointer-events: none;

    position: absolute;

    transition-duration: 0.15s;

    transition-property: opacity, transform;

    transition-timing-function: ease-in-out;

    z-index: 1000;

    left: 0;

    top: 100%;

    transform: translate(25%, calc(-100% - 10px + 5px));

}

@media (prefers-reduced-motion) {

    .css-popover-content-middleright {

        transition-property: opacity;

    }

}

.css-popover-content-middleright-shown {

    opacity: 1;

    pointer-events: auto;

    transform: translate(25%, calc(-100% + 5px));

}

.bG {

    display: grid;

    gap: 20px;

    grid-template-columns: repeat(8, 1fr);

    margin-top: 42px;

}

@media screen and (max-width: 1365px) {

    .bG {

        grid-template-columns: repeat(6, 1fr);

    }

}

@media screen and (max-width: 1279px) {

    .bG {

        grid-template-columns: repeat(5, 1fr);

    }

}

@media screen and (max-width: 767px) {

    .bG {

        gap: 2px;

        grid-template-columns: repeat(auto-fit, minmax(108px, 1fr));

    }

}

.bG__add-story {

    align-items: center;

    background: #1b1b1d;

    border-radius: 12px;

    cursor: pointer;

    display: flex;

    flex-direction: column;

    gap: 10px;

    justify-content: center;

    transition: all ease 200ms;

}

.bG__add-story:hover {

    background: #232325;

}

.bG__add-story:active {

    transform: translateY(2px);

}

@media screen and (max-width: 767px) {

    .bG__add-story {

        border-radius: 0;

    }

}

.bG__skeleton-item {

    background: #111113;

    border-radius: 12px;

    display: flex;

}

.bG__skeleton-item::before {

    content: "";

    display: block;

    flex: 1;

    padding-bottom: 180%;

}

@media screen and (max-width: 767px) {

    .bG__skeleton-item {

        border-radius: 0;

    }

}

.island-block {

    border-radius: 12px;

}

.island-block--overflow-hidden {

    overflow: hidden;

}

.island-block--color--grey-500 {

    background: #343437;

}

.island-block--color--grey-600 {

    background: #232325;

}

.island-block--radius--full {

    border-radius: 12px;

}

.island-block--radius--bottom {

    border-radius: 0 0 12px 12px;

}

.info-block,

.info-block--color--regular {

    background: #232325;

}

.info-block--color--light {

    background: #343437;

}

.info-block--size--small {

    border-radius: 10px;

    padding: 10px;

}

.info-block--size--medium {

    border-radius: 12px;

    padding: 24px;

}

.info-block__title {

    font-size: 22px;

    font-weight: 500;

    line-height: 27px;

    margin: 0 0 20px;

}

.info-block__footer {

    border-top: 2px solid rgba(255, 255, 255, 0.05);

    margin: 20px 0 0;

    padding: 20px 0 0;

}

.info-block-label {

    color: #bbb;

    display: flex;

    font-size: 11px;

    font-weight: 400;

    line-height: 17px;

}

.info-block-label--center {

    align-items: center;

}

.info-block-label__left {

    padding: 0 6px 0 0;

}

.info-block-label__icon {

    color: #fff;

}

.info-block-label__icon--size--small {

    height: 16px;

    width: 16px;

}

.info-block-list {

    list-style: none;

}

.info-block-list__item {

    display: flex;

    font-size: 13px;

    font-weight: 400;

    margin: 8px 2px;

    padding: 0;

}

.info-block-list__item-num {

    margin: 0 4px 0 0;

}

.bm {

    display: grid;

    grid-gap: 20px;

    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));

}

.bm__skeleton-item {

    animation: skeleton-animation;

    animation-duration: 1s;

    animation-iteration-count: infinite;

    animation-timing-function: ease-in-out;

    background: #1b1b1d;

    border-radius: 16px;

    height: 300px;

}

.bm__skeleton-item:nth-child(2n) {

    animation-delay: 300ms;

}

.bK {

    contain: strict;

    min-height: 264px

}



.bK__list {

    display: flex

}



.bK__item {

    margin-right: 12px;

    min-width: 162px;

    width: 162px

}



.bK__item:last-child {

    margin: 0

}



.bk__content {

    align-items: center;

    background: #1b1b1d;

    border-radius: 12px;

    display: flex;

    justify-content: flex-start;

    min-height: 80px;

    padding: 0 20px;

}

@media screen and (max-width: 639px) {

    .bk__content {

        margin-bottom: 10px;

    }

}

@media (hover: hover) {

    .bk__content--with-hover:hover,

    .bk__content--with-hover:hover .bk__users-count {

        background: #232325;

    }

    .bk__content--with-hover:hover .bk__drag {

        opacity: 1;

    }

    .bk__content--with-hover:hover .bk__info {

        transform: translateX(0);

    }

    .bk__content:hover .bk__favorite-button {

        opacity: 1;

        pointer-events: auto;

    }

}

@media screen and (max-width: 639px) {

    .bk__content {

        align-items: flex-start;

        padding: 16px;

    }

}

.bk__name {

    color: #fff;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.bk__drag {

    color: #707071;

    opacity: 0;

    overflow: hidden;

    transition: opacity linear 200ms;

}

.bk__info {

    flex: 1;

    margin-left: 10px;

    transform: translateX(-24px);

    transition: transform linear 200ms;

}

@media screen and (max-width: 639px) {

    .bk__info {

        margin-left: 0;

    }

}

.bk__title {

    align-items: center;

    grid-gap: 6px;

    justify-content: start;

    margin-bottom: 4px;

}

.bk__description-wrapper,

.bk__title {

    display: grid;

    grid-auto-flow: column;

}

.bk__description {

    color: #a0a0a1;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    width: calc(100% - 36px);

}

.bk__actions {

    display: flex;

    gap: 10px;

}

.bk__users-count {

    align-items: center;

    background: inherit;

    display: flex;

    flex-wrap: nowrap;

    gap: 10px;

    justify-content: flex-start;

    margin-right: 30px;

}

@media screen and (max-width: 639px) {

    .bk__users-count {

        margin-right: 0;

        margin-top: 18px;

    }

}

.bk__favorite-button {

    opacity: 0;

    pointer-events: none;

}

.bk__favorite-button--visible {

    opacity: 1;

    pointer-events: auto;

}

.b8 {

    display: flex;

    min-height: 460px;

}

.b8__controls {

    flex: 1 0 540px;

}

.b8__preview {

    display: flex;

    flex-direction: column;

    margin-left: 20px;

    max-width: 100%;

    width: 418px;

}

@media screen and (max-width: 1023px) {

    .b8 {

        display: block;

    }

    .b8__controls {

        margin-bottom: 20px;

    }

    .b8__preview {

        margin-left: 0;

    }

}

.media-browser__list {

    margin-top: 20px;

    max-height: 450px;

    overflow: auto;

}

.media-browser .placeholder {

    align-items: center;

    display: flex;

    height: 200px;

    justify-content: center;

    position: relative;

    width: 100%;

}

.media-browser .empty-state {

    align-items: center;

    display: flex;

    flex-direction: column;

    opacity: 0.5;

}

.media-browser .empty-state-icon {

    fill: currentColor;

    margin: 0;

}

.media-browser .empty-state-icon.icon-camera,

.media-browser .empty-state-icon.icon-photo-2 {

    height: 78px;

    width: 80px;

}

.media-browser .empty-state-icon.icon-new-upload {

    height: 64px;

    width: 56px;

}

.media-browser .empty-state-text {

    font-size: 16px;

    margin-top: 20px;

}

.browse-menu {

    border-bottom: 1px solid rgba(248, 248, 248, 0.1);

    margin-top: 15px;

}

.browse-button.a11y-button {

    color: rgba(255, 255, 255, 0.6);

    font-size: 16px;

    margin-bottom: -1px;

    padding: 15px 0;

}

.browse-button:not(:last-child) {

    margin-right: 30px;

}

.browse-button:hover,

.searchable-head .icon-container:hover {

    color: #fff;

}

.browse-button.active {

    border-bottom: 3px solid var(--primary-border);

    opacity: 1;

}

@media (max-width: 767px) {

    .browse-button {

        font-size: 13px;

    }

    .browse-button:not(:last-child) {

        margin-right: 20px;

    }

}

.club-members-info-title {

    margin-right: 20px;

}

@media screen and (max-width: 639px) {

    .club-members-info-title {

        margin-right: 0;

    }

}

.club-members-delay-info {

    font-size: 0.813rem;

    align-items: center;

    color: rgba(255, 255, 255, 0.8);

    display: flex;

    margin: 0;

}

.club-members-delay-info .time-icon {

    margin-right: 8px;

}

.searchable-head,

.v {

    align-items: center;

    -webkit-user-select: none;

    user-select: none;

}

.searchable-head {

    display: flex;

    justify-content: start;

    position: relative;

}

.searchable-head .icon-container {

    align-items: center;

    cursor: pointer;

    display: flex;

    flex-shrink: 1;

    justify-content: center;

    margin-left: 12px;

    position: relative;

}

.searchable-head .icon-container:after {

    background: rgba(255, 255, 255, 0.2);

    border-radius: 4px;

    content: "";

    display: none;

    height: 32px;

    left: 50%;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

    width: 32px;

}

.searchable-head .icon-container:hover .icon {

    fill: #fff;

}

.searchable-head .icon-close-container {

    position: absolute;

    right: 16px;

}

.searchable-head .icon-close-container:hover .icon-close {

    color: rgba(255, 255, 255, 0.6);

}

.searchable-head.icon-first {

    flex-direction: row-reverse;

    justify-content: flex-end;

}

.searchable-head.icon-first .icon-container {

    margin-left: 0;

    margin-right: 12px;

}

.searchable-head .icon-search {

    color: rgba(255, 255, 255, 0.6);

    height: 24px;

    margin: 0;

    width: 24px;

}

.searchable-head .icon-close {

    color: #49494a;

    height: 20px;

    margin: 0;

    width: 20px;

}

.searchable-head input.input.text-medium {

    min-width: 178px;

    padding-right: 32px;

}

.v {

    cursor: pointer;

    display: inline-flex;

    gap: 8px;

    text-align: right;

    white-space: nowrap;

}

.v__icons-container {

    align-items: center;

    display: flex;

    flex-direction: column;

    gap: 2px;

    justify-content: center;

}

.v__icon-sort {

    color: rgba(255, 255, 255, 0.2);

    height: 5px;

    margin-left: 5px;

    width: 10px;

}

.v__icon-sort--up {

    transform: rotate(180deg);

}

.v:hover .v__icon-sort,

.v__icon-sort--active {

    color: rgba(255, 255, 255, 0.6);

}

.on-boarding-slide {

    min-height: 558px;

    padding: 120px 54px 78px 72px;

}

.on-boarding-slide__icon > .smile {

    height: 78px;

    width: 78px;

}

.on-boarding-slide__title {

    font-size: 34px;

    font-weight: 700;

    line-height: 42px;

    margin: 24px 0;

}

.on-boarding-slide__description {

    color: #bbb;

    font-size: 16px;

    font-weight: 400;

    line-height: 26px;

}

@media screen and (max-width: 767px) {

    .on-boarding-slide {

        min-height: auto;

        padding: 32px 24px;

        text-align: center;

    }

    .on-boarding-slide__icon > .smile {

        height: 56px;

        width: 56px;

    }

    .on-boarding-slide__title {

        font-size: 26px;

        line-height: 32px;

        margin: 12px 0;

    }

    .on-boarding-slide__description {

        font-size: 14px;

        font-weight: 500;

        line-height: 22px;

    }

}

.b4 {

    width: 100%;

}

.b4__grid {

    display: grid;

    gap: 20px;

    grid-template-columns: repeat(2, minmax(400px, 1fr));

}

@media screen and (max-width: 1023px) {

    .b4__grid {

        display: flex;

        flex-direction: column;

    }

}

.b4__grid-cell {

    flex: 1;

}

.b4__grid-cell--full {

    grid-column: 1/3;

}

.b4__period-header {

    align-items: center;

    display: flex;

    flex-wrap: wrap;

    justify-content: space-between;

    margin: 0 0 24px;

}

.b4__period-date {

    font-size: 16px;

}

.b4__period-links {

    align-items: center;

    display: flex;

    gap: 28px;

}

.b4__period-link {

    background: 0 0;

    border: 0;

    color: #707071;

    cursor: pointer;

    font-size: 14px;

    position: relative;

}

.b4__period-link--active {

    color: #cfcfd0;

    pointer-events: none;

}

.b4__period-link:hover {

    color: #cfcfd0;

}

.b4__period-link:not(:last-child)::before {

    color: #49494a;

    content: "â€¢";

    position: absolute;

    right: -15px;

}

.bT__columns {

    display: flex;

    gap: 20px;

}

@media screen and (max-width: 1279px) {

    .bT__columns {

        flex-wrap: wrap;

    }

}

.bT__column {

    align-self: flex-start;

    display: flex;

    flex: 1;

    flex-basis: 590px;

    flex-direction: column;

    gap: 20px;

    width: 590px;

}

@media screen and (max-width: 639px) {

    .bT__column {

        flex-basis: 300px;

        width: 300px;

    }

}

.bT .pagination {

    justify-content: flex-end;

    margin-top: 0;

}

.ck {

    align-items: flex-start;

    border-bottom: 1px solid #e7e7e7;

    display: flex;

    flex-wrap: wrap;

    gap: 12px 20px;

    justify-content: flex-start;

    margin: 20px auto;

    max-width: 100%;

    padding: 0 12px 20px;

    width: 924px;

}

.ck__offer {

    flex: 1;

    min-width: 50%;

}

.ck__offer-title {

    color: #000;

    font-size: 16px;

    font-weight: 600;

    line-height: 18px;

    margin-bottom: 4px;

}

.ck__offer-vat {

    color: #a0a0a1;

    font-size: 12px;

    font-weight: 600;

    line-height: 18px;

}

.ck__button {

    align-items: center;

    background: #eee;

    border: 0;

    border-radius: 6px;

    cursor: pointer;

    display: flex;

    height: 40px;

    justify-content: center;

    max-width: 100%;

    outline: 0;

    padding: 0 20px;

    width: 340px;

}

@media screen and (max-width: 942px) {

    .ck {

        margin: 0 auto 20px;

    }

}

.upload-media-item-add {

    background: rgba(255, 255, 255, 0.05);

    border: 2px dashed rgba(255, 255, 255, 0.2);

    border-radius: 10px;

    color: rgba(255, 255, 255, 0.6);

    cursor: pointer;

    position: relative;

    transition: background 0.3s, border-color 0.3s, color 0.3s;

}

.upload-media-item-add:hover {

    background: rgba(255, 255, 255, 0.1);

    border-color: rgba(255, 255, 255, 0.3);

    color: #fff;

}

.upload-media-item-add__icon {

    left: 50%;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

}

.z {

    background-color: #343437;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    border-radius: 10px;

    height: 76px;

    margin-right: 20px;

    position: relative;

    width: 76px;

    -webkit-user-select: none;

    user-select: none;

}

.z--has-error .z__indicators,

.z--in-moderation .z__indicators,

.z--uploading .z__indicators {

    opacity: 1;

    pointer-events: auto;

}

.z--draggable {

    cursor: grab;

}

.z--hover .z__drag-cover-content {

    opacity: 1;

    transform: translateY(0);

}

.z__badge {

    left: 4px;

    pointer-events: none;

    position: absolute;

    top: 4px;

}

.z__time {

    align-items: center;

    background: rgba(0, 0, 0, 0.8);

    border-radius: 4px;

    bottom: 4px;

    color: #a0a0a1;

    display: flex;

    font-size: 10px;

    height: 14px;

    padding: 0 3px;

    pointer-events: none;

    position: absolute;

    right: 4px;

}

.z__remove-button {

    align-items: center;

    background-color: #5b5b5b;

    border: 3px solid #1b1b1d;

    border-radius: 50%;

    cursor: pointer;

    display: flex;

    height: 24px;

    justify-content: center;

    position: absolute;

    right: -8px;

    top: -12px;

    transition: all ease 0.25s;

    width: 24px;

    z-index: 1;

}

.z__remove-button .icon {

    color: #fff;

    fill: #fff;

    margin: 0;

}

.z__remove-button:hover {

    background-color: #af262f;

}

.z__indicators {

    align-items: center;

    background-color: rgba(0, 0, 0, 0.8);

    border-radius: inherit;

    bottom: 0;

    display: flex;

    justify-content: center;

    left: 0;

    opacity: 0;

    overflow: hidden;

    pointer-events: none;

    position: absolute;

    right: 0;

    top: 0;

    transition: opacity 0.5s;

}

.z__uploading {

    animation: donut-spin 1.2s linear infinite;

}

.z__processing {

    color: #fff;

    font-size: 10px;

    font-weight: 500;

    word-break: break-word;

}

.z__processing--in-moderation {

    color: #fccf49;

}

.z__error-icon {

    left: 5px;

    position: absolute;

    top: 5px;

}

.z__error-icon .icon {

    color: #e12947;

    fill: #e12947;

    height: 14px;

    margin: 0;

    width: 14px;

}

.z__try-again {

    cursor: pointer;

}

.z__try-again .icon {

    color: #fff;

    fill: #fff;

    height: 26px;

    margin: 0;

    transition: all ease 0.25s;

    width: 26px;

}

.z__try-again:hover .icon {

    opacity: 0.7;

}

.z__cover-badge {

    border-bottom-right-radius: 8px;

    border-top-left-radius: 8px;

    color: #fff;

    height: 40px;

    left: 0;

    overflow: hidden;

    position: absolute;

    top: 0;

    width: 40px;

    z-index: 1;

}

.z__cover-badge:before {

    border-color: #d60908 transparent transparent #d60908;

    border-style: solid;

    border-width: 20px;

    content: "";

    display: block;

    left: 0;

    position: absolute;

    top: 0;

}

.z__cover-badge-icon {

    align-items: center;

    cursor: pointer;

    display: inline-flex;

    justify-content: center;

    margin-left: 4px;

    margin-top: 4px;

    position: relative;

    z-index: 1;

}

.z__drag-cover {

    border-radius: 0 0 10px 10px;

    bottom: 0;

    display: flex;

    height: 30%;

    left: 0;

    overflow: hidden;

    pointer-events: none;

    position: absolute;

    right: 0;

}

.z__drag-cover-content {

    align-items: center;

    background: rgba(5, 5, 6, 0.8);

    color: #fff;

    display: flex;

    flex: 1;

    flex-direction: column;

    justify-content: center;

    opacity: 0;

    transform: translateY(30%);

    transition: transform 250ms ease, opacity 250ms ease;

    width: 100%;

}

.z__drag-cover-content::after,

.z__drag-cover-content::before {

    background: #fff;

    border-radius: 12px;

    content: "";

    display: block;

    height: 2px;

    width: 12px;

}

.z__drag-cover-content::before {

    margin-bottom: 4px;

}

.z__drag-cover-content--teaser {

    opacity: 1;

    transform: translateY(0);

}

.z__drag-cover-content--teaser::after,

.z__drag-cover-content--teaser::before {

    display: none;

}

.panel-select-price {

    margin: 0 0 20px;

    position: relative;

    z-index: 3;

}

.panel-select-price__left {

    flex: 1;

}

.panel-select-price__right {

    max-width: 80px;

}

.panel-select-price__content {

    align-items: center;

    display: flex;

    gap: 20px;

}

.users-groups-accordion__item {

    cursor: pointer;

    display: flex;

    font-size: 12px;

    justify-content: space-between;

    padding: 10px 12px;

}

.users-groups-accordion__item:hover,

.users-groups-accordion__list-item:hover {

    background: #050506;

}

.users-groups-accordion__item-left {

    align-items: center;

    display: grid;

    grid-auto-flow: column;

    grid-gap: 4px;

    max-width: 60%;

}

.users-groups-accordion__item-label {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.users-groups-accordion__list {

    border-top: 1px solid rgba(255, 255, 255, 0.1);

    margin: 8px 0 0;

    padding: 8px 0 0;

}

.users-groups-accordion__list-item {

    align-items: center;

    cursor: pointer;

    display: flex;

    height: 48px;

    overflow: hidden;

    padding: 4px 12px;

}

.users-groups-accordion__list-item-badge {

    color: #5f5f61;

    font-size: 11px;

    position: absolute;

    right: 16px;

}

.users-groups-accordion__list-item-badge--alert {

    color: #d21b4c;

}

.users-groups-accordion__title {

    display: flex;

    font-size: 12px;

    justify-content: space-between;

    line-height: 20px;

    padding: 0 12px;

}

.V {

    background: #111113;

    border: 1px solid #343437;

    border-radius: 12px;

    max-width: 360px;

    padding: 20px;

}

.V__selector-header {

    align-items: center;

    display: flex;

    justify-content: space-between;

    margin-bottom: 16px;

}

.V__selector-header-title {

    align-items: center;

    color: #fff;

    display: flex;

    font-size: 18px;

    font-weight: 700;

    gap: 10px;

    line-height: 22px;

}

.V__selector-header-controls {

    align-items: center;

    display: flex;

    gap: 8px;

}

.V__control-button {

    background: 0 0;

    border: 0;

    color: #a0a0a1;

    cursor: pointer;

    display: grid;

    height: 24px;

    place-items: center;

    width: 24px;

}

.V__control-button:disabled {

    color: #49494a;

}

.V__control-button:not(:disabled):hover {

    color: #fff;

}

.V__days {

    align-items: center;

    display: grid;

    gap: 6px;

    grid-template-columns: repeat(7, 40px);

    height: 40px;

    justify-content: center;

}

.V__day-cell {

    color: #fff;

    cursor: pointer;

    display: grid;

    font-size: 12px;

    font-weight: 700;

    line-height: 15px;

    place-items: center;

}

.V__dates {

    display: grid;

    font-weight: 400;

    gap: 6px;

    grid-template-columns: repeat(7, 40px);

    grid-template-rows: repeat(6, 40px);

    justify-content: center;

}

.V__date-cell {

    border-radius: 10px;

    color: #fff;

    cursor: pointer;

    display: grid;

    font-size: 12px;

    place-items: center;

    -webkit-user-select: none;

    user-select: none;

}

.V__date-cell:hover:not(.V__date-cell--disabled, .V__date-cell--selected) {

    background: #343437;

}

.V__date-cell--today:not(.V__date-cell--selected) {

    border: 2px solid rgba(255, 255, 255, 0.4);

    font-weight: 700;

}

.V__date-cell--selected {

    background: #d60908;

    font-weight: 700;

}

.V__date-cell--disabled {

    color: #707071;

    cursor: default;

}

.V__years {

    display: grid;

    font-weight: 400;

    gap: 6px;

    grid-auto-rows: 40px;

    grid-template-columns: repeat(7, 40px);

    justify-content: center;

    margin: 0-20px;

    max-height: 310px;

    padding: 20px;

}

.V__mode-button {

    align-items: center;

    background: 0 0;

    border: 0;

    color: rgba(255, 255, 255, 0.6);

    cursor: pointer;

    display: inline-flex;

    justify-content: center;

    outline: 0;

    padding: 0;

}

.V__mode-button-icon {

    height: 24px;

    width: 24px;

}

.V__mode-button-icon--rotated {

    transform: rotate(180deg);

}

.badge,

.text-area-icon__placeholder {

    align-items: center;

    display: flex;

    font-size: 13px;

}

.text-area-icon__placeholder {

    color: #fff;

}

.text-area-icon__placeholder > .icon {

    height: 20px;

    margin: 0 12px 0 0;

    width: 20px;

}

.badge {

    border-radius: 6px;

    font-weight: 700;

    padding: 0 8px;

}

.badge,

.badge--size--small {

    height: 20px;

}

.badge--size--regular {

    height: 24px;

}

.badge--type--primary {

    background: #d60908;

    color: #fff;

}

.badge--type--teaser {

    background: #fccf49;

    color: #000;

}

.badge--type--positive {

    background: #21b062;

    color: #fff;

}

.badge--type--error {

    background: #d21b4c;

    color: #fff;

}

.masked-input-wrapper {

    position: relative;

}

.masked-input-invisible {

    left: 0;

    opacity: 0;

    position: absolute;

    top: 0;

    width: 100%;

    z-index: 1;

}

.masked-input-invisible ~ input {

    z-index: 0;

}

.chat-skeleton {

    padding: 27px 12px 8px;

}

.chat-skeleton .message-skeleton {

    align-items: flex-end;

    display: flex;

}

.chat-skeleton .message-skeleton:not(:first-child) {

    margin-top: 32px;

}

.chat-skeleton .right-message {

    display: flex;

}

.chat-skeleton .right-message .skeleton-message-content {

    align-items: flex-end;

    justify-content: flex-end;

}

.chat-skeleton .skeleton-message-content {

    display: flex;

    flex: 1;

    flex-direction: column;

}

.chat-skeleton .avatar-skeleton {

    animation: skeleton-animation 3s infinite linear;

    background: linear-gradient(90deg, #515255 20%, #535457 28%, #57595c 35%, #535457 42%, #515255 50%);

    background-size: 300% 100%;

    will-change: background-position;

    height: 24px;

    margin-right: 8px;

    width: 24px;

    border-radius: 50%;

}

.chat-skeleton .skeleton-dashes {

    display: flex;

    justify-content: inherit;

    width: 100%;

}

.chat-skeleton .skeleton-dashes .skeleton-dash:first-child {

    margin-right: 8px;

}

.chat-skeleton .skeleton-dash {

    animation: skeleton-animation 3s infinite linear;

    background: linear-gradient(90deg, #515255 20%, #535457 28%, #57595c 35%, #535457 42%, #515255 50%);

    background-size: 300% 100%;

    will-change: background-position;

    border-radius: 37px;

    height: 6px;

}

.chat-skeleton .skeleton-line:not(:first-child) {

    margin-top: 8px;

}

.messenger-chat-header {

    background-color: #232325;

    border: 1px solid #515151;

    border-radius: 8px 8px 0 0;

    cursor: pointer;

    position: relative;

    -webkit-user-select: none;

    user-select: none;

}

.messenger-chat-header--fixed {

    bottom: calc(100% - 62px);

    left: 0;

    position: fixed;

    right: 0;

    z-index: 1;

}

.messenger-chat-header__content {

    align-items: center;

    display: flex;

    overflow: hidden;

    padding: 5px 8px;

}

@media (max-width: 639px) {

    .messenger-chat-header__content {

        padding: 14px 16px;

    }

}

.messenger-chat-header__placeholder {

    height: 62px;

}

.messenger-chat-header__name .displayname__name {

    max-width: 170px;

}

.messenger-chat-header__left-block {

    align-items: center;

    display: flex;

    flex-grow: 1;

    flex-shrink: 0;

}

.messenger-chat-header .avatar-wrapper {

    height: 32px;

    margin-right: 11px;

    position: relative;

    width: 32px;

}

.messenger-chat-header .avatar-wrapper .online {

    background: #232325;

    height: 8px;

    left: -2px;

    top: -2px;

    width: 8px;

}

.messenger-chat-header .back-to-messenger-button {

    margin-right: 14px;

}

.messenger-chat-header .back-to-messenger-button:hover {

    background: rgba(248, 248, 248, 0.1);

    opacity: 1;

}

.messenger-chat-header .back-to-messenger-button,

.messenger-chat-header .header-button,

.messenger-chat-header .more-button {

    border-radius: 2px;

    height: 24px;

    width: 24px;

    opacity: 0.5;

}

.messenger-chat-header .header-button:hover {

    background: rgba(248, 248, 248, 0.1);

    opacity: 0.7;

}

.messenger-chat-header .more-button {

    margin-left: 8px;

}

.messenger-chat-header .more-button:hover {

    background: rgba(248, 248, 248, 0.1);

}

.messenger-chat-header .more-icon {

    color: #fff;

}

.messenger-chat-header .unread-messages {

    background-color: var(--primary-light);

    border-radius: 50%;

    height: 8px;

    margin: 0 6px;

    width: 8px;

}

.messenger-chat-header .header-icon {

    color: #fff;

    margin: 0;

}

.messenger-chat-header .collapse-button {

    margin-right: 10px;

    opacity: 0.5;

    transition: opacity 200ms;

}

@media (max-width: 639px) {

    .messenger-chat-header .collapse-button {

        display: none;

    }

}

.messenger-chat-header .collapse-button .hidden {

    opacity: 0;

}

.messenger-chat-header .collapse-icon {

    height: 24px;

    width: 24px;

}

.messenger-chat-header .close-icon {

    height: 20px;

    width: 20px;

}

.notifications-tooltip-content {

    width: 100%;

}

.notifications-tooltip-content .visible-wrapper {

    background-color: #1b1b1d;

    border-radius: 12px;

    box-shadow: 0 0 13px rgba(0, 0, 0, 0.45);

    color: #fff;

    padding: 0 20px;

    position: relative;

    width: 100%;

}

.notifications-tooltip-content.expanded .visible-wrapper {

    transform: none;

}

.notifications-tooltip-content .close {

    align-items: center;

    color: rgba(255, 255, 255, 0.4);

    cursor: pointer;

    display: flex;

    height: 30px;

    justify-content: center;

    position: absolute;

    right: 0;

    top: 0;

    width: 30px;

}

.notifications-tooltip-content .close:hover {

    color: rgba(255, 255, 255, 0.8);

}

.notifications-tooltip-content .close .icon {

    height: 10px;

    margin: 0;

    width: 10px;

}

.notifications-tooltip-content .main-settings {

    align-items: center;

    display: flex;

    padding: 20px 0;

}

.notifications-tooltip-content .bell {

    align-items: center;

    background-color: rgba(255, 255, 255, 0.09);

    border-radius: 26px;

    display: flex;

    flex-shrink: 0;

    height: 52px;

    justify-content: center;

    margin-right: 14px;

    width: 52px;

}

.notifications-tooltip-content .bell .icon {

    color: rgba(255, 255, 255, 0.6);

    height: 24px;

    margin: 0;

    width: 24px;

}

.notifications-tooltip-content .notifications-tooltip-title {

    flex-grow: 1;

    font-size: 14px;

    line-height: 17px;

    margin-right: 10px;

    min-width: 0;

}

.notifications-tooltip-content .main-switcher {

    flex-shrink: 0;

    margin: 0;

}

.notifications-tooltip-content.active .bell {

    background-color: rgba(163, 73, 252, 0.16);

}

.notifications-tooltip-content.active .bell .icon {

    color: #ff3332;

}

.notifications-tooltip-content .methods-wrapper {

    height: 0;

    overflow: hidden;

    transition: height 0.25s ease-in-out;

}

.notifications-tooltip-content .methods {

    border-top: 1px solid rgba(255, 255, 255, 0.1);

    opacity: 0;

    padding: 20px 0;

    transform: translateY(-100%);

    transition: transform 0.25s ease-in-out, opacity 0.25s ease-in-out;

}

.notifications-tooltip-content.expanding .methods-wrapper .methods {

    opacity: 1;

    transform: translateY(0);

}

.notifications-tooltip-content.expanded .methods-wrapper {

    height: auto !important;

}

.notifications-tooltip-content.expanded .methods-wrapper .methods {

    opacity: 1;

    transform: none !important;

}

.notifications-tooltip-content .methods-title {

    display: block;

    font-size: 18px;

    font-weight: 700;

    line-height: 22px;

    margin-bottom: 20px;

}

.notifications-tooltip-content .method {

    align-items: center;

    display: flex;

    font-size: 14px;

    justify-content: space-between;

    line-height: 17px;

}

.notifications-tooltip-content .method:not(:last-child) {

    margin-bottom: 14px;

}

.notifications-tooltip-content .connect-link {

    color: inherit;

    display: inline-block;

    font-size: 14px;

    line-height: 22px;

    opacity: 0.6;

    text-decoration: underline;

}

.notifications-tooltip-content .connect-link:hover,

.notifications-tooltip-warning-hint a:hover {

    opacity: 0.8;

}

.notifications-tooltip-warning-hint {

    color: rgba(255, 255, 255, 0.6);

    margin-left: 5px;

}

.notifications-tooltip-warning-hint a {

    color: inherit;

    text-decoration: underline;

}

.notifications-tooltip-warning-hint .icon-exclamation-circle {

    height: 13px;

    transform: translateY(-1px);

    width: 13px;

}

.notifications-tooltip-content.mobile .visible-wrapper {

    border-radius: 0;

    box-shadow: none;

    padding: 0 12px;

}

.notifications-tooltip-content.mobile::before {

    border-bottom: 6px solid #1b1b1d;

    border-left: 7px solid transparent;

    border-right: 7px solid transparent;

    bottom: 100%;

    content: "";

    display: block;

    height: 6px;

    left: 27px;

    position: absolute;

    width: 14px;

}

.notifications-tooltip-content.mobile .close {

    right: 5px;

    top: 15px;

}

.notifications-tooltip-content.mobile .main-settings {

    padding: 10px 34px 10px 0;

}

.notifications-tooltip-content.mobile .bell {

    height: 40px;

    margin-right: 12px;

    width: 40px;

}

.notifications-tooltip-content.mobile .bell .icon {

    height: 18px;

    width: 18px;

}

.notifications-tooltip-content.mobile .notifications-tooltip-title {

    font-size: 12px;

    line-height: 15px;

    margin-right: 10px;

}

.notifications-tooltip-content.mobile .methods {

    padding: 10px 0;

}

.notifications-tooltip-content.mobile .methods-title {

    font-size: 15px;

    line-height: 18px;

    margin-bottom: 12px;

}

.notifications-tooltip-content.mobile .method {

    font-size: 12px;

    line-height: 15px;

}

.notifications-tooltip-content.mobile .method:not(:last-child) {

    margin-bottom: 12px;

}

.notifications-tooltip-content.mobile .connect-link {

    font-size: 12px;

}

.tooltip.left .notifications-tooltip-content.preserve-vertical-position,

.tooltip.right .notifications-tooltip-content.preserve-vertical-position {

    height: 800px;

    padding-top: 355px;

    pointer-events: none;

}

.tooltip.left .notifications-tooltip-content.preserve-vertical-position .visible-wrapper,

.tooltip.right .notifications-tooltip-content.preserve-vertical-position .visible-wrapper {

    pointer-events: auto;

}

.notifications-tooltip-content-compact {

    align-items: center;

    background: rgba(5, 5, 6, 0.4);

    border-radius: 12px;

    display: flex;

    font-size: 12px;

    line-height: 14px;

    padding: 8px 12px;

    position: absolute;

}

.notifications-tooltip-content-compact--position--top {

    bottom: calc(100% + 16px);

    left: 0;

}

.notifications-tooltip-content-compact--position--right {

    left: 100%;

    margin: 0 0 0 12px;

    top: 0;

}

.notifications-tooltip-content-compact__text {

    margin: 0 0 0 12px;

    white-space: nowrap;

}

.bq {

    height: 112px;

    margin: 0 0 48px;

    max-width: calc(100vw - 32px);

    overflow: hidden;

    width: 100%;

}

.bq .scroll-bar-container__arrow {

    margin-top: -20px;

}

.bq--style--mobile {

    height: 82px;

    margin: 0 0 40px;

}

.bq--style--pinned {

    height: 116px;

    margin: 40px 0 0;

}

.bq--style--pinned .scroll-bar-container__arrow {

    margin-top: -8px;

}

.bq--style--pinned .avatar__img,

.bq--style--pinned-mobile .avatar__img {

    background-position: center top;

}

.bq--style--pinned-mobile {

    height: 82px;

    margin: 40px 0 0;

}

.bq__title {

    color: #a0a0a1;

    font-size: 11px;

    margin: 0 0 8px;

    text-transform: uppercase;

}

.bq__controls {

    display: flex;

    gap: 1px;

}

.bq__add {

    align-items: center;

    background: #111113;

    color: #a0a0a1;

    column-gap: 10px;

    cursor: pointer;

    display: flex;

    flex: 1;

    font-size: 14px;

    height: 80px;

    justify-content: center;

    max-height: 100%;

    transition: background 0.3s;

    border-bottom-left-radius: 26px;

    border-top-left-radius: 26px;

}

.bq__add:hover,

.bq__archive:hover {

    background: #1b1b1d;

}

.bq__add--rounded {

    border-radius: 26px;

}

.bq__archive {

    align-items: center;

    background: #111113;

    color: #a0a0a1;

    column-gap: 10px;

    cursor: pointer;

    display: flex;

    flex: 1;

    font-size: 14px;

    height: 80px;

    justify-content: center;

    max-height: 100%;

    transition: background 0.3s;

    border-bottom-right-radius: 26px;

    border-top-right-radius: 26px;

}

.bq__list {

    display: flex;

    gap: 12px;

    padding-bottom: 12px;

}

.bq__item {

    align-items: center;

    display: flex;

    flex-direction: column;

    gap: 2px;

    min-height: 92px;

    min-width: 92px;

    overflow: hidden;

    padding: 6px 0;

    position: relative;

    width: 92px;

}

.bq__item .avatar {

    cursor: pointer;

}

.bq__item--mobile {

    min-height: 56px;

    min-width: 56px;

    width: 56px;

}

.bq__thumb-avatar {

    align-items: center;

    background: #111113;

    border-radius: 30.75%;

    color: #a0a0a1;

    cursor: pointer;

    display: flex;

    justify-content: center;

    transition: background 0.3s;

}

.bq__thumb-avatar:hover {

    background: #1b1b1d;

}

.bq__name {

    font-size: 12px;

    margin: 10px 0 0;

    text-align: center;

    width: 100%;

}

.bq__name .displayname {

    display: block;

}

.bq__icon {

    color: #fff;

    left: 50%;

    pointer-events: none;

    position: absolute;

    top: 50%;

    transform: translateX(-50%) translateY(-50%);

}

.scroll-to-top-button-wrapper {

    bottom: 0;

    left: 0;

    position: fixed;

    right: 0;

    z-index: 5;

}

.scroll-to-top-button-wrapper.stick-to-bottom {

    bottom: -60px;

    position: absolute;

    right: -10px;

}

.scroll-to-top-button-wrapper__page-width-wrapper {

    display: flex;

    justify-content: flex-end;

    margin: 0 auto;

    max-width: 1388px;

}

.scroll-to-top-button-wrapper__scroll-to-top-button {

    bottom: 60px;

    position: absolute;

}

.scroll-to-top-button-wrapper__scroll-to-top-button:hover {

    opacity: 0.8;

}

@media screen and (max-width: 1599px) {

    .scroll-to-top-button-wrapper__scroll-to-top-button {

        right: 20px;

    }

}

@media screen and (max-width: 639px) {

    .scroll-to-top-button-wrapper__scroll-to-top-button {

        bottom: 20px;

    }

}

@media screen and (max-width: 479px) {

    .scroll-to-top-button-wrapper__scroll-to-top-button {

        bottom: calc(var(--tap-bar-height) + env(safe-area-inset-bottom) + 16px);

    }

}

.scroll-to-top-button-wrapper__scroll-to-top-button-icon {

    color: #646464;

    fill: currentColor;

    height: 50px;

    width: 50px;

}

.conversation-skeleton {

    align-items: center;

    display: flex;

    flex-flow: row nowrap;

    padding: 12px;

}

.conversation-skeleton-content {

    display: flex;

    flex-flow: column nowrap;

}

.conversation-skeleton-avatar,

.conversation-skeleton-message,

.conversation-skeleton-username {

    animation: skeleton-animation 3s infinite linear;

    background: linear-gradient(90deg, #515255 20%, #535457 28%, #57595c 35%, #535457 42%, #515255 50%);

    background-size: 300% 100%;

    will-change: background-position;

}

.conversation-skeleton-avatar {

    border-radius: 50%;

    height: 44px;

    width: 44px;

    margin-right: 12px;

}

.conversation-skeleton-message,

.conversation-skeleton-username {

    border-radius: 4px;

    height: 8px;

}

.conversation-skeleton-username {

    width: 171px;

    margin-bottom: 15px;

}

.conversation-skeleton-message {

    width: 247px;

}

.conversations-skeleton {

    margin-bottom: auto;

    padding: 0 8px;

}

.picture-squad-grid {

    column-gap: 12px;

    display: grid;

    grid-template-columns: repeat(2, 1fr);

    row-gap: 12px;

}

@media screen and (min-width: 480px) {

    .picture-squad-grid {

        grid-template-columns: repeat(3, 1fr);

    }

}

@media screen and (min-width: 640px) {

    .picture-squad-grid {

        column-gap: 20px;

        grid-template-columns: repeat(4, 1fr);

        row-gap: 20px;

    }

}

@media screen and (min-width: 1366px) {

    .picture-squad-grid {

        grid-template-columns: repeat(6, 1fr);

    }

}

.picture-squad-grid--columns--2 {

    column-gap: 10px;

    grid-template-columns: repeat(2, 1fr);

    row-gap: 10px;

}

.picture-squad-grid--columns--3 {

    column-gap: 10px;

    grid-template-columns: repeat(3, 1fr);

    row-gap: 10px;

}

.picture-squad-grid--columns--4 {

    grid-template-columns: repeat(4, 1fr);

}

.picture-squad-grid--columns--5 {

    grid-template-columns: repeat(5, 1fr);

}

.picture-squad-grid--columns--6 {

    grid-template-columns: repeat(6, 1fr);

}

.picture-squad-grid__skeleton-item {

    background: #343437;

    border-radius: 18px;

    padding-top: 100%;

}

.c7__title {

    color: #fff;

    font-size: 16px;

    font-weight: 700;

}

.c7__sub-title {

    color: #fff;

    font-size: 16px;

    font-weight: 700;

    margin: 32px 20px 20px;

}

.c7__see-all-button {

    align-items: center;

    display: flex;

    gap: 16px;

}

.c7__notification-list {

    margin: 0 0 0-78px;

}

.button-dropdown {

    position: relative;

    z-index: 1;

}

.button-dropdown__button {

    align-items: center;

    border-radius: 12px;

    color: #fff;

    cursor: pointer;

    display: flex;

    font-size: 14px;

    height: 40px;

    justify-content: center;

    padding: 0 20px;

    width: 100%;

}

.button-dropdown__button--style--default {

    background: 0 0;

    border: 2px solid #343437;

}

.button-dropdown__button--style--primary {

    background: #2e1d3e;

    border: 0;

}

.button-dropdown__button--style--apply {

    background: #d60908;

    border: 0;

}

.button-dropdown__button--style--dark-blue {

    background: #2a244b;

    border: 0;

}

.button-dropdown__arrow {

    color: #f8f8f8;

    height: 20px;

    margin: 0 0 0 12px;

    opacity: 0.6;

    transform: rotate(180deg);

    transition: transform 0.3s;

    width: 20px;

}

.button-dropdown__arrow--opened {

    transform: rotate(0deg);

}

.button-dropdown__content {

    background: #232325;

    border-radius: 12px;

    left: 0;

    margin: 30px 0 0 0;

    padding: 10px 15px;

    position: absolute;

    top: 100%;

    left:-15px;

}

.css-tooltip-bottom,

.css-tooltip-left,

.css-tooltip-right,

.css-tooltip-top {

    display: inline-block;

    position: relative;

}

.css-tooltip-top::after {

    background-color: #fff;

    border-radius: 4px;

    box-shadow: 0 2px 4px transparent, 0 0 4px transparent;

    color: #000;

    content: attr(data-tooltip);

    opacity: 0;

    padding: 8px 10px;

    pointer-events: none;

    position: absolute;

    text-align: center;

    text-transform: none;

    transition-duration: 0.15s;

    transition-property: opacity, transform;

    transition-timing-function: ease-in-out;

    white-space: nowrap;

    z-index: 1000;

    font-size: 11px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: normal;

    left: 50%;

    top: 0;

    transform: translate(-50%, calc(-100% - 5px + 10px - 0px));

}

@media (prefers-reduced-motion) {

    .css-tooltip-top::after {

        transition-property: opacity;

    }

}

.css-tooltip-top::before {

    border-style: solid;

    border-width: 5px;

    content: "";

    opacity: 0;

    pointer-events: none;

    position: absolute;

    transition-duration: 0.15s;

    transition-property: opacity, transform;

    transition-timing-function: ease-in-out;

    z-index: 1001;

    border-color: #fff transparent transparent;

    left: 50%;

    margin-left: -5px;

    top: -5px;

    transform: translateY(calc(10px - 0px));

}

@media (prefers-reduced-motion) {

    .css-tooltip-top::before {

        transition-property: opacity;

    }

}

.css-tooltip-top:hover::before {

    opacity: 1;

    transform: translateY(0);

}

.css-tooltip-top:hover::after {

    opacity: 1;

    pointer-events: auto;

    transform: translate(-50%, calc(-100% - 5px - 0px));

}

.css-tooltip-bottom::after {

    background-color: #fff;

    border-radius: 4px;

    box-shadow: 0 2px 4px transparent, 0 0 4px transparent;

    color: #000;

    content: attr(data-tooltip);

    opacity: 0;

    padding: 8px 10px;

    pointer-events: none;

    position: absolute;

    text-align: center;

    text-transform: none;

    transition-duration: 0.15s;

    transition-property: opacity, transform;

    transition-timing-function: ease-in-out;

    white-space: nowrap;

    z-index: 1000;

    font-size: 11px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: normal;

    bottom: 0;

    left: 50%;

    transform: translate(-50%, calc(100% + 5px - 10px + 0px));

}

@media (prefers-reduced-motion) {

    .css-tooltip-bottom::after {

        transition-property: opacity;

    }

}

.css-tooltip-bottom::before {

    border-style: solid;

    border-width: 5px;

    content: "";

    opacity: 0;

    pointer-events: none;

    position: absolute;

    transition-duration: 0.15s;

    transition-property: opacity, transform;

    transition-timing-function: ease-in-out;

    z-index: 1001;

    border-color: transparent transparent #fff;

    bottom: -5px;

    left: 50%;

    margin-left: -5px;

    transform: translateY(calc(-10px + 0px));

}

@media (prefers-reduced-motion) {

    .css-tooltip-bottom::before {

        transition-property: opacity;

    }

}

.css-tooltip-bottom:hover::before {

    opacity: 1;

    transform: translateY(0);

}

.css-tooltip-bottom:hover::after {

    opacity: 1;

    pointer-events: auto;

    transform: translate(-50%, calc(100% + 5px + 0px));

}

.css-tooltip-left::after {

    background-color: #fff;

    border-radius: 4px;

    box-shadow: 0 2px 4px transparent, 0 0 4px transparent;

    color: #000;

    content: attr(data-tooltip);

    opacity: 0;

    padding: 8px 10px;

    pointer-events: none;

    position: absolute;

    text-align: center;

    text-transform: none;

    transition-duration: 0.15s;

    transition-property: opacity, transform;

    transition-timing-function: ease-in-out;

    white-space: nowrap;

    z-index: 1000;

    font-size: 11px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: normal;

    left: 0;

    top: 50%;

    transform: translate(calc(-100% - 5px + 10px - 0px), -50%);

}

@media (prefers-reduced-motion) {

    .css-tooltip-left::after {

        transition-property: opacity;

    }

}

.css-tooltip-left::before {

    border-style: solid;

    border-width: 5px;

    content: "";

    opacity: 0;

    pointer-events: none;

    position: absolute;

    transition-duration: 0.15s;

    transition-property: opacity, transform;

    transition-timing-function: ease-in-out;

    z-index: 1001;

    border-color: transparent transparent transparent #fff;

    left: -5px;

    margin-top: -5px;

    top: 50%;

    transform: translateX(calc(10px - 0px));

}

@media (prefers-reduced-motion) {

    .css-tooltip-left::before {

        transition-property: opacity;

    }

}

.css-tooltip-left:hover::before {

    opacity: 1;

    transform: translateX(0);

}

.css-tooltip-left:hover::after {

    opacity: 1;

    pointer-events: auto;

    transform: translate(calc(-100% - 5px - 0px), -50%);

}

.css-tooltip-right::after {

    background-color: #fff;

    border-radius: 4px;

    box-shadow: 0 2px 4px transparent, 0 0 4px transparent;

    color: #000;

    content: attr(data-tooltip);

    opacity: 0;

    padding: 8px 10px;

    pointer-events: none;

    position: absolute;

    text-align: center;

    text-transform: none;

    transition-duration: 0.15s;

    transition-property: opacity, transform;

    transition-timing-function: ease-in-out;

    white-space: nowrap;

    z-index: 1000;

    font-size: 11px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: normal;

    right: 0;

    top: 50%;

    transform: translate(calc(100% + 5px - 10px + 0px), -50%);

}

@media (prefers-reduced-motion) {

    .css-tooltip-right::after {

        transition-property: opacity;

    }

}

.css-tooltip-right::before {

    border-style: solid;

    border-width: 5px;

    content: "";

    opacity: 0;

    pointer-events: none;

    position: absolute;

    transition-duration: 0.15s;

    transition-property: opacity, transform;

    transition-timing-function: ease-in-out;

    z-index: 1001;

    border-color: transparent #fff transparent transparent;

    margin-top: -5px;

    right: -5px;

    top: 50%;

    transform: translateX(calc(-10px + 0px));

}

@media (prefers-reduced-motion) {

    .css-tooltip-right::before {

        transition-property: opacity;

    }

}

.css-tooltip-right:hover::before {

    opacity: 1;

    transform: translateX(0);

}

.css-tooltip-right:hover::after {

    opacity: 1;

    pointer-events: auto;

    transform: translate(calc(100% + 5px + 0px), -50%);

}

.pp {

    align-items: stretch;

    color: #fff;

    display: flex;

    min-height: 64px;

    padding: 14px 140px 14px 46px;

    position: absolute;

    top: 0;

    transition: min-height 150ms linear;

    width: 100%;

    z-index: 4;

}

.p--relative {

    position: relative;

}

.p--type--info {

    background: #424248;

}

.p--type--warning {

    background: #d6a100;

}

.p--type--moderation {

    background: #fccf49;

    color: #000;

    min-height: 46px;

    position: relative;

}

.p--type--moderation .p__icon {

    top: 50%;

}

.p--type--error {

    background: #e12947;

    color: #cfcfd0;

}

.pp a,

.p--type--error .p__icon {

    color: #fff;

}

.pp__icon {

    height: 26px;

    left: 12px;

    position: absolute;

    top: 32px;

    transform: translateY(-50%);

    width: 26px;

}

.p__icon.icon-blocked,

.p__icon.icon-wrong {

    height: 20px;

    width: 20px;

}

.p__icon--red {

    color: #d21b4c;

}

.p__content {

    align-self: center;

    line-height: 17px;

    position: relative;

}

.p__button {

    position: absolute;

    right: 12px;

}

.p__text-expander {

    color: #fff;

}

.p__group {

    position: absolute;

    top: 0;

    width: 100%;

}

@media screen and (max-width: 374px) {

    .p__icon {

        display: none;

    }

    .p__content {

        line-height: 17px;

        padding: 6px 120px 6px 10px;

    }

}

.tile {

    max-width: 100%;

}

@media screen and (max-width: 639px) {

    .tile {

        border-radius: 0;

    }

}

.tile .media-content {

    cursor: pointer;

    height: 560px;

    margin-top: 14px;

    position: relative;

}

@media screen and (max-width: 639px) {

    .tile .media-content {

        height: 290px;

    }

    .tile .tile-footer::after {

        left: 14px;

        right: 14px;

    }

    .tile .tile-footer,

    .tile .tile-header {

        padding: 0 14px 20px;

    }

}



/*

.bl {

    background: #1b1b1d;

    border-radius: 16px;

    display: grid;

    flex-direction: column;

    height: 300px;

}

.bl__header {

    padding: 20px 20px 0;

}

.bl__title {

    align-items: center;

    display: flex;

    gap: 12px;

    justify-content: space-between;

    padding: 20px 20px 0;

}

.bl__content {

    flex: 1;

    height: 200px;

    padding: 0 20px;

} */

.user-lists-stats__list-item {

    align-items: center;

    display: grid;

    gap: 12px;

    grid-auto-flow: column;

    justify-content: space-between;

    margin-bottom: 16px;

}

.user-lists-stats__list-item-left {

    align-items: center;

    display: grid;

    grid-auto-flow: column;

    grid-gap: 6px;

    justify-content: flex-start;

}

.user-lists-stats__list-name {

    flex: 1;

    min-width: 0;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.user-lists-stats__list-icon {

    color: #a0a0a1;

    margin-right: 4px;

}

.user-lists-stats__list-icon--system {

    color: #ff3332;

}

.textarea {

    display: block;

    position: relative;

    text-align: left;

}

.textarea__counter {

    background: #111113;

    bottom: 6px;

    color: #a0a0a1;

    font-size: 10px;

    pointer-events: none;

    position: absolute;

    right: 6px;

}

.textarea__counter.error-message {

    font-size: 10px;

}

.textarea__field {

    background: #111113;

    border: 1px solid transparent;

    border-radius: 12px;

    color: #fff;

    display: block;

    width: 100%;

}

.textarea__field:focus {

    border-color: #ff3332;

}

.textarea__field--hide-focus-placeholder:focus + .textarea__placeholder {

    display: none;

}



.textarea__field--size--small {

    min-height: 80px;

    padding: 15px 15px 25px;

}

.textarea__field--size--small-x {

    font-size: 13px;

    min-height: 60px;

    padding: 10px 15px 25px;

}

.textarea__field--size--regular {

    min-height: 140px;

    padding: 15px 15px 25px;

}

.textarea__placeholder {

    font-size: 13px;

    left: 0;

    opacity: 0.6;

    padding: 15px;

    pointer-events: none;

    position: absolute;

    top: 0;

    width: 100%;

}

.textarea__placeholder--size--small {

    padding: 15px;

}

.textarea__placeholder--size--small-x {

    font-size: 12px;

    padding: 10px 15px;

}

.alert,

.alert-content {

    align-items: center;

    display: flex;

    width: 100%;

}

.alert {

    font-size: 16px;

    font-weight: 400;

    letter-spacing: normal;

    line-height: normal;

    color: #f8f8f8;

    padding: 15px;

}

.alert-content {

    justify-content: center;

}

.alert-content-closable {

    margin-left: 23px;

}

.alert-content-left-align {

    justify-content: flex-start;

}

.alert-success {

    background: #21b062;

}

.alert-error {

    background-color: #d21b4c;

}

.alert-info {

    background-color: #4b6a73;

}

.alert-close-icon.alert-close-icon {

    color: rgba(248, 248, 248, 0.5);

    margin: -9px -9px -9px 0;

}

.alert-close-icon.alert-close-icon:hover {

    color: #f8f8f8;

}

.q {

    display: grid;

    gap: 10px;

    grid-template-columns: 2.5fr 1fr;

    grid-template-rows: repeat(2, 1fr);

    height: 360px;

}

.q__item {

    align-items: center;

    border-radius: 12px;

    display: flex;

    justify-content: center;

    overflow: hidden;

    position: relative;

}

.q__item--main {

    grid-row: 2 span;

}

.q__img {

    height: 100%;

    left: 0;

    object-fit: cover;

    object-position: center;

    position: absolute;

    top: 0;

    width: 100%;

}

.q__shadow {

    align-items: center;

    background: rgba(0, 0, 0, 0.4);

    bottom: 0;

    display: flex;

    justify-content: center;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

}

.q__join,

.q__lock {

    align-items: center;

    display: flex;

    flex-direction: column;

    position: relative;

}

.q__lock {

    color: rgba(255, 255, 255, 0.6);

    font-size: 14px;

    gap: 6px;

}

.q__join {

    color: rgba(255, 255, 255, 0.8);

    gap: 16px;

    text-align: center;

    z-index: 1;

}

.q__view-button {

    align-items: center;

    background: 0 0;

    border: 0;

    color: rgba(255, 255, 255, 0.6);

    cursor: pointer;

    display: flex;

    font-size: 12px;

    gap: 6px;

    padding: 0;

    transition: color 0.3s;

}

.q__view-button:hover {

    color: #cfcfd0;

}

.tile-content-info {

    color: #fff;

    display: flex;

    margin: 12px 0;

    padding: 0;

}

.tile-content-info .info-icon {

    fill: currentColor;

    height: 32px;

    margin-right: 12px;

    width: 32px;

}

.tile-content-info .title {

    font-size: 14px;

    font-weight: 700;

    letter-spacing: normal;

    line-height: 1.2;

}

.tile-content-info .description {

    font-size: 13px;

    font-weight: 400;

    letter-spacing: normal;

    line-height: normal;

    margin-top: 2px;

    opacity: 0.6;

}

.tile-footer::after {

    background: rgba(255, 255, 255, 0.1);

    bottom: 0;

    content: "";

    height: 1px;

    left: 0;

    position: absolute;

    right: 0;

}

.tile-footer .content {

    align-items: center;

    border: 0;

    flex-flow: row nowrap;

    justify-content: space-between;

    padding: 14px 0;

}

.tile-footer .content,

.tile-footer .left-wrapper,

.tile-footer .right-wrapper {

    column-gap: 10px;

    display: flex;

}

.tile-footer .right-wrapper {

    align-items: center;

}

.tile-footer .likes-counter {

    position: relative;

}

.tile-footer .likes-counter:before {

    content: "";

    height: 40px;

    left: 50%;

    min-width: 100%;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

    width: 40px;

}

.tile-footer__bookmark {

    align-items: center;

    cursor: pointer;

    display: flex;

    justify-content: center;

    min-width: 36px;

    transition: background 0.3s;

    white-space: nowrap;

    width: 36px;

    -webkit-user-select: none;

    user-select: none;

}

.tile-footer__bookmark--disabled {

    opacity: 0.8;

    pointer-events: none;

}

.tile-footer__bookmark > .icon {

    height: 20px;

    margin: 0;

    width: 20px;

}

.tile-footer .a11y-button,

.tile-footer .tile-button,

.tile-footer .tile-footer__bookmark {

    background: #1b1b1d;

    border-radius: 11px;

    height: 38px;

    padding: 0 8px;

}

.tile-footer .a11y-button:hover,

.tile-footer .tile-button:hover,

.tile-footer .tile-footer__bookmark:hover {

    background: #343437;

}

.X {

    display: flex;

    margin-top: 12px;

    position: relative;

}

.X--highlighted::before {

    animation: animation-comment-highlighted 6s;

    background: rgba(255, 255, 255, 0.05);

    border-radius: 10px;

    bottom: -8px;

    content: "";

    left: -12px;

    position: absolute;

    right: 0;

    top: -12px;

}

.X__left {

    position: relative;

    width: 24px;

}

.X__right {

    flex-grow: 1;

    overflow: hidden;

    padding: 0 0 0 12px;

    position: relative;

}

.X__name {

    align-items: center;

    display: flex;

    flex-wrap: wrap;

    gap: 8px;

    max-width: calc(100% - 32px);

}

.X__username {

    max-width: 100%;

}

.X__date {

    color: #707071;

    font-size: 12px;

    line-height: 15px;

}

.X__content {

    color: #a4a4a4;

    font-size: 13px;

    line-height: 18px;

    margin: 6px 0 8px;

    white-space: pre-wrap;

}

.X__content-deleted {

    align-items: center;

    background: #111113;

    border-radius: 5px;

    color: #a0a0a1;

    display: flex;

    gap: 6px;

    justify-content: center;

    margin: 12px 0 8px;

    min-height: 30px;

    padding: 4px 16px;

}

.X__footer {

    align-items: center;

    display: flex;

    gap: 8px;

}

.X__reply {

    color: #a0a0a1;

    cursor: pointer;

    font-size: 12px;

    line-height: 15px;

}

.X__reply:hover {

    color: #cfcfd0;

}

.X__reply-loader {

    color: #a0a0a1;

    left: 30px;

    pointer-events: none;

    position: absolute;

    top: 0;

}

.X__reply-view {

    align-items: center;

    color: #a0a0a1;

    cursor: pointer;

    display: flex;

    font-size: 12px;

    margin: 12px 0;

    position: relative;

}

.X__reply-view--loading {

    color: transparent;

    pointer-events: none;

}

.X__reply-view::before {

    background: #424248;

    content: "";

    height: 1px;

    margin: 0 10px 0 0;

    width: 20px;

}

.X__menu {

    position: absolute;

    right: 0;

    top: 0;

}

.X__menu .icon-three-dots {

    color: #707071;

}

.X .icon-heart {

    color: #a0a0a1;

}

.r {

    border-radius: 0 0 12px 12px;

    overflow: hidden;

    position: relative;

}

.r--clickable {

    cursor: pointer;

}

.r--locked .image-swiper__points {

    background: 0 0;

}

.r__label {

    align-items: center;

    background: rgba(0, 0, 0, 0.4);

    border-radius: 8px;

    color: #cfcfd0;

    display: flex;

    font-size: 12px;

    font-weight: 700;

    height: 24px;

    padding: 0 8px;

    pointer-events: none;

    position: absolute;

    right: 12px;

    z-index: 2;

}

.r__label--top {

    top: 12px;

}

.r__label--bottom {

    bottom: 12px;

}

.r__blur {

    background-size: 0;

    bottom: 0;

    contain: strict;

    left: 0;

    overflow: hidden;

    pointer-events: none;

    position: absolute;

    right: 0;

    top: 0;

    z-index: -1;

}

.r__blur::after,

.r__blur::before {

    background-image: inherit;

    background-repeat: no-repeat;

    bottom: 0;

    content: "";

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

}

.r__blur::before {

    background-size: cover;

    filter: blur(16px);

    transform: scale(1.2);

}

.r__blur::after {

    background-position: center;

    background-size: contain;

}

.r__tagged-users-count-badge {

    align-items: center;

    background: rgba(0, 0, 0, 0.4);

    border-radius: 8px;

    bottom: 16px;

    color: #cfcfd0;

    display: flex;

    flex-wrap: nowrap;

    font-size: 14px;

    font-weight: 700;

    gap: 8px;

    left: 16px;

    padding: 4px 8px;

    pointer-events: none;

    position: absolute;

    z-index: 2;

}

.bi {

    align-items: center;

    background: #111113;

    border-radius: 12px;

    display: flex;

    gap: 20px;

    min-height: 40px;

    padding: 6px 20px;

}



.bd {

    left: -2px;

    margin: 6px 0 0;

    position: absolute;

    right: -2px;

    top: 100%;

}

.bd--landing {

    z-index: 11;

}

.bd--compact {

    left: 0;

    margin: 2px 0 0;

    right: 0;

}

.bd__empty {

    color: #707071;

    font-size: 13px;

    font-weight: 500;

    line-height: 16px;

    margin: 20px 0;

    text-align: center;

}

.bd__sub-title {

    color: #707071;

    font-size: 11px;

    margin: 20px 16px 10px;

    text-transform: uppercase;

}

.bd__title-link {

    text-transform: none;

}

.bd__button {

    margin: 0 10px 10px;

    width: calc(100% - 20px);

}

.bd__verify {

    align-items: center;

    background: #232325;

    border-radius: 10px;

    display: flex;

    gap: 12px;

    margin: 20px 16px;

    padding: 8px 12px;

}



.bddd {

    border-radius: 18px;

    overflow: hidden;

    padding-top: 100%;

    position: relative;

    transform: translateZ(0);

    transition: opacity 0.3s;

}

.bddd--shadow::after {

    background: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, 0.65) 100%);

    content: "";

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    transition: opacity 0.3s;

    width: 100%;

}

.bddd--locked {

    background: linear-gradient(246.82deg, #3c185e 0, #100415 100%) no-repeat center;

    background-size: cover;

}

.bddd--locked:hover {

    background-image: linear-gradient(246.82deg, #281f4d 0, #0d071e 100%);

}

.bddd--clickable {

    cursor: pointer;

}

.bddd--disabled {

    opacity: 0.6;

    pointer-events: none;

}

.bddd__image {

    height: 100%;

    left: 0;

    object-fit: cover;

    object-position: center;

    position: absolute;

    top: 0;

    transform: scale(1.01);

    transition: transform 0.3s;

    width: 100%;

}

.bddd--with-zoom:hover > .bd__image {

    transform: scale(1.1);

}

.bddd__content {

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

    z-index: 1;

}

.sS {

    align-items: center;

    display: flex;

    flex-direction: column;

    gap: 10px;

    left: 50%;

    pointer-events: none;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

    width: 60%;

}

@media screen and (max-width: 1023px) {

    .s--style--album {

        flex-direction: row;

        justify-content: center;

        top: 30%;

        width: 80%;

    }

    .s--style--album .s__label {

        max-width: 98px;

        text-align: left;

    }

}

@media screen and (max-width: 639px) {

    .s--style--album {

        flex-direction: column;

        top: 50%;

        width: 60%;

    }

    .s--style--album .s__label {

        max-width: 120px;

        text-align: center;

        white-space: normal;

    }

}

.s__label {

    color: #fff;

    font-size: 14px;

    font-weight: 400;

    max-width: 120px;

    text-align: center;

    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.2), 0 1px 20px rgba(0, 0, 0, 0.4);

}

@media screen and (max-width: 639px) {

    .s__label {

        font-size: 12px;

    }

}

.s__icon {

    color: #fff;

    filter: drop-shadow(0 1px 20px rgba(0, 0, 0, 0.4));

    height: 32px;

    width: 32px;

}

@media screen and (max-width: 1023px) {

    .s__icon {

        height: 24px;

        width: 24px;

    }

}

.s__avatar {

    filter: drop-shadow(0 1px 20px rgba(0, 0, 0, 0.2));

}

.s__avatar.avatar {

    height: 48px;

    width: 48px;

}

@media screen and (max-width: 639px) {

    .s__avatar.avatar {

        height: 36px;

        width: 36px;

    }

}

.s__avatar--adaptive.avatar {

    height: 64px;

    width: 64px;

}

@media (max-width: 639px) {

    .s__avatar--adaptive.avatar {

        height: 48px;

        width: 48px;

    }

}

@media (max-width: 479px) {

    .s__avatar--adaptive.avatar {

        height: 36px;

        width: 36px;

    }

}

.settings-island-checkbox__switcher {

    display: flex;

    flex: 1;

    justify-content: flex-end;

}

.slidable-appearing-container-left,

.slidable-appearing-container-right {

    bottom: 0;

    position: absolute;

    top: 0;

    transition: transform ease 150ms;

}

.slidable-appearing-container-right {

    left: auto;

    right: 0;

}

.slidable-appearing-container-left {

    left: 0;

    right: auto;

}

.slidable {

    transition: transform ease 150ms;

}

.slidable.slidable-waiting-action {

    -webkit-user-select: none;

    user-select: none;

}

.header-search-result-item {

    margin: 6px 0;

}

.bKK {

    background: #1b1b1d;

    border-radius: 16px;

    color: #fff;

    display: flex;

    flex-direction: column;

    gap: 16px;

    justify-content: space-between;

    overflow: hidden;

    padding: 85px 20px 20px;

    position: relative;

}

.bKK__info {

    background: #232325;

    border-radius: 10px;

    display: flex;

    justify-content: space-between;

    padding: 16px;

    position: relative;

    white-space: nowrap;

}

.bKK__info-left {

    display: flex;

    flex-direction: column;

    justify-content: center;

    max-width: 70%;

    text-align: left;

}

.bKK__info-right {

    text-align: right;

}

.bKK__info-text {

    overflow: hidden;

    text-overflow: ellipsis;

}

.bKK__footer {

    display: flex;

    gap: 8px;

    justify-content: space-between;

}

.bN__tiles {

    display: flex;

    flex-wrap: wrap;

    gap: 20px;

    min-width: 900px;

}

@media screen and (max-width: 1023px) {

    .bN__tiles {

        column-gap: 20px;

    }

}

.bN__skeleton {

    background: #111113;

    border-radius: 12px;

    flex: 1 0 284px;

    min-height: 128px;

    min-width: 284px;

}

.notifications-subscribed-common-table .menu-button-dots {

    margin-left: auto;

    width: 32px;

}

.notifications-subscribed-common-table .switcher.default {

    margin: 0 auto;

}

.image-swiper__root--disabled .m {

    pointer-events: none;

}

.mm {

    align-items: center;

    color: #fff;

    display: flex;

    flex-direction: column;

    height: 100%;

    justify-content: center;

    left: 0;

    padding: 20px 14px;

    position: absolute;

    text-align: center;

    top: 0;

    transform: none;

    width: 100%;

    z-index: 1;

}

.m--fill--locked {

    background: linear-gradient(246.82deg, #3c185e 0, #100415 100%) no-repeat center;

    background-size: cover;

}

.m--fill--moderation {

    background-color: rgba(252, 207, 73, 0.8);

    color: #000;

}

.m--fill--rejected {

    background-color: rgba(210, 27, 76, 0.6);

    color: #cfcfd0;

}

.m--dark {

    background: rgba(0, 0, 0, 0.2);

}

@media screen and (max-width: 639px) {

    .mm {

        min-height: 135px;

        min-width: 135px;

    }

}

.m__icon--size--regular {

    height: 40px;

    width: 40px;

}

.m__icon--size--big {

    height: 58px;

    width: 58px;

}

.m__title {

    font-size: 16px;

    font-weight: 700;

    margin-top: 16px;

    padding: 0 12px;

    white-space: normal;

    word-break: normal;

}

@media screen and (max-width: 639px) {

    .m__title {

        font-size: 12px;

        font-weight: 400;

        letter-spacing: normal;

        line-height: normal;

        margin-top: 12px;

    }

}

.m__description {

    font-size: 13px;

    margin-top: 16px;

    max-width: 310px;

    padding: 0 12px;

    white-space: normal;

    word-break: normal;

}

.m .content-lock-button {

    margin: 20px 0 0;

}

@media screen and (max-width: 639px) {

    .m .content-lock-button {

        margin: 12px 0 0;

    }

}

.b9__message-body {

    min-height: 142px;

    position: relative;

}

.b9__message-body--with-media {

    height: 204px;

}

.b9__message-input {

    background: #111113;

    border: 1px solid transparent;

    border-radius: 12px;

    bottom: 0;

    height: 100%;

    left: 0;

    overflow-y: auto;

    position: absolute;

    right: 0;

    top: 0;

}

.b9__message-input:focus-within:not(.b9__message-input--error) {

    border: 1px solid #d60908;

}

.b9__message-input--error .chat-controls-input__wrapper {

    border-color: #fd3a5b;

}

.b9__message-input .chat-controls-input {

    height: 100%;

    margin: 0;

    min-height: 100px;

    padding-bottom: 10px;

}

.b9__message-input .chat-controls-input__wrapper {

    border: 0 !important;

}

.b9__media-list {

    background-color: red;

    height: 80px;

    margin: 0 10px;

}

.b9__input-actions {

    align-items: center;

    background: #111113;

    border-radius: 12px;

    bottom: 4px;

    display: flex;

    gap: 14px;

    justify-content: flex-end;

    padding: 2px 0 2px 6px;

    position: absolute;

    right: 4px;

}

.b9__counter {

    color: #a0a0a1;

    font-size: 14px;

    font-weight: 400;

}

.b9__counter--error-message {

    color: #fd3a5b;

}

.b9__upload-button-wrapper {

    height: 100%;

    opacity: 0.6;

}

.b9__upload-button-wrapper--disabled {

    cursor: default;

    opacity: 0.2;

}

.b9__upload-button-wrapper:hover:not(.b9__upload-button-wrapper--disabled) {

    opacity: 1;

}

.b9__upload-icon {

    height: 22px;

    width: 22px;

}

.b9__smiles-wrapper .smiles-dropdown .smiles-list {

    bottom: 40px;

    top: auto;

}

.b9__upload-file-wrapper {

    max-width: 100%;

    padding: 12px;

    width: 460px;

}

.b9__upload-file-wrapper .z {

    margin-top: 0;

}

.b9__active-checkbox {

    align-items: center;

    display: flex;

    justify-content: flex-start;

    margin-bottom: 20px;

}

.b9__checkbox-title {

    font-size: 14px;

    font-weight: 500;

}

.b9__error-message {

    color: #fd3a5b;

    font-size: 12px;

    font-weight: 400;

    line-height: 14px;

    margin-top: 2px;

}

@media screen and (max-width: 1023px) {

    .b9__message-body {

        height: 204px;

    }

}

@media screen and (max-width: 639px) {

    .b9__message-input .chat-controls-input--style--multy-line {

        min-height: 132px;

    }

}

.bPP {

    align-items: center;

    display: flex;

    gap: 12px;

    justify-content: space-between;

    margin-bottom: 20px;

}

.bPP__tabs {

    border-radius: 10px;

    display: flex;

    flex: 1;

    max-width: 1140px;

}

.bPP__tabs .pill-control__item {

    width: 154px;

}

.b0 {

    display: flex;

    flex-direction: column;

    height: 100%;

    max-width: 100%;

    width: 418px;

}

.b0__preview-title {

    font-size: 20px;

    margin: 0 0 10px;

}

.b0__preview-description {

    color: #cfcfd0;

    font-size: 14px;

    font-weight: 500;

    line-height: 22px;

    margin: 10px 0 20px;

}

.b0__chat {

    background: #232325;

    border-radius: 8px;

    box-shadow: 0 20px 30px rgba(0, 0, 0, 0.3);

    display: flex;

    flex: 1;

    flex-direction: column;

    width: 100%;

}

.b0__chat-header {

    align-items: center;

    border-bottom: 1px solid rgba(255, 255, 255, 0.1);

    display: flex;

    gap: 8px;

    height: 44px;

    justify-content: flex-start;

    padding: 6px 8px;

}

.b0__chat-content {

    display: flex;

    flex: 1;

    flex-direction: column;

    height: 304px;

    justify-content: flex-end;

    padding: 6px 8px;

}

.b0__chat-content .base-message {

    background-color: #ff3332;

    max-width: 240px;

}

.b0__chat-content .base-message .Q__gallery {

    min-width: 240px;

}

.bU {

    margin-right: 8px;

    position: relative;

}

.bU__mobile-button {

    background: 0 0;

    border: 0;

    color: rgba(255, 255, 255, 0.4);

    cursor: pointer;

    opacity: 0;

    padding: 0;

    pointer-events: none;

}

.bU__mobile-button:hover {

    color: rgba(255, 255, 255, 0.8);

}

.bU__mobile-button--visible {

    opacity: 1;

    pointer-events: auto;

}

.bU__intervals {

    align-items: center;

    display: flex;

    justify-content: flex-end;

}

.bU__intervals--mobile {

    position: absolute;

    right: 0;

    top: 0;

    width: 100%;

    z-index: 10;

}

.bU__intervals-buttons {

    align-items: center;

    animation-duration: 150ms;

    animation-name: animate-slide;

    animation-timing-function: ease-in;

    display: flex;

    gap: 12px;

    height: 44px;

    justify-content: center;

    padding: 0 10px;

}

.bU__intervals-buttons--mobile {

    background: #1b1b1d;

    border-radius: 12px;

    box-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);

}

.bU__dot {

    color: rgba(255, 255, 255, 0.2);

    font-size: 20px;

}

.bU__interval-button {

    align-items: center;

    background: 0 0;

    border: 0;

    color: rgba(255, 255, 255, 0.4);

    cursor: pointer;

    display: flex;

    font-size: 14px;

    font-weight: 400;

    gap: 5px;

    padding: 0;

    white-space: nowrap;

}

.bU__interval-button--opened {

    color: rgba(255, 255, 255, 0.8);

}

.bU__dropdown-icon--opened {

    transform: rotate(180deg);

}

.bU .dropdown-content {

    padding: 4px 0;

}

.bU__dropdown-item {

    background: 0 0;

    border: 0;

    color: #fff;

    cursor: pointer;

    display: flex;

    font-size: 14px;

    font-weight: 400;

    gap: 12px;

    justify-content: space-between;

    min-width: 160px;

    padding: 10px 15px;

}

.bU__dropdown-item--active {

    pointer-events: none;

}

@media (hover: hover) {

    .bU__dropdown-item:hover {

        background: #232325;

    }

}

.u {

    min-height: 48px;

}

.u__wrapper {

    left: 0;

    right: 0;

}

.u__wrapper--sticky {

    bottom: calc(10px + var(--tap-bar-height));

    position: fixed;

    z-index: 2;

}

.u__wrapper--sticky .u__content {

    backdrop-filter: blur(3px);

    background: rgba(35, 35, 37, 0.6);

    border-radius: 12px;

    box-shadow: 0 1px 20px rgba(0, 0, 0, 0.4);

    margin: 0 60px;

    min-height: 64px;

    width: 100%;

}

@media screen and (max-width: 1365px) {

    .u__wrapper--sticky .u__content {

        margin: 0;

    }

}

.u__row {

    display: flex;

    justify-content: center;

    margin: 0 auto;

    max-width: 1568px;

    width: 100%;

}

.u__content {

    border-bottom-left-radius: 12px;

    border-bottom-right-radius: 12px;

    flex: 1;

    min-height: 48px;

    transition: bottom 0.2s;

    width: inherit;

}

.bX {

    background-color: #232325;

    border-radius: 12px;

    width: 50%;

    -webkit-user-select: none;

    user-select: none;

}

.bX--open .bX__icon-close {

    transform: rotate(180deg);

}

.bX__header {

    align-items: center;

    background: 0 0;

    border: 0;

    border-radius: 12px;

    color: #cfcfd0;

    cursor: pointer;

    display: flex;

    flex-flow: row nowrap;

    font-size: 15px;

    font-weight: 400;

    justify-content: center;

    padding: 14px 16px;

    width: 100%;

}

.bX__header:hover .bX__icon-close {

    fill: #fff;

}

.bX__icon {

    fill: rgba(255, 255, 255, 0.8);

}

.bX__title {

    font-size: 0.938rem;

    flex-grow: 1;

    font-weight: 400;

    margin: 0;

    text-align: start;

}

.bX__icon-exclamation {

    height: 21px;

    margin-right: 21px;

    width: 21px;

}

.bX__icon-close {

    margin: 0;

}

.bX__dropdown {

    font-size: 0.813rem;

    line-height: 1.25rem;

    color: rgba(255, 255, 255, 0.6);

    font-weight: 400;

    padding: 0 64px 1px;

}

.bX__list {

    list-style: disc;

    margin-bottom: 20px;

    margin-top: 0;

    padding-left: 12px;

}

.bX__list-item {

    margin-bottom: 15px;

}

.bX__list-item:last-child {

    margin-bottom: 0;

}

@media screen and (max-width: 1365px) {

    .bX {

        width: 100%;

    }

    .bX__dropdown,

    .bX__header {

        padding-right: 21px;

    }

}

.creators-onboarding-item {

    align-items: center;

    background-color: #232325;

    border-radius: 10px;

    display: flex;

    flex: 1;

    gap: 16px;

    justify-content: space-between;

    padding: 16px;

    width: 100%;

}

.creators-onboarding-item:first-child {

    margin-top: 10px;

}

.creators-onboarding-item:last-child {

    margin-bottom: 10px;

}

.creators-onboarding-item__left-part {

    display: grid;

    flex: 1;

    grid-auto-flow: row;

    grid-row-gap: 4px;

}

.creators-onboarding-item__right-part {

    align-items: center;

    display: flex;

    justify-content: flex-end;

}

.creators-onboarding-item__title {

    align-items: center;

    display: flex;

    justify-content: flex-start;

}

.creators-onboarding-item__option-badge {

    background-color: #343437;

    border-radius: 6px;

    color: #fff;

    margin-left: 8px;

    padding: 2px 8px;

    pointer-events: none;

}

.creators-onboarding-item__completed-icon {

    color: #21b062;

}

.teaser-banner {

    background: url(/assets/common/images/teaser-bg.svg), radial-gradient(146.3% 146.3%at 50%0, #994cfa 0, rgba(82, 0, 133, 0.6) 35.41%, transparent 100%);

    background-size: cover, auto;

    border-radius: 12px;

    max-width: calc(100vw - 32px);

    overflow: hidden;

    padding: 16px 20px 20px;

    text-align: center;

    width: 100%;

}

.teaser-banner__title {

    color: #f9d400;

    font-size: 20px;

    font-weight: 700;

    line-height: 24px;

    margin: 8px 0 12px;

}

.teaser-banner__description {

    color: #a0a0a1;

    font-size: 15px;

    line-height: 22px;

    margin: 0 0 20px;

}

.post-edit-preview-header {

    display: flex;

}

.post-edit-preview-header__image {

    background-color: #000;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    border-radius: 10px;

    height: 60px;

    position: relative;

    width: 60px;

}

.post-edit-preview-header__image--pointer {

    cursor: pointer;

}

.post-edit-preview-header__media-counter {

    background: #424248;

    border: 3px solid #1b1b1d;

    border-radius: 13px;

    color: #cfcfd0;

    display: grid;

    font-size: 12px;

    height: 26px;

    min-width: 26px;

    overflow: hidden;

    padding: 0 4px;

    place-items: center;

    pointer-events: none;

    position: absolute;

    right: -6px;

    top: -8px;

}

.post-edit-preview-header__loading {

    left: 50%;

    position: absolute;

    top: 50%;

    transform: translateX(-50%) translateY(-50%);

}

.post-edit-preview-header__body-wrapper {

    flex: 1;

    position: relative;

}

.cP {

    align-items: center;

    animation: opacity-fade-show-modal-strict 0.5s;

    border-radius: 60px;

    display: flex;

    height: 48px;

    justify-content: center;

    min-width: 60px;

    padding: 0 20px;

    position: relative;

    transition: background 0.3s;

    -webkit-user-select: auto;

    user-select: auto;

}

.cP--draggable {

    cursor: grab;

}

.cP--draggable::before {

    background: rgba(0, 0, 0, 0.1);

    border-radius: inherit;

    bottom: 0;

    content: "";

    left: 0;

    opacity: 0;

    pointer-events: none;

    position: absolute;

    top: 0;

    transition: opacity 0.3s;

    width: 100%;

}

.cP--draggable:hover::before {

    opacity: 1;

}

.cP--dark-select ::selection {

    background: #ff3332;

}

.cP__count {

    bottom: 3px;

    font-size: 10px;

    opacity: 0;

    position: absolute;

    right: 20px;

    transition: opacity 0.3s;

}

.cP__count--dark-text {

    color: #000;

}

.cP__count--visible {

    opacity: 0.4;

}

.cP__text {

    color: #fff;

    font-size: 20px;

    white-space: nowrap;

}

.cP__text--editable {

    cursor: text;

}

.cP__text--dark-text {

    color: #000;

}

.cP__text::before {

    content: attr(placeholder);

    display: none;

    opacity: 0.6;

    pointer-events: none;

    transition: opacity 0.3s;

}

.cP__text--highlighted::before {

    opacity: 1;

}

.cP__text:empty::before {

    display: block;

}

.cP__hints {

    opacity: 0;

    pointer-events: none;

    transition: opacity 0.5s;

    white-space: nowrap;

}

.cP__hints--visible {

    opacity: 1;

}

.cP__hint {

    color: #fff;

    font-size: 14px;

    left: 50%;

    position: absolute;

    text-align: center;

    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.6);

    transform: translateX(-50%);

    white-space: nowrap;

}

.cP__hint--position--top {

    bottom: 100%;

    margin: 0 0 6px;

}

.cP__hint--position--bottom {

    margin: 6px 0 0;

    top: 100%;

}

.cM {

    background: #1b1b1d;

    padding: 20px;

    z-index: 1;

}

.cM--mode--desktop {

    animation: opacity-fade-show-modal-strict 0.3s;

    border-radius: 12px;

    bottom: 12px;

    left: 12px;

    position: absolute;

    right: 12px;

}

.cM--mode--mobile {

    animation: move-bottom-right 0.25s;

    border-radius: 12px 12px 0 0;

    bottom: 0;

    left: 0;

    min-height: 320px;

    position: fixed;

    width: 100%;

    z-index: 2;

}

.cM__header {

    align-items: center;

    display: flex;

    justify-content: space-between;

    margin: 0 0 20px;

}

.cM__description {

    color: #707071;

    font-size: 12px;

    margin: 20px 20px 0;

    text-align: center;

}

.cN {

    animation: move-from-right 0.5s;

    bottom: 0;

    display: flex;

    gap: 6px;

    left: 0;

    overflow-x: auto;

    padding: 0 12px 16px;

    position: absolute;

    width: 100%;

}

.cN__item {

    background-clip: content-box;

    border: 2px solid rgba(255, 255, 255, 0.1);

    border-radius: 5px;

    cursor: pointer;

    height: 22px;

    min-width: 22px;

    transition: border-color 0.3s;

    width: 22px;

}

.cN__item--active,

.cN__item:hover {

    border-color: #fff;

}

.cN__item--dark-text.cN__item--active,

.cN__item--dark-text:hover {

    border-color: #000;

}



.C {

    background: #343437;

    border-radius: 12px;

    box-shadow: 0 1px 20px rgba(0, 0, 0, 0.2);

    margin: 10px 0 0;

    overflow: hidden;

}

.C--style--dark {

    background: #1b1b1d;

}

.C__menu-item {

    align-items: center;

    background: 0 0;

    border: 0;

    color: #fff;

    cursor: pointer;

    display: flex;

    font-size: 14px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: normal;

    padding: 10px 18px;

    position: relative;

    transition: background 0.3s;

    white-space: nowrap;

    width: 100%;

}

.C__menu-item--split {

    margin-bottom: 2px;

}

.C__menu-item--split::before {

    background: rgba(255, 255, 255, 0.05);

    content: "";

    height: 2px;

    left: 0;

    position: absolute;

    right: 0;

    top: 100%;

}

.C__menu-item:hover {

    background: #232325;

}

.C__menu-item--selected {

    background: #343437;

    background: #232325;

}

.C__menu-item-icon {

    height: 16px;

    margin: 0 12px 0 0;

    width: 16px;

}



.CCC {

    align-items: center;

    background-color: #232325;

    border: 2px solid #232325;

    border-radius: 10px;

    cursor: pointer;

    display: flex;

    gap: 8px;

    margin-bottom: 10px;

    min-height: 70px;

    padding: 12px;

    transition: all 100ms linear;

}

.CCC:hover {

    background-color: #343437;

    border-color: #343437;

}

.CCC--active {

    background: rgba(215, 13, 17, 0.1);

    border-color: #ff3332;

    pointer-events: none;

}

.CCC__left-part {

    align-items: start;

    display: grid;

    flex: 1;

    grid-auto-flow: row;

    grid-row-gap: 4px;

}

.CCC__right-part {

    align-items: flex-end;

    display: flex;

    flex-direction: column;

    gap: 4px;

    min-width: 44px;

}

.CCC__primary-text {

    color: #fff;

    font-size: 16px;

    font-weight: 600;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.CCC__sub-text {

    color: #707071;

    font-size: 12px;

    word-break: break-all;

}

.cr {

    flex: 1;

}

@media screen and (max-width: 639px) {

    .cr {

        padding-bottom: 54px;

    }

}

.cr__content {

    height: 344px;

}

@media screen and (max-width: 639px) {

    .cr__content {

        height: 100%;

        max-height: calc(100vh - 156px);

    }

}

.cr__image-container {

    align-items: center;

    display: flex;

    height: 240px;

    justify-content: center;

    margin-bottom: 20px;

}

.cr__image-wrapper {

    border-radius: 4px;

    height: 100%;

    overflow: hidden;

    position: relative;

}

@media screen and (max-width: 639px) {

    .cr__image-wrapper {

        max-height: 100%;

    }

}

.cr__image {

    height: 100%;

    max-width: 100%;

    object-fit: contain;

    width: auto;

}

@media screen and (max-width: 639px) {

    .cr__image {

        object-fit: cover;

    }

}

.cr__footer {

    align-items: center;

    border-top: 1px solid rgba(255, 255, 255, 0.05);

    display: flex;

    justify-content: space-between;

    margin: 0-20px;

    padding: 20px 20px 0;

}

@media screen and (max-width: 639px) {

    .cr__footer {

        bottom: 20px;

        position: absolute;

        width: 100%;

    }

}

.cr__toggle-button {

    align-items: center;

    background-color: #343437;

    border: 0;

    border-radius: 50%;

    color: #fff;

    cursor: pointer;

    display: flex;

    height: 24px;

    justify-content: center;

    padding: 0;

    place-items: center;

    width: 24px;

}

.cr__toggle-button:active {

    transform: translateY(1px);

}

.cr__counter {

    color: #cfcfd0;

    font-size: 16px;

    font-weight: 700;

    white-space: nowrap;

}

.cr__additional-content {

    margin-top: 10px;

}

.cr__icon {

    position: absolute;

    z-index: 1;

}

.cr__icon:after {

    bottom: 50%;

    box-shadow: 0 0 40px rgba(0, 0, 0, 0.6);

    content: "";

    display: block;

    height: 1px;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

    width: 1px;

}

.cr__icon--users {

    bottom: 10px;

    left: 10px;

}

.cr__icon--play {

    right: 14px;

    top: 16px;

}

.users-search {

    flex: 1;

}

.users-search__input-wrapper {

    padding: 20px;

}

.users-search__title {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.users-search__footer {

    align-items: center;

    display: flex;

    justify-content: flex-end;

    width: 100%;

}

.users-search__search-result-description {

    align-items: center;

    display: flex;

    gap: 12px;

    justify-content: space-between;

    padding: 0 20px;

}

.users-search__info-icon {

    margin-left: 5px;

}

.users-search__users-list {

    height: 316px;

    padding: 20px;

}

.users-search__users-list--with-footer {

    height: 244px;

}

.creators-search-result-item {

    align-items: center;

    display: flex;

    justify-content: space-between;

    padding: 10px 0;

}

.creators-search-result-item:not(:last-child) {

    border-bottom: 1px solid rgba(255, 255, 255, 0.05);

}

.MMM {

    align-items: center;

    border-radius: 8px;

    cursor: pointer;

    display: flex;

    margin: 0 8px;

    padding: 12px;

    position: relative;

    transition: background 0.3s;

}

.MMM .icon-people {

    color: #fff;

    margin: 0 6px 0 0;

}

@media (pointer: fine) {

    .MMM:hover,

    .MMM:hover .avatar .online,

    .MMM:hover .M__tier {

        background: #343437;

    }

}

.M__tier {

    align-items: center;

    background: #232325;

    border-radius: 50%;

    bottom: -4px;

    display: flex;

    height: 22px;

    justify-content: center;

    position: absolute;

    right: -4px;

    transition: background 0.3s;

    width: 22px;

}

.M__tier .icon-diamond-colored,

.M__tier .icon-diamond-flat {

    height: 14px;

    width: 14px;

}

.M__avatar-wrapper {

    margin: 0 12px 0 0;

    position: relative;

}

.M .avatar {

    flex-shrink: 0;

    height: 44px;

    width: 44px;

}

.M .avatar .online {

    background: #232325;

    height: 12px;

    left: -3px;

    top: -3px;

    width: 12px;

}

.M__content {

    overflow: hidden;

}

.M__name {

    align-items: center;

    display: flex;

}

.M__name .username {

    font-weight: 700;

}

.M__text {

    color: rgba(255, 255, 255, 0.6);

    margin: 5px 0 0;

    min-height: 16px;

    overflow: hidden;

    padding-right: 40px;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.M__time {

    font-size: 12px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: normal;

    margin: 0 0 0 6px;

    opacity: 0.3;

}

.M__menu {

    align-items: center;

    cursor: pointer;

    display: flex;

    height: 32px;

    justify-content: center;

    opacity: 0.4;

    position: absolute;

    right: 0;

    top: 50%;

    transform: translateY(-50%) rotate(90deg);

    transition: opacity 0.3s;

    width: 32px;

}

@media screen and (max-width: 639px) {

    .M__menu {

        height: 44px;

        margin-right: -8px;

        width: 44px;

    }

}

.M__menu:hover {

    opacity: 1;

}

.M__new {

    align-items: center;

    background: #ff5f5f;

    border-radius: 10px;

    color: #fff;

    display: flex;

    font-size: 11px;

    height: 20px;

    justify-content: center;

    min-width: 20px;

    padding: 0 4px;

    pointer-events: none;

    position: absolute;

    right: 30px;

}

.M .personal-notifications-settings {

    bottom: unset;

    left: unset;

    right: -8px;

    top: 56px;

}

@media screen and (max-width: 639px) {

    .M .personal-notifications-settings {

        bottom: unset;

        left: 7px;

        right: 7px;

        top: 56px;

        width: unset;

    }

}

.M--menu--top .personal-notifications-settings {

    bottom: 56px;

    top: unset;

}

@media screen and (max-width: 639px) {

    .M--menu--top .personal-notifications-settings {

        bottom: 56px;

        top: unset;

    }

}

.M--menu--top .personal-notifications-settings-arrow-up {

    bottom: -5px;

    top: unset;

    transform: rotate(180deg);

}

.M .personal-notifications-switcher-name {

    cursor: pointer;

    text-decoration: none;

}

.M .personal-notifications-switcher-name:hover {

    color: #fff;

}

.modal-light {

    animation: opacity-fade-top-show 0.5s;

    cursor: default;

    min-width: 400px;

    position: absolute;

}

.modal-light--position--top {

    bottom: 100%;

    left: 0;

    margin: 0 0 20px;

}

.modal-light--position--top-right {

    bottom: 100%;

    margin: 0 0 20px;

    right: 0;

}

.modal-light--position--bottom {

    left: 0;

    margin: 20px 0 0;

    top: 100%;

}

@media screen and (max-width: 639px) {

    .modal-light {

        animation: none;

        bottom: auto !important;

        left: 20px !important;

        margin: 0;

        min-width: auto;

        position: fixed !important;

        right: 20px !important;

        top: 50% !important;

        transform: translateY(-50%);

        z-index: 4;

    }

}

.media-thumb-edit-content__select-cover {

    background: rgba(217, 2, 60, 0.4);

    border-radius: 18px;

    bottom: 0;

    left: 0;

    pointer-events: none;

    position: absolute;

    top: 0;

    width: 100%;

}

.media-thumb-edit-content__checkbox {

    pointer-events: none;

    position: absolute;

    right: 8px;

    top: 8px;

    z-index: 2;

}

.media-thumb-edit-content .menu-button-dots {

    position: absolute;

    right: 10px;

    top: 10px;

    z-index: 2;

}

.media-thumb-edit-content__edit-cover {

    background: #000;

    border-radius: 18px;

    bottom: 0;

    left: 0;

    opacity: 0;

    position: absolute;

    top: 0;

    width: 100%;

}

.media-thumb-edit-content__edit-cover:hover {

    opacity: 0.2;

}

.bc {

    position: relative;

}

.bc--clickable {

    cursor: pointer;

}

.bcc::before {

    background: #1b1b1d;

    border-radius: 18px;

    content: "";

    height: 100%;

    left: 2%;

    pointer-events: none;

    position: absolute;

    top: 2%;

    width: 100%;

}

.bc--locked:hover > .bc__image-wrapper--locked {

    background: linear-gradient(246.82deg, #3b2d71 0, #1e1146 100%) no-repeat center;

    background-size: cover;

}

.bc .m {

    border-radius: 18px;

    overflow: inherit;

}

.bc__image-wrapper {

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    border-radius: 18px;

    display: block;

    overflow: hidden;

    padding-bottom: 75%;

    pointer-events: none;

    position: relative;

    transform: translateZ(0);

    width: 100%;

}

.bc__image-wrapper--locked {

    background-image: linear-gradient(246.82deg, #3c185e 0, #100415 100%);

}

.bc__image-wrapper--shadow::after {

    background: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, 0.65) 100%);

    content: "";

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    transition: opacity 0.3s;

    width: 100%;

}

.bc__image {

    height: 100%;

    left: 0;

    object-fit: cover;

    object-position: center;

    position: absolute;

    top: 0;

    transform: scale(1.01);

    transition: transform 0.3s;

    width: 100%;

}

.bc:hover .bc__image {

    transform: scale(1.1);

}

.bc:hover .bc__image-wrapper::after {

    opacity: 0.5;

}

.bc__description {

    font-size: 12px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: normal;

    bottom: 5%;

    color: rgba(255, 255, 255, 0.6);

    left: 6%;

    margin: 0 14px 0 0;

    max-width: 100%;

    padding-right: 28px;

    position: absolute;

    white-space: normal;

}

.bc__name {

    font-size: 16px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: normal;

    color: #fff;

    display: block;

    margin: 0 0 4px;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.bD {

    max-width: calc(100vw - 32px);

    width: 100%;

}

.bD__header {

    align-items: flex-end;

    display: flex;

    justify-content: space-between;

    margin: 0 0 32px;

}

.bD__tabs {

    color: #a0a0a1;

    display: flex;

    font-size: 24px;

    gap: 32px;

}

.bD__tab {

    cursor: pointer;

}

.bD__tab--active,

.bD__tab:hover {

    color: #fff;

}

.bD__tab--active {

    pointer-events: none;

}

.bD__link {

    align-items: center;

    color: #ff3332;

    display: flex;

    font-size: 16px;

    transition: color 0.3s;

}

@media (max-width: 639px) {

    .bD__tabs {

        gap: 24px;

    }

    .bD .scroll-bar-container__arrow,

    .bD .scroll-bar-container__shadow {

        display: none;

    }

}

.link-banner {

    align-items: center;

    background: radial-gradient(120.5% 1003.32%at 69.22% 14.96%, #7a2cc4 0, #421074 100%), #050506;

    border-radius: 10px;

    display: flex;

    padding: 8px 10px;

    text-decoration: none;

    transition: background 0.3s;

}

.link-banner:hover {

    background: radial-gradient(120.5% 1003.32%at 69.22% 14.96%, #9544e1 0, #7a29cc 100%), #050506;

    text-decoration: none;

}

.link-banner:hover .link-banner__text {

    color: #cfcfd0;

}

.link-banner__icon {

    width: 48px;

}

.link-banner__text {

    color: #a0a0a1;

}

.link-banner__title {

    color: #fff;

    margin: 0 0 4px;

}

.messenger-upload-button-wrapper {

    height: 100%;

    margin-right: 8px;

    opacity: 0.6;

}

.messenger-upload-button-wrapper:hover,

.cY:hover::before {

    opacity: 1;

}

.messenger-upload-button-wrapper .upload-icon {

    height: 22px;

    width: 22px;

}

.documents-submit-warning {

    align-items: center;

    display: flex;

    flex-direction: column;

    padding: 0 0 56px;

    text-align: center;

}

.documents-submit-warning__icon {

    margin-bottom: 8px;

}

.documents-submit-warning__title {

    font-size: 1.125rem;

    line-height: 1.374rem;

    font-weight: 500;

    margin-bottom: 12px;

}

.documents-submit-warning__subtitle {

    font-size: 0.813rem;

    line-height: 1.125rem;

    margin-bottom: 20px;

    opacity: 0.8;

}

.E {

    align-items: center;

    border-bottom: 2px solid rgba(255, 255, 255, 0.05);

    display: flex;

    justify-content: flex-start;

    padding: 20px;

}

.E__left {

    height: 48px;

    margin-right: 14px;

    width: 48px;

}

.E__avatar.avatar {

    height: 48px;

    width: 48px;

}

.E__title {

    font-size: 16px;

    font-weight: 700;

}

.E__sub-text {

    color: #707071;

    font-size: 12px;

}

.E__sub-text--last::before {

    content: " â€¢ ";

}

.E__avatar {

    height: 48px;

    width: 48px;

}

.co {

    bottom: -22px;

    column-gap: 4px;

    display: flex;

    height: 42px;

    left: 0;

    position: absolute;

    right: 0;

    z-index: 1;

}

.co__item {

    align-items: center;

    background: #343437;

    border-radius: 6px;

    color: #fff;

    cursor: pointer;

    display: flex;

    flex-shrink: 0;

    font-size: 12px;

    height: 20px;

    overflow: hidden;

    padding: 0 5px;

    white-space: nowrap;

}

.co__item:hover {

    background: #424248;

}

.cZ {

    align-items: center;

    display: flex;

    justify-content: center;

}

.cZ--disabled {

    pointer-events: none;

}

.cZ__content {

    align-items: center;

    background: rgba(255, 255, 255, 0.1);

    border-radius: 10px;

    display: flex;

    flex: 1;

    height: 40px;

    position: relative;

    transition: background 0.3s;

    z-index: 2;

}

.cZ__content:focus-within {

    background: rgba(255, 255, 255, 0.2);

}

.cZ .chat-controls-input {

    height: 40px;

    margin: 0;

    padding: 8px 0 0;

}

.cZ .chat-controls-input__wrapper {

    padding: 0 0 0 4px;

}

.cZ .chat-controls-input__wrapper-scroll {

    right: 4px;

}

.cZ__smiles-wrapper {

    background: 0 0;

    border: 0;

    display: block;

    padding: 0;

}

.cZ__send {

    align-items: center;

    background: 0 0;

    border: 0;

    box-sizing: content-box;

    color: #cfcfd0;

    cursor: pointer;

    display: flex;

    justify-content: flex-end;

    overflow: hidden;

    padding: 0;

    position: relative;

    transition: padding-left 0.3s;

    width: 32px;

}

.cZ__send--share {

    padding-left: 6px;

}

.cZ__send--share::before {

    background: rgba(255, 255, 255, 0.05);

    content: "";

    height: 20px;

    left: 10px;

    position: absolute;

    width: 1px;

}

.cY:hover,

.cZ__send:hover {

    color: #fff;

}

.cZ__alert {

    align-items: center;

    animation: form-alert-top-and-hide 3s;

    background: rgba(0, 0, 0, 0.6);

    border-radius: 20px;

    bottom: 100%;

    color: #cfcfd0;

    display: flex;

    font-size: 14px;

    margin: 0 0 12px;

    min-height: 42px;

    opacity: 0;

    padding: 0 18px;

    pointer-events: none;

    position: absolute;

}

.cZ__shater {

    align-items: center;

    color: rgba(255, 255, 255, 0.4);

    cursor: pointer;

    display: flex;

    font-size: 12px;

    gap: 3px;

    left: 12px;

    position: absolute;

    right: 12px;

    top: 8px;

}

.cZ__shater--loading {

    color: #fccf49;

    pointer-events: none;

}

.cY {

    align-items: center;

    border-radius: 60px;

    color: #fff;

    cursor: pointer;

    display: flex;

    font-size: 20px;

    height: 48px;

    overflow: hidden;

    padding: 0 20px;

    position: absolute;

    transform: translateY(-50%) translateX(-50%);

    white-space: nowrap;

    z-index: 1;

}

.cY::before {

    background: rgba(0, 0, 0, 0.1);

    bottom: 0;

    content: "";

    left: 0;

    opacity: 0;

    pointer-events: none;

    position: absolute;

    top: 0;

    transition: opacity 0.3s;

    width: 100%;

}

.cY--dark-text,

.cY--dark-text:hover {

    color: #000;

}

.cY__text {

    position: relative;

}

.cY__icon--style--blocked {

    color: #d21b4c;

}

.cY__icon--style--star-filled {

    color: #fccf49;

}

.cY__notify {

    align-items: center;

    animation: opacity-fade-show 0.5s;

    background: rgba(0, 0, 0, 0.6);

    border-radius: 20px;

    bottom: 64px;

    display: flex;

    gap: 18px;

    left: 12px;

    min-height: 48px;

    padding: 4px 18px;

    pointer-events: none;

    position: absolute;

    right: 12px;

    z-index: 2;

}

.cY__notify--floor {

    bottom: 12px;

}

.c9__logo {

    align-items: center;

    background: #d60908;

    border-radius: 14px;

    display: flex;

    justify-content: center;

}

.c9__list {

    margin: 0 0 0-64px;

}

.ct {

    column-gap: 10px;

    display: flex;

    margin: 0 0 20px;

    overflow: auto;

    position: relative;

    width: 100%;

}

.cu {

    display: flex;

    gap: 20px;

    height: 304px;

}

.cu__item {

    align-items: center;

    background: #343437 no-repeat center;

    background-size: cover;

    border-radius: 12px;

    color: #fff;

    cursor: pointer;

    display: flex;

    flex: 1;

    flex-direction: column;

    gap: 4px;

    justify-content: center;

    overflow: hidden;

    position: relative;

}

.cu__item:hover {

    background-color: #424248;

}

.cu__item--image::before {

    background: #000;

    bottom: 0;

    content: "";

    left: 0;

    opacity: 0.7;

    position: absolute;

    top: 0;

    width: 100%;

}

.cu__item--image:hover::before {

    opacity: 0.6;

}

.cx__video-time {

    align-items: center;

    background: rgba(0, 0, 0, 0.8);

    border-radius: 4px;

    bottom: 6px;

    color: #cfcfd0;

    display: flex;

    font-size: 10px;

    font-weight: 500;

    height: 14px;

    line-height: 13px;

    padding: 0 3px;

    position: absolute;

    right: 6px;

}

.cx__video {

    border-radius: 4px;

    max-height: 100%;

    max-width: 100%;

}

.cx__video-wrapper {

    align-items: center;

    display: flex;

    height: 234px;

    justify-content: center;

    margin: 0 0 20px;

    position: relative;

}

.cx__video-inner-wrapper {

    align-items: center;

    display: flex;

    height: inherit;

    justify-content: center;

    overflow: hidden;

    position: relative;

}

.cx__track {

    display: flex;

    margin: 0 0 0-14px;

}

.cx__error {

    display: flex;

    flex-direction: column;

    gap: 10px;

}

.cx__remove {

    align-items: center;

    color: #707071;

    cursor: pointer;

    display: flex;

    justify-content: center;

    width: 34px;

}

.cx__remove:hover {

    color: #cfcfd0;

}

.cv {

    display: flex;

    height: 225px;

}

.cv__image {

    align-items: center;

    display: flex;

    flex: 1;

    justify-content: center;

    position: relative;

}

.cv__image-photo {

    border-radius: 4px;

    max-height: 100%;

    max-width: 100%;

}

.cv__controls {

    align-items: center;

    bottom: 20px;

    display: flex;

    gap: 10px;

    position: absolute;

}

.cv__button {

    align-items: center;

    background: rgba(0, 0, 0, 0.4);

    border-radius: 50%;

    color: #cfcfd0;

    cursor: pointer;

    display: flex;

    height: 32px;

    justify-content: center;

    width: 32px;

}

.cv__button:hover {

    background: rgba(0, 0, 0, 0.6);

    color: #fff;

}

.cv__loading {

    align-items: center;

    display: flex;

    flex: 1;

    flex-direction: column;

    gap: 10px;

    justify-content: center;

    width: 100%;

}

.c3 {

    padding: 0 20px;

}

.c3__row {

    align-items: flex-start;

    color: rgba(255, 255, 255, 0.6);

    display: flex;

    gap: 12px;

    justify-content: space-between;

}

.c3__row:not(first-child) {

    margin-top: 16px;

}

.c3__row-title {

    display: grid;

    font-size: 14px;

    font-weight: 400;

    grid-auto-flow: column;

    grid-column-gap: 8px;

    justify-content: start;

    min-width: 40%;

}

.c3__row-value {

    align-items: center;

    color: #fff;

    display: flex;

    font-size: 14px;

    font-weight: 500;

}

.c3__row-value--warning {

    color: #fccf49;

}

.c3__question-icon {

    margin-left: 5px;

}

.c3__divider {

    background-color: #fff;

    height: 1px;

    margin-top: 21px;

    opacity: 0.1;

}

.c3__lists {

    color: #fff;

    text-align: end;

    word-break: break-word;

}

.c3__user-group {

    white-space: nowrap;

}

.c3__media {

    align-items: flex-start;

    display: grid;

    gap: 14px;

    grid-template-columns: repeat(5, 1fr);

    margin-top: 21px;

}

.c3__description {

    font-style: italic;

    margin-top: 16px;

    white-space: pre-wrap;

}

.c3__buttons-wrapper {

    display: flex;

    gap: 8px;

    margin-bottom: 16px;

}

.c3__edit-button {

    align-items: center;

    display: flex;

    flex: 1;

    gap: 10px;

}

@media (max-width: 420px) {

    .c3__media {

        grid-template-columns: repeat(3, 1fr);

    }

}

.c4 {

    position: relative;

}

.c4:first-child {

    margin-left: 0;

}

.c4__image {

    aspect-ratio: 1;

    border-radius: 4px;

    cursor: pointer;

    height: 64px;

    overflow: hidden;

    width: 100%;

}

.c4__top-right {

    pointer-events: none;

    position: absolute;

    right: 2px;

    top: 2px;

}

.c4__icon {

    color: #fff;

    filter: drop-shadow(0 0 6px rgba(0, 0, 0, 0.3));

    height: 16px;

    width: 16px;

}

.personal-notifications-modal-panel-controls {

    align-items: center;

    color: rgba(255, 255, 255, 0.4);

    display: flex;

    height: 24px;

    position: absolute;

    right: 22px;

    top: 20px;

    z-index: 11;

}

.personal-notifications-modal-panel-controls-btn {

    background: 0 0;

    color: #707071;

    margin-left: 24px;

    position: relative;

    z-index: 11;

}

.personal-notifications-modal-panel-controls-btn:hover {

    color: #fff;

}

.personal-notifications-modal-panel-controls-btn.active {

    color: #fff;

    pointer-events: none;

}

.personal-notifications-modal-panel-controls-btn.active .icon-settings {

    transform: rotate(180deg);

}

.personal-notifications-modal-panel-controls .icon {

    height: 18px;

    transition: all 0.3s;

    width: 18px;

}

.personal-notifications-modal-panel-controls .icon.icon-close-3 {

    height: 15px;

    width: 15px;

}

@media screen and (max-width: 639px) {

    .personal-notifications-modal-panel-controls .icon.icon-close-3 {

        height: 13px;

        width: 13px;

    }

}

.personal-notifications-modal-panel-controls__icon-title {

    margin: 0 16px 0 0;

}

.personal-notifications-modal-panel-controls__select {

    margin: 8px 0;

    max-width: 300px;

    width: 300px;

}

.personal-notifications-modal-panel-controls-form {

    max-width: 100%;

    padding: 30px;

    width: 600px;

}

.personal-notifications-modal-panel-controls-form label {

    align-items: center;

    display: flex;

    margin: 10px 0;

}

.personal-notifications-modal-panel-controls-form-field.input,

.personal-notifications-modal-panel-controls-form-field.select {

    display: block;

    height: 30px !important;

    text-align: left;

    width: 185px;

}

.personal-notifications-modal-panel-controls-form-field .select-control {

    height: 30px !important;

}

.personal-notifications-modal-panel-controls-form-text {

    text-align: left;

    width: 100px;

}

.personal-notifications-modal-panel-controls-form-actions {

    align-items: center;

    border-top: 1px solid rgba(255, 255, 255, 0.1);

    display: flex;

    justify-content: flex-end;

    margin: 20px 0 0;

    padding: 20px 0 0;

}

.personal-notifications-modal-panel-controls-form-actions > .btn {

    margin: 0 0 0 20px;

}

.personal-notifications-modal-panel-controls-form h3 {

    font-size: 22px;

    font-weight: 600;

    letter-spacing: normal;

    line-height: normal;

    margin: 0 0 12px;

}

.personal-notifications-modal-panel-controls-form h3 > .icon {

    height: 21px;

    margin: 0 14px 0 0;

    width: 21px;

}

.personal-notifications-modal-panel-controls__create-mass-message-btn {

    align-items: center;

    color: rgba(255, 255, 255, 0.6);

    display: grid;

    grid-auto-flow: column;

    grid-column-gap: 10px;

    justify-content: start;

    transition: color 0.3s;

    width: auto;

}

.personal-notifications-modal-panel-controls__create-mass-message-btn .icon {

    transition: none;

}

.personal-notifications-modal-panel-controls__create-mass-message-btn:hover {

    color: #fff;

}

.personal-notifications-modal-panel-controls > .personal-notifications-modal-panel-controls-settings {

    right: 20px;

    top: 32px;

}

@media screen and (max-width: 639px) {

    .personal-notifications-modal-panel-controls {

        right: 17px;

        top: 15px;

    }

    .personal-notifications-modal-panel-controls-form label {

        justify-content: space-between;

    }

}

.i {

    display: flex;

    flex-direction: column;

    margin: -20px 0 0;

}

.settings-pricing-controls .input-wrapper {

    margin: 8px 0 20px;

}

.settings-pricing-controls__wrapper--disabled {

    opacity: 0.4;

    pointer-events: none;

}

.settings-pricing-controls__description {

    font-size: 14px;

    margin: 10px 0 20px;

    opacity: 0.6;

}

.settings-pricing-controls__title {

    font-size: 20px;

    font-weight: 700;

    margin: 20px 0;

}

.settings-pricing-controls__footer-text {

    color: #707071;

    font-size: 12px;

    margin: 20px 0;

}

.c__description {

    color: #a0a0a1;

    font-size: 14px;

    margin: 10px 0 20px;

}

.c__title {

    font-size: 20px;

    font-weight: 700;

    margin: 0 0 20px;

}

.c__links-list {

    display: grid;

    grid-auto-flow: row;

    grid-row-gap: 16px;

    margin-bottom: 20px;

}

.c__actions {

    display: flex;

}

.c__add-link-button {

    align-items: center;

    display: grid;

    flex: 1;

    grid-auto-flow: column;

    grid-column-gap: 12px;

    justify-content: center;

}

.b2 {

    height: 100%;

    position: relative;

}

.b2__total {

    align-items: center;

    display: flex;

    flex-direction: column;

    gap: 8px;

    justify-content: center;

    left: 50%;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

}

.b2__total-title {

    color: #707071;

    font-size: 12px;

    font-weight: 500;

    line-height: 120%;

    text-transform: uppercase;

}

.flag {

    background-repeat: no-repeat;

    background-size: contain;

}

.flag.size-small {

    height: 11px;

    width: 16px;

}

.flag.size-medium {

    height: 17px;

    width: 24px;

}

.b3,

.statistics-line-chart {

    height: 100%;

    position: relative;

}

.multi-check-box-settings {

    background: #1b1b1d;

    border-radius: 12px;

    color: #cfcfd0;

    font-size: 13px;

    font-weight: 400;

    line-height: 20px;

    overflow: hidden;

    position: relative;

}

.multi-check-box-settings--closed:hover {

    background: #232325;

}

.multi-check-box-settings__title {

    color: #fff;

    display: flex;

    font-size: 16px;

    font-weight: 700;

    line-height: 20px;

    min-height: 62px;

    padding: 20px 20px 0;

    position: relative;

}

.multi-check-box-settings__title--closed {

    cursor: pointer;

}

.multi-check-box-settings__content {

    padding: 0 20px;

}

.multi-check-box-settings__help {

    align-items: center;

    border: 1px solid currentColor;

    border-radius: 50%;

    color: #cfcfd0;

    cursor: pointer;

    display: flex;

    font-size: 11px;

    height: 15px;

    justify-content: center;

    margin: 3px 0 0 6px;

    width: 15px;

}

.multi-check-box-settings__description {

    margin: 8px 0 0;

}

.multi-check-box-settings__control {

    cursor: pointer;

    opacity: 0.6;

    padding: 4px;

    position: absolute;

    right: 20px;

    top: 16px;

    transition: transform 0.3s, opacity 0.3s;

}

.multi-check-box-settings__control:hover,

.bd__content:hover .my-collection-video-item__play {

    opacity: 1;

}

.multi-check-box-settings__control--opened {

    transform: rotate(-180deg);

}

.multi-check-box-settings__arrow {

    height: 14px;

    width: 14px;

}

.multi-check-box-settings__list {

    border-top: 1px solid rgba(255, 255, 255, 0.2);

    margin: 10px 0 0;

    padding: 10px 0;

}

.radio-check-block {

    background: #343437;

    border-radius: 12px;

    margin: 0 0 10px;

}

.radio-check-block__header {

    cursor: pointer;

    display: flex;

    gap: 18px;

    padding: 18px;

}

.radio-check-block__title {

    font-size: 16px;

    font-weight: 500;

}

.radio-check-block__sub-title {

    color: #a0a0a1;

    margin: 6px 0 0;

}

.radio-check-block__radio-box {

    align-items: center;

    border: 2px solid rgba(255, 255, 255, 0.4);

    border-radius: 50%;

    display: flex;

    height: 20px;

    justify-content: center;

    width: 20px;

}

.radio-check-block__radio-box--checked {

    border-color: #ff3332;

}

.radio-check-block__radio-box--checked::before {

    background: #ff3332;

    border-radius: 50%;

    content: "";

    display: block;

    height: 10px;

    width: 10px;

}

.radio-check-block__checkbox {

    align-items: center;

    border: 2px solid rgba(255, 255, 255, 0.4);

    border-radius: 4px;

    color: #fff;

    display: flex;

    height: 18px;

    justify-content: center;

    width: 18px;

}

.radio-check-block__checkbox--checked {

    background: #ff3332;

    border-color: #ff3332;

}

.radio-check-block__checkbox--disabled {

    background: #5f5f67;

    border-color: #5f5f67;

    color: #e3e1ec;

    pointer-events: none;

}

.radio-check-block__radio-box-icon {

    height: 14px;

    width: 14px;

}

.radio-check-block__content {

    padding: 14px 18px 18px;

    position: relative;

}

.radio-check-block__content::before {

    background: #f8f8f8;

    content: "";

    height: 1px;

    left: 18px;

    opacity: 0.05;

    position: absolute;

    right: 18px;

    top: 0;

}

.bj {

    align-items: center;

    background: inherit;

    display: flex;

    flex-wrap: nowrap;

    justify-content: flex-start;

}

.bj__avatar-wrapper {

    background: inherit;

    border-radius: 30.75%;

    padding: 2px;

    z-index: 1;

}

.bj__avatar-wrapper:not(:first-child) {

    margin-left: -10px;

}

.earnings-table-info {

    align-items: center;

    display: flex;

    flex-flow: row nowrap;

    justify-content: space-between;

    margin-bottom: 20px;

}

.earnings-table-info__description {

    font-size: 13px;

    font-weight: 400;

    line-height: 16px;

    margin: 12px 0;

}

@media screen and (max-width: 639px) {

    .earnings-table-info {

        padding: 0;

    }

}

@media screen and (max-width: 1023px) {

    .earnings-table-info {

        align-items: start;

    }

}

.earnings-table-info-main {

    align-items: center;

    display: flex;

    flex-flow: row nowrap;

    flex-grow: 1;

    justify-content: space-between;

    margin-right: 20px;

}

@media screen and (max-width: 1023px) {

    .earnings-table-info-main {

        align-items: start;

        flex-flow: column nowrap;

    }

}

.earnings-table-info-title {

    font-size: 1.25rem;

    color: #fff;

    font-weight: 400;

    line-height: 1.2;

    margin: 0;

}

.earnings-table-info-title .primary-color-text {

    font-weight: 700;

}

@media screen and (max-width: 1023px) {

    .earnings-table-info-title {

        margin-bottom: 13px;

    }

}

.earnings-table-info-life-time-picker {

    min-width: 286px;

}

.my-collection-video-item__duration {

    font-size: 12px;

    font-weight: 700;

    letter-spacing: normal;

    line-height: normal;

    align-items: center;

    background: rgba(0, 0, 0, 0.6);

    border-radius: 6px;

    bottom: 3%;

    color: #a0a0a1;

    display: flex;

    height: 22px;

    padding: 0 8px;

    position: absolute;

    right: 3%;

}

.my-collection-video-item__play {

    align-items: center;

    background: rgba(0, 0, 0, 0.5);

    border-radius: 24px;

    display: flex;

    height: 30%;

    justify-content: center;

    left: 50%;

    opacity: 0;

    position: absolute;

    top: 50%;

    transform: translateX(-50%) translateY(-50%);

    transition: opacity 0.3s;

    width: 30%;

}

.my-collection-video-item__play > .icon {

    height: 50%;

    margin: 0;

    width: 50%;

}

.bM {

    align-items: stretch;

    background: #111113;

    border-radius: 12px;

    display: flex;

    flex: 1 0 284px;

    gap: 16px;

    min-height: 128px;

    min-width: 284px;

    padding: 20px 16px 20px 20px;

    transition: background 0.3s;

}

.bM--style--accent {

    background: rgba(91, 65, 255, 0.2);

}

.bM--style--accent .bM__title {

    color: #ff3332;

}

.bM--hovered {

    cursor: pointer;

}

.bM--hovered:hover {

    background: #1b1b1d;

}

.bM--hovered:hover.bM--style--accent {

    background: rgba(91, 65, 255, 0.3);

}

.bM--hovered:hover .df__chevron-icon {

    color: #cfcfd0;

}

.bM__left-part {

    flex: 1;

}

.bM__right-part {

    align-items: center;

    display: flex;

    flex: 0 1 24px;

    flex-direction: column;

    justify-content: space-between;

    width: 24px;

}

.bM__right-part--center {

    justify-content: center;

}

.bM__title {

    color: #707071;

    font-size: 12px;

    font-weight: 400;

    margin-bottom: 15px;

    text-transform: uppercase;

}

.bM__body {

    color: #fff;

    display: grid;

    font-size: 36px;

    font-weight: 500;

    margin-bottom: 8px;

}

.bM__body-content {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.bM__body-highlight {

    color: #fff;

    font-size: 2rem;

    line-height: 2.5rem;

}

.bM__description {

    align-items: flex-start;

    color: #707071;

    display: flex;

    font-size: 12px;

    font-weight: 400;

    gap: 10px;

}

.bM__indicator {

    color: #21b062;

}

.bM__indicator--spaced {

    margin-right: 8px;

}

.bM__indicator--negative {

    color: #d21b4c;

}

.bM__chevron-icon {

    color: #707071;

}

.bM__help-tooltip {

    color: #707071;

    white-space: normal;

}

.bM__help-tooltip.help-tooltip:hover {

    color: #a0a0a1;

}

.b7__title {

    color: #f8f8f8;

    font-size: 20px;

    font-weight: 500;

    line-height: 24px;

    margin-bottom: 8px;

}

.b7__description {

    color: #cfcfd0;

    font-size: 14px;

    font-weight: 500;

    line-height: 22px;

    margin-bottom: 20px;

}

.bW {

    animation-duration: 250ms;

    animation-name: animate-slide;

    animation-timing-function: ease;

}

.responsive-grid {

    column-gap: 20px;

    display: grid;

    grid-template-columns: 2fr 1fr;

    margin: 40px 0 0;

    row-gap: 20px;

}

.responsive-grid__column {

    flex: 1;

}

@media screen and (max-width: 1023px) {

    .responsive-grid {

        grid-template-columns: 1fr;

    }

}

.icon-badge {

    align-items: center;

    display: flex;

    justify-content: center;

}

.icon-badge--size--small {

    border-radius: 6px;

    font-size: 12px;

    height: 20px;

    width: 20px;

}

.icon-badge--style--white {

    background: #fff;

    color: #d60908;

}

.icon-badge--style--primary {

    background: #d60908;

    color: #fff;

}

.upload-percent-round {

    align-items: center;

    border: 2px solid #424248;

    border-radius: 50%;

    display: flex;

    justify-content: center;

    pointer-events: none;

    position: relative;

}

.upload-percent-round--animated {

    animation: donut-spin 1.2s linear infinite;

}

.upload-percent-round--color--blue {

    color: #d60908;

}

.upload-percent-round__svg {

    height: inherit;

    position: absolute;

    transform: rotateY(-180deg) rotateZ(-90deg);

    width: inherit;

}

.upload-percent-round__circle {

    fill: none;

    stroke: currentColor;

    stroke-linecap: round;

}

.select-popup {

    color: #fff;

    display: inline-block;

    position: relative;

    width: 100%;

    z-index: 2;

}

.select-popup__value-content {

    align-items: center;

    column-gap: 10px;

    display: flex;

    font-size: 12px;

    font-weight: 700;

}

.select-popup__value {

    align-items: center;

    background: #343437;

    border: 1px solid transparent;

    border-radius: 12px;

    cursor: pointer;

    display: flex;

    height: 44px;

    padding: 0 40px 0 12px;

    transition: background 0.3s;

}

.select-popup__value:hover {

    background: #424248;

}

.select-popup__value--error {

    border-color: #fd3a5b;

}

.select-popup__value-icon {

    height: 20px;

    margin: 0 8px 0 0;

    width: 20px;

}

.select-popup__arrow {

    color: #a0a0a1;

    margin: 0 0 0 16px;

    position: absolute;

    right: 12px;

    width: 12px;

}

.select-popup__popup {

    background: #232325;

    border-radius: 12px;

    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);

    left: 0;

    overflow: hidden;

    position: absolute;

    top: 0;

    width: 100%;

}

.select-popup__title {

    font-size: 13px;

    font-weight: 500;

    margin: 0 0 12px;

    padding: 0 16px 12px;

}

.select-popup__item {

    align-items: center;

    cursor: pointer;

    display: flex;

    font-size: 15px;

    font-weight: 500;

    height: 56px;

    padding: 4px 20px 4px 0;

    position: relative;

    transition: background 0.3s;

}

.select-popup__item:hover {

    background: #343437;

}

.select-popup__item--disabled {

    background: 0 0 !important;

    pointer-events: none;

}

.select-popup__item-check {

    color: #ff3332;

    height: 17px;

    position: absolute;

    right: 18px;

    width: 17px;

}

.select-popup__item-icon-wrapper {

    display: flex;

    justify-content: center;

    width: 46px;

}

.select-popup__item-icon {

    height: 20px;

    width: 20px;

}

.user-check-box {

    display: flex;

    margin: 8px 0;

    padding: 0 116px 0 0;

}

.user-check-box--disabled {

    opacity: 0.6;

    pointer-events: none;

}

.user-check-box__avatar {

    margin: 0 8px;

}

.user-check-box .checkbox-ds {

    pointer-events: none;

}

.steps {

    align-items: center;

    color: #a0a0a1;

    display: flex;

    height: 24px;

    justify-content: space-between;

    margin: 0 0 20px;

}

.steps--uncompact {

    margin: 0 0 60px;

}

.steps__item {

    align-items: center;

    display: flex;

    flex-direction: column;

    height: 24px;

    transition: color 0.3s;

    width: 24px;

}

.steps__item-line {

    flex: 1;

    transition: color 0.3s;

}

.steps__item-line::before {

    border-top: 1px dashed currentColor;

    content: "";

    display: block;

    margin: 0 3px;

}

.steps__item-line--ready::before {

    border-top-style: solid;

    color: #21b062;

    margin: 0;

}

.steps__item-icon {

    display: block;

    flex: 1;

    height: 24px;

    min-height: 24px;

    min-width: 24px;

    width: 24px;

}

.steps__item-text {

    margin: 10px 0 0;

}

.steps__item-text-inner {

    display: inline-block;

    font-size: 13px;

    max-width: 140px;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.transfer-fan-steps-info {

    background: #232325;

    border-radius: 12px;

    padding: 24px;

}

.radio-pill-controls {

    align-items: center;

    display: flex;

    flex-wrap: wrap;

    gap: 12px;

}

.radio-pill-controls--content--space-between {

    justify-content: space-between;

}

.radio-pill-controls__item {

    align-items: center;

    background: #343437;

    border: 2px solid transparent;

    border-radius: 12px;

    color: #fff;

    cursor: pointer;

    display: flex;

    font-size: 14px;

    font-weight: 700;

    height: 40px;

    justify-content: center;

    line-height: 17px;

    padding: 0 24px;

    transition: border-color 0.3s, background 0.3s;

}

.radio-pill-controls__item--grow {

    flex: 1;

}

.radio-pill-controls__item:last-child {

    margin-right: 0;

}



.radio-pill-controls__item--active {

    background: rgba(221, 11, 11, 0.2);

    border-color: #ff3332;

}

.add-founds-pill {



}



.add-founds-pill .radio-pill-controls__item--active {

    background: rgb(14 231 71 / 20%) !important;

    border-color: #0abd07 !important;

}



@media screen and (max-width: 639px) {

    .radio-pill-controls {

        gap: 10px;

        justify-content: space-between;

    }

    .radio-pill-controls__item {

        flex: 1;

        padding: 0 12px;

    }

}

.I {

    align-items: center;

    bottom: 48px;

    display: flex;

    justify-content: space-between;

    left: 0;

    min-height: 30px;

    padding: 4px 12px;

    position: absolute;

    right: 0;

    text-align: center;

}

.I--level--error {

    background: #9e3233;

    color: #fff;

}

.I--level--warning {

    background: #343437;

    color: #cfcfd0;

}

.I__close-icon {

    position: absolute;

    right: 6px;

    top: 6px;

}

.chat-request-delivering-banner {

    align-items: center;

    background-color: #ff3332;

    color: #a0a0a1;

    display: flex;

    gap: 6px;

    height: 30px;

    margin-bottom: 8px;

    padding: 4px 16px;

    width: 100%;

}

.chat-request-delivering-banner__body {

    flex: 1;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.chat-request-delivering-banner__close-button {

    background: 0 0;

    border: 0;

    color: #a0a0a1;

    cursor: pointer;

}

.message-list-overlay {

    -webkit-backdrop-filter: blur(0);

    backdrop-filter: blur(0);

    bottom: 0;

    left: 0;

    pointer-events: none;

    position: fixed;

    right: 0;

    top: 0;

    transition: backdrop-filter 50ms linear;

    z-index: 2;

}

.message-list-overlay--visible {

    -webkit-backdrop-filter: blur(10px);

    backdrop-filter: blur(10px);

    pointer-events: auto;

}

.content-status-changed-personal-notification .success-icon {

    color: #79943d;

    fill: currentColor;

}

.closable-settings-menu .chat-header-personal-notifications-settings {

    right: 56px;

    top: 5px;

    width: 247px;

}

@media (max-width: 639px) {

    .closable-settings-menu .chat-header-personal-notifications-settings {

        bottom: auto;

        right: 107px;

    }

}

.closable-settings-menu .chat-header-personal-notifications-settings .personal-notifications-settings-arrow-up {

    display: none;

}

.c5 {

    align-items: center;

    border-radius: 8px;

    cursor: pointer;

    display: flex;

    margin: 0 8px;

    padding: 12px;

    position: relative;

    transition: background 0.3s;

}

@media (pointer: fine) {

    .c5:hover,

    .c5:hover .c5__icon-circle--hovered {

        background: #343437;

    }

}

.c5__icon-wrapper {

    align-items: center;

    display: flex;

    justify-content: center;

    margin-right: 12px;

    position: relative;

}

.c5__icon-circle {

    align-items: center;

    background-color: #ff3332;

    border-radius: 14px;

    display: flex;

    height: 44px;

    justify-content: center;

    width: 44px;

}

.c5__icon-circle--free {

    background-color: #21b062;

}

.c5__icon-circle--small {

    background-color: #3e3f42;

    bottom: -3px;

    height: 24px;

    position: absolute;

    right: -1px;

    width: 24px;

}

.c5__icon-circle--error {

    background-color: #d21b4c;

}

.c5__icon-circle--pending {

    background-color: #fccf49;

    color: #232325;

}

.c5__status-icon {

    color: #fff;

    fill: #fff;

}

.c5__pending {

    color: #fccf49;

    margin-left: 8px;

    position: relative;

}

.c5__question-icon {

    margin-left: 5px;

}

.c5__icon {

    margin-right: 5px;

}

.c5__mode {

    font-size: 15px;

    font-weight: 700;

    letter-spacing: normal;

    line-height: normal;

    color: #fff;

}

.c5__time {

    font-size: 12px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: normal;

    color: #fff;

    margin-left: 8px;

    opacity: 0.3;

}

.c5__bottom {

    align-items: center;

    column-gap: 12px;

    display: flex;

    margin-top: 4px;

}

.c5__count {

    font-size: 14px;

    font-weight: 400;

    letter-spacing: normal;

    color: rgba(255, 255, 255, 0.6);

    line-height: 17px;

}

.c5__chevron {

    color: rgba(255, 255, 255, 0.6);

    margin-left: auto;

}

.c5__error {

    color: #fd4967;

    margin-left: 8px;

}

.image-loader-placeholder {

    animation: skeleton-animation 3s infinite linear;

    background: linear-gradient(90deg, #383838 20%, #404040 28%, #454545 35%, #404040 42%, #383838 50%);

    background-size: 300% 100%;

    will-change: background-position;

    border-radius: 4px;

    overflow: hidden;

}

.image-with-lazy-loading {

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

}

.image-with-lazy-loading--pending::before {

    background: rgba(0, 0, 0, 0.7);

    bottom: 0;

    content: "";

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

}

.image-with-lazy-loading__image {

    clip: rect(0 0 0 0);

    display: none;

    height: 1px;

    margin: -1px;

    position: absolute;

    visibility: hidden;

    width: 1px;

}

.image-with-lazy-loading__placeholder {

    display: none;

    height: 100%;

    left: 0;

    top: 0;

    width: 100%;

}

.image-with-lazy-loading__placeholder--loading {

    display: block;

}

.image-with-lazy-loading__icon {

    align-items: center;

    background-color: #000;

    border-radius: 50%;

    color: #fff;

    display: flex;

    height: 34px;

    justify-content: center;

    left: 50%;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

    width: 36px;

}

.image-with-lazy-loading__icon--pending {

    background-color: transparent;

}

.image-with-lazy-loading__icon--pending .icon.icon-sand-clock {

    margin-left: 0;

}

.image-with-lazy-loading__icon .icon {

    fill: currentColor;

    margin-left: 2px;

    margin-right: 0;

}

.c0__media-preview,

.c6__logo {

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    border-radius: 14px;

}

.c6__logo {

    align-items: center;

    background-color: #d60908;

    display: flex;

    justify-content: center;

}

.c6__footer {

    align-items: center;

    display: flex;

    flex-wrap: wrap;

    gap: 12px;

    justify-content: flex-start;

}

.likes-counter {

    align-items: center;

    background: 0 0;

    border: 0;

    color: inherit;

    cursor: default;

    display: flex;

    opacity: 0.6;

    padding: 0;

    pointer-events: none;

}

.likes-counter--size--small {

    font-size: 12px;

}

.likes-counter--long-format,

.likes-counter--size--medium {

    font-size: 13px;

    font-weight: 700;

    letter-spacing: normal;

    line-height: normal;

}

.likes-counter--long-format {

    font-size: 15px;

}

.likes-counter--clickable {

    cursor: pointer;

    opacity: 1;

    pointer-events: auto;

}

.like-icon--size--small {

    height: 16px;

    margin-right: 4px;

    width: 16px;

}

.like-icon--size--medium {

    height: 20px;

    margin-right: 5px;

    width: 20px;

}

.like-icon.liked {

    color: #f44;

}

.user-media-content-unlock-badge {

    align-items: center;

    border-radius: 6px;

    box-shadow: 0 0 2px rgba(32, 32, 39, 0.3);

    display: flex;

    font-size: 11px;

    font-weight: 700;

    left: 8px;

    max-width: calc(100% - 16px);

    min-height: 24px;

    padding: 4px 8px;

    position: absolute;

    top: 8px;

}

.user-media-content-unlock-badge--style--free {

    background: #f2f2f2;

}

.user-media-content-unlock-badge--style--paid {

    background: #d60908;

}

.user-media-content-unlock-badge__icon {

    color: #fff;

    height: 36px;

    left: 50%;

    opacity: 0.1;

    pointer-events: none;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

    width: 36px;

}

.multi-check-box-settings-item {

    color: #cfcfd0;

    display: flex;

    font-size: 13px;

    font-weight: 400;

    justify-content: space-between;

    line-height: 16px;

    margin: 14px 0;

}

.bVV {

    background: #111113;

    border-radius: 12px;

    display: flex;

    flex-direction: column;

    height: 100%;

    padding: 20px;

}

.bVV__caption {

    align-items: center;

    display: flex;

    margin-bottom: 20px;

}

.bVV__title {

    color: #fff;

    flex: 1;

    font-size: 20px;

    font-weight: 500;

    line-height: 120%;

}

.bVV__tabs-scrollbar {

    border-radius: 12px;

    margin: 20px 0;

}

.bVV__tabs {

    max-width: 640px;

    min-width: 480px;

}

.bVV__tabs--style--expand {

    max-width: 100%;

}

.bVV__dropdown {

    position: relative;

}

.bVV__dropdown .dropdown-menu {

    width: 240px;

}

.bVV__dropdown .dropdown-menu__menu-item {

    padding: 12px 20px;

}

.bVV__dropdown-button {

    align-items: center;

    color: #707071;

    cursor: pointer;

    display: flex;

    font-size: 14px;

    font-weight: 400;

    gap: 6px;

    user-select: none;

}

.bVV__dropdown-button--disabled {

    pointer-events: none;

}

.bVV__dropdown-icon--opened {

    transform: rotate(180deg);

}

.bVV__content {

    display: flex;

    flex: 1;

    flex-direction: column;

    gap: 10px;

    height: 100%;

    position: relative;

}

.bVV__content--horizontal {

    align-items: center;

    flex-direction: row;

    gap: 40px;

    justify-content: center;

}

.bVV__screen {

    background: rgba(17, 17, 19, 0.9);

    bottom: 0;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 3;

}

.bVV__screen-content {

    align-items: center;

    color: #707071;

    display: flex;

    flex-direction: column;

    gap: 8px;

    left: 50%;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

}

.notifications-subscribers-table .data-table-body-row {

    align-items: center;

    padding: 3px 20px;

}

.payment-cards-list-item {

    align-items: center;

    display: flex;

    font-size: 13px;

    justify-content: space-between;

    margin: 18px 0 0;

}

.payment-cards-list-item__number {

    margin: 0 0 0 12px;

}

.payment-cards-list-item__left {

    align-items: center;

    color: #cfcfd0;

    display: flex;

}

.payment-cards-list-item__right {

    align-items: center;

    color: #a0a0a1;

    display: flex;

}



.bRR {

    background: rgba(17, 17, 19, 0.8);

    bottom: 0;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 3;

}

.bRR__content {

    align-items: center;

    color: #a0a0a1;

    display: flex;

    flex-direction: column;

    left: 50%;

    max-width: 260px;

    position: absolute;

    text-align: center;

    top: 50%;

    transform: translate(-50%, -50%);

}

.bSS {

    background: rgba(17, 17, 19, 0.8);

    bottom: 0;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 3;

}

.bSS__loader {

    align-items: center;

    display: flex;

    flex-direction: column;

    gap: 8px;

    left: 50%;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

}

.bZ {

    align-items: center;

    display: flex;

    flex-wrap: wrap;

    gap: 20px;

    justify-content: center;

}

.bZ--vertical {

    align-items: flex-start;

    flex-direction: column;

}

.bZ__item {

    align-items: center;

    border-radius: 10px;

    display: grid;

    grid-auto-flow: column;

    grid-gap: 8px;

    padding: 8px 10px;

    position: relative;

    transition: all 0.1s linear;

}

.bZ__item--hidden {

    opacity: 0.4;

}

.bZ__item--active,

.bZ__item--hovered:hover {

    background: #1b1b1d;

    cursor: pointer;

    opacity: 1;

}

.bZ__item--active .statistics-line-chart__legend-item-label,

.bZ__item--hovered:hover .statistics-line-chart__legend-item-label {

    color: #fff;

}

.bZ__item--disabled {

    opacity: 0.4;

}

.bZ__item-color {

    border-radius: 4px;

    height: 12px;

    width: 12px;

}

.bZ__item-body {

    color: #cfcfd0;

    font-size: 12px;

    font-weight: 700;

    user-select: none;

}

.bZ__tooltip .tooltip-inner {

    background: #343437;

    box-shadow: none;

    color: #cfcfd0;

}

.bZ__tooltip .tooltip-inner--arrow {

    border-color: #343437;

}

.bO {

    display: inline-block;

    position: relative;

}

.bO__button {

    align-items: center;

    background: 0 0;

    border: 2px solid #343437;

    border-radius: 12px;

    color: #a0a0a1;

    cursor: pointer;

    display: flex;

    flex-flow: row nowrap;

    font-size: 14px;

    font-weight: 400;

    min-height: 40px;

    padding: 8px 20px;

    position: relative;

    white-space: nowrap;

    -webkit-user-select: none;

    user-select: none;

}

.bO__button:hover {

    border-color: #fff;

    color: #fff;

}

.bO__button:active,

.bO__button:focus {

    outline: 0;

}

.bO--open .bO__button {

    background: #343437;

    color: #fff;

}

.bO__button-icon {

    margin-right: 10px;

}

@media screen and (max-width: 639px) {

    .bO__button-icon {

        margin: 0;

    }

}

.bO__dropdown {

    position: absolute;

    right: 0;

    top: calc(100% + 10px);

    z-index: 10;

}

.bO__dropdown-menu {

    background: #1b1b1d;

    border-radius: 12px;

    box-shadow: 0 1px 20px rgba(0, 0, 0, 0.4);

    display: flex;

    flex-flow: column nowrap;

    max-width: 100%;

    overflow: hidden;

    transition: opacity 100ms ease;

    width: 248px;

}

.bO__dropdown-menu--hidden {

    opacity: 0;

    pointer-events: none;

}

.bO__dropdown-item {

    font-size: 0.875rem;

    align-items: center;

    background: inherit;

    border: 0;

    color: #fff;

    cursor: pointer;

    display: flex;

    font-weight: 400;

    justify-content: space-between;

    outline: 0;

    padding: 10px 20px;

    text-align: left;

}

.bO__dropdown-item:hover {

    background-color: #232325;

}

.bO__predefine-dates {

    display: flex;

    flex-flow: column nowrap;

}

.bO__custom-interval {

    align-items: center;

    color: #a0a0a1;

    cursor: pointer;

    display: flex;

    gap: 10px;

    padding: 20px;

    position: relative;

}

.bO__custom-interval::before {

    background: rgba(255, 255, 255, 0.05);

    content: "";

    height: 1px;

    margin: 0 auto;

    position: absolute;

    top: 0;

    width: calc(100% - 40px);

}

.bO__custom-interval--fill {

    color: #fff;

}

.bO__clear-interval {

    align-items: center;

    backdrop-filter: blur(5px);

    background: #050506;

    border: 0;

    border-radius: 50%;

    color: #a0a0a1;

    cursor: pointer;

    display: flex;

    height: 20px;

    justify-content: center;

    outline: 0;

    width: 20px;

}

.bO .V {

    background: #1b1b1d;

    border: 0;

}

.bO__calendar-wrapper {

    position: absolute;

    top: 0;

    z-index: 4;

}

.bO__calendar-wrapper--position--left {

    right: calc(100% + 10px);

}

.bO__calendar-wrapper--position--right {

    left: calc(100% + 10px);

}

.bO__calendar-wrapper--position--mobile {

    background: #1b1b1d;

    border-top-left-radius: 12px;

    border-top-right-radius: 12px;

    box-shadow: 0 1px 20px rgba(0, 0, 0, 0.4);

    display: flex;

    justify-content: center;

    left: 0;

    position: fixed;

    right: 0;

    top: 100%;

    transform: translateY(0);

}

.bO__calendar-wrapper--position--mobile.bO__calendar-wrapper--visible {

    transform: translateY(-100%);

}

.bO__close-calendar-mobile {

    background: 0 0;

    border: 0;

    color: #707071;

    display: grid;

    height: 32px;

    padding: 0;

    place-items: center;

    position: absolute;

    right: 0;

    top: -32px;

    width: 32px;

}

.cL {

    align-items: center;

    background: #232325;

    border-radius: 10px;

    color: #fff;

    cursor: pointer;

    display: flex;

    font-size: 16px;

    gap: 10px;

    justify-content: space-between;

    min-height: 56px;

    padding: 4px 16px;

    transition: background 0.3s;

}

.cL:hover {

    background: #343437;

}

.cL__left {

    align-items: center;

    display: flex;

    gap: 14px;

}

.bQ,

.cL__right {

    align-items: center;

    display: flex;

}

.bQQ {

    gap: 12px;

}

.bQQ__image {

    background-color: #343437;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    border-radius: 10px;

    color: #d4d4d4;

    display: grid;

    font-size: 16px;

    place-items: center;

    position: relative;

}

.bQQ__image--type--horizontal {

    height: 32px;

    width: 42px;

}

.bQQ__image--type--vertical {

    height: 64px;

    width: 36px;

}

.bQQ__image--type--square {

    height: 32px;

    width: 32px;

}

.bQQ__preview {

    align-items: center;

    background-color: #343437;

    border-radius: 10px;

    display: flex;

    height: 90px;

    justify-content: center;

    left: 50%;

    opacity: 0;

    overflow: hidden;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

    width: 120px;

    z-index: 3;

}

.bQQ__preview-image {

    height: 100%;

    margin: 0 auto;

    max-width: 100%;

    object-fit: contain;

    width: auto;

}

.bQQ__title {

    color: #fff;

    font-size: 13px;

    font-weight: 400;

    line-height: 120%;

}

.bQQ__title--clickable {

    cursor: pointer;

}

.bQQ__description {

    color: #707071;

    font-size: 11px;

    font-weight: 400;

    line-height: 125%;

}

.text-post-skeleton .avatar-skeleton {

    animation: skeleton-animation 3s infinite linear;

    background: linear-gradient(90deg, #383838 20%, #404040 28%, #454545 35%, #404040 42%, #383838 50%);

    background-size: 300% 100%;

    will-change: background-position;

    border-radius: 50%;

    height: 40px;

    width: 40px;

}

.text-post-skeleton .model-name-skeleton {

    border-radius: 4px;

    height: 16px;

    margin-bottom: 4px;

    width: 85px;

}

.text-post-skeleton .image-skeleton,

.text-post-skeleton .model-name-skeleton,

.text-post-skeleton .posted-at-skeleton {

    animation: skeleton-animation 3s infinite linear;

    background: linear-gradient(90deg, #383838 20%, #404040 28%, #454545 35%, #404040 42%, #383838 50%);

    background-size: 300% 100%;

    will-change: background-position;

}

.text-post-skeleton .posted-at-skeleton {

    border-radius: 4px;

    height: 12px;

    width: 85px;

}

.text-post-skeleton .image-skeleton {

    height: 256px;

    width: 642px;

}

.text-post-skeleton .footer-skeleton {

    padding: 12px 20px 20px;

}

.text-post-skeleton .first-line,

.text-post-skeleton .second-line {

    animation: skeleton-animation 3s infinite linear;

    background: linear-gradient(90deg, #383838 20%, #404040 28%, #454545 35%, #404040 42%, #383838 50%);

    background-size: 300% 100%;

    will-change: background-position;

    border-radius: 4px;

    height: 19px;

    width: 100%;

}

.text-post-skeleton .second-line {

    margin-top: 12px;

    width: 70%;

}

.personal-notifications-message-item-body .message-body-media-icon {

    fill: currentColor;

    vertical-align: bottom;

}

.personal-notifications-message-item-body .extra-request-icon {

    color: #fccf49;

    margin-right: 7px;

}

.bCC {

    contain: strict;

    min-height: 264px;

}

.bCC__list {

    display: flex;

}

.bCC__item {

    margin-right: 12px;

    min-width: 190px;

    width: 190px;

}

.bCC__item:last-child {

    margin: 0;

}

.select-toggler {

    align-items: center;

    background: #424248;

    border: 2px solid #424248;

    border-radius: 10px;

    cursor: pointer;

    display: flex;

    height: 32px;

    justify-content: space-between;

    padding: 0 10px 0 16px;

    transition: background 0.3s, color 0.3s;

}

.select-toggler--opened {

    background: 0 0;

}

.select-toggler__content {

    color: #fff;

    font-size: 13px;

    font-weight: 500;

    padding: 0 14px 0 0;

}

.select-toggler__icon {

    color: #fff;

    opacity: 0.4;

    transition: opacity 0.3s, transform 0.3s;

}

.select-toggler__icon--opened {

    opacity: 1;

    transform: rotate(180deg);

}

.c8__logo {

    align-items: center;

    background-color: #d60908;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    border-radius: 14px;

    display: flex;

    justify-content: center;

    position: relative;

}

.c8__icon--small {

    align-items: center;

    background: #d60908;

    border-radius: 50%;

    bottom: -4px;

    display: flex;

    height: 24px;

    justify-content: center;

    position: absolute;

    right: -4px;

    width: 24px;

}

.cw {

    border-radius: 4px;

    flex: 1;

    overflow: hidden;

    position: relative;

}

.cw__thumbs {

    display: flex;

    height: 50px;

}

.cw__item {

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    height: inherit;

    pointer-events: none;

    position: relative;

}

.cw__control {

    border: 2px solid #ff3332;

    border-radius: 4px;

    box-shadow: 0 0 0 500px rgba(0, 0, 0, 0.6);

    cursor: grab;

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

}

.cw__control--hidden {

    opacity: 0;

}

.chat-notifications-header {

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 2;

}

.personal-notifications-price-control {

    align-items: center;

    background: #343437;

    border-radius: 8px;

    color: rgba(255, 255, 255, 0.6);

    display: flex;

    justify-content: space-between;

    margin: 10px 0;

    min-height: 34px;

    padding: 10px 12px;

}

.personal-notifications-price-control-text,

.personal-notifications-price-control-value {

    font-size: 13px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: normal;

    color: #fff;

}

.personal-notifications-price-control-value {

    font-weight: 700;

    color: #d60908;

}

.personal-notifications-price-control-free {

    font-size: 13px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: normal;

    color: rgba(255, 255, 255, 0.8);

}

.personal-notifications-price-control-change {

    font-size: 13px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: normal;

    text-decoration: underline;

}

.personal-notifications-price-control.disabled {

    opacity: 0.6;

    pointer-events: none;

}

.personal-notifications-settings-overlay {

    -webkit-backdrop-filter: blur(3px);

    backdrop-filter: blur(3px);

    bottom: 0;

    left: 0;

    position: fixed;

    right: 0;

    top: 0;

}

@media screen and (max-width: 639px) {

    .personal-notifications-settings-overlay {

        z-index: 10;

    }

}

.personal-notifications-settings {

    animation: opacity-fade-show 0.2s;

    background: #232325;

    border-radius: 8px;

    box-shadow: 0 1px 20px rgba(0, 0, 0, 0.25);

    color: #fff;

    cursor: default;

    display: flex;

    flex-flow: column nowrap;

    padding: 10px 20px;

    position: absolute;

    right: 31px;

    text-decoration: none;

    top: 33px;

    width: 350px;

    z-index: 11;

    -webkit-user-select: none;

    user-select: none;

}

.personal-notifications-settings-line {

    background: #fff;

    height: 1px;

    margin: 12px 0 10px;

    opacity: 0.1;

}

.personal-notifications-settings-question {

    align-items: center;

    border: 1px solid currentColor;

    border-radius: 50%;

    display: inline-flex;

    font-size: 11px;

    height: 14px;

    justify-content: center;

    margin: 0 0 0 6px;

    width: 14px;

}

.personal-notifications-settings.is-hiding {

    animation: opacity-fade-hide 0.1s;

    opacity: 0;

    pointer-events: none;

}

.personal-notifications-settings-arrow-up {

    border-bottom: 5px solid #232325;

    border-left: 5px solid transparent;

    border-right: 5px solid transparent;

    height: 0;

    position: absolute;

    right: 20px;

    top: -5px;

    width: 0;

}

.personal-notifications-settings.dialog-settings .personal-notifications-switcher,

.personal-notifications-settings.messenger-settings .personal-notifications-switcher {

    margin-left: -20px;

    margin-right: -20px;

    padding: 10px 20px;

}

.personal-notifications-settings.dialog-settings .personal-notifications-switcher:hover,

.personal-notifications-settings.messenger-settings .personal-notifications-switcher:hover {

    background-color: #343437;

    text-decoration: none;

}

.personal-notifications-settings .icon {

    height: 20px;

    width: 20px;

}

.personal-notifications-settings h3 {

    font-size: 14px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: normal;

    align-items: center;

    display: flex;

    margin: 10px 0 12px;

}

@media screen and (max-width: 639px) {

    .personal-notifications-settings {

        bottom: 41px;

        left: 7px;

        right: 7px;

        top: unset;

        width: unset;

    }

    .personal-notifications-settings .personal-notifications-settings-arrow-up {

        display: none;

    }

}

.personal-notifications-switcher {

    font-size: 14px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: 20px;

    align-items: center;

    color: #fff;

    cursor: pointer;

    display: flex;

    justify-content: space-between;

    position: relative;

    transition: opacity 0.5s;

}

.personal-notifications-switcher:hover {

    text-decoration: none;

}

.personal-notifications-switcher--split {

    margin-top: 22px;

}

.personal-notifications-switcher--split::after {

    background: #fff;

    content: "";

    height: 1px;

    left: 20px;

    opacity: 0.2;

    position: absolute;

    right: 20px;

    top: -10px;

}

.personal-notifications-switcher--disabled {

    opacity: 0.6;

    pointer-events: none;

}

.personal-notifications-switcher-name {

    align-items: center;

    color: #fff;

    display: flex;

    flex: 1;

    padding-right: 12px;

    text-align: left;

}

.personal-notifications-switcher-name .icon {

    color: #fff;

    fill: currentColor;

    height: 18px;

    margin: 0 16px 0 0;

    min-width: 18px;

    width: 18px;

}

.personal-notifications-switcher .icon-arrow-right {

    color: rgba(255, 255, 255, 0.6);

    height: 18px;

    margin: 0;

    width: 18px;

}

.personal-notifications-switcher .switcher {

    pointer-events: none;

}

.gg {

    border-bottom: 1px solid #29292b;

    display: flex;

    gap: 12px;

    padding: 20px 0;

}

.gg:last-child {

    border-bottom: 0;

}

.g__left,

.g__right {

    flex: 1;

}

.g__right-inner {

    display: flex;

    gap: 10px;

}

.g__header {

    align-items: center;

    display: flex;

    font-size: 16px;

    gap: 12px;

}

.g__number {

    align-items: center;

    background: #29292b;

    border-radius: 8px;

    color: #a0a0a1;

    display: flex;

    font-size: 14px;

    height: 24px;

    justify-content: center;

    width: 24px;

}

.g__description {

    color: #a0a0a1;

    font-size: 14px;

    line-height: 20px;

    padding: 6px 0 0;

}

.g__example {

    align-items: flex-end;

    background: #343437;

    border-radius: 12px;

    cursor: pointer;

    display: flex;

    height: 120px;

    margin: 20px 0 0;

    overflow: hidden;

    padding: 10px;

    position: relative;

    text-align: center;

    width: 90px;

}

.g__example::before {

    background: rgba(0, 0, 0, 0.4);

    content: "";

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

    z-index: 1;

}

.g__example:hover .g__img {

    transform: scale(1.1);

}

.g__img {

    height: 100%;

    left: 0;

    object-fit: cover;

    object-position: center;

    position: absolute;

    top: 0;

    transition: transform 0.3s;

    width: 100%;

}

.g__example-expand {

    align-items: center;

    backdrop-filter: blur(2px);

    background: rgba(5, 5, 6, 0.4);

    border-radius: 50%;

    color: #fff;

    display: flex;

    height: 32px;

    justify-content: center;

    position: absolute;

    right: 8px;

    top: 8px;

    transition: background 0.3s;

    width: 32px;

    z-index: 1;

}

.g__example-text {

    position: absolute;

    z-index: 1;

}

@media (max-width: 639px) {

    .g {

        flex-direction: column;

    }

    .g__left {

        display: flex;

        gap: 20px;

        justify-content: space-between;

    }

    .g__example {

        margin: 0;

    }

}

.h {

    background: #343437 center no-repeat;

    background-origin: border-box;

    background-size: contain;

    border-radius: 12px;

    cursor: pointer;

    display: flex;

    flex: 1;

    flex-direction: column;

    justify-content: center;

    min-height: 160px;

    overflow: hidden;

    position: relative;

}

.h--disabled {

    pointer-events: none;

}

.h:hover {

    background-color: #424248;

}

.h--rejected,

.h--rejected:hover {

    background: #000;

}

.h--error {

    border: 1px solid #5e152a;

}

.h--pending {

    opacity: 0.5;

    pointer-events: none;

}

.h--with-image::before {

    background: rgba(0, 0, 0, 0.8);

    content: "";

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

    z-index: 1;

}

.h__item {

    align-items: center;

    display: flex;

    flex: 1;

    justify-content: center;

    padding: 16px;

    position: relative;

    z-index: 1;

}

.h__item::before {

    background: rgba(255, 255, 255, 0.05);

    content: "";

    height: 1px;

    left: 32px;

    position: absolute;

    right: 32px;

    top: 0;

}

.h__item:first-child::before {

    display: none;

}

.h__content {

    display: flex;

    flex-wrap: wrap;

    font-size: 12px;

    gap: 10px;

    justify-content: center;

    text-align: center;

}

.h__content-header {

    align-items: center;

    display: flex;

    gap: 10px;

}

@media (max-width: 639px) {

    .h {

        min-height: 60px;

    }

}

.trial-link-creation-form {

    margin-bottom: 20px;

}

.trial-link-creation-form__form {

    padding: 16px;

}

.trial-link-creation-form__content {

    display: flex;

    flex-wrap: wrap;

    gap: 16px;

    margin-bottom: 16px;

}

.trial-link-creation-form__select-label {

    color: #fff;

    font-size: 12px;

    font-weight: 700;

    margin: 0 0 8px;

}

.trial-link-creation-form__select {

    width: 284px;

}

.trial-link-creation-form__select--small {

    width: 158px;

}

.trial-link-creation-form__actions {

    display: flex;

    gap: 16px;

    justify-content: flex-end;

}

.b__info {

    display: grid;

    grid-auto-flow: row;

    grid-row-gap: 16px;

    padding: 16px;

}

.b__actions,

.b__info-row {

    align-items: center;

    display: flex;

    justify-content: space-between;

}

.b__actions {

    flex: 1;

    gap: 22px;

}

.b__trial-members {

    color: #707071;

    pointer-events: none;

    position: relative;

}

.b__trial-members--active {

    cursor: pointer;

    pointer-events: auto;

}

.b__users-menu {

    bottom: calc(100% + 8px);

    position: absolute;

    right: 0;

}

.b__copy-button-container {

    position: relative;

}

.b__copy-button {

    display: flex;

    gap: 12px;

}

.b__delete-button {

    background: 0 0;

    border: 0;

    border-radius: 2px;

    color: #707071;

    cursor: pointer;

    margin-left: auto;

    padding: 2px;

}

.b__delete-button:hover {

    background: rgba(248, 248, 248, 0.1);

    color: #fff;

}



.b1 {

    -webkit-backdrop-filter: blur(12px);

    backdrop-filter: blur(12px);

    background: rgba(255, 255, 255, 0.2);

    border-radius: 6px;

    color: #707071;

    filter: drop-shadow(0 1px 20px rgba(0, 0, 0, 0.4));

    font-size: 12px;

    font-weight: 500;

    padding: 8px;

    pointer-events: none;

    position: fixed;

    transition: opacity 0.1s linear;

    z-index: 3;

}

.b1--position--center {

    transform: translateX(-50%);

}

.b1--position--left {

    transform: translateX(-10%);

}

.b1--position--right {

    transform: translateX(-90%);

}

.b1--type--bar.b1--position--left,

.b1--type--doughnut.b1--position--left {

    transform: translateX(5px);

}

.b1--type--bar.b1--position--right,

.b1--type--doughnut.b1--position--right {

    transform: translateX(calc(-100% - 5px));

}

.b1--type--bar.b1--position--right .b1__arrow,

.b1--type--doughnut.b1--position--right .b1__arrow {

    left: unset;

    right: 0;

    transform: translate(50%, -50%) rotate(-135deg);

}

.b1__arrow {

    -webkit-backdrop-filter: blur(12px);

    backdrop-filter: blur(12px);

    background: rgba(255, 255, 255, 0.2);

    border-bottom-left-radius: 2px;

    clip-path: polygon(0 0, 0 100%, 100% 100%);

    filter: drop-shadow(0 1px 20px rgba(0, 0, 0, 0.4));

    height: 10px;

    left: 0;

    position: absolute;

    top: 50%;

    transform: translateY(-50%) translateX(-50%) rotate(45deg);

    width: 10px;

}

.b1__line {

    background: rgba(255, 255, 255, 0.1);

    border-radius: 0 0 1px 1px;

    position: absolute;

    transform: translateX(-50%);

    transition: all 0.1s linear;

    width: 2px;

    z-index: 1;

}

.b1__title {

    margin-bottom: 8px;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.b1__items {

    display: grid;

    grid-auto-flow: row;

    grid-row-gap: 8px;

}

.b1__item {

    align-items: center;

    display: flex;

    font-size: 12px;

    font-weight: 500;

    gap: 6px;

}

.b1__color {

    border-radius: 4px;

    flex: 0 1 12px;

    height: 12px;

    width: 12px;

}

.b1__label {

    color: #cfcfd0;

    flex: 1;

    margin-right: 4px;

    white-space: nowrap;

}

.b1__value {

    color: #fff;

    text-align: right;

    white-space: nowrap;

}

.b6 {

    align-items: start;

    color: #a0a0a1;

    display: flex;

    gap: 18px;

    margin-bottom: 20px;

    padding: 18px;

}

.b6__title {

    color: #fff;

    font-size: 16px;

    font-weight: 700;

    line-height: 20px;

    margin-bottom: 14px;

}

.b6__list {

    margin-bottom: 28px;

}

.b6__list-item {

    margin-bottom: 6px;

}

.dashboard-widget {

    background: #232325;

    border-radius: 12px;

    display: flex;

    height: 140px;

    justify-content: center;

}

.dashboard-widget__content {

    align-items: center;

    display: flex;

    width: 100%;

}

.dashboard-widget-item {

    flex: 1;

    padding: 0 16px;

    position: relative;

    text-align: center;

}

.dashboard-widget-item--split {

    border-left: 1px solid rgba(255, 255, 255, 0.05);

}

.dashboard-widget-item__label {

    margin: 0 0 16px;

}

.messenger-chat-stub {

    align-items: center;

    background: #343437;

    border-radius: 16px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    margin: 12px;

    padding: 16px;

}

.messenger-chat-stub__or {

    font-size: 12px;

    line-height: 20px;

    margin: 6px 0;

    opacity: 0.6;

}

.messenger-chat-stub .blocked-icon {

    height: 45px;

    width: 45px;

}

.messenger-chat-stub .stub-title {

    font-size: 17px;

    margin: 16px 0;

    text-align: center;

}

.messenger-chat-stub .stub-description {

    font-size: 12px;

    line-height: 20px;

    margin: 0 0 12px;

    opacity: 0.6;

    text-align: center;

}

.messenger-chat-stub .stub-description-link {

    color: inherit;

    cursor: pointer;

    text-decoration: underline;

}

.messenger-chat-stub .stub-description-link:hover {

    color: #fff;

}

.messenger-chat-stub__message-icon-wrapper {

    align-items: center;

    background: url('') no-repeat;

    background-size: contain;

    display: flex;

    height: 56px;

    justify-content: center;

    margin: 0 auto;

    width: 56px;

}

.messenger-chat-stub__message-icon {

    display: block;

    height: 20px;

    width: 20px;

}

.messenger-chat-stub__unlock {

    animation: opacity-zoom-fade-hide 1.5s;

    bottom: 50%;

    display: flex;

    justify-content: center;

    left: 0;

    opacity: 0;

    pointer-events: none;

    position: absolute;

    width: 100%;

    z-index: 1;

}

.messenger-chat-stub__unlock-icon {

    height: 30px;

    width: 30px;

}

.chart-canvas {

    position: relative;

    z-index: 2;

}

.oo {

    align-items: center;

    background: rgba(0, 0, 0, 0.4);

    border-radius: 8px;

    color: rgba(255, 255, 255, 0.8);

    display: flex;

    font-size: 14px;

    font-weight: 500;

    gap: 8px;

    height: 28px;

    padding: 0 8px;

}

.image-swiper__root--disabled .t {

    pointer-events: none;

}

.t {

    align-items: center;

    color: #fff;

    display: flex;

    flex-direction: column;

    height: 100%;

    justify-content: center;

    left: 0;

    padding: 20px 14px;

    position: absolute;

    text-align: center;

    top: 0;

    transform: none;

    width: 100%;

    z-index: 1;

}

.t--fill--locked {

    background: linear-gradient(246.82deg, #3c185e 0, #100415 100%) no-repeat center;

    background-size: cover;

    border-radius: 12px;

}

.t--fill--moderation {

    background-color: rgba(252, 207, 73, 0.8);

    color: #000;

}

.t--fill--rejected {

    background-color: rgba(210, 27, 76, 0.6);

    color: #cfcfd0;

}

.t--dark {

    background: rgba(0, 0, 0, 0.2);

}

@media screen and (max-width: 639px) {

    .t {

        min-height: 135px;

        min-width: 135px;

    }

}

.t__icon--size--regular {

    height: 40px;

    width: 40px;

}

.t__icon--size--big {

    height: 58px;

    width: 58px;

}

.t__title {

    font-size: 16px;

    font-weight: 700;

    margin-top: 16px;

    padding: 0 12px;

    white-space: normal;

    word-break: normal;

}

@media screen and (max-width: 639px) {

    .t__title {

        font-size: 12px;

        font-weight: 400;

        letter-spacing: normal;

        line-height: normal;

        margin-top: 12px;

    }

}

.t__description {

    font-size: 13px;

    margin-top: 16px;

    max-width: 310px;

    padding: 0 12px;

    white-space: normal;

    word-break: normal;

}

.t .content-lock-button {

    margin: 20px 0 0;

}

@media screen and (max-width: 639px) {

    .t .content-lock-button {

        margin: 12px 0 0;

    }

}



.t__content {

    overflow: hidden

}



.t__name {

    align-items: center;

    display: flex

}



.t__name .username {

    font-weight: 700

}



.t__text {

    color: rgba(255, 255, 255, .6);

    margin: 5px 0 0;

    min-height: 16px;

    overflow: hidden;

    padding-right: 40px;

    text-overflow: ellipsis;

    white-space: nowrap

}



.t__time {

    font-size: 12px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: normal;

    margin: 0 0 0 6px;

    opacity: .3

}



.t__menu {

    align-items: center;

    cursor: pointer;

    display: flex;

    height: 32px;

    justify-content: center;

    opacity: .4;

    position: absolute;

    right: 0;

    top: 50%;

    transform: translateY(-50%) rotate(90deg);

    transition: opacity .3s;

    width: 32px

}



@media screen and (max-width:639px) {

    .t__menu {

        height: 44px;

        margin-right: -8px;

        width: 44px

    }

}



.t__menu:hover {

    opacity: 1

}



.t__new {

    align-items: center;

    background: #ff5f5f;

    border-radius: 10px;

    color: #fff;

    display: flex;

    font-size: 11px;

    height: 20px;

    justify-content: center;

    min-width: 20px;

    padding: 0 4px;

    pointer-events: none;

    position: absolute;

    right: 30px

}



.t .personal-notifications-settings {

    bottom: unset;

    left: unset;

    right: -8px;

    top: 56px

}



@media screen and (max-width:639px) {

    .t .personal-notifications-settings {

        bottom: unset;

        left: 7px;

        right: 7px;

        top: 56px;

        width: unset

    }

}



.t--menu--top .personal-notifications-settings {

    bottom: 56px;

    top: unset

}



@media screen and (max-width:639px) {

    .t--menu--top .personal-notifications-settings {

        bottom: 56px;

        top: unset

    }

}



.t--menu--top .personal-notifications-settings-arrow-up {

    bottom: -5px;

    top: unset;

    transform: rotate(180deg)

}



.t .personal-notifications-switcher-name {

    cursor: pointer;

    text-decoration: none

}



.t .personal-notifications-switcher-name:hover {

    color: #fff

}

.user-list-actions__container {

    display: table;

    width: 100%;

}

.user-list-actions .scroll-bar-container {

    max-height: 200px;

}

.counterpart-text-message,

.own-text-message {

    color: #fff;

    padding: 10px 12px;

    position: relative;

    word-break: break-word;

}

.own-text-message {

    background-color: rgb(129 40 40 / 28%);

}

.counterpart-text-message {

    background-color: #151516;

}

.counterpart-text-message .text-message-indicators {

    right: 8px;

}

.Q {

    background: #151516;

}

.Q--own {

    background: rgba(91, 65, 255, 0.2);

}

.Q__gallery {

    background: #151516;

    height: 240px;

    min-height: 214px;

    min-width: 220px;

    position: relative;

}

.Q__gallery--uncovered {

    height: 214px;

}

.Q__icon {

    color: #cfcfd0;

    left: 8px;

    pointer-events: none;

    position: absolute;

    top: 8px;

}

.Q__footer {

    padding: 10px 12px 26px;

    text-align: left;

}

.Q__counters {

    color: #a0a0a1;

    font-size: 12px;

    font-weight: 500;

    line-height: 15px;

    margin-top: 2px;

}

.Q__body {

    border-top: 1px solid rgba(255, 255, 255, 0.1);

    margin: 5px 0 0;

    padding-top: 5px;

    word-break: break-word;

}

.Q__right-bottom {

    font-size: 11px;

    font-weight: 700;

    letter-spacing: normal;

    line-height: 12px;

    text-transform: uppercase;

    align-items: center;

    background-color: rgba(0, 0, 0, 0.4);

    border-radius: 4px;

    color: rgba(248, 248, 248, 0.8);

    display: flex;

    justify-content: center;

    padding: 4px 8px;

    position: absolute;

    right: 8px;

    top: calc(100% - 8px);

    transform: translateY(-100%);

}

.Q__play-icon {

    color: #fff;

    position: absolute;

    right: 8px;

    top: 8px;

}

.J {

    align-items: center;

    color: #fff;

    display: flex;

    font-size: 12px;

    font-weight: 600;

    height: 40px;

    justify-content: center;

}

.J--type--default {

    background-color: #424248;

}

.J--type--warning {

    background-color: #ffc107;

    color: #050506;

}

.J--type--warning .J__button-view-request {

    border-color: rgba(5, 5, 6, 0.4);

}

.J--type--alert {

    background-color: #d21b4c;

}

.J__cart-icon--with-notification {

    position: relative;

}

.J__cart-icon--with-notification:after {

    background-color: #e12947;

    border: 2px solid #424248;

    border-radius: 50%;

    content: "";

    height: 7px;

    position: absolute;

    right: -4px;

    top: -2px;

    width: 7px;

}

.J__body {

    align-items: center;

    color: inherit;

    display: flex;

    flex: 1;

    gap: 12px;

    justify-content: center;

}

.J__button-view-request {

    background: 0 0;

    border: 2px solid rgba(255, 255, 255, 0.4);

    border-radius: 10px;

    color: inherit;

    cursor: pointer;

    font-size: 12px;

    height: 24px;

    padding: 2px 12px;

}

.users-dropdown-list {

    background: #1b1b1d;

    border: 1px solid rgba(255, 255, 255, 0.02);

    border-radius: 12px;

    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);

    max-width: 100%;

    overflow: hidden;

    width: 280px;

}

.users-dropdown-list__header {

    padding: 12px 16px;

}

.users-dropdown-list__body {

    max-height: 168px;

    overflow-y: auto;

}

.users-dropdown-list__item {

    height: 56px;

    padding: 8px 16px;

}

.users-dropdown-list__item:hover {

    background-color: #343437;

}

.dd {

    align-items: center;

    background: #232325;

    border-radius: 12px;

    display: flex;

    gap: 16px;

    justify-content: space-between;

    padding: 12px 16px;

}

.dd__left {

    word-break: break-word;

}

.dd__right {

    align-items: center;

    display: flex;

    gap: 10px;

    white-space: nowrap;

}

.PPP {

    background: #232325;

    height: 240px;

    overflow: inherit;

}

.P__play {

    align-items: center;

    background-color: #000;

    border-radius: 50%;

    color: #fff;

    display: flex;

    height: 34px;

    justify-content: center;

    width: 34px;

}

.user-list-actions-item {

    align-items: center;

    display: flex;

    margin: 12px 0;

}

.user-list-actions-item__left {

    flex: 1;

}

.user-list-actions-item__right {

    align-items: center;

    display: flex;

    justify-content: flex-end;

}

.user-list-actions-item__label {

    margin: 0 0 0 10px;

    white-space: nowrap;

}

.user-list-actions-item__icon {

    align-items: center;

    color: #707071;

    display: flex;

    justify-content: center;

    margin: 0 0 0 20px;

    width: 24px;

}

.message-indicators {

    color: rgba(255, 255, 255, 0.4);

    float: right;

    font-size: 10px;

    line-height: 16px;

    margin-left: 3px;

    pointer-events: none;

    -webkit-user-select: none;

    user-select: none;

}

.message-indicators__content {

    position: relative;

    right: -6px;

    top: 5px;

    white-space: nowrap;

}

.message-indicators__error-wrapper {

    margin: 0 0 0 7px;

}

.message-indicators__error-icon {

    color: #ffc107;

    height: 10px;

    width: 10px;

}

.message-indicators .read-icon {

    color: rgba(255, 255, 255, 0.4);

    fill: currentColor;

    height: 8px;

    margin: 0 0 0 3px;

}

.message-indicators .read-icon.icon-check-4 {

    margin-right: 3px;

    width: 11px;

}

.message-indicators .read-icon.icon-read {

    width: 14px;

}

.message-indicators.with-absolute-position {

    bottom: 6px;

    position: absolute;

    right: 6px;

}

.message-indicators.with-absolute-position .message-indicators-placeholder {

    display: none;

}

.message-indicators.with-absolute-position .message-indicators-content {

    position: static;

}

.message-indicators.with-background {

    background-color: rgba(0, 0, 0, 0.6);

    border-radius: 4px;

    color: rgba(255, 255, 255, 0.8);

    line-height: 10px;

    padding: 4px;

}

.message-indicators.with-background .read-icon {

    color: rgba(255, 255, 255, 0.8);

}

.message-indicators.with-background .message-indicators__content {

    right: auto;

    top: auto;

}

.counterpart-base-message .message-indicators {

    margin-left: 5px;

}

.counterpart-base-message .message-indicators .message-indicators-content,

.counterpart-base-message .message-indicators.with-absolute-position {

    right: 8px;

}

.counterpart-base-message .message-indicators .read-icon {

    display: none;

}

.TT {

    cursor: pointer;

    display: grid;

    grid-auto-flow: row;

    grid-row-gap: 4px;

    margin-bottom: 4px;

    max-width: 80%;

    min-height: 24px;

    padding-left: 6px;

    position: relative;

}

.TT:hover .TT__title {

    color: #fff;

}

.TT__label {

    color: #ff3332;

    font-size: 12px;

    font-weight: 400;

    white-space: nowrap;

}

.TT::before {

    background-color: #ff3332;

    border-radius: 1px;

    bottom: 0;

    content: "";

    display: block;

    left: 0;

    position: absolute;

    top: 0;

    width: 2px;

}

.TT__title {

    color: #707071;

    font-size: 12px;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.SS {

    align-items: center;

    background: rgba(0, 0, 0, 0.6);

    border: 0;

    border-radius: 20px;

    color: #fff;

    display: flex;

    flex-direction: column;

    font-size: 12px;

    justify-content: center;

    left: 50%;

    max-width: 85%;

    min-width: 118px;

    padding: 10px 20px;

    pointer-events: none;

    position: absolute;

    text-align: center;

    top: 50%;

    transform: translate(-50%, -50%);

    transition: background 0.3s;

}

.S__icon {

    fill: currentColor;

    height: 20px;

    margin: 0;

}

.S__icon--unlocked {

    color: #34b353;

}

.S__label {

    margin-top: 8px;

}

.S__price {

    font-weight: 700;

}

.S__original-price {

    color: #b5b6b7;

    font-weight: 700;

    text-decoration: line-through;

}

.OPA {

    display: grid;

    gap: 2px;

    grid-template-columns: repeat(2, 1fr);

    grid-template-rows: repeat(2, 1fr);

    height: 100%;

    width: 100%;

}

.O__item {

    align-items: center;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    display: flex;

    justify-content: center;

}

.L__header {

    color: #707071;

    display: flex;

    flex-direction: column;

    font-size: 12px;

    gap: 4px;

    margin: 0 0 4px;

    position: relative;

}

.L__header::before {

    background: rgba(255, 255, 255, 0.4);

    border-radius: 1px;

    bottom: 0;

    content: "";

    position: absolute;

    top: 0;

    width: 2px;

}

.L__header--style--left {

    padding: 0 0 0 8px;

}

.L__header--style--left::before {

    left: 0;

}

.L__header--style--right {

    align-items: end;

    padding: 0 8px 0 0;

    text-align: right;

}

.L__header--style--right::before {

    right: 0;

}

.L__body {

    word-break: break-word;

}

.L__image-wrapper {

    align-items: center;

    aspect-ratio: 0.5625;

    background: no-repeat center;

    background-size: cover;

    border-radius: 8px;

    display: flex;

    justify-content: center;

    overflow: hidden;

    width: 90px;

}

.L__image {

    flex: 1;

    max-height: 100%;

    max-width: 100%;

}

.L__empty {

    background: #343437;

    border-radius: 8px;

    color: #707071;

    line-height: 120%;

    max-width: 90px;

    padding: 10px;

    text-align: center;

}

.K__header {

    align-items: center;

    display: flex;

    font-size: 12px;

    font-weight: 500;

    gap: 6px;

    justify-content: space-between;

    padding: 0 12px 10px;

}

.K__sub-header {

    align-items: center;

    display: flex;

    gap: 4px;

}

.K__footer {

    display: flex;

    gap: 8px;

    justify-content: start;

    margin-top: 8px;

}

.K__footer--disabled {

    opacity: 0.4;

}

.K__delivered-time {

    align-items: center;

    color: #a0a0a1;

    display: grid;

    font-size: 13px;

    font-weight: 500;

    grid-auto-flow: column;

    grid-column-gap: 6px;

}

.K__link {

    color: #fff;

    text-decoration: underline;

}

.K__title {

    color: #ff3332;

    cursor: pointer;

}

.photo-message {

    background: #343437;

}

.photo-message--own {

    background: rgba(91, 65, 255, 0.2);

}

.photo-message__body {

    padding: 10px 10px 20px;

    word-break: break-word;

}

.album-message__album-image.image-with-loader,

.photo-message__photo-image {

    height: unset;

    max-height: 220px;

    max-width: 100%;

    min-height: 150px;

    min-width: 172px;

    object-fit: cover;

}

.photo-message__photo-image--blocked {

    filter: blur(10px);

}

.photo-message-modal-content {

    border-radius: 0;

}

.photo-message-modal-content.photo-message-modal-loading .image {

    filter: blur(15px);

    width: 50vw;

}

.album-message {

    background: #343437;

    position: relative;

}

.album-message--own {

    background: rgba(91, 65, 255, 0.2);

}

.album-message__body {

    border-top: 1px solid rgba(255, 255, 255, 0.2);

    margin: 10px 12px 0;

    padding: 10px 0 20px;

    word-break: break-word;

}

.album-message .image-container {

    position: relative;

}

.album-message .image-container .a11y-button {

    display: block;

}

.album-message__texts {

    padding: 10px 12px;

    text-align: left;

}

.album-message__photos-count {

    color: #a0a0a1;

    font-size: 12px;

    font-weight: 700;

    line-height: 15px;

    margin-top: 2px;

}

.album-message span.message-indicators.with-absolute-position {

    bottom: 10px;

    right: 12px;

}

.media-unlocked-message {

    border: 2px solid rgba(91, 65, 255, 0.2);

    padding: 8px 12px;

    position: relative;

    word-wrap: break-word;

}

.media-unlocked-message-media-button {

    color: rgba(255, 255, 255, 0.6);

    cursor: pointer;

    text-decoration: underline;

}

.media-unlocked-message-media-button:hover {

    color: rgba(255, 255, 255, 0.8);

}

.video-message {

    position: relative;

    height: unset;

    max-height: 220px;

    max-width: 100%;

    min-height: 150px;

    min-width: 172px;

    object-fit: cover;

}

.video-message--body {

    background: rgba(91, 65, 255, 0.2);

}

.video-message__body {

    padding: 10px 10px 20px;

    word-break: break-word;

}

.video-message__video-image {

    height: unset;

    max-height: 220px;

    max-width: 100%;

    min-width: 172px;

    object-fit: cover;

    min-height: 160px;

}

.video-message .play {

    align-items: center;

    background-color: rgba(0, 0, 0, 0.6);

    border-radius: 50%;

    color: #f8f8f8;

    display: flex;

    height: 50px;

    justify-content: center;

    left: 50%;

    margin: 0;

    padding: 15px;

    position: absolute;

    top: 50%;

    transform: translate(-50%, -50%);

    width: 50px;

}

.video-message .play-icon {

    fill: currentColor;

    height: 25px;

    left: 15px;

    margin: 0;

    position: absolute;

    top: 12px;

    width: 25px;

}

.video-message .right-top {

    display: flex;

    flex-flow: row nowrap;

    height: 20px;

    position: absolute;

    right: 8px;

    top: 8px;

}

.video-message .duration {

    font-size: 11px;

    font-weight: 700;

    letter-spacing: normal;

    line-height: 12px;

    text-transform: uppercase;

    background-color: rgba(0, 0, 0, 0.4);

    border-radius: 4px;

    color: rgba(248, 248, 248, 0.8);

    padding: 4px 8px;

}

.processing-video-message,

.video-message .duration,

.video-message .mini-play {

    align-items: center;

    display: flex;

    justify-content: center;

}

.video-message .mini-play {

    background-color: rgba(0, 0, 0, 0.4);

    border-radius: 4px;

    color: rgba(248, 248, 248, 0.8);

    margin-right: 8px;

    padding: 4px 6px;

}

.video-message .mini-play-icon {

    fill: currentColor;

    margin: 0;

}

.processing-video-message {

    background-color: #515255;

    color: #fff;

    flex-flow: column nowrap;

    padding: 81px 40px;

    text-align: center;

}

.processing-video-message .time-icon {

    margin: 0 0 10px;

}

.date-message {

    color: #fff;

    opacity: 0.4;

    -webkit-user-select: none;

    user-select: none;

}

.tipped-message.base-message {

    background: rgba(33, 176, 98, 0.2);

}

.base-message-wrapper {

    align-items: flex-end;

    display: flex;

    flex: 1;

    padding: 8px 12px 0;

    position: relative;

    width: 100%;

}

.base-message-wrapper--left {

    justify-content: flex-start;

}

.base-message-wrapper--right {

    justify-content: flex-end;

}

.base-message-wrapper--mobile .base-message {

    -webkit-user-select: none;

    user-select: none;

}

.base-message-wrapper--position--left {

    justify-content: flex-start;

}

.base-message-wrapper--position--left > .base-message {

    transform-origin: left bottom;

}

.base-message-wrapper--position--left > .base-message__clone {

    left: 40px;

}

.base-message-wrapper--position--right {

    justify-content: flex-end;

}

.base-message-wrapper--position--right > .base-message {

    transform-origin: right bottom;

}

.base-message-wrapper--position--right > .base-message__clone {

    right: 12px;

}

.base-message-wrapper--special-request {

    background: #1b1b1d;

    flex-wrap: wrap;

    margin: 8px 0;

    padding-bottom: 8px;

}

.base-message-wrapper__resend-wrapper {

    color: #fff;

    cursor: pointer;

    left: 10px;

    margin: -8px 0 0;

    opacity: 0.6;

    position: absolute;

    top: 50%;

}

.base-message-wrapper__resend-wrapper:hover {

    opacity: 1;

}

.base-message-wrapper__resend-icon {

    height: 15px;

    width: 15px;

}

.base-message-wrapper__content {

    max-width: 70%;

}

.base-message-wrapper__header {

    position: relative;

}

.base-message-wrapper__body-wrapper {

    align-items: flex-end;

    display: flex;

    flex: 1;

    position: relative;

}

.base-message {

    border-radius: 16px 16px 6px 16px;

    flex: 1;

    font-size: 14px;

    line-height: 17px;

    overflow: hidden;

    -webkit-touch-callout: none;

    text-align: left;

}

.base-message-clickable {

    cursor: pointer;

}

.base-message__clone {

    bottom: 0;

    max-width: calc(70% - 17px);

    z-index: 10;

    -webkit-user-select: none;

    user-select: none;

}

.counterpart-base-message {

    border-radius: 16px 16px 16px 6px;

    position: relative;

}

.image-with-loader {

    height: 150px;

    max-width: 100%;

    object-fit: cover;

}

.image-with-loader-placeholder {

    background: linear-gradient(246.82deg, #3c185e 0, #100415 100%) no-repeat center;

    height: 150px;

    width: 200px;

}

.announcement-message {

    font-size: 11px;

    line-height: 12px;

    margin-top: 30px;

    text-align: center;

}

.R {

    display: flex;

    justify-content: flex-end;

    position: relative;

}

.R .ba__menu-item:hover {

    background: #424248;

}

.R .ba__menu-item .ba__menu-item-icon {

    height: 18px;

    width: 18px;

}

.R--counterpart {

    order: 3;

}

.R--counterpart .R__desktop-menu {

    left: 12px;

    margin-left: 4px;

    transform: translateX(-6px);

}

.R--counterpart .R__desktop-menu--visible {

    transform: translateX(0);

}

.R__desktop-menu {

    bottom: 0;

    margin-right: 4px;

    opacity: 0;

    padding-bottom: 6px;

    pointer-events: none;

    position: absolute;

    right: 0;

    transform: translateX(6px);

    transition: all 200ms ease;

    z-index: 2;

}

.R__desktop-menu--visible {

    opacity: 1;

    pointer-events: auto;

    transform: translateX(0);

}

.R__desktop-menu .css-popover-content-topleft,

.R__desktop-menu .css-popover-content-topright {

    top: -6px;

}

.R--mobile {

    z-index: 11;

}

.R--mobile.R--position--bottomleft .R__mobile-menu {

    left: -64px;

    right: auto;

    top: 0;

}

.R--mobile.R--position--bottomright .R__mobile-menu {

    left: -24px;

    right: auto;

    top: -4px;

}

.R--mobile.R--position--left {

    bottom: 0;

    left: 0;

    position: absolute;

}

.R--mobile.R--position--left .R__mobile-menu {

    bottom: 12px;

    left: 0;

    right: auto;

}

.R--mobile.R--position--right .R__mobile-menu {

    bottom: 0;

    left: -40px;

    right: auto;

}

.R--mobile.R--position--topleft {

    position: absolute;

    right: 0;

    top: 0;

}

.R--mobile.R--position--topleft .R__mobile-menu {

    bottom: 0;

    right: 34px;

}

.R--mobile.R--position--topright {

    left: 74px;

    position: absolute;

    top: 0;

}

.R--mobile.R--position--topright .R__mobile-menu {

    bottom: 0;

    left: 0;

    right: auto;

}

.R--mobile.R--position--middleright .R__mobile-menu {

    bottom: 12px;

    left: 10px;

    right: auto;

}

.R--mobile.R--position--middleleft .R__mobile-menu {

    bottom: 12px;

    right: 12px;

}

.R__mobile-menu {

    bottom: 0;

    opacity: 0;

    position: absolute;

    right: 34px;

    transform: translateY(-6px);

    transition: all 200ms ease;

}

.R__mobile-menu--visible {

    opacity: 1;

    transform: translateY(0);

}



.media-gallery--mobile-portrait{

    bottom: 60px;

}



.media-gallery--mobile-portrait .media-gallery__content-wrapper{

    left: 0px;

    position: absolute;

    background: #000;

    bottom: 0px; 

    right: 0px; 

    top: 0px;    

}



.media-gallery--mobile-portrait .comments-gallery__footer {

    padding-bottom: max(12px,env(safe-area-inset-bottom))

}



.media-gallery--mobile-portrait .ch__comments,.media-gallery--mobile-portrait .ch__user-tags {

    

}



.media-gallery--mobile-portrait .ch__user {

    bottom: 75px;

    left: 10px;

    position: fixed;

    top: auto;

    z-index: 4

}



.media-gallery--mobile-portrait .ch__user--video {

    bottom: 140px

}



.media-gallery--mobile-portrait .ch__controls {

    flex: 1;

    justify-content: space-between;

    left: -2px;

    position: relative;

    width: 100%;

    display: flex;

}



.media-gallery--mobile-portrait .tile-button {

    background: 0 0;

    border-radius: 0;

    font-weight: 700;

    height: 36px;

    padding: 0 8px

}



.media-gallery--mobile-portrait .tile-button:hover {

    background: 0 0

}



.media-gallery--mobile-portrait .tile-button__text {

    display: none

}



.media-gallery--mobile-portrait .tile-button__count {

    margin: 0 0 0 6px

}



.ch--has-title .media-gallery--mobile-portrait .ch__user {

    bottom: 130px

}



.media-gallery--mobile-landscape .ch__user {

    left: 10px;

    position: fixed;

    z-index: 4

}



.media-gallery--mobile-landscape .ch__controls {

    filter: drop-shadow(0 0 4px rgba(0,0,0,.8));

    flex-direction: column;

    height: 100%;

    justify-content: center

}



.media-gallery--mobile-landscape .tile-button {

    background: 0 0;

    border-radius: 0;

    color: #fff;

    flex-direction: row-reverse;

    font-weight: 700;

    height: 36px;

    padding: 0 8px

}



.media-gallery--mobile-landscape .tile-button__count {

    margin: 0 6px 0 0

}



.media-gallery--mobile-landscape .tile-button__text {

    display: none

}





.media-gallery--mobile-portrait .media-gallery__info {

    background: linear-gradient(180deg,rgba(0,0,0,.72)0,transparent 100%);

    box-sizing: border-box;

    display: flex;

    font-size: 16px;

    height: 175px;

    justify-content: center;

    left: 0;

    padding: 34px 0 0;

    top: 0;

    width: 100%

}



.media-gallery--mobile-portrait .media-gallery__close {

    opacity: .7;

    right: 4px;

    top: 24px

}



.media-gallery--mobile-portrait .media-gallery__content {

    bottom: 0;

    left: 0;

    right: 0;

    top: 0

}



.media-gallery--mobile-portrait .media-gallery__controls-panel {

    bottom: 24px;

    left: 10px;

    right: 10px

}



.media-gallery--mobile-portrait .media-gallery__bottom-shadow {

    height: 175px

}



.media-gallery--mobile-portrait .media-gallery__info-icon {

    display: none

}



.media-gallery--mobile-portrait .media-gallery__info-title {

    bottom: 80px;

    left: 16px;

    position: fixed

}



.media-gallery--mobile-portrait .video-player__controls {

    padding-bottom: 74px

}



.bv {

    flex-shrink: 0;

    position: relative;

    width: 100%

}



.bv--mobile {

    display: flex;

    flex-direction: column;

    gap: 12px

}



.bv__row {

    display: flex;

    gap: 12px

}



.bv__row>a,

.bv__row>button,

.bv__row>div {

    flex-grow: 1;

    justify-content: center;

    text-align: center

}



@media (min-width:479px) {

    .bv__row {

        display: flex;

        gap: 12px

    }

    .bv__row>a,

    .bv__row>button,

    .bv__row>div {

        flex-basis: 50%

    }

}



.bv__favorite {

    display: flex;

    flex-direction: column;

    gap: 12px;

    position: absolute;

    right: 15px;

    top: 70px;

    z-index: 4

}



.bv__dropdown {

    color: #fff;

    font-size: 13px;

    min-width: 153px

}



.bv__dropdown-footer {

    border-top: 1px solid rgba(255, 255, 255, .05);

    margin: 12px 0 0;

    padding: 12px 0 0

}



.bv__dropdown-header {

    align-items: center;

    column-gap: 16px;

    display: flex;

    justify-content: space-between

}



.bv__edit-request-menu-button {

    align-items: center;

    gap: 12px

}



.bv__edit-request-menu-button.btn {

    padding: 0 16px

}



.bv__actions-settings {

    align-items: center;

    display: flex

}



.bv__actions-settings-icon--padded {

    margin: 0 8px 0 0

}



.bv__right {

    display: flex;

    gap: 12px;

    margin: 0 0 0 auto

}



.bv__title {

    align-items: center;

    display: flex;

    font-size: 14px;

    font-weight: 700;

    white-space: nowrap

}



.bv__date {

    font-size: 14px;

    margin: 6px 0 0;

    opacity: .4;

    white-space: nowrap

}



.bv__date--warning {

    color: #d21b4c;

    opacity: 1

}



@media screen and (max-width:639px) {

    .bv {

        padding: 10px 0;

        width: 100%

    }

    .bv .action-buttons-container .user-fan-club-status-btn {

        height: 31px;

        justify-content: center;

        margin: 0 0 20px;

        width: 100%

    }

    .bv .splitter {

        display: none

    }

}



.bv__icon-wrapper {

    position: relative

}



.bv__icon-decorator {

    color: #2e1d3e;

    height: 12px;

    position: absolute;

    right: 7px;

    top: -3px;

    width: 12px

}



.bv .icon-diamond-colored,

.bv .icon-diamond-flat,

.bv .icon-diamond-rotate {

    height: 20px;

    margin: 0 10px 0 0;

    width: 20px

}



.action-buttons-container {

    align-items: center;

    display: flex;

    flex-wrap: wrap;

    gap: 12px

}



.action-buttons-container .button-dropdown__button {

    white-space: nowrap

}



.action-buttons-container .btn {

    display: flex;

    flex-shrink: 0

}



.action-buttons-container .btn .icon {

    height: 18px;

    width: 18px

}



.action-buttons-container .menu-button-dots .tile-button {

    background: 0 0;

    height: auto;

    min-width: auto;

    padding: 0

}



@media screen and (max-width:479px) {

    .action-buttons-container__right {

        display: flex;

        gap: 12px

    }

    .action-buttons-container .button-dropdown__button {

        font-size: 13px;

        padding: 0 10px

    }

    .action-buttons-container .btn {

        font-size: 13px;

        padding: 0 8px

    }

}



.bs {

    color: #fff;

    margin: 20px 0 12px;

    max-height: 84px;

    opacity: .8;

    overflow: hidden;

    position: relative;

    width: 67%;

    word-break: break-word;

    font-size: .875rem;

    line-height: 1.063rem

}



.bs--opened {

    max-height: none

}



.bs__text {

    font-size: inherit;

    font-weight: inherit;

    line-height: inherit;

    margin: 0;

    padding: 0

}



.bs__shadow-text {

    opacity: 0;

    pointer-events: none;

    position: absolute;

    visibility: hidden

}



@media screen and (max-width:1023px) {

    .bs {

        width: 100%

    }

}



.image-swiper {

    overflow: hidden;

    position: relative;

    user-select: none;

    width: 100%;

    border-radius: 12px;

}



.image-swiper::before {

    bottom: 0;

    content: "";

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

    visibility: hidden;

    z-index: 2

}



.image-swiper__root,

.image-swiper__root>body {

    overscroll-behavior-x: none

}



.image-swiper__root--disabled {

    overflow: hidden

}



.image-swiper__scroll {

    height: 100%;

    outline: 0;

    overflow: hidden;

    pointer-events: none;

    position: relative;

    width: 100%

}



.image-swiper__scroll-space {

    height: 1px;

    left: 0;

    pointer-events: none;

    position: absolute;

    top: 0;

    visibility: hidden

}



.image-swiper__item {

    contain: strict;

    pointer-events: all;

    position: absolute;

    top: 0;

    z-index: 1

}



.image-swiper__item-image {

    border: 0;

    height: 100%;

    object-position: center;

    object-fit: cover;

    outline: 0;

    pointer-events: none;

    position: relative;

    width: 100%;

    max-height: 640px;    

}



.image-swiper__item-image--size--cover {

    object-fit: cover

}



.image-swiper__item-image--size--contain {

    object-fit: contain

}



.image-swiper:hover>.image-swiper__arrow--active {

    opacity: .6

}



.image-swiper__children {

    bottom: 0;

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 1

}



.image-swiper__arrow {

    align-items: center;

    background: rgba(0, 0, 0, .6);

    border-radius: 50%;

    box-shadow: 0 0 3px rgba(0, 0, 0, .2);

    cursor: pointer;

    display: flex;

    font-weight: 700;

    height: 30px;

    justify-content: center;

    opacity: 0;

    pointer-events: none;

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    transition: opacity .3s, left .3s, right .3s;

    width: 30px;

    z-index: 3

}



.image-swiper__arrow--left {

    left: 20px

}



.image-swiper__arrow--left>svg {

    transform: rotate(180deg)

}



.image-swiper__arrow--right {

    right: 20px

}



.image-swiper__arrow--active {

    pointer-events: auto

}



.image-swiper__arrow>svg {

    display: block;

    height: inherit;

    pointer-events: none;

    width: inherit

}



.image-swiper__points {

    align-items: flex-end;

    background: linear-gradient(180deg, rgba(185, 185, 185, 0)0, rgba(0, 0, 0, .35) 100%);

    bottom: 0;

    display: flex;

    height: 100px;

    justify-content: center;

    left: 0;

    padding: 0 0 20px;

    pointer-events: none;

    position: absolute;

    width: 100%;

    z-index: 3

}



.image-swiper__points-item {

    background: #fff;

    border-radius: 50%;

    height: 6px;

    margin: 0 2px;

    opacity: .5;

    position: relative;

    transition: opacity .6s, transform .6s;

    width: 6px

}



.image-swiper__points-item--active {

    opacity: 1;

    transform: scale(1.2)

}



@media (max-width:1024px) {

    .image-swiper__arrow {

        display: none

    }

    .image-swiper__points {

        padding-bottom: 12px

    }

}



.user-avatar-editable .dropdown-content::after {

    display: none

}



.user-avatar-editable .avatar-wrapper:not(.is-loading):hover .avatar-upload {

    display: flex

}



.btn-apply {

    background: #d60908;

    color: #fff;

    transition: background 250ms, color 250ms;

}



.bq {

    cursor: pointer;

    display: flex;

    gap: 12px;

    height: 40px;

    margin: 20px 0 0;

    max-width: 320px;

    position: relative;

    width: 100%

}



.bq__progress-title {

    align-items: center;

    display: flex;

    font-size: 14px;

    gap: 4px;

    justify-content: space-between;

    margin: 0 0 10px;

    text-shadow: 0 1px 20px rgba(0, 0, 0, .2)

}



.bq__title-text {

    color: #cfcfd0;

    font-weight: 500;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap

}



.bq__left {

    display: flex;

    flex: 1;

    flex-direction: column;

    justify-content: center;

    max-width: calc(100% - 56px)

}



.bw {

    color: #707071;

    column-gap: 24px;

    display: flex;

    flex-wrap: wrap;

    margin: 20px 0 0;

    overflow: hidden;

    row-gap: 10px

}



.bw__item {

    align-items: center;

    column-gap: 6px;

    display: flex;

    font-size: 16px;

    font-weight: 500;

    position: relative

}



.bw__item::after {

    background: rgba(255, 255, 255, .2);

    border-radius: 50%;

    content: "";

    height: 4px;

    left: -13px;

    position: absolute;

    width: 4px

}



.bw__link {

    color: #a0a0a1

}



.bw__link:hover {

    color: #cfcfd0

}



.bu {

    position: relative

}



.bu__tooltip {

    width: 145px

}



.bu__tooltip .tooltip-inner {

    display: flex;

    flex-direction: column

}



.bu__button {

    align-items: center;

    background: #111113;

    border: 0;

    border-radius: 12px;

    color: #fff;

    cursor: pointer;

    display: flex;

    font-weight: 500;

    gap: 12px;

    height: 40px;

    justify-content: center;

    padding: 11px 20px;

    transition: background .3s;

    width: 100%

}



.bu__button:hover {

    background: #232325

}



@media screen and (max-width:767px) {

    .bu__button {

        padding: 11px

    }

    .image-swiper {

        border-radius: 0;

    }    

    .t--fill--locked {

        border-radius: 0;

    }    

}



.bu__action {

    align-items: center;

    background: 0 0;

    border: 0;

    color: rgba(255, 255, 255, .8);

    cursor: pointer;

    display: flex;

    font-size: 14px;

    font-weight: 400;

    line-height: 20px;

    min-height: 38px;

    padding: 7px 22px 7px 15px;

    transition: all ease .25s;

    white-space: nowrap;

    width: 145px

}



.bu__action .icon {

    fill: rgba(255, 255, 255, .8);

    margin-right: 10px

}



.bu__action.profile-cover-dropdown__action--active,

.bu__action:hover {

    background: #343437;

    color: #fff

}

.bp {

    height: 112px;

    margin: 0 0 48px;

    max-width: calc(100vw - 8px);

    overflow: hidden;

    width: 100%

}



.bp .scroll-bar-container__arrow {

    margin-top: -20px

}



.bp--style--mobile {

    height: 82px;

    margin: 0 0 40px

}



.bp--style--pinned {

    height: 116px;

    margin: 40px 0 0

}



.bp--style--pinned .scroll-bar-container__arrow {

    margin-top: -8px

}



.bp--style--pinned .avatar__img,

.bp--style--pinned-mobile .avatar__img {

    background-position: center top

}



.bp--style--pinned-mobile {

    height: 82px;

    margin: 40px 0 0

}



.bp__title {

    color: #a0a0a1;

    font-size: 11px;

    margin: 0 0 8px;

    text-transform: uppercase

}



.bp__controls {

    display: flex;

    gap: 1px

}



.bp__add {

    align-items: center;

    background: #111113;

    color: #a0a0a1;

    column-gap: 10px;

    cursor: pointer;

    display: flex;

    flex: 1;

    font-size: 14px;

    height: 80px;

    justify-content: center;

    max-height: 100%;

    transition: background .3s;

    border-bottom-left-radius: 26px;

    border-top-left-radius: 26px

}



.bp__add:hover,

.bp__archive:hover {

    background: #1b1b1d

}



.bp__add--rounded {

    border-radius: 26px

}



.bp__archive {

    align-items: center;

    background: #111113;

    color: #a0a0a1;

    column-gap: 10px;

    cursor: pointer;

    display: flex;

    flex: 1;

    font-size: 14px;

    height: 80px;

    justify-content: center;

    max-height: 100%;

    transition: background .3s;

    border-bottom-right-radius: 26px;

    border-top-right-radius: 26px

}



.bp__list {

    display: flex;

    gap: 2px;

    padding-bottom: 12px

}



.feed_stories.bp__list{

    gap: 14px!important;

} 



.bp__item {

    align-items: center;

    display: flex;

    flex-direction: column;

    gap: 2px;

    min-height: 92px;

    min-width: 92px;

    overflow: hidden;

    padding: 6px 0;

    position: relative;

    width: 92px

}



.bp__item .avatar {

    cursor: pointer

}



.bp__item--mobile {

    min-height: 56px;

    min-width: 56px;

    width: 56px

}



.bp__thumb-avatar {

    align-items: center;

    background: #111113;

    border-radius: 30.75%;

    color: #a0a0a1;

    cursor: pointer;

    display: flex;

    justify-content: center;

    transition: background .3s

}



.bp__thumb-avatar:hover {

    background: #1b1b1d

}



.bp__name {

    font-size: 12px;

    margin: 10px 0 0;

    text-align: center;

    width: 100%

}



.bp__name .displayname {

    display: block

}



.bp__icon {

    color: #fff;

    left: 50%;

    pointer-events: none;

    position: absolute;

    top: 50%;

    transform: translateX(-50%) translateY(-50%)

}



.S img[src=""] {

    visibility: hidden

}

.S {

    overflow: hidden;

    position: relative

}



.S--clickable {

    cursor: pointer

}



.S--locked .image-swiper__points {

    background: 0 0

}



.S__label {

    align-items: center;

    background: rgba(0, 0, 0, .4);

    border-radius: 8px;

    color: #cfcfd0;

    display: flex;

    font-size: 12px;

    font-weight: 700;

    height: 24px;

    padding: 0 8px;

    pointer-events: none;

    position: absolute;

    right: 12px;

    z-index: 2

}



.S__label--top {

    top: 12px

}



.S__label--bottom {

    bottom: 12px

}



.S__blur {

    background-size: 0;

    bottom: 0;

    contain: strict;

    left: 0;

    overflow: hidden;

    pointer-events: none;

    position: absolute;

    right: 0;

    top: 0;

    z-index: -1

}



.S__blur::after,

.S__blur::before {

    background-image: inherit;

    background-repeat: no-repeat;

    bottom: 0;

    content: "";

    left: 0;

    position: absolute;

    right: 0;

    top: 0

}



.S__blur::before {

    background-size: cover;

    filter: blur(16px);

    transform: scale(1.2)

}



.S__blur::after {

    background-position: center;

    background-size: contain

}



.S__tagged-users-count-badge {

    align-items: center;

    background: rgba(0, 0, 0, .4);

    border-radius: 8px;

    bottom: 16px;

    color: #cfcfd0;

    display: flex;

    flex-wrap: nowrap;

    font-size: 14px;

    font-weight: 700;

    gap: 8px;

    left: 16px;

    padding: 4px 8px;

    pointer-events: none;

    position: absolute;

    z-index: 2

}



.P {

    align-items: center;

    background: rgba(0, 0, 0, .4);

    border-radius: 8px;

    color: rgba(255, 255, 255, .8);

    display: flex;

    font-size: 14px;

    font-weight: 500;

    gap: 8px;

    height: 28px;

    padding: 0 8px

}



.bc {

    background-color: #232325;

    border-radius: 8px 8px 0 0;

    box-shadow: 0 20px 30px rgba(0, 0, 0, 0.3);

    display: flex;

    flex-direction: column;

    padding-bottom: env(safe-area-inset-bottom);

    position: relative;

    transition: width 200ms;

    width: 250px;

}

@media (max-width: 639px) {

    .bc {

        border-radius: 0;

        bottom: var(--tap-bar-height);

        left: 0;

        position: fixed;

        right: 0;

        top: var(--pwa-notification-height);

    }

    .picture-squad-grid {

        column-gap: 1px;

        grid-template-columns: repeat(3, 1fr);

        row-gap: 1px;

    }

    .F {

        border-radius: 1px;

    }



    .dp__dropdown {

        width: 90vw;

    }



}



@media (max-width: 1024px) {

    .top-search-hidden {

        display: none;

    }



}

.no-show-tablets {

    display: block;

}





@media (max-width: 800px) {

    .no-show-tablets {

        display: none!important;

    }

    .mobile-menu {

        display: block!important;

    }

}

.bc:not(:first-child) {

    margin-left: 20px;

}

.bc__content {

    display: flex;

    flex-direction: column;

    height: 0;

    justify-content: flex-end;

    position: relative;

    transition: height 200ms;

}

.bc__content--expanded {

    height: 430px;

    max-height: calc(100vh - 100px);

}

@media (max-width: 639px) {

    .bc__content--expanded {

        flex: 1;

    }

}

@media screen and (max-width: 639px) {

    .bc__content--expanded {

        height: auto;

        max-height: none;

        overflow: hidden;

    }

}

.bc .chat-header-username {

    max-width: 160px;

}

.bc--expanded {

    overflow: inherit;

    width: 360px;

}

@media (max-width: 639px) {

    .bc--expanded {

        width: 100%;

    }

	.bc{

	    margin-left: 0px !important;

	} 

}

.bc--expanded .messenger-chat-header {

    border-color: transparent;

    border-bottom-color: rgba(255, 255, 255, 0.1);

}

.bc--expanded .chat-header-username {

    max-width: 180px;

}

.bc__skeleton-wrapper {

    flex: 1;

    max-height: 100%;

}

.bb {

    align-items: center;

    border-radius: 8px;

    cursor: pointer;

    display: flex;

    margin: 0 8px;

    padding: 12px;

    position: relative;

    transition: background 0.3s;

}

.bb .icon-people {

    color: #fff;

    margin: 0 6px 0 0;

}

@media (pointer: fine) {

    .bb:hover,

    .bb:hover .avatar .online,

    .bb:hover .bb__tier {

        background: #343437;

    }

}

.bb__tier {

    align-items: center;

    background: #232325;

    border-radius: 50%;

    bottom: -4px;

    display: flex;

    height: 22px;

    justify-content: center;

    position: absolute;

    right: -4px;

    transition: background 0.3s;

    width: 22px;

}

.bb__tier .icon-diamond-colored,

.bb__tier .icon-diamond-flat {

    height: 14px;

    width: 14px;

}

.bb__avatar-wrapper {

    margin: 0 12px 0 0;

    position: relative;

}

.bb .avatar {

    flex-shrink: 0;

    height: 44px;

    width: 44px;

}

.bb .avatar .online {

    background: #232325;

    height: 12px;

    left: -3px;

    top: -3px;

    width: 12px;

}

.bb__content {

    overflow: hidden;

}

.bb__name {

    align-items: center;

    display: flex;

}

.bb__name .username {

    font-weight: 700;

}

.bb__text {

    color: rgba(255, 255, 255, 0.6);

    margin: 5px 0 0;

    min-height: 16px;

    overflow: hidden;

    padding-right: 40px;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.bb__time {

    font-size: 12px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: normal;

    margin: 0 0 0 6px;

    opacity: 0.3;

}

.bb__menu {

    align-items: center;

    cursor: pointer;

    display: flex;

    height: 32px;

    justify-content: center;

    opacity: 0.4;

    position: absolute;

    right: 0;

    top: 50%;

    transform: translateY(-50%) rotate(90deg);

    transition: opacity 0.3s;

    width: 32px;

}

@media screen and (max-width: 639px) {

    .bb__menu {

        height: 44px;

        margin-right: -8px;

        width: 44px;

    }

}

.bb__menu:hover {

    opacity: 1;

}

.bb__new {

    align-items: center;

    background: #ff5f5f;

    border-radius: 10px;

    color: #fff;

    display: flex;

    font-size: 11px;

    height: 20px;

    justify-content: center;

    min-width: 20px;

    padding: 0 4px;

    pointer-events: none;

    position: absolute;

    right: 30px;

}

.bb .personal-notifications-settings {

    bottom: unset;

    left: unset;

    right: -8px;

    top: 56px;

}

@media screen and (max-width: 639px) {

    .bb .personal-notifications-settings {

        bottom: unset;

        left: 7px;

        right: 7px;

        top: 56px;

        width: unset;

    }

}

.bb--menu--top .personal-notifications-settings {

    bottom: 56px;

    top: unset;

}

@media screen and (max-width: 639px) {

    .bb--menu--top .personal-notifications-settings {

        bottom: 56px;

        top: unset;

    }

}

.bb--menu--top .personal-notifications-settings-arrow-up {

    bottom: -5px;

    top: unset;

    transform: rotate(180deg);

}

.bb .personal-notifications-switcher-name {

    cursor: pointer;

    text-decoration: none;

}

.bb .personal-notifications-switcher-name:hover {

    color: #fff;

}





y {

    border-radius: 0 0 12px 12px;

    overflow: hidden;

    position: relative;

}

.y--clickable {

    cursor: pointer;

}

.y--locked .image-swiper__points {

    background: 0 0;

}

.y__label {

    align-items: center;

    background: rgba(0, 0, 0, 0.4);

    border-radius: 8px;

    color: #cfcfd0;

    display: flex;

    font-size: 12px;

    font-weight: 700;

    height: 24px;

    padding: 0 8px;

    pointer-events: none;

    position: absolute;

    right: 12px;

    z-index: 2;

}

.y__label--top {

    top: 12px;

}

.y__label--bottom {

    bottom: 12px;

}

.y__blur {

    background-size: 0;

    bottom: 0;

    contain: strict;

    left: 0;

    overflow: hidden;

    pointer-events: none;

    position: absolute;

    right: 0;

    top: 0;

    z-index: -1;

}

.y__blur::after,

.y__blur::before {

    background-image: inherit;

    background-repeat: no-repeat;

    bottom: 0;

    content: "";

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

}

.y__blur::before {

    background-size: cover;

    filter: blur(16px);

    transform: scale(1.2);

}

.y__blur::after {

    background-position: center;

    background-size: contain;

}

.y__tagged-users-count-badge {

    align-items: center;

    background: rgba(0, 0, 0, 0.4);

    border-radius: 8px;

    bottom: 16px;

    color: #cfcfd0;

    display: flex;

    flex-wrap: nowrap;

    font-size: 14px;

    font-weight: 700;

    gap: 8px;

    left: 16px;

    padding: 4px 8px;

    pointer-events: none;

    position: absolute;

    z-index: 2;

}



.D {

    padding: 20px 20px 0;

    position: relative;

    word-break: break-all;

}

.D--compact {

    display: flex;

}

.D__avatar {

    display: block;

    height: 80px;

    margin: 20px 10px 16px 0;

    width: 80px;

}

.D__avatar--size--small {

    height: 64px;

    width: 64px;

}

.D__avatar--size--medium {

    height: 80px;

    width: 80px;

}

.D__avatar > .avatar {

    height: inherit;

    width: inherit;

}

.D__username {

    display: flex;

    position: relative;

}

.D__cover {

    background-repeat: no-repeat;

    background-size: cover;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

}

.D__cover--size--small {

    height: 84px;

}

.D__cover--size--medium {

    height: 100px;

}

.D__cover--size--large {

    height: 120px;

}

.D__cover::before {

    background: linear-gradient(1deg, #0a0a0a 0, rgba(0, 0, 0, 0.55) 100%);

    content: "";

    display: block;

    height: inherit;

}

.D__cover--no-photo::before {

    background: radial-gradient(138.66% 168.3%at 72.8% 11.43%, #2c2057 0, #050506 77.21%), #050506;

}



.pepe {

    padding: 20px;

}

.p__benefits-list {

    display: flex;

    flex-wrap: wrap;

    gap: 10px;

    margin: 5px 0;

}

.p__benefit {

    align-items: center;

    background: #232325;

    border-radius: 12px;

    color: rgba(255, 255, 255, 0.6);

    flex: 1 0 224px;

    font-size: 12px;

    line-height: 120%;

    min-height: 48px;

    padding: 10px 13px;

    width: 224px;

    display: flex;

    flex-direction: row;

}

.p__benefit .icon-check-1 {

    color: #d60908;

    height: 16px;

    min-width: 12px;

    width: 16px;

}

.p__benefit .icon-gift {

    fill: currentColor;

    margin-right: 14px;

}

@media (max-width: 540px) {

    .p__benefit {

        width: 100%;

    }

}

.p__icon {

    color: #d60908;

    margin-right: 12px;

}

.p__actions--sticked {

    backdrop-filter: blur(2px);

    background: rgba(27, 27, 29, 0.8);

    border-radius: 0 0 12px 12px;

    bottom: 0;

    left: 0;

    padding: 20px;

    position: absolute;

    width: 100%;

}

@media screen and (max-height: 760px) {

    .p__actions--sticked {

        border-top: 1px solid rgba(255, 255, 255, 0.05);

    }

}

.p__actions > .btn {

    margin-top: 10px;

    width: 100%;

}

.p__actions > .btn > .icon-diamond-colored,

.p__actions > .btn > .icon-diamond-flat {

    height: 16px;

    margin: 0 6px 0 0;

    width: 16px;

}

.p__actions > .btn:first-child:last-of-type {

    margin-top: 0;

}

.p__actions-description {

    color: #f8f8f8;

    font-size: 11px;

    font-weight: 500;

    line-height: 13px;

    margin: 12px 0 0;

    opacity: 0.4;

    text-align: center;

}

@media screen and (max-width: 479px) {

    .p {



    }

    .p__benefits-list {

        gap: 0;

        margin: 20px 0 0;

    }

    .p__benefit {

        border-radius: 0;

        min-height: auto;

    }

    .p__benefit:first-child {

        border-radius: 12px 12px 0 0;

    }

    .p__benefit:last-child {

        border-radius: 0 0 12px 12px;

    }

}



.o {

    border-radius: 12px;

    margin: 10px 0;

    padding: 12px 16px;

    position: relative;

}

.o--selectable {

    cursor: pointer;

    padding-left: 51px;

}

.o::before {

    border: 1px solid rgba(255, 255, 255, 0.1);

    border-radius: inherit;

    bottom: 0;

    content: "";

    left: 0;

    pointer-events: none;

    position: absolute;

    right: 0;

    top: 0;

    transition: background 0.3s, border 0.3s;

}

.o--state--not-selected:hover::before {

    background: #232325;

    border-color: #49494a;

}

.o--state--not-selected:hover .checkbox-ds__box {

    border-color: #a0a0a1;

}

.o--state--selected {

    cursor: default;

}

.o--state--selected::before {

    background: rgba(215, 13, 17, 0.1);

    border: 2px solid #d60908;

}

.o__title {

    color: #fff;

    font-size: 16px;

    font-weight: 700;

    line-height: 22px;

    margin: 0 0 6px;

    position: relative;

}

.o__description {

    color: #f8f8f8;

    font-size: 11px;

    font-weight: 500;

    line-height: 13px;

    opacity: 0.4;

}

.o__discount {

    align-items: center;

    background: #d21b4c;

    border-radius: 6px;

    color: #fff;

    display: flex;

    font-size: 13px;

    font-weight: 700;

    height: 24px;

    padding: 0 8px;

    position: absolute;

    right: 14px;

    top: 10px;

}

.o__discount--free {

    background: #21b062;

    text-transform: uppercase;

}

.o__checkbox {

    left: 16px;

    position: absolute;

    top: 12px;

}





.bLL {

    max-width: calc(100vw - 32px);

    width: 100%

}

.bLL__header {

    align-items: flex-end;

    display: flex;

    justify-content: space-between;

    margin: 0 0 32px

}



.bLL__tabs {

    color: #a0a0a1;

    display: flex;

    font-size: 24px;

    gap: 32px

}



.bLL__tab {

    cursor: pointer

}



.bLL__tab--active,.bL__tab:hover {

    color: #fff

}



.bLL__tab--active {

    pointer-events: none

}



.bLL__link {

    align-items: center;

    color: #ef0202;

    display: flex;

    font-size: 16px;

    transition: color .3s;

    line-height: 21px;

}



@media (max-width: 639px) {

    .bLL__tabs {

        gap:24px

    }



    .bLL .scroll-bar-container__arrow,.bLL .scroll-bar-container__shadow {

        display: none

    }

    .bYz__wrapper-center{

        width: auto!important;

        top: -60px!important;

    }

    .bYz__wrapper-center{

        

    }

    .bYz__wrapper{

        max-width: 700px!important;

        min-width: 700px!important;

    }

    .bYz__item{

        height: 125px!important;

        min-width: 125px!important;

    }

}



.m {

    align-items: flex-end;

    background: #424248;

    border-radius: 16px;

    display: flex;

    height: 264px;

    max-height: 100%;

    min-height: 100%;

    overflow: hidden;

    padding: 12px;

    position: relative;

    transform: translateZ(0);

    -webkit-user-select: none;

    user-select: none

}



.m--squad {

    border-radius: 2px

}



.m--hover:hover>.m__cover--image {

    transform: scale(1.2)

}



.m--hover:hover .avatar {

    border-color: rgba(255,255,255,.6)

}



.m--hover:hover .avatar:hover {

    border-color: #fff

}



.m--hover:hover .m__description {

    opacity: 1;

    transform: translateY(0)

}



.m--clickable {

    cursor: pointer

}



.m--bordered::before {

    border: 3px solid #ef0202;

    border-radius: inherit;

    bottom: 0;

    content: "";

    left: 0;

    pointer-events: none;

    position: absolute;

    right: 0;

    top: 0;

    z-index: 1

}



.m__controls {

    align-items: center;

    bottom: 6px;

    color: rgba(255,255,255,.8);

    display: flex;

    gap: 12px;

    left: 8px;

    position: absolute;

    z-index: 2

}



.m__comments:hover,.m__controls>.likes-counter:hover {

    color: #fff

}



.m__comments {

    align-items: center;

    background: 0 0;

    border: 0;

    color: rgba(255,255,255,.8);

    cursor: pointer;

    display: flex;

    font-weight: 700;

    gap: 5px;

    padding: 2px

}



.m__cover {

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%

}



.m__cover--image {

    object-fit: cover;

    object-position: center;

    transition: transform .3s

}



.m__followers {

    align-items: center;

    color: rgba(255,255,255,.7);

    display: flex;

    font-size: 12px;

    margin: 2px 0 0

}



.m__top-right-block {

    pointer-events: none;

    position: absolute;

    right: 8px;

    top: 8px;

    z-index: 1

}



.m__top-right-block-icon {

    color: rgba(255,255,255,.8);

    height: 24px;

    width: 24px

}



@media screen and (max-width: 639px) {

    .m__top-right-block-icon {

        height:16px;

        width: 16px

    }

    .br__media-aspect-ratio {

        height: 240px;

    }   



}



.m__bottom-shadow {

    background: linear-gradient(180deg,transparent 0,rgba(0,0,0,.3) 100%);

    border-bottom-left-radius: 16px;

    border-bottom-right-radius: 16px;

    bottom: 0;

    height: 56px;

    left: 0;

    pointer-events: none;

    position: absolute;

    right: 0;

    z-index: 1

}



.m__download {

    background: #232325;

    border-radius: 4px;

    cursor: pointer;

    left: 10px;

    position: absolute;

    top: 10px;

    transform: rotate(90deg)

}



.m--top-shadow::before {

    background: linear-gradient(180deg,rgba(0,0,0,.4)0,transparent 100%);

    content: "";

    height: 60px;

    left: 0;

    pointer-events: none;

    position: absolute;

    top: 0;

    width: 100%;

    z-index: 1

}



.m__top-avatar {

    left: 8px;

    position: absolute;

    right: 40px;

    top: 8px;

    z-index: 1

}



.m__description {

    align-items: flex-end;

    background: linear-gradient(180deg,transparent 0,rgba(0,0,0,.6) 100%);

    bottom: 0;

    display: flex;

    filter: drop-shadow(0 1px 10px rgba(0,0,0,.4));

    height: 200px;

    left: 0;

    opacity: 0;

    padding: 0 8px 40px;

    pointer-events: none;

    position: absolute;

    right: 0;

    transform: translateY(30px);

    transition: transform 150ms ease,opacity 100ms ease;

    z-index: 1

}



.m__description-text {

    -webkit-box-orient: vertical;

    color: rgba(255,255,255,.8);

    display: -webkit-box;

    font-size: 14px;

    font-weight: 400;

    -webkit-line-clamp: 2;

    overflow: hidden;

    word-break: break-all

}



.m__description-link {

    color: rgba(255,255,255,.8)

}



.loading-story:before {

  content: "";

  position: absolute;

  top: 0rem;

  right: 0rem;

  bottom: 0rem;

  left: 0rem;

  border-radius: 33.75%;

  background: linear-gradient(to right, transparent 0, transparent 30%, rgb(60 60 60 / 80%) 50%, transparent 70%, transparent 100%) rgb(52 52 52 / 60%);

  background-size: 500px 100px;

  background-position: center left;

  animation: content-placeholder 1.5s ease infinite;

}



@keyframes content-placeholder {

  from {

    background-position: center right;

  }

  to {

    background-position: center left;

  }

}

.loading-story {

    background: #000;

}



.loading-popular:before {

  content: "";

  position: absolute;

  top: 0rem;

  right: 0rem;

  bottom: 0rem;

  left: 0rem;

  border-radius: 0;

  background: linear-gradient(to right, transparent 0, transparent 30%, rgb(60 60 60 / 80%) 50%, transparent 70%, transparent 100%) rgb(52 52 52 / 60%);

  background-size: 800px 100px;

  background-position: center left;

  animation: content-placeholder 1.5s ease infinite;

}



.loading-popular {

    background: #000;

}



.loading-feed:before {

  content: "";

  position: absolute;

  top: 0rem;

  right: 0rem;

  bottom: 0rem;

  left: 0rem;

  border-radius: 0;

  background: linear-gradient(to right, transparent 0, transparent 30%, rgb(60 60 60 / 80%) 50%, transparent 70%, transparent 100%) rgb(52 52 52 / 60%);

  background-size: 2000px 100px;

  background-position: center left;

  animation: content-placeholder 1.5s ease infinite;

  border-radius: 5px;

}



.loading-media {

    background: #000;

}



.loading-media:before {

  content: "";

  position: absolute;

  top: 0rem;

  right: 0rem;

  bottom: 0rem;

  left: 0rem;

  border-radius: 0;

  background: linear-gradient(to right, transparent 0, transparent 30%, rgb(60 60 60 / 80%) 50%, transparent 70%, transparent 100%) rgb(52 52 52 / 60%);

  background-size: 800px 100px;

  background-position: center left;

  animation: content-placeholder 1.5s ease infinite;

  border-radius: 5px;

}



.loading-feed {

    background: #000;

}





.loading-live:before {

  content: "";

  position: absolute;

  top: 0rem;

  right: 0rem;

  bottom: 0rem;

  left: 0rem;

  border-radius: 0;

  background: linear-gradient(to right, transparent 0, transparent 30%, rgb(60 60 60 / 80%) 50%, transparent 70%, transparent 100%) rgb(52 52 52 / 60%);

  background-size: 2000px 100px;

  background-position: center left;

  animation: content-placeholder 1.5s ease infinite;

  border-radius: 0px;

}



.loading-live {

    background: #000;

}



.fslightbox-source {

    border-radius: 10px !important;

}



.fade-in-bottom {

    -webkit-animation: fade-in-bottom 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;

            animation: fade-in-bottom 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;

}



@-webkit-keyframes fade-in-bottom {

  0% {

    -webkit-transform: translateY(50px);

            transform: translateY(50px);

    opacity: 0;

  }

  100% {

    -webkit-transform: translateY(0);

            transform: translateY(0);

    opacity: 1;

  }

}

@keyframes fade-in-bottom {

  0% {

    -webkit-transform: translateY(50px);

            transform: translateY(50px);

    opacity: 0;

  }

  100% {

    -webkit-transform: translateY(0);

            transform: translateY(0);

    opacity: 1;

  }

}



.fade-in-right {

    -webkit-animation: fade-in-right 0.5s cubic-bezier(0.680, -0.550, 0.265, 1.550) ;

            animation: fade-in-right 0.5s cubic-bezier(0.680, -0.550, 0.265, 1.550) ;

}



@-webkit-keyframes fade-in-right {

  0% {

    -webkit-transform: translateX(50px);

            transform: translateX(50px);

    opacity: 0;

  }

  100% {

    -webkit-transform: translateX(0);

            transform: translateX(0);

    opacity: 1;

  }

}

@keyframes fade-in-right {

  0% {

    -webkit-transform: translateX(50px);

            transform: translateX(50px);

    opacity: 0;

  }

  100% {

    -webkit-transform: translateX(0);

            transform: translateX(0);

    opacity: 1;

  }

}







.bU {

    display: flex;

    flex-direction: column;

    gap: 10px;

    margin: 20px 0

}



.bU__st-link {

    align-items: center;

    display: inline-flex

}



.bU__st-link-content {

    overflow: hidden;

    padding: 0 8px 0 4px;

    position: relative

}



.bU__st-link-content:after {

    background: linear-gradient(270deg, #1b1b1d 0, rgba(27, 27, 29, 0) 100%);

    bottom: 0;

    content: "";

    display: block;

    position: absolute;

    right: -5px;

    top: 0;

    width: 13px

}



.bU__live {

    align-items: center;

    background: #d21b4c;

    border-radius: 6px;

    color: #fff;

    column-gap: 4px;

    display: flex;

    font-size: 13px;

    font-weight: 700;

    height: 20px;

    padding: 0 8px 0 4px;

    position: relative;

    white-space: nowrap

}



.bU__live:hover {

    background: #d9023c

}



.bU__links,

.bU__st {

    display: flex;

    gap: 8px

}



.bU__link {

    align-items: center;

    background: #1b1b1d;

    border-radius: 12px;

    display: flex;

    height: 32px;

    justify-content: center;

    min-width: 32px;

    overflow: hidden;

    width: 32px

}



.bU__link:hover {

    background: #232325

}



.bU__link--st {

    color: #cfcfd0;

    max-width: min(360px, 100%);

    padding: 0 6px;

    position: relative;

    width: auto

}



.bU__link--st:hover .bU__st-link-content::before {

    background: linear-gradient(270deg, #232325 0, rgba(27, 27, 29, 0) 100%)

}



.g {

    display: grid;

    gap: 10px;

    grid-template-columns: 2.5fr 1fr;

    grid-template-rows: repeat(2, 1fr);

    height: 360px

}



.g__item {

    align-items: center;

    border-radius: 12px;

    display: flex;

    justify-content: center;

    overflow: hidden;

    position: relative

}



.g__item--main {

    grid-row: 2 span

}



.g__img {

    height: 100%;

    left: 0;

    object-fit: cover;

    object-position: center;

    position: absolute;

    top: 0;

    width: 100%

}



.g__shadow {

    align-items: center;

    background: rgba(0, 0, 0, .4);

    bottom: 0;

    display: flex;

    justify-content: center;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%

}



.g__join,

.g__lock {

    align-items: center;

    display: flex;

    flex-direction: column;

    position: relative

}



.g__lock {

    color: rgba(255, 255, 255, .6);

    font-size: 14px;

    gap: 6px

}



.g__join {

    color: rgba(255, 255, 255, .8);

    gap: 16px;

    text-align: center;

    z-index: 1

}



.g__view-button {

    align-items: center;

    background: 0 0;

    border: 0;

    color: rgba(255, 255, 255, .6);

    cursor: pointer;

    display: flex;

    font-size: 12px;

    gap: 6px;

    padding: 0;

    transition: color .3s

}



.g__view-button:hover {

    color: #cfcfd0

}



.landing {

    display: flex;

    justify-content: center;

    position: relative;

    scroll-behavior: smooth;

}

.landing__main-arrow {

    bottom: 12px;

    cursor: pointer;

    left: 50%;

    margin-left: -18px;

    position: fixed;

    transition: opacity 1s;

}

.landing__main-arrow--hidden {

    opacity: 0;

    pointer-events: none;

}

.landing__content {

    max-width: 1400px;

    padding: 0 100px;

}

.landing__section {

    min-height: 100vh;

    padding-top: var(--pwa-sticky-header-height);

}

.landing__section-login {

    display: flex;

    justify-content: space-between;

    min-height: max(100vh, 800px);

}

.landing__section-flex,

.landing__section-flex-center {

    align-items: center;

    display: flex;

    justify-content: space-between;

}

.landing__section-flex-center {

    justify-content: center;

}

.landing__login-wrapper {

    display: flex;

    flex: 1;

    gap: 40px;

    justify-content: space-between;

    margin: 40px 0 80px;

    position: relative;

}

.landing__real-title {

    font-size: 44px;

    font-weight: 700;

    line-height: 50px;

    margin: 0 0 666px;

    max-width: 610px;

}

.landing__footer-gradient {

    background: radial-gradient(74.17% 69.92%at 50% -6.37%, #3f1962 0, transparent 100%);

    bottom: 0;

    height: 155vh;

    pointer-events: none;

    position: absolute;

    transform: rotate(-180deg);

    width: 100%;

    z-index: -1;

}

.landing__profile-card-wrapper {

    flex: 1;

    margin: 100px auto 84px;

    transform: translateY(-60px);

    width: 100%;

}

@media screen and (max-width: 1023px) {

    .landing {

        display: block;

    }

    .landing__content {

        padding: 0 40px;

    }

    .landing__section-login {

        width: auto;

    }

}

@media screen and (min-width: 768px) {

    .landing__nav_center {

        justify-content: flex-end;

    }

}

@media screen and (max-width: 767px) {

    .landing__nav-left {

        flex: 1 1 50%;

    }

    .landing__logo-wrapper {

        width: 100%;

    }

    .landing__login-wrapper {

        align-items: center;

        flex-direction: column;

        margin: 80px 0 0;

    }

    .landing__real-title {

        font-size: 24px;

        line-height: 30px;

        margin-bottom: 300px;

        text-align: center;

    }

}

@media screen and (max-width: 639px) {

    .landing {

        margin: unset;

    }

    .landing__content {

        padding: 0 20px;

    }

    .landing__header {

        justify-content: space-between;

        padding-right: 10px;

    }

    .landing__nav-center {

        justify-content: flex-end;

    }

    .landing__section {

        min-height: unset;

    }

    .landing__section-flex {

        align-items: flex-start;

        flex-direction: column;

        justify-content: flex-start;

    }

    .landing__section-login {

        flex-direction: column-reverse;

    }

    .landing__profile-card-wrapper {

        transform: translateY(0);

    }

}



.bY {

    display: flex;

    font-size: 14px;

    justify-content: center;

    line-height: 100%;

    margin: 80px 0 0;

    position: absolute;

    width: 100%;

}

.bY__wrapper-center {

    display: flex;

    justify-content: center;

    overflow: hidden;

    position: absolute;

    top: 0;

    width: 100vw;

}

.bY__wrapper-center::before {

    background: linear-gradient(90deg, #050506 0, rgba(5, 5, 6, 0) 100%);

    content: "";

    width: 160px;

    z-index: 1;

}

.bY__wrapper-center::after {

    background: linear-gradient(270deg, #050506 0, rgba(5, 5, 6, 0) 100%);

    content: "";

    height: 100%;

    pointer-events: none;

    position: absolute;

    right: 0;

    top: 0;

    width: 160px;

    z-index: 1;

}

.bY__wrapper {

    display: flex;

    flex-wrap: wrap;

    gap: 30px;

    height: 666px;

    padding: 30px 0 0;

}

.bY__item-bottom {

    background: linear-gradient(360deg, rgba(0, 0, 0, 0.45) 0, rgba(0, 0, 0, 0.42) 26.38%, transparent 100%);

    bottom: 0;

    color: #fff;

    left: 0;

    min-height: 40px;

    padding: 12px;

    position: absolute;

    text-align: center;

    width: 100%;

}

.bY__item {

    background: #424248;

    border-radius: 32px;

    height: 192px;

    min-width: 192px;

    overflow: hidden;

    position: relative;

    transform: translateZ(0);

    width: 192px;

}

.bY__item:hover > .bYz__image {

    transform: scale(1.2);

}



.bY__username {

    align-items: center;

    display: flex;

    font-size: 16px;

    font-weight: 500;

    gap: 4px;

    justify-content: center;

    max-width: 100%;

    white-space: nowrap;

}

.bY__name {

    max-width: 100%;

    overflow: hidden;

    text-overflow: ellipsis;

}

.bY__counters {

    align-items: center;

    color: rgba(255, 255, 255, 0.8);

    display: flex;

    font-size: 12px;

    font-weight: 500;

    gap: 4px;

    justify-content: center;

    margin: 6px 0 0;

}

.bY__image {

    background: no-repeat center;

    background-size: cover;

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    transition: transform 0.3s;

    width: 100%;

}

@media screen and (max-width: 767px) {

    .bYz__wrapper-center {

        justify-content: flex-start;

    }

    .bYz__wrapper {

        transform: translateX(-150px);

    }

}

.bW__content {

    text-align: center;

}

.bW__footer {

    display: flex;

    justify-content: center;

    margin: 40px 0 0;

}

.bW__title {

    font-size: 44px;

    font-weight: 700;

    line-height: 50px;

}

@media screen and (max-width: 767px) {

    .bW__title {

        font-size: 24px;

        font-weight: 700;

        line-height: 30px;

    }

}

.auth-form {

    display: flex;

    flex: 1;

    flex-direction: column;

    justify-content: center;

}

.auth-form__fading-input {

    max-height: 100px;

}

.auth-form__fading-input:not(:last-child) {

    margin-bottom: 16px;

}

.auth-form__title {

    font-size: 1.375rem;

    line-height: 1.679rem;

    font-weight: 500;

    margin-bottom: 24px;

    text-align: center;

}

.auth-form__social-login {

    column-gap: 12px;

    display: grid;

}

.auth-form__social-login .icon {

    margin-right: 10px;

}

.auth-form__divider {

    margin: 24px 0;

    padding: 0 76px;

    text-align: center;

    font-size: 0.75rem;

    line-height: 0.938rem;

}

.auth-form__divider-text {

    opacity: 0.4;

}

.auth-form__hint {

    font-size: 0.688rem;

    line-height: 1rem;

    color: #707071;

    font-weight: 400;

    margin-top: 10px;

    text-align: center;

}

.auth-form__hint a {

    color: #707071;

    text-decoration: underline;

}

.auth-form__hint a:hover {

    color: #cfcfd0;

    text-decoration: none;

}

.auth-form__join {

    margin-top: 16px;

}

.auth-form__form-switcher {

    color: #a0a0a1;

    margin-top: 32px;

    text-align: center;

    font-size: 0.813rem;

    line-height: 1rem;

}

.auth-form__form-switcher .btn {

    border-radius: 0;

    color: #ff3636;

    vertical-align: baseline;

    font-size: 0.813rem;

    line-height: 1rem;

}

@media screen and (max-width: 639px) {

    .auth-form__title {

        font-size: 1.375rem;

        line-height: 1.679rem;

    }

}

.auth-form .recaptcha {

    display: flex;

    justify-content: center;

    margin: 20px auto 0;

}



bX {

    flex: 1;

    position: relative;

    width: 100%;

}

.bX__size {

    aspect-ratio: 5/4;

    display: block;

    visibility: hidden;

    width: 100%;

}

.bX__shadow-box {

    border-radius: 50%;

    box-shadow: 0 0 200px rgba(163, 73, 252, 0.6);

    pointer-events: none;

    position: absolute;

}

.bX__shadow-box--face--1 {

    left: 20%;

    padding-top: 31%;

    top: 74%;

    width: 31%;

}

.bX__shadow-box--face--2 {

    left: 30%;

    padding-top: 44%;

    top: 10%;

    width: 48%;

}

.bX__face {

    position: absolute;

}

.bX__face--face--1 {

    left: 14%;

    top: 73%;

    width: 38%;

}

.bX__face--face--2 {

    left: 30%;

    top: 5%;

    width: 60%;

}

.bX__face--chat {

    position: absolute;

}

.bX__face--chat--1 {

    left: 14%;

    top: 0;

    width: 41%;

}

.bX__face--chat--2 {

    left: 53%;

    top: 100%;

    width: 47%;

}

.bX__face--shadow {

    border-radius: 20px;

    box-shadow: 0 0 200px rgba(163, 73, 252, 0.6);

}

.bX__smile {

    left: 87%;

    position: absolute;

    top: 95%;

    width: 8%;

}

@media screen and (max-width: 767px) {

    .bX {

        margin-top: 20px;

    }

}

.abilitie-tip {

    flex: 1;

    margin: 20px 0 20px auto;

    max-width: 600px;

    overflow: hidden;

    position: relative;

}

.abilitie-tip::after {

    bottom: 70px;

    box-shadow: 0 0 150px 182px rgba(138, 24, 252, 0.3);

    content: "";

    height: 1px;

    left: 50%;

    pointer-events: none;

    position: absolute;

    top: 50%;

    width: 1px;

    z-index: 10;

}

.abilitie-tip__message {

    align-items: center;

    display: flex;

    height: 100%;

    justify-content: center;

    left: 0;

    pointer-events: none;

    position: absolute;

    top: 0;

    width: 100%;

    z-index: 11;

}

.abilitie-tip__message > .login-message-wrapper {

    opacity: 0;

    transform: scale(0);

    transition: opacity 0.5s, transform 0.5s;

}

.abilitie-tip__message::before {

    background: rgba(0, 0, 0, 0.4);

    content: "";

    height: 100%;

    left: 0;

    opacity: 0;

    position: absolute;

    top: 0;

    transition: opacity 0.3s;

    width: 100%;

}

.abilitie-tip__message--visible {

    pointer-events: auto;

}

.abilitie-tip__message--visible > .login-message-wrapper {

    opacity: 1;

    transform: scale(1);

}

.abilitie-tip__message--visible > .login-message-wrapper .login-message__inline-emoji {

    animation: animation-ability-tip 2.5s ease;

}

.abilitie-tip__message--visible::before {

    opacity: 1;

}

@media screen and (max-width: 1023px) {

    .abilitie-tip .tip-modal__content .radio-pill-controls {

        grid-template-columns: repeat(3, 1fr);

    }

}

@media screen and (max-width: 639px) {

    .abilitie-tip {

        width: 100%;

    }

}

@media screen and (max-width: 767px) {

    .abilitie-tip {

        margin: 30px auto;

        max-width: 100%;

    }

}



.bYz {

    display: flex;

    font-size: 14px;

    justify-content: center;

    line-height: 100%;

    margin: 0px 0 0;

    position: absolute;

    width: 100%;

}

.bYz__wrapper-center {

    display: flex;

    justify-content: center;

    overflow: hidden;

    position: absolute;

    top: 0;

    width: 100vw;

}

.bYz__wrapper-center::before {

    background: linear-gradient(90deg, #050506 0, rgba(5, 5, 6, 0) 100%);

    content: "";

    width: 220px;

    z-index: 1;

    pointer-events: none;

}

.bYz__wrapper-center::after {

    background: linear-gradient(270deg, #050506 0, rgba(5, 5, 6, 0) 100%);

    content: "";

    height: 100%;

    pointer-events: none;

    position: absolute;

    right: 0;

    top: 0;

    width: 220px;

    z-index: 1;

}

.bYz__wrapper {

    display: flex;

    flex-wrap: wrap;

    gap: 30px;

    height: 766px;

    padding: 30px 0 0;

}

.bYz__item-bottom {

    background: linear-gradient(360deg, rgba(0, 0, 0, 0.45) 0, rgba(0, 0, 0, 0.42) 26.38%, transparent 100%);

    bottom: 0;

    color: #fff;

    left: 0;

    min-height: 40px;

    padding: 12px;

    position: absolute;

    text-align: center;

    width: 100%;

}

.bYz__item {

    background: #424248;

    border-radius: 32px;

    height: 202px;

    min-width: 202px;

    overflow: hidden;

    position: relative;

    transform: translateZ(0);

}

.bYz__item:hover > .bYz__image {

    transform: scale(1.2);

}

.bYz__item:nth-child(even) {

    transform: translateY(-30px);

}

.bYz__username {

    align-items: center;

    display: flex;

    font-size: 16px;

    font-weight: 500;

    gap: 4px;

    justify-content: center;

    max-width: 100%;

    white-space: nowrap;

}

.bYz__name {

    max-width: 100%;

    overflow: hidden;

    text-overflow: ellipsis;

}

.bYz__counters {

    align-items: center;

    color: rgba(255, 255, 255, 0.8);

    display: flex;

    font-size: 12px;

    font-weight: 500;

    gap: 4px;

    justify-content: center;

    margin: 6px 0 0;

}

.bYz__image {

    background: no-repeat center;

    background-size: cover;

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    transition: transform 0.3s;

    width: 100%;

}

@media screen and (max-width: 767px) {

    .bYz__wrapper-center {

        justify-content: flex-start;

    }

    .bYz__wrapper {

        transform: translateX(-150px);

    }

}

.bWz__content {

    text-align: center;

}

.bWz__footer {

    display: flex;

    justify-content: center;

    margin: 40px 0 0;

}

.bWz__title {

    font-size: 44px;

    font-weight: 700;

    line-height: 50px;

}

@media screen and (max-width: 767px) {

    .bWz__title {

        font-size: 24px;

        font-weight: 700;

        line-height: 30px;

    }

}



.bTz {

    margin-bottom: 32px;

}

.bTz__wrapper {

    contain: strict;

    left: 0;

    overflow: hidden;

    position: absolute;

    right: 0;

}

.bTz__list {

    align-items: center;

    display: flex;

}

.bTz__item {

    margin-right: 20px;

    min-width: 190px;

    width: 190px;

}

.bTz__shadow {

    bottom: 0;

    pointer-events: none;

    position: absolute;

    top: 0;

    width: 190px;

}

.bTz__shadow--right {

    background: linear-gradient(to right, transparent 0, #000 100%);

    right: 0;

}

.bTz__shadow--left {

    background: linear-gradient(to left, transparent 0, #000 100%);

    left: 0;

}

.bTz__scroll-container {

    display: flex;

    overflow: auto;

    position: relative;

}

@media screen and (max-width: 767px) {

    .bTz__shadow {

        width: 100px;

    }

}



.eb {

    align-items: center;

    background: #232325;

    bottom: 0;

    color: rgba(255,255,255,.8);

    display: flex;

    justify-content: center;

    left: 0;

    min-height: 60px;

    padding: 10px 12px;

    position: fixed;

    width: 100%;

    z-index: 11;

    font-size: .813rem;

    line-height: 1.125rem

}



.eb__icon-cookie {

    flex-shrink: 0

}



.eb__description {

    line-height: normal;

    margin: 0 12px 0 15px

}



@media screen and (max-width: 639px) {

    .eb__description {

        font-size:11px

    }

}



@media screen and (max-width: 479px) {

    .eb__description {

        font-size:10px

    }

}



@media screen and (max-width: 320px) {

    .eb__description {

        font-size:9px

    }

}



.eb__learn-more {

    color: #fff;

    opacity: 1

}



@media (max-width: 479px) {

    .eb {

        bottom:calc(60px + env(safe-area-inset-bottom))

    }

}



.dominant-color, .dominant-color-2, .dominant-color-3 {

    position: absolute;

    top: 0;

    width: 100%;

    height: 409px;

    opacity: .72;

    background: linear-gradient(to bottom, rgba(18, 8, 16, 0), #050506);

    transition: all .3s ease-in-out;

}



.dominant-color {

    background-color: rgb(8, 52, 168);

}



.dominant-color-2 {

    background-color: rgb(102, 219, 186);

}



.dominant-color-3 {

    background-color: rgb(115 5 5 / 22%);

}



.login-bg{

    background: #050506!important;

}





.live-badge{

    position: absolute;

    top: 0.5rem;

    right: 0.5rem;

    background: #eb3456;

    color: #fff;

    border-radius: 0.4em;

    text-transform: uppercase;

    font-size: .7em;

    font-weight: 600;

    letter-spacing: .2em;

    padding: 0.35em 0.5em 0.2em 0.68em;

    transform-origin: center bottom;

    display: block;    

}



.btn-suscribe {

  position: relative;

  background: linear-gradient(-90deg, #EE7752, #E73C7E, #23A6D5, #23D5AB, #EE7752);

  background-size: 400% 100%;

  text-transform: uppercase;

  font-weight: 700;

  border: none;

  border-radius: 2.25em;

  font-size: 13px;

  letter-spacing: 1px;

  padding: 0;

  margin: 0;

  animation: Gradient 4s ease infinite;

  text-decoration: none;

}



.btn-suscribe div {

  color: white;

  padding: 0.35em 1.618em;

  border-radius: inherit;

  background-size: inherit;

  background-image: inherit;

  animation: Gradient 4s ease infinite;

  position: relative;

  z-index: 1;

  mix-blend-mode: overlay;

  font-family: 'Inter';

  font-size: 14px;

  

}



@keyframes Gradient {

    50% {

        background-position: 140% 50%;

    transform: skew(-2deg);

    }

}



.btn-suscribe::after {

  content: '';

  position: absolute;

  background-size: inherit;

  background-image: inherit;

  animation: inherit;

  left: 0px;

  right: 0px;

  top: 2px;

  height: 100%;

  filter: blur(1rem);

}



.r__favorite {

    display: flex;

    flex-direction: column;

    gap: 8px;

    position: absolute;

    right: 10px;

    top: 20px;

    z-index: 4;

}



.eU {

    align-items: stretch;

    display: flex;

    height: calc(100vh - 100px - var(--tap-bar-height) - env(safe-area-inset-bottom));

    margin-bottom: -40px;

    overflow: hidden;

    position: relative;

    border-radius: 20px;

    min-width: 960px;

    max-width: 960px;

}



.eU__left-part {

    background: #0c0c0c;

    display: flex;

    flex: 0 1 340px;

    flex-direction: column;

    position: relative;

    width: min(50%, 340px)

}



.eU__left-part--mobile {

    flex: 1;

    width: 100%

}



.eU__right-part {

    background: #0c0c0c;

    border-left: 1px solid #141414;

    flex: 1;

    min-width: 50%;

    position: relative

}



.eU__content-scroll {

    display: flex;

    flex: 1;

    flex-direction: column;

    max-height: 100%;

    padding-bottom: var(--chats-footer-height)

}



.eU__header {

    align-items: center;

    border-bottom: 1px solid transparent;

    color: #fff;

    display: flex;

    flex-wrap: nowrap;

    font-size: 20px;

    font-style: normal;

    font-weight: 700;

    gap: 20px;

    height: 64px;

    line-height: 120%;

    padding: 20px

}



.eU__header--scrolled {

    border-bottom-color: #29292b

}



.eU__header-title {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap

}



.eU__header-text {

    align-items: flex-start;

    background: #343437;

    border-radius: 8px;

    color: #a0a0a1;

    display: flex;

    font-size: 14px;

    font-style: normal;

    font-weight: 500;

    gap: 8px;

    line-height: 140%;

    margin: 12px 18px;

    padding: 10px 22px;

    cursor: pointer!important;

}



.eU__back-button.btn {

    background: #343437;

    border-radius: 50%;

    color: #fff;

    display: inline-grid;

    height: 24px;

    place-items: center;

    width: 24px

}



.eU__chats-filter {

    margin: 0 8px 8px

}



.eU__message-detail-header {

    align-items: center;

    border-bottom: 1px solid #29292b;

    display: flex;

    font-size: 20px;

    font-style: normal;

    font-weight: 700;

    gap: 4px;

    height: 64px;

    line-height: 120%;

    padding: 20px

}



.eU__message-detail-scroll {

    height: 100%;

    width: 100%

}



.eU__message-detail-content {

    margin: 0 auto;

    max-width: 800px;

    padding-top: 20px

}



.eU__empty-state {

    color: #cfcfd0;

    font-size: 14px;

    font-weight: 500;

    left: 50%;

    line-height: 140%;

    position: absolute;

    text-align: center;

    top: 50%;

    transform: translate(-50%, -50%);

    width: calc(100% - 40px);

    z-index: 1

}



.eU__close-btn {

    color: #707071;

    display: grid;

    height: 40px;

    place-items: center;

    position: absolute;

    right: 0;

    top: 10px;

    width: 40px

}





.bDc {

    align-items: center;

    border-radius: 8px;

    cursor: pointer;

    display: flex;

    margin: 0 8px;

    padding: 12px;

    position: relative;

    transition: background .3s

}



.bDc--mode--page {

    margin-bottom: 4px

}



.bDc--selected,

.bDc--selected .bDc__tier,

.bDc--selected .user-status-icon {

    background: #181818

}



@media (pointer:fine) {

    .bDc:hover,

    .bDc:hover .bDc__tier,

    .bDc:hover .user-status-icon {

        background: #181818

    }

}



.bDc .icon-people {

    color: #fff;

    margin: 0 6px 0 0

}



.bDc__tier {

    align-items: center;

    background: #232325;

    border-radius: 50%;

    bottom: -4px;

    display: flex;

    height: 22px;

    justify-content: center;

    position: absolute;

    right: -4px;

    transition: background .3s;

    width: 22px

}



.bDc__tier .icon-diamond-colored,

.bDc__tier .icon-diamond-flat {

    height: 14px;

    width: 14px

}



.bDc__avatar-wrapper {

    margin: 0 12px 0 0;

    position: relative

}



.bDc .avatar {

    flex-shrink: 0;

    height: 44px;

    width: 44px

}



.bDc .user-status-icon {

    background: #232325;

    height: 12px;

    left: -3px;

    top: -3px;

    width: 12px

}



.bDc__content {

    flex: 1;

    max-width: 75%;

    overflow: hidden

}



.bDc__name {

    align-items: center;

    display: flex

}



.bDc__name .username {

    font-weight: 700

}



.bDc__text {

    color: #a0a0a1;

    margin: 5px 0 0;

    min-height: 16px;

    overflow: hidden;

    padding-right: 5px;

    text-overflow: ellipsis;

    white-space: nowrap;

    text-align: left;

    font-size: 0.8rem;

}



.bDc__time {

    font-size: 12px;

    font-weight: 500;

    letter-spacing: normal;

    line-height: normal;

    color: #5f5f61;

    flex: auto;

    margin: 0 0 0 6px;

    text-align: right;

}



.bDc__menu {

    align-items: center;

    cursor: pointer;

    display: flex;

    height: 32px;

    justify-content: center;

    opacity: .4;

    position: absolute;

    right: 0;

    top: 50%;

    transform: translateY(-50%) rotate(90deg);

    transition: opacity .3s;

    width: 32px

}



@media screen and (max-width:639px) {

    .bDc__menu {

        height: 44px;

        margin-right: -8px;

        width: 44px

    }

    .bDc__new {

        right: 10px !important;

    }  

    .bDc__content {

        max-width:100% !important;

    }        

}



.bDc__menu:hover {

    opacity: 1

}



.bDc__new {

    align-items: center;

    background: #fb0000f7;

    border-radius: 10px;

    color: #fff;

    display: flex;

    font-size: 10px;

    height: 15px;

    justify-content: center;

    min-width: 15px;

    padding: 0 4px;

    pointer-events: none;

    position: absolute;

    right: 20px;

    top: 35px;

}





.bDc .personal-notifications-settings {

    bottom: unset;

    left: unset;

    right: -8px;

    top: 56px

}



@media screen and (max-width:639px) {

    .bDc .personal-notifications-settings {

        bottom: unset;

        left: 7px;

        right: 7px;

        top: 56px;

        width: unset

    }

}



.bDc--menu--top .personal-notifications-settings {

    bottom: 56px;

    top: unset

}



@media screen and (max-width:639px) {

    .bDc--menu--top .personal-notifications-settings {

        bottom: 56px;

        top: unset

    }

}



.bDc--menu--top .personal-notifications-settings-arrow-up {

    bottom: -5px;

    top: unset;

    transform: rotate(180deg)

}



.bDc .personal-notifications-switcher-name {

    cursor: pointer;

    text-decoration: none

}



.bDc .personal-notifications-switcher-name:hover {

    color: #fff

}



.bCa {

    background-color: #0c0c0c;

    border-bottom: 1px solid #141414;

    border-radius: 8px 8px 0 0;

    min-height: 48px;

    position: relative;

    -webkit-user-select: none;

    user-select: none

}



.bCa--mode--page {

    min-height: 64px

}



.bCa--mode--page .bCa__left-block {

    padding-left: 12px;

    justify-content: center;

}



.bCa--collapsed {

    border: 1px solid #515151

}



.bCa--fixed {

    bottom: calc(100% - 62px);

    left: 0;

    position: fixed;

    right: 0;

    z-index: 1

}



.bCa__content {

    align-items: center;

    display: flex;

    height: 100%;

    min-height: 40px

}



.bCa__placeholder {

    height: 62px

}



.bCa__name .displayname__name {

    font-weight: 700;

    line-height: 125%;

    max-width: 164px

}



.bCa__name--collapsed .displayname__name {

    max-width: 126px

}



.bCa__back-block {

    position: absolute;

    left: 10px;

    top: 20px;

    display: none;

}



.bCa__back-block svg{

    width: 20px;

}



.bCa__left-block {

    align-items: center;

    display: flex;

    flex-grow: 1;

    flex-shrink: 0;

    padding-left: 6px

}



.bCa__right-block {

    align-items: flex-start;

    backdrop-filter: blur(2px);

    background: rgba(27, 27, 29, .6);

    border-radius: 12px 12px 0 0;

    bottom: calc(100% - 10px);

    box-shadow: 0 20px 30px 0 rgba(0, 0, 0, .3);

    display: flex;

    justify-content: flex-end;

    padding: 0 0 10px;

    position: absolute;

    right: 0;

    width: 100%;

    z-index: -1

}



.bCa__avatar-wrapper {

    height: 32px;

    margin-right: 11px;

    position: relative;

    width: 32px

}



.bCa__header-button.btn {

    color: #707071

}



.bCa__header-button.btn:hover {

    color: #a0a0a1

}



.bCa__header-button--action-btn {

    height: 40px;

    width: 40px

}



.bCa .unread-messages {

    background-color: var(--primary-light);

    border-radius: 50%;

    height: 8px;

    margin: 0 6px;

    width: 8px

}



.bCa__collapse-button {

    margin-right: 10px;

    opacity: .5;

    transition: opacity 200ms

}



.bCa__call-btn {

    background: 0 0;

    border: 0;

    cursor: pointer;

    padding: 0

}



@media (max-width:639px) {

    .bCa__right-block {

        position: static;

        z-index: 1

    }

}



.bsc {

    border-radius: 8px 8px 0 0;

    box-shadow: 0 20px 30px rgba(0, 0, 0, .3);

    display: flex;

    flex-direction: column !important;

    padding-bottom: env(safe-area-inset-bottom);

    position: relative;

    transition: width 200ms;

    width: 300px

}



.bsc--mode--page {

    border-radius: 0;

    box-shadow: none;

    height: 100%;

    width: 100%

}



.bsc--mode--page.bsc--expanded {

    width: 100%!important

}



.bsc--mode--page .bsc__content--expanded {

    flex: 1;

    width: 100%

}



.bsc--expanded {

    overflow: inherit;

    width: 360px

}



@media (max-width:639px) {

    .bsc--expanded {

        width: 100%

    }

    .bsc--mode--modal {

        border-radius: 0;

        bottom: var(--tap-bar-height);

        left: 0;

        position: fixed;

        right: 0;

        top: 0

    }

}



.bsc:not(:first-child) {

    margin-left: 0px

}



.bsc__content {

    display: flex;

    flex-direction: column;

    height: 0;

    justify-content: flex-end;

    position: relative;

    transition: height 200ms

}



.bsc__content--expanded {

    height: 430px;

    max-height: calc(100vh - 100px)

}



@media (max-width:639px) {

    .bsc__content--expanded {

        flex: 1

    }

}



@media screen and (max-width:639px) {

    .bsc__content--expanded {

        height: auto;

        max-height: none;

        overflow: hidden

    }

    .bsc__content--cookie-expanded {

        max-height: calc(100vh - 160px)

    }

}



.bsc .chat-header-username {

    max-width: 160px

}



.bsc__skeleton-wrapper {

    flex: 1;

    max-height: 100%

}



.bzz {

    flex: 1

}



.bzz__list {

    display: flex;

    flex-direction: column;

    justify-content: flex-end;

    margin: 0 auto;

    max-width: max(800px, 25vw);

    width: 100%

}



.bzz__message-list-overlay {

    -webkit-backdrop-filter: blur(0);

    backdrop-filter: blur(0);

    bottom: 0;

    left: 0;

    pointer-events: none;

    position: fixed;

    right: 0;

    top: 0;

    transition: backdrop-filter 50ms linear;

    z-index: 2

}



.bzz__message-list-overlay--visible {

    -webkit-backdrop-filter: blur(10px);

    backdrop-filter: blur(10px);

    pointer-events: auto

}



.bGc {

    background: #151516

}



.bGc--own {

    background: rgba(91, 65, 255, .2)

}



.bGc__gallery {

    background: #232325;

    height: 260px;

    min-height: 220px;

    min-width: 300px;

    position: relative

}



.bGc__gallery--uncovered {

    height: 220px

}



.bGc__icon {

    color: #cfcfd0;

    left: 8px;

    pointer-events: none;

    position: absolute;

    top: 8px

}



.bGc__footer {

    padding: 10px 12px 26px;

    text-align: left

}



.bGc__counters {

    color: rgba(255, 255, 255, .4);

    font-size: 12px;

    font-weight: 500;

    line-height: 15px;

    margin-top: 2px

}



.bGc__body {

    margin: 5px 0 0;

    padding-top: 5px;

    word-break: break-word

}



.bGc__right-bottom {

    font-size: 11px;

    font-weight: 700;

    letter-spacing: normal;

    line-height: 12px;

    text-transform: uppercase;

    align-items: center;

    background-color: rgba(0, 0, 0, .4);

    border-radius: 4px;

    color: rgba(248, 248, 248, .8);

    display: flex;

    justify-content: center;

    padding: 4px 8px;

    position: absolute;

    right: 8px;

    top: calc(100% - 8px);

    transform: translateY(-100%)

}



.bGc__play-icon {

    color: #fff;

    position: absolute;

    right: 8px;

    top: 8px

}





.bFc {

    background: #232325;

    height: 260px;

    overflow: inherit

}



.bFc__play {

    align-items: center;

    background-color: #000;

    border-radius: 50%;

    color: #fff;

    display: flex;

    height: 34px;

    justify-content: center;

    width: 34px

}



.bEc {

    display: grid;

    gap: 2px;

    grid-template-columns: repeat(2, 1fr);

    grid-template-rows: repeat(2, 1fr);

    height: 100%;

    width: 100%

}



.bEc__item {

    align-items: center;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    display: flex;

    justify-content: center

}



.bIc {

    align-items: center;

    background: rgba(0, 0, 0, .6);

    border: 0;

    border-radius: 20px;

    color: #fff;

    display: flex;

    flex-direction: column;

    font-size: 12px;

    justify-content: center;

    left: 50%;

    max-width: 85%;

    min-width: 118px;

    padding: 10px 20px;

    pointer-events: none;

    position: absolute;

    text-align: center;

    top: 50%;

    transform: translate(-50%, -50%);

    transition: background .3s

}



.bIc__icon {

    fill: currentColor;

    height: 20px;

    margin: 0

}



.bIc__icon--unlocked {

    color: #34b353

}



.bIc__label {

    margin-top: 8px

}



.bIc__price {

    font-weight: 700

}



.bIc__original-price {

    color: #b5b6b7;

    font-weight: 700;

    text-decoration: line-through

}



.qc {

    align-items: center;

    background: #151516;

    border-radius: 16px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    margin: 12px;

    padding: 16px

}



.qc__wrapper {

    display: flex;

    flex: 1;

    flex-direction: column;

    justify-content: flex-end

}



.qc__or {

    font-size: 12px;

    line-height: 20px;

    margin: 6px 0;

    opacity: .6

}



.qc__blocked-icon.icon {

    height: 45px;

    width: 45px

}



.qc__stub-title {

    font-size: 17px;

    margin: 16px 0;

    text-align: center

}



.qc__stub-description {

    font-size: 14px;

    line-height: 20px;

    margin: 0 0 12px;

    opacity: .6;

    text-align: center

}



.qc__message-icon-wrapper {

    align-items: center;

    background: url('')no-repeat;

    background-size: contain;

    display: flex;

    height: 56px;

    justify-content: center;

    margin: 0 auto;

    width: 56px

}



.qc__message-icon {

    display: block;

    height: 20px;

    width: 20px

}



.qc__unlock {

    animation: opacity-zoom-fade-hide 1.5s;

    bottom: 50%;

    display: flex;

    justify-content: center;

    left: 0;

    opacity: 0;

    pointer-events: none;

    position: absolute;

    width: 100%;

    z-index: 1

}



.qc__unlock-icon {

    height: 30px;

    width: 30px

}



.gcc,

.qc__button-group {

    align-items: center;

    display: flex;

    gap: 10px

}



.qc__button-group .btn {

    padding: 0 16px

}



.bAc {

    align-items: center;

    border-top: 1px solid #141414;

    display: flex;

    flex: 0 0 60px;

    position: relative;

    touch-action: none;

    padding-bottom: 10px;

}



.bAc--hidden,



.bAc--mobile {

    background: #232325;

    bottom: calc(var(--tap-bar-height) + env(safe-area-inset-bottom));

    left: 0;

    position: fixed;

    width: 100%

}



.bAc__shatter {

    align-items: center;

    cursor: pointer;

    display: flex;

    font-size: 12px;

    gap: 3px;

    height: 100%;

    left: 12px;

    position: absolute;

    right: 12px;

    top: 0

}



.bAc__ghost {

    min-height: 40px

}



.bAc .chat-controls-input {

    max-height: 80px;

    padding: 6px 0

}



.bAc__content {

    align-items: center;

    display: flex;

    flex: 1;

    height: 100%

}



.bAc__input-wrapper {

    align-items: center;

    background: #111113;

    border: 1px solid transparent;

    border-radius: 12px;

    display: flex;

    flex: 1;

    margin: 8px;

    min-height: 40px;

    padding: 0 12px;

    position: relative

}



.bAc__input-buttons {

    align-items: center;

    display: flex

}



.bAc .messenger-upload-button-wrapper {

    color: #a0a0a1;

    height: 100%;

    margin-right: 0;

    opacity: 1;

    width: 40px

}



.bAc .smiles-dropdown {

    margin: 0

}



.bAc .smiles-dropdown .trigger {

    color: #fff;

    height: 30px;

    width: auto

}



.bAc .smiles-dropdown .trigger .icon,

.bAc .smiles-dropdown .trigger:hover .icon {

    fill: #fff;

    opacity: .6;

    position: static

}



.bAc__control-button {

    display: grid;

    height: 100%;

    place-items: center;

    width: 40px

}



.bAc__control-button__label {

    align-items: center;

    background: #8a18fc;

    border-radius: 6px;

    color: #fff;

    display: flex;

    font-size: 13px;

    font-weight: 700;

    height: 20px;

    padding: 0 8px

}



.bAc__send-button {

    cursor: default

}



.bAc__send-button--non-empty-input {

    cursor: pointer

}



.bAc__send-button--non-empty-input .send-icon {

    opacity: 1

}



.bAc__send-button--non-empty-input:hover .send-icon {

    transform: scale(1.1, 1.1)

}



.bAc .control-icon {

    color: #fff;

    fill: currentColor;

    height: 20px;

    margin: 0;

    opacity: .6;

    width: 20px

}



.bAc .smiles-dropdown .smiles-list {

    bottom: 40px;

    top: auto

}



@media (max-width:639px) {

    .bAc .smiles-dropdown .smiles-list {

        left: auto;

        right: 0

    }



    .messages-container{

        top:0;

        border-radius: 0;

        height: 100vh;

        width: 100%;



    }

    .eU {

        border-radius: 0;

        height: 100%;

        min-width: 100%;

        width: 100%;

        padding-bottom: 50px;

    }



    .eU__left-part {

        width: 100%;

        flex: 0 0 100%;

    }

    .eU__right-part {

        width: 100%;

        flex: 0 0 100%;

    }    

}





:root {

    --header-cta-height: 80px;

}



/*CTA*/

.header-cta {

    padding: 20px;

    min-height: var(--header-cta-height);

    display: flex;

    justify-content: space-between;

    align-items: center;

    gap: 20px;

    background: url("https://my.club/blog/assets/header-banner.webp") no-repeat;

    background-size: cover;

    position: fixed;

    top: 50px;

    transform: translateY(-100%);



    left: 0;

    right: 0;

    box-sizing: border-box;

    z-index: 10;

    transition: all 200ms ease;

    box-shadow: 0 1px 20px rgba(0, 0, 0, 0.6);

}



.header-cta--visible {

    transform: translateY(0);

}



.header-cta__texts {

    align-items: center;

    flex: 1;

    display: flex;

    gap: 20px;

}



.header-cta__logo {

    align-items: center;

    display: flex;

    width: 104px;

    min-width: 104px;

}



.header-cta__logo-image {

    width: 100%;

    height: auto;

    object-fit: cover;

}



.header-cta__text {

    font-weight: 700;

    font-size: 20px;

    line-height: 120%;

    color: #FFFFFF;

    text-align: center;

    margin: 0 auto;

    text-shadow: 0 1px 20px rgba(0, 0, 0, 0.4);

}



.header-cta__action {

    min-width: 150px;

}



.header-cta__button {

    display: flex;

    flex-direction: row;

    justify-content: center;

    align-items: center;

    padding: 0 20px;

    gap: 10px;

    height: 40px;

    background: #b4189e;

    border-radius: 12px;

    color: #FFFFFF;

    font-size: 14px;

    font-weight: 600;

    border: none;

    cursor: pointer;

    box-sizing: border-box;

    transition: all 250ms ease;

}



.header-cta__button:hover {

    background: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), #FC8A18;

}





.header-cta__button > span {

    white-space: nowrap;

}



.header-cta__button-icon {

    width: 14px;

    height: 14px;

    color: rgba(255, 255, 255, 0.6);

}



@media (max-width: 640px) {

    :root {

        --header-cta-height: 120px;

    }



    .header-cta {

        border-radius: 0 0 12px 12px;

        flex-direction: column;

        justify-content: center;

        align-items: center;

        gap: 10px;

    }



    .header-cta__action {

        width: 100%;

        flex: 1;

    }



    .header-cta__texts {

        align-items: flex-start;

        gap: 20px;

        flex-direction: row-reverse;

        justify-content: space-between;

        width: 100%;

    }



    .header-cta__text {

        text-align: left;

        font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif;

        font-style: normal;

        font-weight: 700;

        font-size: 16px;

        line-height: 125%;

        margin: 0;

    }



    .header-cta__button {

        max-width: 100%;

    }



    .header-cta__logo {

        width: 70px;

        min-width: 70px;

    }



    .header-cta__button {

        height: 32px;

        font-size: 13px;

    }

}





.mobile-menu {

    transform: translateY(100px);

    transition: all 200ms ease;

}



.mobile-menu-visible {

    transform: translateY(0);

}



.mobile-menu-invisible {

    transform: translateY(100px);

}



.only-premium-message-username{

    font-weight: bold;

}



.ew {

    display: flex;

    flex-direction: column;

    gap: 10px;

    padding: 20px;

}



@media (max-width:639px) {

    .ew {

        padding: 20px

    }

}



.cf {

    align-items: center;

    background-color: #19191a;

    border-radius: 10px;

    display: flex;

    flex: 1;

    gap: 16px;

    width: 100%

}



.cf--size--reqular {

    padding: 16px

}



.cf--size--reqular-long {

    min-height: 64px;

    padding: 10px 20px

}



.cf--size--small {

    padding: 12px

}



.cf--align--space-between {

    justify-content: space-between

}



.cf--align--left {

    justify-content: flex-start

}



.cf--clickable {

    cursor: pointer

}



.cf--clickable:hover {

    background-color: #343437

}



.cf__left-part {

    display: grid;

    grid-auto-flow: row;

    grid-row-gap: 4px

}



.cf__left-part--grow {

    flex: 1

}



.cf__right-part {

    align-items: center;

    display: flex;

    justify-content: flex-end

}



.cf__right-part--overflow-hidden {

    overflow: hidden

}



.cf__right-part--grow {

    flex: 1

}



.ev__wrapper {

    align-items: center;

    display: flex;

    flex: 1;

    gap: 20px;

    justify-content: space-between;

    width: 100%

}



.icons-hidden{

    display: none;

}





.fs {

    animation: opacity-fade-show .3s;

    background: #232325;

    border-radius: 16px;

    bottom: 10px;

    box-shadow: 0 20px 30px rgba(0, 0, 0, .3);

    display: flex;

    flex-direction: column;

    height: unset;

    left: auto !important;

    max-height: 100%;

    position: fixed;

    right: 30px;

    top: 64px;

    width: 382px;

    z-index: 106

}



.fs--cookie {

    bottom: 70px

}



.fs--is-hiding {

    animation: opacity-fade-hide .3s

}



.fs__verify {

    align-items: center;

    background: #1b1b1d;

    border-radius: 12px;

    display: flex;

    font-size: 14px;

    gap: 12px;

    line-height: 140%;

    margin: 0 8px 4px;

    padding: 12px 42px 12px 12px;

    position: relative

}



.fs__verify-icon {

    align-self: flex-start

}



.fs__verify-close {

    color: #707071;

    cursor: pointer;

    font-size: 0;

    padding: 6px;

    position: absolute;

    right: 4px;

    top: 4px

}



.fs__verify-close:hover {

    color: #a0a0a1

}



.fs .scroll-bar-container {

    display: flex;

    flex-direction: column;

    height: 100%;

    max-height: none;

    max-width: none;

    overflow-x: hidden;

    width: auto

}



.fs__title {

    align-items: center;

    border-bottom: 1px solid transparent;

    color: #fff;

    display: flex;

    font-size: 20px;

    font-weight: 700;

    height: 65px;

    line-height: 24px;

    margin: 0;

    padding: 20px;

    transition: border-bottom-color .5s

}



.fs__title--scrolled {

    border-bottom-color: #29292b

}



.fs__title button {

    border-radius: 2px;

    height: 24px;

    min-width: 24px;

    width: 24px;

    color: #fff;

    margin-right: 12px

}



.fs__title button:hover {

    background: rgba(248, 248, 248, .1)

}



.fs__title .icon {

    flex-shrink: 0;

    height: 16px;

    margin: 0;

    width: 16px

}



@media (max-width:639px) {

    .fs {

        border-radius: 0;

        height: 100%;

        right: 0;

        top: 0;

        width: 100%

    }

    .fs h2 {

        display: none

    }

}



@media screen and (max-width:639px) {

    .fs {

        height: calc(100% - var(--tap-bar-height) - env(safe-area-inset-bottom))

    }

}



.dt__tabs {

    align-items: center;

    display: flex;

    gap: 20px;

    justify-content: flex-start

}



.dt__tabs-item {

    color: #707071;

    cursor: pointer;

    display: flex;

    overflow: hidden;

    text-overflow: ellipsis

}



.dt__tabs-item--active {

    color: #fff;

    pointer-events: none

}



.dt__tabs-item--with-unread:after {

    background: #d21b4c;

    border-radius: 50%;

    content: "";

    display: block;

    flex: 0 0 10px;

    height: 10px;

    position: relative;

    right: 0;

    top: 0;

    width: 10px

}



@media screen and (max-width:639px) {

    .dt__tabs-item {

        font-size: 16px

    }

}



.dt__tabs-item-content {

    font-size: 20px;

    font-weight: 700;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap

}



.dp {

    flex-shrink: 0;

    position: relative;

    width: 100%

}



.dp--mobile {

    display: flex;

    flex-direction: column;

    gap: 12px

}



.dp__row {

    display: flex;

    gap: 12px

}



.dp__row>a,

.dp__row>button,

.dp__row>div {

    flex-grow: 1;

    justify-content: center;

    text-align: center

}



@media (min-width:479px) {

    .dp__row {

        display: flex;

        gap: 12px

    }

    .dp__row>a,

    .dp__row>button,

    .dp__row>div {

        flex-basis: 50%

    }

}



.dp__favorite {

    display: flex;

    flex-direction: column;

    gap: 12px;

    position: absolute;

    right: 15px;

    top: 70px;

    z-index: 7

}



.dp__dropdown {

    color: #fff;

    font-size: 13px;

    min-width: 350px

}



.dp__dropdown-footer {

    border-top: 1px solid rgba(255, 255, 255, .05);

    margin: 12px 0 0;

    padding: 12px 0 0

}



.dp__dropdown-header {

    align-items: center;

    column-gap: 16px;

    display: flex;

    justify-content: space-between

}



.dp__edit-request-menu-button {

    align-items: center;

    gap: 12px

}



.dp__edit-request-menu-button.btn {

    padding: 0 16px

}



.dp__actions-settings {

    align-items: center;

    display: flex

}



.dp__actions-settings-icon--padded {

    margin: 0 8px 0 0

}



.dp__right {

    display: flex;

    gap: 12px;

    margin: 0 0 0 auto

}



.dp__title {

    align-items: center;

    display: flex;

    font-size: 14px;

    font-weight: 700;

    white-space: nowrap

}



.dp__date {

    font-size: 14px;

    margin: 6px 0 0;

    opacity: .4;

    white-space: nowrap

}



.dp__date--warning {

    color: #d21b4c;

    opacity: 1

}



.dp__join-club-block {

    display: flex

}



.dp__join-club-button.btn {

    border-bottom-right-radius: 0;

    border-top-right-radius: 0

}



.dp__dot-button.menu-button-dots__menu-button {

    background: #8a18fc;

    border-left: 1px solid rgba(0, 0, 0, .1);

    border-radius: 0 12px 12px 0;

    filter: none;

    padding: 0 10px;

    position: relative

}



.dp__dot-button.menu-button-dots__menu-button:hover {

    background: #9e40fd

}



.dp__dot-button--style--ai-primary.menu-button-dots__menu-button {

    background: #a0f0e6;

    color: #050506

}



.dp__dot-button--style--ai-primary.menu-button-dots__menu-button:hover {

    background: #a0f0e6

}



.discover-tabs{

    margin-top: 20px!important;

}



@media screen and (max-width:639px) {

    .dp {

        padding: 0;

        width: 100%

    }

    .dp .action-buttons-container .user-fan-club-status-btn {

        height: 31px;

        justify-content: center;

        margin: 0 0 20px;

        width: 100%

    }

    .dp .splitter {

        display: none

    }

    .discover-tabs{

        margin-top: 0px!important;

    }    

}



.dp__icon-wrapper {

    position: relative

}



.dp__icon-decorator {

    color: #2e1d3e;

    height: 12px;

    position: absolute;

    right: 7px;

    top: -3px;

    width: 12px

}



.dp .icon-diamond-colored,

.dp .icon-diamond-flat,

.dp .icon-diamond-rotate {

    height: 20px;

    margin: 0 10px 0 0;

    width: 20px

}



.subscribeBtnDisabled{

    background: #1e1d1d!important;

}



.payments__options{

    position: relative;

    width: 100%;

    height: 550px;

    background:#0a0a0a;;

}



.payments__iframe{

    width: 100%;height: 100%; border: none; margin: 0; padding: 0;border-radius: 10px;border: none;

}



.select select{

    text-indent: 5px!important;

}



.select select option{

    background: #111113;

    color:#dfdfdf99;

    text-indent: 5px!important;      

}





.documents {

    column-gap: 20px;

    display: grid;

    grid-template-columns: repeat(2, 1fr);

    row-gap: 10px

}



.m__field-row--long {

    grid-column: span 2

}



.m__row-split {

    background: rgba(255, 255, 255, .05);

    grid-column: span 2;

    height: 1px;

    margin: 6px 0 0

}



.m__field-label {

    flex-basis: 40%;

    line-height: 30px;

    text-align: left;

    white-space: nowrap;

    font-size: .75rem

}



.m__field-input {

    flex-basis: 60%;

    font-size: .75rem

}



.m__field-tooltip {

    margin-left: 10px

}



.m__field-input-optional {

    align-items: center;

    display: flex

}



.m__field-delete-button {

    background: 0 0;

    border: 0;

    color: #707071;

    cursor: pointer;

    margin: 0 11px;

    outline: 0;

    padding: 0

}



@media (max-width:639px) {

    .documents {

        display: block

    }

}



.documents-selection {

    display: flex;

    flex-wrap: wrap;

    gap: 20px

}



.e__item {

    align-items: center;

    background: #232325;

    border: 0;

    border-radius: 10px;

    cursor: pointer;

    display: flex;

    flex: 1;

    flex-direction: column;

    gap: 20px;

    justify-content: center;

    overflow: hidden;

    padding: 0 20px;

    position: relative;

    transition: background .3s;

    width: 100%

}



.e__item--size--small {

    min-height: 148px

}



.e__item--size--reqular {

    min-height: 240px

}



.e__item:hover {

    background: #343437

}



.e__icon {

    align-items: center;

    display: flex;

    justify-content: center

}



.e__icon::before {

    background: radial-gradient(50% 50%at 50% 50%, rgba(189, 16, 1, .2)0, rgba(27, 27, 29, 0) 100%);

    content: "";

    height: 192px;

    position: absolute;

    width: 192px

}



.e__text {

    color: #fff;

    font-size: 16px;

    font-weight: 600

}



@media (max-width:639px) {

    .documents-selection {

        flex-direction: column

    }

    .e__item {

        min-height: 148px

    }

}



.hideFlex{

    display:none!important;

}





.ageRestricted {

    -webkit-backdrop-filter: blur(12px);

    backdrop-filter: blur(12px);

    background: rgba(0,0,0,.8);

    bottom: 0;

    display: flex;

    justify-content: center;

    left: 0;

    position: fixed;

    right: 0;

    top: 0;

    width: 100%;

    z-index: 10000

}



.ageRestricted__scroll {

    padding: 0 20px;

    width: 100%

}



.ageRestricted__content {

    margin: 0 auto;

    max-width: 440px;

    min-height: 100vh;

    padding: 120px 0 60px;

    width: 100%

}



.ageRestricted__header {

    align-items: center;

    display: flex;

    flex-direction: column;

    justify-content: center;

    margin: 0 auto 40px;

    max-width: 240px

}



.ageRestricted__separator {

    background: rgba(255,255,255,.1);

    height: 1px;

    width: 100%

}



.ageRestricted__reject-button.btn {

    background: 0 0;

    color: #fff;

}



.bm4 {

    background-color: #1b1b1d;

    border-radius: 12px;

    display: flex;

    flex-direction: column;

    max-width: 100%;

    overflow: hidden;

    width: 500px

}



.bm4--size--large {

    width: 760px

}



.bm4__body {

    display: flex;

    flex: 1;

    flex-direction: column

}



.bm4__footer {

    border-top: 1px solid rgba(255, 255, 255, .05);

    max-height: 80px;

    padding: 20px

}



.bm4__footer--sticky {

    -webkit-backdrop-filter: blur(2px);

    backdrop-filter: blur(2px);

    background: rgba(27, 27, 29, .9);

    bottom: 0;

    position: absolute;

    width: 100%;

    z-index: 2

}



.blr {

    align-items: center;

    border-bottom: 2px solid rgba(255, 255, 255, .05);

    display: flex;

    justify-content: flex-start;

    padding: 20px

}



.blr__left {

    height: 48px;

    margin-right: 14px;

    width: 48px

}



.blr__avatar.avatar {

    height: 48px;

    width: 48px

}



.blr__title {

    font-size: 16px;

    font-weight: 700

}



.blr__sub-text {

    color: #707071;

    font-size: 12px

}



.blr__sub-text--last::before {

    content: " â€¢ "

}



.blr__avatar {

    height: 48px;

    width: 48px

}



.ft,

.ft__content {

    align-items: center;

    display: flex;

    flex: 1;

    flex-direction: column

}



.ft__content {

    justify-content: center;

    padding: 20px;

    width: 100%

}



.ft__svg-icon {

    margin-bottom: 16px

}



.ft__extra-name {

    color: #fff;

    font-size: 24px;

    font-weight: 500;

    margin-bottom: 20px

}



.ft__description {

    color: #a0a0a1;

    font-size: 14px;

    font-weight: 400;

    margin-bottom: 20px;

    max-width: 340px;

    text-align: center

}



.ft__add-details {

    align-items: center;

    color: #c4e568;

    column-gap: 12px;

    cursor: pointer;

    display: flex;

    font-size: 14px

}



.ft__text-form {

    display: flex;

    position: relative;

    width: 100%

}



.ft__text-form-controls {

    align-items: center;

    bottom: 10px;

    column-gap: 4px;

    display: flex;

    position: absolute;

    right: 5px

}



.ft__text-form-close {

    align-items: center;

    background: rgba(255, 255, 255, .1);

    border-radius: 50%;

    color: #a0a0a1;

    cursor: pointer;

    display: flex;

    height: 20px;

    justify-content: center;

    position: absolute;

    right: 14px;

    top: 10px;

    width: 20px

}



.ft__text-form-close:hover {

    color: #fff

}



.ft__attach-media {

    bottom: 10px;

    left: 5px;

    position: absolute

}



.ft__attach-media button{

    background: none;

    color: #a4a4a4;

    padding: 0 5px;

}



.ft .chat-controls-input--form {

    height: 120px;

}



.ft__vat {

    color: #707071;

    font-size: 12px;

    margin-bottom: 20px

}



.ft__details {

    margin: 0 auto;

    max-width: 420px;

    width: 100%

}



.ft__media-list {

    margin-top: 20px;

    width: 100%

}



.bc__media-preview,

.peso {

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    border-radius: 14px

}



.peso {

    background-color: #343437;

    border-radius: 10px;

    height: 76px;

    margin-right: 5px;

    position: relative;

    width: 76px;

    -webkit-user-select: none;

    user-select: none

}



.p--has-error .p__indicators,

.p--in-moderation .p__indicators,

.p--uploading .p__indicators {

    opacity: 1;

    pointer-events: auto

}



.p--draggable {

    cursor: grab

}



.p--hover .p__drag-cover-content {

    opacity: 1;

    transform: translateY(0)

}



.p__badge {

    left: 4px;

    pointer-events: none;

    position: absolute;

    top: 4px

}



.p__time {

    align-items: center;

    background: rgba(0, 0, 0, .8);

    border-radius: 4px;

    bottom: 4px;

    color: #a0a0a1;

    display: flex;

    font-size: 10px;

    height: 14px;

    padding: 0 3px;

    pointer-events: none;

    position: absolute;

    right: 4px

}



.p__add-button {

    align-items: center;

    background-color: none;

    border-radius: 50%;

    cursor: pointer;

    display: flex;

    height: 44px;

    justify-content: center;

    position: absolute;

    transition: all ease .25s;

    width: 44px;

    z-index: 1

}





.p__remove-button {

    align-items: center;

    background-color: #5b5b5b;

    border: 3px solid #1b1b1d;

    border-radius: 50%;

    cursor: pointer;

    display: flex;

    height: 24px;

    justify-content: center;

    position: absolute;

    right: -8px;

    top: -12px;

    transition: all ease .25s;

    width: 24px;

    z-index: 1

}



.p__remove-button .icon {

    color: #fff;

    fill: #fff;

    margin: 0

}



.p__remove-button:hover {

    background-color: #af262f

}



.p__indicators {

    align-items: center;

    background-color: rgba(0, 0, 0, .8);

    border-radius: inherit;

    bottom: 0;

    container-type: inline-size;

    display: flex;

    justify-content: center;

    left: 0;

    opacity: 0;

    overflow: hidden;

    pointer-events: none;

    position: absolute;

    right: 0;

    top: 0;

    transition: opacity .5s

}



.p__uploading {

    animation: donut-spin 1.2s linear infinite

}



.p__processing {

    color: #fff;

    font-size: 10px;

    font-weight: 500;

    word-break: break-word

}



@container (max-width: 60px) {

    .p__processing {

        font-size: 8px

    }

}



.p__processing--in-moderation {

    color: #fccf49

}



.p__error-icon {

    left: 5px;

    position: absolute;

    top: 5px

}



.p__error-icon .icon {

    color: #e12947;

    fill: #e12947;

    height: 14px;

    margin: 0;

    width: 14px

}



.p__try-again {

    cursor: pointer

}



.p__try-again .icon {

    color: #fff;

    fill: #fff;

    height: 26px;

    margin: 0;

    transition: all ease .25s;

    width: 26px

}



.p__try-again:hover .icon {

    opacity: .7

}



.p__cover-badge {

    border-bottom-right-radius: 8px;

    border-top-left-radius: 8px;

    color: #fff;

    height: 40px;

    left: 0;

    overflow: hidden;

    position: absolute;

    top: 0;

    width: 40px;

    z-index: 1

}



.p__cover-badge:before {

    border-color: #daff73 transparent transparent #daff73;

    border-style: solid;

    border-width: 20px;

    content: "";

    display: block;

    left: 0;

    position: absolute;

    top: 0

}



.p__cover-badge-icon {

    align-items: center;

    cursor: pointer;

    display: inline-flex;

    justify-content: center;

    margin-left: 4px;

    margin-top: 4px;

    position: relative;

    z-index: 1

}



.p__drag-cover {

    border-radius: 0 0 10px 10px;

    bottom: 0;

    display: flex;

    height: 30%;

    left: 0;

    overflow: hidden;

    pointer-events: none;

    position: absolute;

    right: 0

}



.p__drag-cover-content {

    align-items: center;

    background: rgba(5, 5, 6, .8);

    color: #fff;

    display: flex;

    flex: 1;

    flex-direction: column;

    justify-content: center;

    opacity: 0;

    transform: translateY(30%);

    transition: transform 250ms ease, opacity 250ms ease;

    width: 100%

}



.p__drag-cover-content::after,

.p__drag-cover-content::before {

    background: #fff;

    border-radius: 12px;

    content: "";

    display: block;

    height: 2px;

    width: 12px

}



.p__drag-cover-content::before {

    margin-bottom: 4px

}



.p__drag-cover-content--teaser {

    opacity: 1;

    transform: translateY(0)

}



.p__drag-cover-content--teaser::after,

.p__drag-cover-content--teaser::before {

    display: none

}



.za {

    align-items: stretch;

    background: #111113;

    border-radius: 12px;

    display: flex;

    flex: 1 0 284px;

    gap: 16px;

    min-height: 128px;

    min-width: 284px;

    padding: 20px 16px 20px 20px;

    transition: background .3s

}



.za--style--accent {

    background: rgba(218, 255, 115, .1)

}



.za--style--accent .za__title {

    color: #c4e568

}



.za--hovered {

    cursor: pointer

}



.za--hovered:hover {

    background: #1b1b1d

}



.za--hovered:hover.za--style--accent {

    background: rgba(218, 255, 115, .2)

}



.za--hovered:hover .gb__chevron-icon {

    color: #cfcfd0

}



.za__left-part {

    flex: 1

}



.za__right-part {

    align-items: center;

    display: flex;

    flex: 0 1 24px;

    flex-direction: column;

    justify-content: space-between;

    width: 24px

}



.za__right-part--center {

    justify-content: center

}



.za__title {

    color: #707071;

    font-size: 12px;

    font-weight: 400;

    margin-bottom: 15px;

    text-transform: uppercase

}



.za__body {

    color: #fff;

    display: grid;

    font-size: 36px;

    font-weight: 500;

    margin-bottom: 8px

}



.za__body-content {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap

}



.za__body-highlight {

    color: #fff;

    font-size: 2rem;

    line-height: 2.5rem

}



.za__description {

    align-items: flex-start;

    color: #707071;

    display: flex;

    font-size: 12px;

    font-weight: 400;

    gap: 10px

}



.za__indicator {

    color: #21b062

}



.za__indicator--spaced {

    margin-right: 8px

}



.za__indicator--negative {

    color: #d21b4c

}



.za__chevron-icon {

    color: #707071

}



.za__help-tooltip {

    color: #707071;

    white-space: normal

}



.za__help-tooltip.help-tooltip:hover {

    color: #a0a0a1

}



.modal-body--padding--large {

    padding: 60px

}



.modal-body--padding--large-s {

    padding: 60px 60px 10px

}



.modal-body--padding--large-ss {

    padding: 40px 40px 20px

}





.modal-body--padding--regular-top {

    padding: 24px 20px

}



.modal-body--padding--small {

    padding: 20px

}



.Esa {

    align-items: stretch;

    background: #111113;

    border-radius: 12px;

    display: flex;

    flex: 1 0 284px;

    gap: 16px;

    min-height: 128px;

    min-width: 284px;

    padding: 20px 16px 20px 20px;

    transition: background .3s;

}



.Esa.selected{

    border:2px solid #fb0102;

}



.Esa--style--accent {

    background: rgba(218, 255, 115, .1)

}



.Esa--style--accent .Esa__title {

    color: #c4e568

}



.Esa--hovered {

    cursor: pointer

}



.Esa--hovered:hover {

    background: #1b1b1d

}



.Esa--hovered:hover.Esa--style--accent {

    background: rgba(218, 255, 115, .2)

}



.Esa--hovered:hover .gf__chevron-icon {

    color: #cfcfd0

}



.Esa__left-part {

    flex: 1

}



.Esa__right-part {

    align-items: center;

    display: flex;

    flex: 0 1 24px;

    flex-direction: column;

    justify-content: space-between;

    width: 24px

}



.Esa__right-part--center {

    justify-content: center

}



.Esa__title {

    color: #707071;

    font-size: 12px;

    font-weight: 400;

    margin-bottom: 15px;

    text-transform: uppercase

}



.Esa__body {

    color: #fff;

    display: grid;

    font-size: 36px;

    font-weight: 500;

    margin-bottom: 8px

}



.Esa__body-content {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap

}



.Esa__body-highlight {

    color: #fff;

    font-size: 2rem;

    line-height: 2.5rem

}



.Esa__description {

    align-items: flex-start;

    color: #707071;

    display: flex;

    font-size: 12px;

    font-weight: 400;

    gap: 10px

}



.Esa__indicator {

    color: #21b062

}



.Esa__indicator--spaced {

    margin-right: 8px

}



.Esa__indicator--negative {

    color: #d21b4c

}



.Esa__chevron-icon {

    color: #707071

}



.Esa__help-tooltip {

    color: #707071;

    white-space: normal

}



.Esa__help-tooltip.help-tooltip:hover {

    color: #a0a0a1

}



.D__tiles {

    display: flex;

    flex-wrap: wrap;

    gap: 20px;

    min-width: 900px

}



@media screen and (max-width:1023px) {

    .D__tiles {

        column-gap: 20px;

        min-width: 100%;

        flex: 0 2;

    }

    .Esa{

        flex: 1 0 200px;

        min-width: 200px;

    }

}



.searchable-head,

.Exa {

    align-items: center;

    -webkit-user-select: none;

    user-select: none

}



.Exa {

    cursor: pointer;

    display: inline-flex;

    gap: 8px;

    text-align: right;

    white-space: nowrap

}



.Exa__icons-container {

    align-items: center;

    display: flex;

    flex-direction: column;

    gap: 2px;

    justify-content: center

}



.Exa__icon-sort {

    color: rgba(255, 255, 255, .2);

    height: 5px;

    margin-left: 5px;

    width: 10px

}



.Exa__icon-sort--up {

    transform: rotate(180deg)

}



.Exa:hover .Exa__icon-sort,

.Exa__icon-sort--active {

    color: rgba(255, 255, 255, .6)

}

.earnings-block-scroll {

    overflow: auto

}



.documents-container {

    display: flex;

    flex-direction: column;

    margin: -20px 0 0

}



.rr {

    border-bottom: 1px solid #29292b;

    display: flex;

    gap: 12px;

    padding: 20px 0

}



.rr--compact {

    flex-wrap: wrap

}



.rr:last-child {

    border-bottom: 0

}



.rr__left,

.rr__right {

    flex: 1

}



.rr__left--compact,

.rr__right--compact {

    flex: none;

    width: 100%

}



.rr__left--compact {

    display: flex;

    justify-content: space-between

}



.rr__right-inner {

    display: flex;

    gap: 10px

}



.rr__header {

    align-items: center;

    display: flex;

    font-size: 16px;

    gap: 12px

}



.rr__number {

    align-items: center;

    background: #29292b;

    border-radius: 8px;

    color: #a0a0a1;

    display: flex;

    font-size: 14px;

    height: 24px;

    justify-content: center;

    width: 24px

}



.rr__description {

    color: #a0a0a1;

    font-size: 12px;

    line-height: 20px;

    padding: 6px 0 0

}



.rr__example {

    align-items: flex-end;

    background: #343437;

    border-radius: 12px;

    cursor: pointer;

    display: flex;

    height: 120px;

    margin: 20px 0 0;

    overflow: hidden;

    padding: 10px;

    position: relative;

    text-align: center;

    width: 90px

}



.rr__example--compact {

    margin: 0

}



.rr__example::before {

    background: rgba(0, 0, 0, .4);

    content: "";

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

    z-index: 1

}



.rr__example:hover .rr__img {

    transform: scale(1.1)

}



.rr__img {

    height: 100%;

    left: 0;

    object-fit: cover;

    object-position: center;

    position: absolute;

    top: 0;

    transition: transform .3s;

    width: 100%

}



.rr__example-expand {

    align-items: center;

    backdrop-filter: blur(2px);

    background: rgba(5, 5, 6, .4);

    border-radius: 50%;

    color: #fff;

    display: flex;

    height: 22px;

    justify-content: center;

    position: absolute;

    right: 4px;

    top: 4px;

    transition: background .3s;

    width: 22px;

    z-index: 1

}



.rr__example-text {

    position: absolute;

    z-index: 1;

    font-size: 0.7rem;

}



@media (max-width:639px) {

    .rr {

        flex-direction: column

    }

    .rr__left {

        display: flex;

        gap: 20px;

        justify-content: space-between

    }

    .rr__example {

        margin: 0

    }

}



.tat {

    background: #343437 center no-repeat;

    background-origin: border-box;

    background-size: cover;

    background-repeat: no-repeat;

    border-radius: 12px;

    cursor: pointer;

    display: flex;

    flex: 1;

    flex-direction: column;

    justify-content: center;

    min-height: 160px;

    overflow: hidden;

    position: relative

}



.tat--size--small {

    min-height: 60px

}



.tat--size--regular {

    min-height: 160px

}



.tat--disabled {

    pointer-events: none

}



.tat:hover {

    background-color: #424248

}



.tat--rejected,

.tat--rejected:hover {

    background: #000

}



.tat--error {

    border: 1px solid #5e152a

}



.tat--pending {

    opacity: .5;

    pointer-events: none

}



.tat--with-image::before {

    background: rgba(0, 0, 0, .8);

    content: "";

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

    z-index: 1

}



.tat--with-image-complete::before {

    background: rgb(32 179 77 / 29%);

    content: "";

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

    z-index: 1

}



.tat__item {

    align-items: center;

    display: flex;

    flex: 1;

    justify-content: center;

    padding: 16px;

    position: relative;

    z-index: 1

}



.tat__item::before {

    background: rgba(255, 255, 255, .05);

    content: "";

    height: 1px;

    left: 32px;

    position: absolute;

    right: 32px;

    top: 0

}



.tat__item:first-child::before {

    display: none

}



.tat__content {

    display: flex;

    flex-wrap: wrap;

    font-size: 12px;

    gap: 10px;

    justify-content: center;

    text-align: center

}



.tat__content-header {

    align-items: center;

    display: flex;

    gap: 10px

}



@media (max-width:639px) {

    .tat {

        min-height: 60px

    }

}