@import"https://fonts.googleapis.com/css2?family=Rubik:wght@300;400&display=swap";.device-dialog-container {
    position: relative;
    width: 100%;
    max-width: 800px;
    height: 100vh;
    background: #000404;
    overflow-y: hidden;
    overflow-x: hidden;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    box-sizing: border-box
}

.device-dialog-bg-elements {
    position: absolute;
    left: 357.12px;
    top: -147.56px;
    z-index: 1
}

.device-dialog-ellipse-1 {
    position: absolute;
    width: 556.14px;
    height: 554.28px;
    left: 200.88px;
    top: 273.42px;
    background: #03c8ba80;
    filter: blur(279px);
    will-change: filter;
    transform: translateZ(0);
    isolation: isolate
}

.device-dialog-ellipse-1 div,.device-dialog-ellipse-1 img {
    display: none
}

.device-dialog-ellipse-2 {
    position: absolute;
    width: 957.9px;
    height: 954.8px;
    left: 0;
    top: 0;
    background: #03c8ba80;
    mix-blend-mode: plus-lighter;
    filter: blur(341px);
    will-change: filter;
    transform: translateZ(0);
    isolation: isolate
}

.device-dialog-ellipse-2 div,.device-dialog-ellipse-2 img {
    display: none
}

.device-dialog-ellipse-3-wrapper {
    position: absolute;
    width: 343.236px;
    height: 260.163px;
    left: 220.72px;
    top: -5.58px;
    background: #ffffff80;
    mix-blend-mode: plus-lighter;
    filter: blur(186px);
    transform: rotate(29.076deg) translateZ(0);
    will-change: filter,transform;
    isolation: isolate
}

.device-dialog-ellipse-3-wrapper div,.device-dialog-ellipse-3-wrapper img {
    display: none
}

.device-dialog-title {
    position: relative;
    font-family: Rubik,sans-serif;
    font-weight: 400;
    line-height: normal;
    font-size: clamp(2.5rem,6.2vw,49.6px);
    color: #fff;
    text-align: center;
    margin: clamp(3rem,11.5vh,6rem) auto clamp(1rem,2vh,2rem);
    padding: 0;
    white-space: nowrap;
    z-index: 10;
    width: 100%;
    margin-top: 30px
}

.device-dialog-subtitle {
    position: relative;
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: 1.3;
    font-size: clamp(1.5rem,3.72vw,29.76px);
    color: #ffffff80;
    text-align: center;
    margin: 0 auto clamp(2rem,4vh,4rem);
    padding: 0;
    width: 75%;
    max-width: 600px;
    z-index: 10
}

.device-dialog-buttons-container {
    position: relative;
    width: 88.2%;
    max-width: 705.56px;
    margin: clamp(2rem,4vh,4rem) auto 0;
    padding: 0 6.35%;
    z-index: 10;
    display: flex;
    flex-direction: column;
    gap: clamp(1rem,2vh,2rem)
}

@media (min-width: 768px) {
    .device-dialog-buttons-container {
        gap:2rem
    }
}

.device-dialog-os-button {
    position: relative;
    height: clamp(70px,8.6vh,111.6px);
    width: 100%;
    overflow: hidden;
    border-radius: clamp(15px,3.1vw,24.8px);
    cursor: pointer;
    transition: background .2s ease,transform .2s ease;
    display: flex;
    align-items: center;
    border: none;
    background: linear-gradient(180deg,#00252566,#002a2a66);
    z-index: 10;
    will-change: transform;
    transform: translateZ(0)
}

.device-dialog-os-button:hover {
    background: linear-gradient(180deg,#002a2a80,#002f2f80);
    transform: translateY(-2px) translateZ(0)
}

.device-dialog-button-icon {
    position: absolute;
    left: 5.6%;
    width: clamp(25px,4.96vw,39.68px);
    height: clamp(25px,4.96vw,39.68px);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #02c1b3
}

.device-dialog-button-icon svg {
    width: 100%;
    height: 100%
}

.device-dialog-button-text {
    position: absolute;
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: normal;
    left: 15.7%;
    font-size: clamp(1.8rem,4.875vw,39px);
    color: #fff;
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.device-dialog-button-arrow {
    position: absolute;
    right: 5.6%;
    width: clamp(18px,3.72vw,29.76px);
    height: clamp(18px,3.72vw,29.76px);
    color: #ffffff80
}

.device-dialog-button-arrow svg {
    width: 100%;
    height: 100%
}

.device-dialog-close-button {
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    bottom: 5vh;
    width: 88.2%;
    max-width: 705.56px;
    height: clamp(60px,7.44vh,96.72px);
    background: #02c1b31a;
    border-radius: clamp(15px,3.1vw,24.8px);
    cursor: pointer;
    transition: background .2s ease,transform .2s ease;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    will-change: transform;
    transform: translate(-50%) translateZ(0)
}

.device-dialog-close-button:hover {
    background: #02c1b333;
    transform: translate(-50%) translateY(-2px) translateZ(0)
}

.device-dialog-close-button-text {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: 1;
    font-size: clamp(1.6rem,4.34vw,34.72px);
    color: #fff;
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.whitelist-setup-screen-container {
    position: relative;
    width: 100%;
    min-height: 100vh;
    background: #000606;
    overflow-y: auto;
    overflow-x: hidden;
    margin: 0 auto;
    display: flex;
    flex-direction: column
}

.whitelist-setup-bg-elements {
    position: absolute;
    left: 60%;
    top: -11.35%;
    z-index: 1
}

.whitelist-setup-ellipse-1 {
    position: absolute;
    width: 69.52vw;
    height: 42.63vh;
    left: 25.11vw;
    top: 21.03vh;
    background: #03c8ba80;
    filter: blur(21.5vw)
}

.whitelist-setup-ellipse-1 div,.whitelist-setup-ellipse-1 img {
    display: none
}

.whitelist-setup-ellipse-2 {
    position: absolute;
    width: 119.74vw;
    height: 73.45vh;
    left: 0;
    top: 0;
    background: #03c8ba80;
    mix-blend-mode: plus-lighter;
    filter: blur(26.2vw)
}

.whitelist-setup-ellipse-2 div,.whitelist-setup-ellipse-2 img {
    display: none
}

.whitelist-setup-ellipse-3-wrapper {
    position: absolute;
    width: 42.91vw;
    height: 20.01vh;
    left: 27.59vw;
    top: -.43vh;
    background: #ffffff80;
    mix-blend-mode: plus-lighter;
    filter: blur(14.3vw);
    transform: rotate(29.08deg)
}

.whitelist-setup-ellipse-3-wrapper div,.whitelist-setup-ellipse-3-wrapper img {
    display: none
}

.whitelist-setup-content-container {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    flex: 1;
    z-index: 10;
    padding: 8vh 2rem 2rem
}

.whitelist-setup-shield-container {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 46.7rem;
    flex-shrink: 0;
    aspect-ratio: 466.98 / 570.19;
    pointer-events: none
}

.whitelist-setup-bottom-content {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    gap: 3.5rem;
    padding-bottom: 8rem
}

.whitelist-setup-shield-vector {
    position: absolute;
    width: 100%;
    height: 100%
}

.whitelist-setup-shield-vector img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.whitelist-setup-shield-vector2 {
    position: absolute;
    width: 69.63%;
    height: 69.57%;
    top: 15.77%;
    left: 15.27%
}

.whitelist-setup-shield-vector2 img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.whitelist-setup-shield-vector3 {
    position: absolute;
    width: 86.19%;
    height: 86.1%;
    top: 6.97%;
    left: 6.87%
}

.whitelist-setup-shield-vector3 img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.whitelist-setup-download-icon {
    position: absolute;
    width: 12rem;
    height: 12rem;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 20
}

.whitelist-setup-download-icon img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.whitelist-setup-text-container {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.8rem;
    width: 100%;
    max-width: 62.5rem
}

.whitelist-setup-title {
    font-family: Author,sans-serif;
    font-weight: 400;
    line-height: normal;
    font-size: 4.96rem;
    text-align: center;
    color: #fff;
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.whitelist-setup-subtitle {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: 1.3;
    font-size: 2.98rem;
    color: #ffffff80;
    text-align: center;
    margin: 0;
    padding: 0;
    max-width: 43.1rem
}

.whitelist-setup-buttons-container {
    position: relative;
    display: flex;
    gap: 2.8rem;
    width: 100%;
    max-width: 70rem;
    justify-content: center
}

.whitelist-setup-button-install {
    position: relative;
    background: #02c1b3;
    border: none;
    height: auto;
    aspect-ratio: 344 / 97;
    border-radius: 6.2rem;
    flex: 1;
    max-width: 35rem;
    cursor: pointer;
    transition: background .2s ease,transform .2s ease,box-shadow .2s ease;
    box-shadow: 0 0 0 .8rem #03c8ba40;
    display: flex;
    align-items: center;
    justify-content: center;
    will-change: transform;
    transform: translateZ(0)
}

.whitelist-setup-button-install:hover {
    background: #03d4c5;
    transform: translateY(-2px) translateZ(0);
    box-shadow: 0 0 0 .8rem #03c8ba40,0 4px 20px #02c1b366
}

.whitelist-setup-button-install-text {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: 1;
    color: #000404;
    font-size: 3.47rem;
    text-align: center;
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.whitelist-setup-button-next {
    position: relative;
    background: #02c1b31a;
    height: auto;
    aspect-ratio: 344.1 / 96.72;
    overflow: visible;
    border-radius: 6.2rem;
    flex: 1;
    max-width: 35rem;
    cursor: pointer;
    transition: background .2s ease,transform .2s ease;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    will-change: transform;
    transform: translateZ(0)
}

.whitelist-setup-button-next:hover {
    background: #02c1b333;
    transform: translateY(-2px) translateZ(0)
}

.whitelist-setup-button-next-content {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    position: relative
}

.whitelist-setup-button-next-text {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: 1;
    font-size: 3.47rem;
    text-align: center;
    color: #fff;
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.whitelist-setup-button-next-icon {
    width: 2.98rem;
    height: 2.98rem;
    display: flex;
    align-items: center;
    justify-content: center
}

.whitelist-setup-button-next-icon img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.whitelist-subscription-screen-container {
    position: relative;
    width: 100%;
    min-height: 100vh;
    background: #000606;
    overflow-y: auto;
    overflow-x: hidden;
    margin: 0 auto;
    display: flex;
    flex-direction: column
}

.whitelist-subscription-bg-elements {
    position: absolute;
    left: 44.65%;
    top: -11.35%;
    z-index: 1
}

.whitelist-subscription-ellipse-1 {
    position: absolute;
    width: 69.54vw;
    height: 42.65vh;
    left: 25.12vw;
    top: 21.04vh;
    background: #03c8ba80;
    filter: blur(21.5vw)
}

.whitelist-subscription-ellipse-1 div,.whitelist-subscription-ellipse-1 img {
    display: none
}

.whitelist-subscription-ellipse-2 {
    position: absolute;
    width: 119.77vw;
    height: 73.47vh;
    left: 0;
    top: 0;
    background: #03c8ba80;
    mix-blend-mode: plus-lighter;
    filter: blur(26.2vw)
}

.whitelist-subscription-ellipse-2 div,.whitelist-subscription-ellipse-2 img {
    display: none
}

.whitelist-subscription-ellipse-3-wrapper {
    position: absolute;
    width: 42.92vw;
    height: 20.02vh;
    left: 27.6vw;
    top: -.43vh;
    background: #ffffff80;
    mix-blend-mode: plus-lighter;
    filter: blur(14.3vw);
    transform: rotate(29.08deg)
}

.whitelist-subscription-ellipse-3-wrapper div,.whitelist-subscription-ellipse-3-wrapper img {
    display: none
}

.whitelist-subscription-content-container {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    flex: 1;
    z-index: 10;
    padding: 8vh 2rem 2rem
}

.whitelist-subscription-shield-container {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 46.7rem;
    flex-shrink: 0;
    aspect-ratio: 466.98 / 570.19;
    pointer-events: none
}

.whitelist-subscription-bottom-content {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    gap: 2.5rem;
    padding-bottom: 8rem
}

.whitelist-subscription-shield-vector {
    position: absolute;
    width: 100%;
    height: 100%
}

.whitelist-subscription-shield-vector img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.whitelist-subscription-shield-vector2 {
    position: absolute;
    width: 69.63%;
    height: 69.57%;
    top: 15.77%;
    left: 15.27%
}

.whitelist-subscription-shield-vector2 img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.whitelist-subscription-shield-vector3 {
    position: absolute;
    width: 86.19%;
    height: 86.1%;
    top: 6.97%;
    left: 6.87%
}

.whitelist-subscription-shield-vector3 img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.whitelist-subscription-cloud-icon {
    position: absolute;
    width: 12rem;
    height: 12rem;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 20
}

.whitelist-subscription-cloud-icon img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.whitelist-subscription-text-container {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
    width: 100%;
    max-width: 70rem
}

.whitelist-subscription-title {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: normal;
    font-size: 4.96rem;
    text-align: center;
    color: #fff;
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.whitelist-subscription-subtitle {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: 1.3;
    font-size: 2.98rem;
    color: #ffffff80;
    text-align: center;
    margin: 0;
    padding: 0;
    max-width: 48.7rem
}

.whitelist-subscription-url-field {
    position: relative;
    background: #02c1b31a;
    height: auto;
    aspect-ratio: 711.938 / 96.744;
    overflow: visible;
    border-radius: 6.2rem;
    width: 100%;
    max-width: 70rem;
    cursor: pointer;
    transition: background .2s ease;
    border: none;
    display: flex;
    align-items: center;
    padding: 0 4.5rem
}

.whitelist-subscription-url-field:hover {
    background: #02c1b333
}

.whitelist-subscription-url-text {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: normal;
    font-size: 2.8rem;
    color: #fff;
    margin: 0;
    padding: 0;
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.whitelist-subscription-copy-icon {
    width: 3.47rem;
    height: 3.47rem;
    margin-left: 2rem;
    flex-shrink: 0
}

.whitelist-subscription-copy-icon img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.whitelist-subscription-buttons-container {
    position: relative;
    display: flex;
    gap: 2.8rem;
    width: 100%;
    max-width: 70rem;
    justify-content: center
}

.whitelist-subscription-button-add {
    position: relative;
    background: #02c1b3;
    border: none;
    height: auto;
    aspect-ratio: 344 / 97;
    border-radius: 6.2rem;
    flex: 1;
    max-width: 35rem;
    cursor: pointer;
    transition: background .2s ease,transform .2s ease,box-shadow .2s ease;
    box-shadow: 0 0 0 .8rem #03c8ba40;
    display: flex;
    align-items: center;
    justify-content: center;
    will-change: transform;
    transform: translateZ(0)
}

.whitelist-subscription-button-add:hover {
    background: #03d4c5;
    transform: translateY(-2px) translateZ(0);
    box-shadow: 0 0 0 .8rem #03c8ba40,0 4px 20px #02c1b366
}

.whitelist-subscription-button-add-text {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: 1;
    color: #000404;
    font-size: 3.47rem;
    text-align: center;
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.whitelist-subscription-button-next {
    position: relative;
    background: #02c1b31a;
    height: auto;
    aspect-ratio: 344.186 / 96.744;
    overflow: visible;
    border-radius: 6.2rem;
    flex: 1;
    max-width: 35rem;
    cursor: pointer;
    transition: background .2s ease,transform .2s ease;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    will-change: transform;
    transform: translateZ(0)
}

.whitelist-subscription-button-next:hover {
    background: #02c1b333;
    transform: translateY(-2px) translateZ(0)
}

.whitelist-subscription-button-next-content {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    position: relative
}

.whitelist-subscription-button-next-text {
    font-family: Author,sans-serif;
    font-weight: 400;
    line-height: 1;
    font-size: 3.47rem;
    text-align: center;
    color: #fff;
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.whitelist-subscription-button-next-icon {
    width: 2.98rem;
    height: 2.98rem;
    display: flex;
    align-items: center;
    justify-content: center
}

.whitelist-subscription-button-next-icon img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.whitelist-success-screen-container {
    position: relative;
    width: 100%;
    min-height: 100vh;
    background: #000606;
    overflow-y: auto;
    overflow-x: hidden;
    margin: 0 auto;
    display: flex;
    flex-direction: column
}

.whitelist-success-bg-elements {
    position: absolute;
    left: 60%;
    top: -11.35%;
    z-index: 1
}

.whitelist-success-ellipse-1 {
    position: absolute;
    width: 69.52vw;
    height: 42.63vh;
    left: 25.11vw;
    top: 21.03vh;
    background: #03c8ba80;
    filter: blur(21.5vw)
}

.whitelist-success-ellipse-1 div,.whitelist-success-ellipse-1 img {
    display: none
}

.whitelist-success-ellipse-2 {
    position: absolute;
    width: 119.74vw;
    height: 73.45vh;
    left: 0;
    top: 0;
    background: #03c8ba80;
    mix-blend-mode: plus-lighter;
    filter: blur(26.2vw)
}

.whitelist-success-ellipse-2 div,.whitelist-success-ellipse-2 img {
    display: none
}

.whitelist-success-ellipse-3-wrapper {
    position: absolute;
    width: 42.9vw;
    height: 20.01vh;
    left: 27.59vw;
    top: -.43vh;
    background: #ffffff80;
    mix-blend-mode: plus-lighter;
    filter: blur(14.3vw);
    transform: rotate(29.076deg)
}

.whitelist-success-ellipse-3-wrapper div,.whitelist-success-ellipse-3-wrapper img {
    display: none
}

.whitelist-success-content-container {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    flex: 1;
    z-index: 10;
    padding: 8vh 2rem 2rem
}

.whitelist-success-shield-check {
    position: relative;
    width: 100%;
    max-width: 40rem;
    flex-shrink: 0;
    aspect-ratio: 402.481 / 491.02;
    z-index: 20;
    margin-top: 3.5rem
}

.whitelist-success-bottom-content {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    gap: 3.5rem;
    padding-bottom: 8rem
}

.whitelist-success-shield-check img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.whitelist-success-text-container {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.8rem;
    width: 100%;
    max-width: 62.5rem
}

.whitelist-success-title {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: normal;
    font-size: 4.96rem;
    text-align: center;
    color: #fff;
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.whitelist-success-subtitle {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: 1.3;
    font-size: 2.98rem;
    color: #ffffff80;
    text-align: center;
    margin: 0;
    padding: 0;
    max-width: 50rem
}

.whitelist-success-button-finish {
    position: relative;
    background: #02c1b3;
    border: none;
    height: auto;
    aspect-ratio: 665.88 / 96.72;
    border-radius: 6.2rem;
    width: 100%;
    max-width: 66.59rem;
    cursor: pointer;
    transition: background .2s ease,transform .2s ease,box-shadow .2s ease;
    box-shadow: 0 0 0 .8rem #03c8ba40;
    display: flex;
    align-items: center;
    justify-content: center;
    will-change: transform;
    transform: translateZ(0)
}

.whitelist-success-button-finish:hover {
    background: #03d4c5;
    transform: translateY(-2px) translateZ(0);
    box-shadow: 0 0 0 .8rem #03c8ba40,0 4px 20px #02c1b366
}

.whitelist-success-button-finish-text {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: 1;
    color: #000404;
    font-size: 3.47rem;
    text-align: center;
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.manual-setup-container {
    position: relative;
    width: 100%;
    min-height: 100vh;
    background: #000404;
    overflow-y: auto;
    overflow-x: hidden;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    padding-bottom: 10rem;
    box-sizing: border-box
}

.manual-setup-bg-elements {
    position: absolute;
    left: 50%;
    top: -11.35vh;
    transform: translate(-50%);
    z-index: 1;
    will-change: filter;
    transform: translate(-50%) translateZ(0);
    isolation: isolate
}

.manual-setup-ellipse-1 {
    position: absolute;
    width: clamp(300px,69.5vw,556.14px);
    height: clamp(300px,69.3vw,554.28px);
    left: clamp(100px,25.1vw,200.88px);
    top: clamp(150px,21.4vh,273.42px);
    background: #03c8ba80;
    filter: blur(clamp(150px,34.9vw,279px));
    will-change: filter;
    transform: translateZ(0);
    isolation: isolate
}

.manual-setup-ellipse-1 div,.manual-setup-ellipse-1 img {
    display: none
}

.manual-setup-ellipse-2 {
    position: absolute;
    width: clamp(500px,119.7vw,957.9px);
    height: clamp(500px,119.4vw,954.8px);
    left: 0;
    top: 0;
    background: #03c8ba80;
    mix-blend-mode: plus-lighter;
    filter: blur(clamp(180px,42.6vw,341px));
    will-change: filter;
    transform: translateZ(0);
    isolation: isolate
}

.manual-setup-ellipse-2 div,.manual-setup-ellipse-2 img {
    display: none
}

.manual-setup-ellipse-3-wrapper {
    position: absolute;
    width: clamp(180px,42.9vw,343.236px);
    height: clamp(140px,32.5vw,260.163px);
    left: clamp(110px,27.6vw,220.72px);
    top: clamp(-3px,-.43vh,-5.58px);
    background: #ffffff80;
    mix-blend-mode: plus-lighter;
    filter: blur(clamp(100px,23.3vw,186px));
    transform: rotate(29.076deg) translateZ(0);
    will-change: filter,transform;
    isolation: isolate
}

.manual-setup-ellipse-3-wrapper div,.manual-setup-ellipse-3-wrapper img {
    display: none
}

.manual-setup-title {
    position: relative;
    font-family: Rubik,sans-serif;
    font-weight: 400;
    line-height: normal;
    font-size: clamp(2.5rem,6.2vw,49.6px);
    color: #fff;
    text-align: center;
    margin: clamp(2rem,3vh,40px) auto clamp(1.5rem,2.3vh,30px);
    padding: 0;
    white-space: nowrap;
    z-index: 10;
    width: 100%
}

.manual-setup-subtitle {
    position: absolute;
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: 1.3;
    left: 400px;
    font-size: 29.76px;
    color: #ffffff80;
    text-align: center;
    top: 160px;
    transform: translate(-50%);
    margin: 0;
    padding: 0;
    width: 600px;
    z-index: 10
}

.manual-setup-instructions {
    position: relative;
    width: 88.2%;
    max-width: 665.88px;
    margin: 0 auto;
    padding: 0;
    z-index: 10;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch
}

.manual-setup-instructions::-webkit-scrollbar {
    width: 0px;
    background: transparent
}

.manual-setup-step {
    background: linear-gradient(180deg,#00252566,#002a2a66);
    border-radius: clamp(12px,2.5vw,20px);
    padding: clamp(1rem,2.2vw,18px) clamp(1.2rem,3vw,24px);
    margin-bottom: clamp(.6rem,1.5vw,12px);
    min-height: auto;
    display: flex;
    align-items: flex-start
}

.manual-setup-step-number {
    font-family: Rubik,sans-serif;
    font-weight: 400;
    font-size: clamp(1.3rem,3.2vw,26px);
    color: #02c1b3;
    margin-right: clamp(.6rem,1.5vw,12px);
    flex-shrink: 0;
    min-width: clamp(1.8rem,4.5vw,36px)
}

.manual-setup-step-text {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: clamp(1.3rem,3.2vw,26px);
    color: #fff;
    line-height: 1.25;
    margin: 0;
    padding-top: 2px;
    flex: 1
}

.manual-setup-step-text p {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: clamp(1.3rem,3.2vw,26px);
    color: #fff;
    line-height: 1.25;
    margin: 0
}

.manual-setup-step-text a {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: clamp(1.3rem,3.2vw,26px);
    transition: color .2s ease,opacity .2s ease
}

.manual-setup-step-text a:hover {
    color: #03d4c5;
    opacity: .8
}

.manual-setup-url-container {
    position: relative;
    width: 88.2%;
    max-width: 665.88px;
    margin: clamp(1rem,1.5vh,20px) auto clamp(1rem,1.5vh,20px);
    padding: 0;
    z-index: 10
}

.manual-setup-url-label {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: clamp(1.3rem,3.2vw,26px);
    color: #fff;
    margin: 0 0 clamp(.5rem,1.2vw,10px) 0;
    padding: 0
}

.manual-setup-url-field {
    background: #02c1b31a;
    height: clamp(50px,6.2vh,80px);
    border-radius: clamp(12px,2.5vw,20px);
    width: 100%;
    cursor: pointer;
    transition: background .2s ease;
    border: none;
    display: flex;
    align-items: center;
    padding: 0 clamp(1.5rem,4vw,32px)
}

.manual-setup-url-field:hover {
    background: #02c1b333
}

.manual-setup-url-text {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: normal;
    font-size: clamp(1.2rem,3vw,24px);
    color: #fff;
    margin: 0;
    padding: 0;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.manual-setup-copy-icon {
    width: clamp(22px,4.34vw,34.72px);
    height: clamp(22px,4.34vw,34.72px);
    margin-left: clamp(1rem,2.5vw,20px);
    flex-shrink: 0;
    color: #02c1b3
}

.manual-setup-copy-icon svg {
    width: 100%;
    height: 100%
}

.manual-setup-done-button {
    position: relative;
    width: 88.2%;
    max-width: 665.88px;
    height: clamp(50px,6.2vh,80px);
    margin: clamp(.8rem,1.2vh,16px) auto clamp(1.5rem,2.3vh,30px);
    background: #02c1b3;
    border-radius: clamp(2.5rem,6.5vw,52px);
    cursor: pointer;
    transition: background .2s ease,transform .2s ease,box-shadow .2s ease;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    box-shadow: 0 0 0 clamp(.4rem,.8vw,6px) #03c8ba40;
    will-change: transform;
    transform: translateZ(0)
}

.manual-setup-done-button:hover {
    background: #03d4c5;
    transform: translateY(-2px) translateZ(0);
    box-shadow: 0 0 0 8px #03c8ba40,0 4px 20px #02c1b366
}

.manual-setup-done-button-text {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: 1;
    font-size: clamp(1.4rem,3.6vw,29px);
    color: #000404;
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.manual-setup-back-button {
    position: absolute;
    left: 50.84px;
    width: 705.56px;
    height: 96.72px;
    background: #02c1b31a;
    border-radius: 24.8px;
    cursor: pointer;
    transition: background .2s ease,transform .2s ease;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    will-change: transform;
    transform: translateZ(0)
}

.manual-setup-back-button:hover {
    background: #02c1b333;
    transform: translateY(-2px) translateZ(0)
}

.manual-setup-back-button-text {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: 1;
    font-size: 34.72px;
    color: #fff;
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.devices-screen-container {
    position: relative;
    width: 100%;
    min-height: 100vh;
    background: #000606;
    overflow-y: auto;
    overflow-x: hidden;
    margin: 0 auto;
    display: flex;
    flex-direction: column
}

.devices-screen-container .devices-bg-elements {
    position: absolute;
    left: 60%;
    top: -11.78%;
    z-index: 1
}

.devices-screen-container .devices-ellipse-1 {
    position: absolute;
    width: 69.52vw;
    height: 42.64vh;
    left: 25.11vw;
    top: 21.45vh;
    background: #03c8ba80;
    filter: blur(21.5vw)
}

.devices-screen-container .devices-ellipse-1 .ellipse-inner,.devices-screen-container .devices-ellipse-1 img {
    display: none
}

.devices-screen-container .devices-ellipse-2 {
    position: absolute;
    width: 119.74vw;
    height: 73.45vh;
    left: 0;
    top: .43vh;
    background: #03c8ba80;
    mix-blend-mode: plus-lighter;
    filter: blur(26.2vw)
}

.devices-screen-container .devices-ellipse-2 .ellipse-inner,.devices-screen-container .devices-ellipse-2 img {
    display: none
}

.devices-screen-container .devices-ellipse-3-wrapper {
    position: absolute;
    width: 42.91vw;
    height: 20.01vh;
    left: 27.59vw;
    top: 0;
    background: #ffffff80;
    mix-blend-mode: plus-lighter;
    filter: blur(14.3vw);
    transform: rotate(29.08deg)
}

.devices-screen-container .devices-ellipse-3-rotate,.devices-screen-container .devices-ellipse-3,.devices-screen-container .devices-ellipse-3 .ellipse-inner,.devices-screen-container .devices-ellipse-3 img {
    display: none
}

.devices-content-container {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    flex: 1;
    z-index: 10;
    padding: 8vh 2rem 2rem
}

.devices-shield-container {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 46.7rem;
    flex-shrink: 0;
    aspect-ratio: 466.98 / 570.19;
    pointer-events: none
}

.devices-bottom-content {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    gap: 3.5rem;
    padding-bottom: 8rem
}

.devices-text-container {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.8rem;
    width: 100%;
    max-width: 62.5rem
}

.devices-screen-container .devices-title {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: normal;
    font-size: 4.96rem;
    text-align: center;
    color: #fff;
    margin: 0!important;
    padding: 0!important;
    white-space: nowrap
}

.devices-screen-container .devices-subtitle {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: normal;
    font-size: 2.98rem;
    text-align: center;
    color: #ffffff80;
    white-space: nowrap;
    margin: 0!important;
    padding: 0!important
}

.devices-screen-container .devices-subtitle p:first-child {
    margin-bottom: 0!important;
    margin-top: 0!important;
    padding: 0!important
}

.devices-screen-container .devices-subtitle p:last-child {
    margin: 0!important;
    padding: 0!important
}

.devices-buttons-container {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 2.8rem;
    width: 100%;
    max-width: 66.59rem
}

.devices-screen-container .devices-button-primary {
    position: relative;
    background: #02c1b3;
    border: none;
    height: auto;
    aspect-ratio: 665.88 / 96.72;
    overflow: hidden;
    border-radius: 6.2rem;
    width: 100%;
    cursor: pointer;
    transition: background .2s ease,transform .2s ease,box-shadow .2s ease;
    box-shadow: 0 0 0 .8rem #03c8ba40;
    display: flex;
    align-items: center;
    justify-content: center;
    will-change: transform;
    transform: translateZ(0)
}

.devices-screen-container .devices-button-primary:hover {
    background: #03d4c5;
    transform: translateY(-2px) translateZ(0);
    box-shadow: 0 0 0 .8rem #03c8ba40,0 4px 20px #02c1b366
}

.devices-screen-container .devices-button-primary-text {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: 1;
    color: #000404;
    font-size: 3.47rem;
    text-align: center;
    margin: 0!important;
    padding: 0!important;
    white-space: nowrap
}

.devices-screen-container .devices-button-whitelist {
    position: relative;
    background: #02c1b3;
    border: none;
    height: auto;
    aspect-ratio: 665.88 / 96.72;
    overflow: hidden;
    border-radius: 6.2rem;
    width: 100%;
    cursor: pointer;
    transition: background .2s ease,transform .2s ease,box-shadow .2s ease;
    box-shadow: 0 0 0 .8rem #03c8ba40;
    display: flex;
    align-items: center;
    justify-content: center;
    will-change: transform;
    transform: translateZ(0)
}

.devices-screen-container .devices-button-whitelist:hover {
    background: #03d4c5;
    transform: translateY(-2px) translateZ(0);
    box-shadow: 0 0 0 .8rem #03c8ba40,0 4px 20px #02c1b366
}

.devices-screen-container .devices-button-whitelist-text {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: 1;
    color: #000404;
    font-size: 3.47rem;
    text-align: center;
    margin: 0!important;
    padding: 0!important;
    white-space: nowrap
}

.devices-screen-container .devices-button-secondary {
    position: relative;
    background: #02c1b31a;
    border: none;
    height: auto;
    aspect-ratio: 665.88 / 96.72;
    overflow: hidden;
    border-radius: 6.2rem;
    width: 100%;
    cursor: pointer;
    transition: background .2s ease,transform .2s ease;
    display: flex;
    align-items: center;
    will-change: transform;
    transform: translateZ(0);
    justify-content: center
}

.devices-screen-container .devices-button-secondary:hover {
    background: #02c1b333;
    transform: translateY(-2px) translateZ(0)
}

.devices-screen-container .devices-button-secondary-text {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: 1;
    font-size: 3.47rem;
    text-align: center;
    color: #fff;
    margin: 0!important;
    padding: 0!important;
    white-space: nowrap
}

.devices-screen-container .devices-shield-vector {
    position: absolute;
    width: 100%;
    height: 100%
}

.devices-screen-container .devices-shield-vector img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.devices-screen-container .devices-shield-vector2 {
    position: absolute;
    width: 69.63%;
    height: 69.57%;
    top: 15.77%;
    left: 15.27%
}

.devices-screen-container .devices-shield-vector2 img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.devices-screen-container .devices-shield-vector3 {
    position: absolute;
    width: 86.19%;
    height: 86.1%;
    top: 6.97%;
    left: 6.87%
}

.devices-screen-container .devices-shield-vector3 img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.devices-screen-container .devices-connect-icon {
    position: absolute;
    width: 12rem;
    height: 12rem;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 20
}

.devices-screen-container .devices-connect-icon img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.analytics-screen-container {
    position: relative;
    width: 100%;
    min-height: 100vh;
    background: #000404;
    overflow-y: auto;
    overflow-x: hidden;
    margin: 0 auto;
    display: flex;
    flex-direction: column
}

.analytics-bg-elements {
    position: absolute;
    left: 60%;
    top: -11.35%;
    z-index: 1
}

.analytics-ellipse-1 {
    position: absolute;
    width: 69.52vw;
    height: 42.64vh;
    left: 25.11vw;
    top: 21.03vh;
    background: #03c8ba80;
    filter: blur(21.5vw)
}

.analytics-ellipse-1 div,.analytics-ellipse-1 img {
    display: none
}

.analytics-ellipse-2 {
    position: absolute;
    width: 119.74vw;
    height: 73.45vh;
    left: 0;
    top: 0;
    background: #03c8ba80;
    mix-blend-mode: plus-lighter;
    filter: blur(26.2vw)
}

.analytics-ellipse-2 div,.analytics-ellipse-2 img {
    display: none
}

.analytics-ellipse-3-wrapper {
    position: absolute;
    width: 42.9vw;
    height: 20.01vh;
    left: 27.59vw;
    top: -.43vh;
    background: #ffffff80;
    mix-blend-mode: plus-lighter;
    filter: blur(14.3vw);
    transform: rotate(29.076deg)
}

.analytics-ellipse-3-wrapper div,.analytics-ellipse-3-wrapper img {
    display: none
}

.analytics-title {
    position: absolute;
    font-family: Rubik,sans-serif;
    font-weight: 400;
    line-height: normal;
    left: 50%;
    transform: translate(-50%);
    font-size: 4.96rem;
    color: #fff;
    top: 6.8rem;
    margin: 0;
    padding: 0;
    white-space: nowrap;
    z-index: 10
}

.analytics-stats-card {
    position: absolute;
    background: linear-gradient(180deg,#00252566,#002a2a66);
    height: 12rem;
    left: 50%;
    transform: translate(-50%);
    overflow: hidden;
    border-radius: 2.48rem;
    width: 100%;
    max-width: 70.56rem;
    z-index: 10
}

.analytics-stats-card-1 {
    top: 15rem
}

.analytics-stats-card-2 {
    top: 28.5rem
}

.analytics-stats-card-3 {
    top: 42rem
}

.analytics-stats-card-4 {
    top: 55.5rem
}

.analytics-stats-card-5 {
    top: 69rem
}

.analytics-stats-card-6 {
    top: 82.5rem
}

.analytics-stats-label {
    position: absolute;
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: normal;
    left: 3rem;
    font-size: 2.6rem;
    color: #ffffffb3;
    top: 2rem;
    margin: 0;
    padding: 0
}

.analytics-stats-value {
    position: absolute;
    font-family: Rubik,sans-serif;
    font-weight: 400;
    line-height: normal;
    left: 3rem;
    font-size: 4.2rem;
    color: #fff;
    top: 5rem;
    margin: 0;
    padding: 0
}

.analytics-withdraw-button {
    position: absolute;
    height: 11.16rem;
    left: 50%;
    transform: translate(-50%);
    overflow: hidden;
    border-radius: 2.48rem;
    width: 100%;
    max-width: 70.56rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    z-index: 10;
    top: 97rem
}

.analytics-withdraw-button-active {
    background: linear-gradient(90deg,#0ac9bb80 0% 100%),linear-gradient(180deg,#00252566,#002a2a66)
}

.analytics-withdraw-button-active:active {
    background: linear-gradient(90deg,#0ac9bb99 0% 100%),linear-gradient(180deg,#002a2a80,#002f2f80)
}

.analytics-withdraw-button-disabled {
    background: linear-gradient(180deg,#0025254d,#002a2a4d);
    cursor: not-allowed;
    opacity: .6
}

.analytics-withdraw-text {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: normal;
    font-size: 3.2rem;
    color: #fff;
    margin: 0;
    padding: 0;
    text-align: center
}

@font-face {
    font-family: Author;
    font-style: normal;
    font-weight: 400;
    src: local("Author Regular"),local("Author-Regular");
    font-display: swap
}

@font-face {
    font-family: Author;
    font-style: normal;
    font-weight: 500;
    src: local("Author Medium"),local("Author-Medium");
    font-display: swap
}

.whitelist-screen-container {
    position: relative;
    width: 100%;
    min-height: 100vh;
    background: #000606;
    overflow-y: auto;
    overflow-x: hidden;
    margin: 0 auto;
    display: flex;
    flex-direction: column
}

.whitelist-screen-container .bg-elements {
    position: absolute;
    left: 60%;
    top: -11.78%;
    z-index: 1
}

.whitelist-screen-container .ellipse-1 {
    position: absolute;
    width: 69.52vw;
    height: 42.64vh;
    left: 25.11vw;
    top: 21.45vh;
    background: #03c8ba80;
    filter: blur(21.5vw)
}

.whitelist-screen-container .ellipse-1 .ellipse-inner,.whitelist-screen-container .ellipse-1 img {
    display: none
}

.whitelist-screen-container .ellipse-2 {
    position: absolute;
    width: 119.74vw;
    height: 73.45vh;
    left: 0;
    top: .43vh;
    background: #03c8ba80;
    mix-blend-mode: plus-lighter;
    filter: blur(26.2vw)
}

.whitelist-screen-container .ellipse-2 .ellipse-inner,.whitelist-screen-container .ellipse-2 img {
    display: none
}

.whitelist-screen-container .ellipse-3-wrapper {
    position: absolute;
    width: 42.91vw;
    height: 20.01vh;
    left: 27.59vw;
    top: 0;
    background: #ffffff80;
    mix-blend-mode: plus-lighter;
    filter: blur(14.3vw);
    transform: rotate(29.08deg)
}

.whitelist-screen-container .ellipse-3-rotate,.whitelist-screen-container .ellipse-3,.whitelist-screen-container .ellipse-3 .ellipse-inner,.whitelist-screen-container .ellipse-3 img {
    display: none
}

.whitelist-screen-container .v-logo {
    position: absolute;
    top: 17.36%;
    left: 50%;
    transform: translate(-50%);
    width: 39.29%;
    max-width: 314.32px;
    height: auto;
    aspect-ratio: 314.32 / 159.64;
    z-index: 1000
}

.whitelist-screen-container .v-logo img {
    display: block;
    width: 100%;
    height: 100%;
    filter: brightness(1.5) contrast(1.2);
    opacity: 1;
    object-fit: contain;
    pointer-events: none
}

.whitelist-screen-container .content-container {
    position: absolute;
    background: linear-gradient(to bottom,#00252566,#002a2a66);
    border-radius: 2.48rem;
    width: calc(100% - 4rem);
    max-width: 70.56rem;
    left: 50%;
    transform: translate(-50%);
    top: 45vh;
    bottom: 8rem;
    z-index: 10;
    padding: 5rem 6.5rem 6rem;
    display: flex;
    flex-direction: column;
    gap: 0
}

.whitelist-screen-container .vpnus-title {
    font-family: Rubik,sans-serif;
    font-weight: 500;
    font-style: normal;
    line-height: normal;
    font-size: 6.8rem;
    color: #fff;
    margin: 0;
    padding: 0;
    align-self: flex-start
}

.whitelist-screen-container .balance-expire-wrapper {
    position: relative;
    width: 100%;
    margin-top: 2rem
}

.whitelist-screen-container .balance-expire-container {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%
}

.whitelist-screen-container .balance-section {
    position: relative;
    font-family: Rubik,sans-serif;
    font-weight: 400;
    line-height: normal;
    font-style: normal;
    display: flex;
    flex-direction: column;
    gap: .5rem
}

.whitelist-screen-container .balance-amount {
    position: relative;
    font-family: Rubik,sans-serif;
    font-weight: 400;
    font-size: 3.97rem;
    color: #fff;
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.whitelist-screen-container .balance-label {
    position: relative;
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: 2.98rem;
    color: #ffffff80;
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.whitelist-screen-container .expire-section {
    position: relative;
    font-family: Rubik,sans-serif;
    font-weight: 400;
    line-height: normal;
    font-style: normal;
    text-align: right;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: .5rem
}

.whitelist-screen-container .expire-date {
    position: relative;
    font-family: Rubik,sans-serif;
    font-weight: 400;
    font-size: 3.97rem;
    color: #fff;
    margin: 0;
    padding: 0;
    white-space: nowrap;
    letter-spacing: -.2rem
}

.whitelist-screen-container .expire-label {
    position: relative;
    font-family: Rubik,sans-serif;
    font-weight: 300;
    color: #ffffff80;
    font-size: 2.98rem;
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.whitelist-screen-container .traffic-section {
    position: absolute;
    right: 6rem;
    top: 3rem;
    width: 36%;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: .5rem
}

.whitelist-screen-container .traffic-progress {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: .5rem
}

.whitelist-screen-container .traffic-amount-container {
    display: flex;
    justify-content: flex-end
}

.whitelist-screen-container .traffic-amount {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: normal;
    font-size: 2rem;
    color: #fff;
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.whitelist-screen-container .traffic-progress-background {
    position: relative;
    background: #ececec;
    height: 1rem;
    width: 100%;
    border-radius: 1.2rem
}

.whitelist-screen-container .traffic-label {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: normal;
    font-size: 2.4rem;
    color: #ffffff80;
    margin: 0;
    padding: 0;
    white-space: nowrap;
    text-align: right
}

.whitelist-screen-container .traffic-progress-fill {
    position: absolute;
    background: #02c1b3;
    height: 1rem;
    left: 0;
    bottom: 0;
    border-radius: 1.2rem;
    width: 93%
}

.whitelist-screen-container .button-purchase {
    background: #02c1b3;
    border: .21rem solid #03c8ba;
    border-radius: 7.04rem;
    width: 100%;
    max-width: 581.56px;
    height: auto;
    aspect-ratio: 581.56 / 96.72;
    cursor: pointer;
    transition: background .2s ease,transform .2s ease,box-shadow .2s ease;
    margin-top: 3rem;
    align-self: center;
    will-change: transform;
    transform: translateZ(0)
}

.whitelist-screen-container .button-purchase .button-inner {
    height: 100%;
    overflow: hidden;
    position: relative;
    border-radius: inherit;
    width: 100%
}

.whitelist-screen-container .button-purchase .button-text {
    position: absolute;
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: normal;
    left: 50%;
    font-style: normal;
    color: #000404;
    font-size: 3.4rem;
    text-align: center;
    top: 30%;
    transform: translate(-50%);
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.whitelist-screen-container .button-ellipse {
    position: absolute;
    height: 60.26%;
    left: 17.48%;
    top: 96.82%;
    width: 66.43%
}

.whitelist-screen-container .button-ellipse .ellipse-inner {
    position: absolute;
    inset: -153.19% -23.11%
}

.whitelist-screen-container .button-ellipse img {
    display: block;
    max-width: none;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.whitelist-screen-container .button-icon-left {
    position: absolute;
    left: 6.55%;
    width: 6.18%;
    height: 37.18%;
    top: 31.02%
}

.whitelist-screen-container .button-icon-left img {
    display: block;
    max-width: none;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.whitelist-screen-container .button-icon-right {
    position: absolute;
    left: 88.72%;
    width: 5.12%;
    height: 30.77%;
    top: 34.62%
}

.whitelist-screen-container .button-icon-right img {
    display: block;
    max-width: none;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.whitelist-screen-container .button-connect {
    background: #02c1b31a;
    border: .21rem solid #03c8ba;
    border-radius: 7.04rem;
    width: 100%;
    max-width: 581.56px;
    height: auto;
    aspect-ratio: 581.56 / 96.72;
    cursor: pointer;
    transition: background .2s ease,transform .2s ease;
    margin-top: 2.5rem;
    align-self: center;
    will-change: transform;
    transform: translateZ(0)
}

.whitelist-screen-container .button-connect .button-inner {
    height: 100%;
    overflow: hidden;
    position: relative;
    border-radius: inherit;
    width: 100%
}

.whitelist-screen-container .button-connect .button-text {
    position: absolute;
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: normal;
    left: 50%;
    font-style: normal;
    font-size: 3.4rem;
    text-align: center;
    color: #fff;
    top: 30%;
    transform: translate(-50%);
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.whitelist-screen-container .connect-icon-1 {
    position: absolute;
    left: 7.41%;
    width: 4.48%;
    height: 32.69%;
    top: 31.02%
}

.whitelist-screen-container .connect-icon-1 img {
    display: block;
    max-width: none;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.whitelist-screen-container .connect-icon-2 {
    position: absolute;
    left: 90.15%;
    width: 2.66%;
    height: 27.69%;
    top: 35.9%
}

.whitelist-screen-container .connect-icon-2 img {
    display: block;
    max-width: none;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.whitelist-screen-container .small-buttons-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin-top: 2.5rem;
    gap: 2rem
}

.whitelist-screen-container .button-profile {
    background: #02c1b31a;
    border: .21rem solid #03c8ba;
    border-radius: 7.04rem;
    width: 100%;
    max-width: 275.9px;
    height: auto;
    aspect-ratio: 275.9 / 96.72;
    cursor: pointer;
    transition: background .2s ease,transform .2s ease;
    will-change: transform;
    transform: translateZ(0)
}

.whitelist-screen-container .button-profile .button-inner-small {
    height: 100%;
    overflow: hidden;
    position: relative;
    border-radius: inherit;
    width: 100%
}

.whitelist-screen-container .button-profile .button-text {
    position: absolute;
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: normal;
    left: 55.7%;
    font-style: normal;
    font-size: 3.2rem;
    text-align: center;
    color: #fff;
    top: 30.48%;
    transform: translate(-50%);
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.whitelist-screen-container .profile-icon {
    position: absolute;
    left: 14.14%;
    width: 13.94%;
    height: 39.75%;
    top: 30.48%
}

.whitelist-screen-container .profile-icon img {
    display: block;
    max-width: none;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.whitelist-screen-container .button-support {
    background: #02c1b31a;
    border: .21rem solid #03c8ba;
    border-radius: 7.04rem;
    width: 100%;
    max-width: 275.9px;
    height: auto;
    aspect-ratio: 275.9 / 96.72;
    cursor: pointer;
    transition: background .2s ease,transform .2s ease;
    will-change: transform;
    transform: translateZ(0)
}

.whitelist-screen-container .button-support .button-inner-small {
    height: 100%;
    overflow: hidden;
    position: relative;
    border-radius: inherit;
    width: 100%
}

.whitelist-screen-container .button-text-support {
    position: absolute;
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: normal;
    left: 25.9%;
    font-style: normal;
    font-size: 3.2rem;
    color: #fff;
    top: 30.48%;
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.whitelist-screen-container .support-icon {
    position: absolute;
    left: 10.31%;
    width: 9.76%;
    height: 27.78%;
    top: 36.68%
}

.whitelist-screen-container .support-icon img {
    display: block;
    max-width: none;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.whitelist-screen-container .button-purchase:hover {
    background: #03d4c5;
    transform: translateY(-2px)
}

.whitelist-screen-container .button-connect:hover,.whitelist-screen-container .button-profile:hover,.whitelist-screen-container .button-support:hover {
    background: #02c1b333;
    transform: translateY(-2px)
}

.whitelist-purchase-container {
    position: relative;
    width: 100%;
    min-height: 100vh;
    background: #000404;
    overflow-y: auto;
    overflow-x: hidden;
    margin: 0 auto
}

.whitelist-purchase-container .bg-elements {
    position: absolute;
    left: 60%;
    top: -11.78%;
    z-index: 1;
    pointer-events: none
}

.whitelist-purchase-container .ellipse-1 {
    position: absolute;
    width: 69.52vw;
    height: 42.63vh;
    left: 25.11vw;
    top: 21.45vh;
    background: #03c8ba66;
    filter: blur(50px)
}

.whitelist-purchase-container .ellipse-2 {
    position: absolute;
    width: 119.74vw;
    height: 73.45vh;
    left: 0;
    top: .43vh;
    background: #03c8ba66;
    mix-blend-mode: plus-lighter;
    filter: blur(60px)
}

.whitelist-purchase-container .ellipse-3-wrapper {
    position: absolute;
    width: 42.91vw;
    height: 20.01vh;
    left: 27.59vw;
    top: 0;
    background: #fff6;
    mix-blend-mode: plus-lighter;
    filter: blur(40px);
    transform: rotate(29.08deg)
}

.whitelist-purchase-container .v-logo {
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    top: 6.27%;
    width: 12.17%;
    max-width: 97.36px;
    height: auto;
    aspect-ratio: 97.36 / 39.45;
    z-index: 1000
}

.whitelist-purchase-container .v-logo img {
    display: block;
    max-width: none;
    width: 100%;
    height: 100%;
    filter: brightness(1.5) contrast(1.2);
    opacity: 1;
    object-fit: contain;
    pointer-events: none
}

.whitelist-purchase-container .content-section {
    position: absolute;
    left: 8.375%;
    top: 13.92%;
    width: 83.25%;
    display: flex;
    flex-direction: column;
    z-index: 10
}

.whitelist-purchase-container .header-container {
    position: relative;
    width: 54.875%;
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: normal;
    margin-bottom: 3rem
}

.whitelist-purchase-container .header-title {
    position: relative;
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: 4.96rem;
    color: #fff;
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.whitelist-purchase-container .header-subtitle {
    position: relative;
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: 2.98rem;
    color: #ffffff80;
    margin: 1.2rem 0 0;
    padding: 0
}

.whitelist-purchase-container .tariffs-wrapper {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
    margin-top: 0
}

.whitelist-purchase-container .tariff-card {
    position: relative;
    background: #02c1b31a;
    border: .19rem solid transparent;
    height: auto;
    aspect-ratio: 666.05 / 133.95;
    border-radius: 12.4rem;
    width: 100%;
    max-width: 666.05px;
    cursor: pointer;
    overflow: hidden;
    flex-shrink: 0;
    box-sizing: border-box
}

.whitelist-purchase-container .tariff-card.selected {
    border-color: #03c8ba;
    background: #02c1b333
}

.whitelist-purchase-container .tariff-card-inner {
    position: relative;
    width: 100%;
    height: 100%
}

.whitelist-purchase-container .plan-container {
    position: absolute;
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: normal;
    left: 3.5rem;
    top: 3.22rem;
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
    height: 7.1rem
}

.whitelist-purchase-container .tariff-amount {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: 5.95rem;
    color: #fff;
    margin: 0;
    padding: 0;
    width: 9rem;
    text-align: right;
    line-height: 1
}

.whitelist-purchase-container .tariff-labels {
    display: flex;
    flex-direction: column
}

.whitelist-purchase-container .tariff-label {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: 2.98rem;
    color: #fff;
    margin: 0;
    padding: 0;
    line-height: 1.2
}

.whitelist-purchase-container .tariff-price-per-gb {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: 2.98rem;
    color: #ffffff80;
    margin: 0;
    padding: 0;
    line-height: 1.2;
    white-space: nowrap
}

.whitelist-purchase-container .tariff-price {
    position: absolute;
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: 3.97rem;
    text-align: right;
    color: #fff;
    top: 33.3%;
    right: 13.2%;
    margin: 0;
    padding: 0
}

.whitelist-purchase-container .tariff-with-badge {
    position: relative;
    width: 100%
}

.whitelist-purchase-container .popular-badge {
    position: absolute;
    background: #02c1b3;
    height: auto;
    aspect-ratio: 150.08 / 33.49;
    left: 50%;
    transform: translate(-50%) translateY(50%);
    overflow: hidden;
    border-radius: 6.2rem;
    bottom: 0;
    width: 18.76%;
    max-width: 150.08px;
    z-index: 10
}

.whitelist-purchase-container .popular-badge-text {
    position: absolute;
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: normal;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    color: #000404;
    font-size: 1.49rem;
    text-align: center;
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.whitelist-purchase-container .bottom-section {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-top: 3rem
}

.whitelist-purchase-container .balance-info {
    position: relative;
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: 3.8rem;
    color: #fff;
    margin: 0;
    padding: 0
}

.whitelist-purchase-container .payment-method-hint {
    position: relative;
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: 2.98rem;
    color: #ffffff80;
    margin: 0;
    padding: 0
}

.whitelist-purchase-container .payment-button {
    position: relative;
    background: #02c1b3;
    height: auto;
    aspect-ratio: 666.05 / 96.74;
    overflow: hidden;
    border-radius: 6.2rem;
    width: 100%;
    max-width: 666.05px;
    cursor: pointer;
    border: none;
    margin-top: 2.5rem
}

.whitelist-purchase-container .payment-button.disabled {
    opacity: .6;
    pointer-events: none
}

.whitelist-purchase-container .payment-button-text {
    position: absolute;
    font-family: Rubik,sans-serif;
    font-weight: 300;
    line-height: normal;
    left: 50%;
    transform: translate(-50%);
    font-size: 3.5rem;
    color: #000;
    text-align: center;
    top: 27.9%;
    margin: 0;
    padding: 0;
    white-space: nowrap
}

.whitelist-purchase-container .payment-dialog-overlay {
    position: fixed;
    inset: 0;
    background: #000000b3;
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2000
}

.whitelist-purchase-container .payment-dialog-container {
    background: #000404;
    border-radius: 2rem;
    width: 90%;
    max-width: 500px;
    padding: 3rem 2.5rem;
    box-shadow: 0 0 40px #03c8ba33;
    border: .15rem solid rgba(3,200,186,.2)
}

.whitelist-purchase-container .payment-dialog-header {
    margin-bottom: 2.5rem
}

.whitelist-purchase-container .payment-dialog-title {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: 3.2rem;
    color: #fff;
    text-align: center;
    margin: 0;
    padding: 0
}

.whitelist-purchase-container .payment-methods-list {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    margin-bottom: 2.5rem
}

.whitelist-purchase-container .payment-method-button {
    background: #02c1b31a;
    border: .15rem solid transparent;
    border-radius: 1.5rem;
    padding: 2rem 2.5rem;
    cursor: pointer
}

.whitelist-purchase-container .payment-method-content {
    position: relative;
    z-index: 1
}

.whitelist-purchase-container .payment-method-title {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: 2.4rem;
    color: #fff;
    margin: 0 0 .5rem;
    padding: 0
}

.whitelist-purchase-container .payment-method-subtitle {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: 1.6rem;
    color: #ffffff80;
    margin: 0;
    padding: 0
}

.whitelist-purchase-container .payment-dialog-cancel {
    width: 100%;
    background: transparent;
    border: .15rem solid rgba(255,255,255,.2);
    border-radius: 1.5rem;
    padding: 1.8rem;
    cursor: pointer
}

.whitelist-purchase-container .payment-dialog-cancel-text {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: 2.2rem;
    color: #fff;
    margin: 0;
    padding: 0;
    text-align: center
}

.giveaway-screen-container {
    position: relative;
    width: 100%;
    height: 100vh;
    background: #000606;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    padding: 10rem 6%;
    box-sizing: border-box;
    gap: 2.5rem
}

.giveaway-bg-elements {
    position: absolute;
    left: 60%;
    top: -11.78%;
    z-index: 0;
    pointer-events: none
}

.giveaway-ellipse-1 {
    position: absolute;
    width: 69.52vw;
    height: 42.63vh;
    left: 25.11vw;
    top: 21.45vh;
    background: #03c8ba80;
    filter: blur(21.5vw);
    will-change: filter;
    transform: translateZ(0);
    isolation: isolate
}

.giveaway-ellipse-2 {
    position: absolute;
    width: 119.74vw;
    height: 73.45vh;
    left: 0;
    top: .43vh;
    background: #03c8ba80;
    mix-blend-mode: plus-lighter;
    filter: blur(26.2vw);
    will-change: filter;
    transform: translateZ(0);
    isolation: isolate
}

.giveaway-ellipse-3 {
    position: absolute;
    width: 42.91vw;
    height: 20.01vh;
    left: 29.99vw;
    top: 0;
    background: #ffffff80;
    mix-blend-mode: plus-lighter;
    filter: blur(14.3vw);
    transform: rotate(29.08deg) translateZ(0);
    will-change: filter,transform;
    isolation: isolate
}

.giveaway-loading {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    color: #fff;
    font-family: Rubik,sans-serif;
    font-size: 2.4rem;
    z-index: 10
}

.giveaway-header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.2rem;
    z-index: 1;
    flex-shrink: 0
}

.giveaway-header-icon {
    font-size: 4rem
}

.giveaway-title {
    font-family: Rubik,sans-serif;
    font-weight: 500;
    font-size: 3.8rem;
    color: #fff;
    margin: 0
}

.giveaway-prize {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    z-index: 1;
    flex-shrink: 0
}

.giveaway-prize-label {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: 2.4rem;
    color: #ffffffb3
}

.giveaway-prize-amount {
    font-family: Rubik,sans-serif;
    font-weight: 500;
    font-size: 3.5rem;
    color: #02c1b3
}

.giveaway-timer {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .8rem;
    background: #ffc10726;
    border: 1px solid rgba(255,193,7,.3);
    border-radius: 1.5rem;
    padding: 1rem 2rem;
    z-index: 1;
    flex-shrink: 0;
    align-self: center
}

.giveaway-timer-icon {
    font-size: 2rem
}

.giveaway-timer-text {
    font-family: Rubik,sans-serif;
    font-weight: 400;
    font-size: 2.2rem;
    color: #ffc107
}

.giveaway-user-stats {
    display: flex;
    gap: 2rem;
    width: 100%;
    z-index: 1;
    flex-shrink: 0
}

.giveaway-stat-card {
    flex: 1;
    background: #02c1b31a;
    border: 1px solid rgba(2,193,179,.2);
    border-radius: 1.5rem;
    padding: 1.2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .3rem
}

.giveaway-stat-value {
    font-family: Rubik,sans-serif;
    font-weight: 500;
    font-size: 3rem;
    color: #fff;
    margin: 0
}

.giveaway-stat-label {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: 2rem;
    color: #fff9;
    margin: 0
}

.giveaway-leaderboard {
    width: 100%;
    flex: 1;
    min-height: 0;
    background: #02c1b30d;
    border: 1px solid rgba(2,193,179,.15);
    border-radius: 2rem;
    padding: 1.2rem;
    z-index: 1;
    display: flex;
    flex-direction: column
}

.giveaway-leaderboard-title {
    font-family: Rubik,sans-serif;
    font-weight: 500;
    font-size: 2.4rem;
    color: #fff;
    margin: 0 0 1rem;
    text-align: center;
    flex-shrink: 0
}

.giveaway-leaderboard-list {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    overflow-y: auto;
    flex: 1;
    padding-right: .5rem
}

.giveaway-leaderboard-list::-webkit-scrollbar {
    width: 3px
}

.giveaway-leaderboard-list::-webkit-scrollbar-track {
    background: #ffffff1a;
    border-radius: 2px
}

.giveaway-leaderboard-list::-webkit-scrollbar-thumb {
    background: #02c1b380;
    border-radius: 2px
}

.giveaway-leaderboard-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .8rem 1.2rem;
    background: #ffffff08;
    border-radius: 1rem;
    flex-shrink: 0
}

.giveaway-leaderboard-item-current {
    background: #02c1b333;
    border: 1px solid rgba(2,193,179,.4)
}

.giveaway-leaderboard-rank {
    display: flex;
    align-items: center;
    gap: .8rem
}

.giveaway-leaderboard-icon {
    font-size: 1.8rem
}

.giveaway-leaderboard-position {
    font-family: Rubik,sans-serif;
    font-weight: 400;
    font-size: 2rem;
    color: #ffffffe6
}

.giveaway-leaderboard-invites {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: 1.8rem;
    color: #fff
}

.giveaway-bottom-section {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 2rem;
    z-index: 1;
    flex-shrink: 0
}

.giveaway-details-link {
    font-family: Rubik,sans-serif;
    font-weight: 400;
    font-size: 2.2rem;
    color: #02c1b3;
    background: none;
    border: none;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
    align-self: center
}

.giveaway-details-link:active {
    opacity: .7
}

.giveaway-referral-link {
    position: relative;
    background: #02c1b31a;
    height: auto;
    aspect-ratio: 711.938 / 96.744;
    overflow: visible;
    border-radius: 6.2rem;
    width: 100%;
    max-width: 70rem;
    cursor: pointer;
    border: none;
    display: flex;
    align-items: center;
    padding: 0 4.5rem
}

.giveaway-referral-link:active {
    background: #02c1b333
}

.giveaway-referral-url {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: 2.8rem;
    color: #fff;
    margin: 0;
    padding: 0;
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.giveaway-referral-copy {
    width: 3.47rem;
    height: 3.47rem;
    margin-left: 2rem;
    flex-shrink: 0
}

.giveaway-referral-copy img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.giveaway-copied-tooltip {
    position: absolute;
    top: -3rem;
    left: 50%;
    transform: translate(-50%);
    background: #02c1b3;
    color: #000404;
    font-family: Rubik,sans-serif;
    font-weight: 400;
    font-size: 1.8rem;
    padding: .6rem 1.5rem;
    border-radius: 1rem;
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease;
    white-space: nowrap
}

.giveaway-copied-tooltip-visible {
    opacity: 1
}

.giveaway-invite-btn {
    width: 100%;
    background: #02c1b3;
    border: none;
    border-radius: 5rem;
    padding: 1.8rem;
    font-family: Rubik,sans-serif;
    font-weight: 400;
    font-size: 2.6rem;
    color: #000404;
    cursor: pointer;
    box-shadow: 0 0 0 .6rem #03c8ba40
}

.giveaway-invite-btn:active {
    background: #03d4c5
}

.contest-screen-container {
    position: relative;
    width: 100%;
    height: 100vh;
    background: #000606;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    padding: 10rem 6%;
    box-sizing: border-box;
    gap: 2.5rem
}

.contest-bg-elements {
    position: absolute;
    left: 60%;
    top: -11.78%;
    z-index: 0;
    pointer-events: none
}

.contest-ellipse-1 {
    position: absolute;
    width: 69.52vw;
    height: 42.63vh;
    left: 25.11vw;
    top: 21.45vh;
    background: #03c8ba80;
    filter: blur(21.5vw);
    will-change: filter;
    transform: translateZ(0);
    isolation: isolate
}

.contest-ellipse-2 {
    position: absolute;
    width: 119.74vw;
    height: 73.45vh;
    left: 0;
    top: .43vh;
    background: #03c8ba80;
    mix-blend-mode: plus-lighter;
    filter: blur(26.2vw);
    will-change: filter;
    transform: translateZ(0);
    isolation: isolate
}

.contest-ellipse-3 {
    position: absolute;
    width: 42.91vw;
    height: 20.01vh;
    left: 29.99vw;
    top: 0;
    background: #ffffff80;
    mix-blend-mode: plus-lighter;
    filter: blur(14.3vw);
    transform: rotate(29.08deg) translateZ(0);
    will-change: filter,transform;
    isolation: isolate
}

.contest-loading {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    color: #fff;
    font-family: Rubik,sans-serif;
    font-size: 2.4rem;
    z-index: 10
}

.contest-header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.2rem;
    z-index: 1;
    flex-shrink: 0
}

.contest-header-icon {
    font-size: 4rem
}

.contest-title {
    font-family: Rubik,sans-serif;
    font-weight: 500;
    font-size: 3.8rem;
    color: #fff;
    margin: 0
}

.contest-timer {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .8rem;
    background: #ffc10726;
    border: 1px solid rgba(255,193,7,.3);
    border-radius: 1.5rem;
    padding: 1rem 2rem;
    z-index: 1;
    flex-shrink: 0;
    align-self: center
}

.contest-timer-icon {
    font-size: 2rem
}

.contest-timer-text {
    font-family: Rubik,sans-serif;
    font-weight: 400;
    font-size: 2.2rem;
    color: #ffc107
}

.contest-stats {
    display: flex;
    gap: 1.5rem;
    width: 100%;
    z-index: 1;
    flex-shrink: 0
}

.contest-stat-card {
    flex: 1;
    background: #02c1b31a;
    border: 1px solid rgba(2,193,179,.2);
    border-radius: 1.5rem;
    padding: 2rem 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: .5rem
}

.contest-stat-value {
    font-family: Rubik,sans-serif;
    font-weight: 500;
    font-size: 3.6rem;
    color: #fff;
    margin: 0
}

.contest-stat-chance {
    font-family: Rubik,sans-serif;
    font-weight: 500;
    font-size: 2rem;
    color: #02c1b3;
    margin: auto 0 0;
    text-align: center;
    line-height: 1.2;
    flex: 1;
    display: flex;
    align-items: center
}

.contest-stat-label {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: 2rem;
    color: #fff9;
    margin: 0;
    text-align: center
}

.contest-leaderboard {
    width: 100%;
    background: #02c1b30d;
    border: 1px solid rgba(2,193,179,.15);
    border-radius: 2rem;
    padding: 1.8rem;
    z-index: 1;
    display: flex;
    flex-direction: column
}

.contest-leaderboard-title {
    font-family: Rubik,sans-serif;
    font-weight: 500;
    font-size: 2.8rem;
    color: #fff;
    margin: 0 0 1.5rem;
    text-align: center;
    flex-shrink: 0
}

.contest-leaderboard-list {
    display: flex;
    flex-direction: column;
    gap: .8rem
}

.contest-leaderboard-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.2rem 1.5rem;
    background: #ffffff08;
    border-radius: 1.2rem;
    flex-shrink: 0
}

.contest-leaderboard-item-current {
    background: #02c1b333;
    border: 1px solid rgba(2,193,179,.4)
}

.contest-leaderboard-left {
    display: flex;
    align-items: center;
    gap: 1rem
}

.contest-leaderboard-icon {
    font-size: 2.2rem
}

.contest-leaderboard-position {
    font-family: Rubik,sans-serif;
    font-weight: 400;
    font-size: 2.4rem;
    color: #ffffffe6
}

.contest-leaderboard-prize {
    font-family: Rubik,sans-serif;
    font-weight: 500;
    font-size: 2.2rem;
    color: #02c1b3
}

.contest-leaderboard-tickets {
    font-family: Rubik,sans-serif;
    font-weight: 400;
    font-size: 2.2rem;
    color: #fff;
    white-space: nowrap
}

.contest-leaderboard-divider {
    height: 1px;
    background: #02c1b333;
    margin: .4rem 0
}

.contest-bottom-section {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 2rem;
    z-index: 1;
    flex-shrink: 0;
    margin-top: auto
}

.contest-details-link {
    font-family: Rubik,sans-serif;
    font-weight: 400;
    font-size: 2.2rem;
    color: #02c1b3;
    background: none;
    border: none;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
    align-self: center
}

.contest-details-link:active {
    opacity: .7
}

.contest-referral-link {
    position: relative;
    background: #02c1b31a;
    height: auto;
    aspect-ratio: 711.938 / 96.744;
    overflow: visible;
    border-radius: 6.2rem;
    width: 100%;
    max-width: 70rem;
    cursor: pointer;
    border: none;
    display: flex;
    align-items: center;
    padding: 0 4.5rem
}

.contest-referral-link:active {
    background: #02c1b333
}

.contest-referral-url {
    font-family: Rubik,sans-serif;
    font-weight: 300;
    font-size: 2.8rem;
    color: #fff;
    margin: 0;
    padding: 0;
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.contest-referral-copy {
    width: 3.47rem;
    height: 3.47rem;
    margin-left: 2rem;
    flex-shrink: 0
}

.contest-referral-copy img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none
}

.contest-copied-tooltip {
    position: absolute;
    top: -3rem;
    left: 50%;
    transform: translate(-50%);
    background: #02c1b3;
    color: #000404;
    font-family: Rubik,sans-serif;
    font-weight: 400;
    font-size: 1.8rem;
    padding: .6rem 1.5rem;
    border-radius: 1rem;
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease;
    white-space: nowrap
}

.contest-copied-tooltip-visible {
    opacity: 1
}

.contest-invite-btn {
    width: 100%;
    background: #02c1b3;
    border: none;
    border-radius: 5rem;
    padding: 1.8rem;
    font-family: Rubik,sans-serif;
    font-weight: 400;
    font-size: 2.6rem;
    color: #000404;
    cursor: pointer;
    box-shadow: 0 0 0 .6rem #03c8ba40
}

.contest-invite-btn:active {
    background: #03d4c5
}

.contest-results-mode {
    overflow-y: auto;
    height: auto;
    min-height: 100vh;
    padding-bottom: 4rem
}

.contest-win-block {
    width: 100%;
    background: #02c1b31a;
    border: 1px solid rgba(2,193,179,.3);
    border-radius: 2rem;
    padding: 2rem;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 1.2rem
}

.contest-win-title {
    font-family: Rubik,sans-serif;
    font-weight: 500;
    font-size: 2.8rem;
    color: #02c1b3;
    margin: 0;
    text-align: center
}

.contest-win-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #ffffff0d;
    border-radius: 1.2rem;
    padding: 1.2rem 1.5rem;
    gap: 1rem
}

.contest-win-ticket {
    font-family: Rubik,sans-serif;
    font-weight: 400;
    font-size: 2rem;
    color: #ffffffb3
}

.contest-win-place {
    font-family: Rubik,sans-serif;
    font-weight: 400;
    font-size: 2rem;
    color: #ffffff80
}

.contest-win-prize {
    font-family: Rubik,sans-serif;
    font-weight: 500;
    font-size: 2.2rem;
    color: #02c1b3
}

.contest-claim-btn {
    width: 100%;
    background: #02c1b3;
    border: none;
    border-radius: 5rem;
    padding: 1.8rem;
    font-family: Rubik,sans-serif;
    font-weight: 500;
    font-size: 2.6rem;
    color: #000404;
    cursor: pointer;
    margin-top: .5rem;
    box-shadow: 0 0 0 .6rem #03c8ba40
}

.contest-claim-btn:active {
    background: #03d4c5
}

.contest-no-win-block {
    width: 100%;
    background: #ffffff0d;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 2rem;
    padding: 2rem;
    z-index: 1
}

.contest-no-win-text {
    font-family: Rubik,sans-serif;
    font-weight: 400;
    font-size: 2.2rem;
    color: #ffffffb3;
    margin: 0;
    text-align: center;
    line-height: 1.4
}

.contest-tickets-block {
    width: 100%;
    z-index: 1
}

.contest-section-title {
    font-family: Rubik,sans-serif;
    font-weight: 500;
    font-size: 2.6rem;
    color: #fff;
    margin: 0 0 1.2rem
}

.contest-tickets-grid {
    display: flex;
    flex-wrap: wrap;
    gap: .8rem
}

.contest-ticket-chip {
    font-family: Rubik,sans-serif;
    font-weight: 400;
    font-size: 1.8rem;
    color: #fff9;
    background: #ffffff0f;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 1rem;
    padding: .6rem 1.2rem
}

.contest-ticket-chip-won {
    color: #02c1b3;
    background: #02c1b326;
    border-color: #02c1b366;
    font-weight: 500
}

.grainient-container {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden
}

@font-face {
    font-family: Fixel Display;
    src: url(/fonts/FixelDisplay-Regular.woff2) format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Fixel Display;
    src: url(/fonts/FixelDisplay-Medium.woff2) format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Fixel Display;
    src: url(/fonts/FixelDisplay-SemiBold.woff2) format("woff2");
    font-weight: 600;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Fixel Display;
    src: url(/fonts/FixelDisplay-Bold.woff2) format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box
}

html {
    width: 100%;
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    font-size: 1.25vw
}

@media (min-width: 600px) {
    html {
        font-size:6px
    }
}

body {
    font-family: Fixel Display,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background: #000;
    width: 100%;
    min-height: 100vh;
    min-height: 100dvh;
    color: #fff;
    overflow-y: auto;
    overflow-x: hidden;
    margin: 0;
    padding: 0;
    padding-top: env(safe-area-inset-top,0px);
    padding-bottom: env(safe-area-inset-bottom,0px);
    padding-left: env(safe-area-inset-left,0px);
    padding-right: env(safe-area-inset-right,0px)
}

#root {
    width: 100%;
    min-height: 100vh;
    min-height: 100dvh;
    max-width: 100%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow-y: auto;
    overflow-x: hidden;
    background: #000
}

html.is-web body {
    background: #000
}

html.is-web #root {
    background: transparent
}

html.is-web .main-screen-container,html.is-web .profile-screen-container,html.is-web .payment-screen-container,html.is-web .referral-screen-container,html.is-web .referral-analytics-screen-container,html.is-web .analytics-screen-container,html.is-web .devices-screen-container,html.is-web .giveaway-screen-container,html.is-web .contest-screen-container,html.is-web .whitelist-screen-container,html.is-web .whitelist-purchase-screen-container,html.is-web .setup-screen-container,html.is-web .subscription-screen-container,html.is-web .success-screen-container,html.is-web .device-management-screen-container,html.is-web .user-agreement-screen-container,html.is-web .payment-screen-container .payment-main-card,html.has-app-layout .main-screen-container,html.has-app-layout .profile-screen-container,html.has-app-layout .payment-screen-container,html.has-app-layout .referral-screen-container,html.has-app-layout .referral-analytics-screen-container,html.has-app-layout .analytics-screen-container,html.has-app-layout .devices-screen-container,html.has-app-layout .giveaway-screen-container,html.has-app-layout .contest-screen-container,html.has-app-layout .whitelist-screen-container,html.has-app-layout .whitelist-purchase-screen-container,html.has-app-layout .setup-screen-container,html.has-app-layout .subscription-screen-container,html.has-app-layout .success-screen-container,html.has-app-layout .device-management-screen-container,html.has-app-layout .user-agreement-screen-container,html.has-app-layout .payment-screen-container .payment-main-card {
    background: transparent!important
}

@media (min-width: 600px) {
    html.has-app-layout .MuiDialog-root,html.has-app-layout .MuiPopover-root,html.has-app-layout .MuiPopper-root:not(.MuiTooltip-popper),html.has-app-layout .MuiBackdrop-root {
        left:117px!important
    }
}

html.has-app-layout .MuiBackdrop-root {
    backdrop-filter: blur(8px) saturate(115%)!important;
    -webkit-backdrop-filter: blur(8px) saturate(115%)!important;
    background-color: #0000004d!important
}

html.has-app-layout .MuiDialog-paper {
    background-color: #ffffff0f!important;
    backdrop-filter: blur(60px) saturate(140%)!important;
    -webkit-backdrop-filter: blur(60px) saturate(140%)!important;
    background-image: none!important
}

html.is-web .giveaway-banner-fixed {
    top: 12rem!important
}

html.is-web .v-logo {
    top: 25%!important
}

@media (min-width: 600px) {
    #root {
        max-width:480px;
        margin: 0 auto;
        overflow-x: hidden
    }
}

@media (min-width: 600px) {
    html.has-app-layout #root {
        max-width:none
    }
}

@media (max-width: 599px) {
    input,textarea,select {
        font-size:16px!important
    }
}

@keyframes media-shimmer {
    0% {
        background-position: -200% 0
    }

    to {
        background-position: 200% 0
    }
}

@keyframes page-fadein {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes block-rise {
    0% {
        opacity: 0;
        transform: translateY(10px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

.stagger-children>* {
    animation: block-rise .7s cubic-bezier(.22,.61,.36,1) backwards
}

.stagger-children>*:nth-child(1) {
    animation-delay: 0ms
}

.stagger-children>*:nth-child(2) {
    animation-delay: .2s
}

.stagger-children>*:nth-child(3) {
    animation-delay: .4s
}

.stagger-children>*:nth-child(4) {
    animation-delay: .6s
}

.stagger-children>*:nth-child(5) {
    animation-delay: .8s
}

.stagger-children>*:nth-child(6) {
    animation-delay: 1s
}

.stagger-children>*:nth-child(7) {
    animation-delay: 1.2s
}

.stagger-children>*:nth-child(n+8) {
    animation-delay: 1.4s
}

@keyframes bg-pulse {
    0% {
        opacity: 0
    }

    33% {
        opacity: 1
    }

    66% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

@keyframes mobile-bg-pulse {
    0% {
        opacity: 0
    }

    25% {
        opacity: 1
    }

    50% {
        opacity: 1
    }

    75% {
        opacity: 0
    }

    to {
        opacity: 0
    }
}

@keyframes bg-breathe {
    0%,to {
        transform: scale(1) translate(0)
    }

    25% {
        transform: scale(1.04) translate(-1%,1%)
    }

    50% {
        transform: scale(1.02) translate(1%,-1%)
    }

    75% {
        transform: scale(1.05) translate(-1%,-1%)
    }
}

@keyframes auth-blob-drift-a {
    0%,to {
        transform: translate(-50%) scale(1) rotate(0);
        filter: blur(60px)
    }

    25% {
        transform: translate(-52%,-2%) scale(1.1) rotate(8deg);
        filter: blur(72px)
    }

    50% {
        transform: translate(-48%,2%) scale(.92) rotate(-6deg);
        filter: blur(64px)
    }

    75% {
        transform: translate(-51%,-1%) scale(1.05) rotate(4deg);
        filter: blur(68px)
    }
}

@keyframes auth-blob-drift-b {
    0%,to {
        transform: translate(-50%) scale(.85) rotate(0);
        opacity: .5;
        filter: blur(80px)
    }

    33% {
        transform: translate(-46%,4%) scale(1.05) rotate(-12deg);
        opacity: .7;
        filter: blur(72px)
    }

    66% {
        transform: translate(-54%,-3%) scale(.95) rotate(10deg);
        opacity: .6;
        filter: blur(86px)
    }
}

@keyframes auth-shape-soft-pulse {
    0% {
        transform: translate(-50%) scale(1) rotate(0);
        opacity: .85;
        filter: brightness(1) saturate(1)
    }

    20% {
        transform: translate(-51%,-1%) scale(1.03) rotate(-1deg);
        opacity: .95;
        filter: brightness(1.05) saturate(1.05)
    }

    40% {
        transform: translate(-49%,1%) scale(.98) rotate(.8deg);
        opacity: .82;
        filter: brightness(.96) saturate(1)
    }

    60% {
        transform: translate(-51%,-1%) scale(1.05) rotate(-.6deg);
        opacity: 1;
        filter: brightness(1.08) saturate(1.08)
    }

    80% {
        transform: translate(-50%,.5%) scale(1.01) rotate(1deg);
        opacity: .9;
        filter: brightness(1.02) saturate(1.03)
    }

    to {
        transform: translate(-50%) scale(1) rotate(0);
        opacity: .85;
        filter: brightness(1) saturate(1)
    }
}

@keyframes auth-shape-pulse-a {
    0%,to {
        transform: translate(-50%) scale(1) rotate(0);
        opacity: .85
    }

    25% {
        transform: translate(-52%) scale(1.06) rotate(4deg);
        opacity: .9
    }

    50% {
        transform: translate(-48%) scale(.96) rotate(-3deg);
        opacity: .75
    }

    75% {
        transform: translate(-51%) scale(1.04) rotate(2deg);
        opacity: .88
    }
}

@keyframes auth-shape-pulse-b {
    0%,to {
        transform: translate(-50%) scale(1) rotate(0);
        opacity: .95
    }

    33% {
        transform: translate(-49%) scale(1.08) rotate(-6deg);
        opacity: 1
    }

    66% {
        transform: translate(-51%) scale(.94) rotate(5deg);
        opacity: .85
    }
}

.web-bg-page {
    position: fixed;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: -1
}

html.has-app-layout .web-bg-page,html.has-app-layout .web-bg-overlay {
    display: none!important
}

.web-bg-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    pointer-events: none
}

.web-bg-overlay:before,.web-bg-overlay:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    pointer-events: none
}

.web-bg-overlay:before {
    top: 0;
    height: 70px;
    background: linear-gradient(to bottom,#011a17,#011a1700)
}

.web-bg-overlay:after {
    bottom: 0;
    height: 70px;
    background: linear-gradient(to top,#011a17,#011a1700)
}

body.page-profile .web-bg-overlay:after {
    display: none
}

.web-bg-background {
    position: absolute;
    top: calc(-50px - env(safe-area-inset-top,0px));
    left: -50px;
    right: -50px;
    bottom: calc(-50px - env(safe-area-inset-bottom,0px));
    z-index: 0
}

::-webkit-scrollbar {
    width: 8px;
    height: 8px
}

::-webkit-scrollbar-track {
    background: #ffffff0d;
    border-radius: 4px
}

::-webkit-scrollbar-thumb {
    background: #03c8ba4d;
    border-radius: 4px
}

::-webkit-scrollbar-thumb:hover {
    background: #03c8ba80
}
