.root {
    display: flex;
    padding: var(--spacing-32) var(--spacing-16) var(--spacing-16) var(--spacing-16);
    flex-direction: column;
    align-items: flex-start;
    gap: var(--spacing-28);
    align-self: stretch;

    border-radius: var(--border-radius-md);
    background-color: var(--color-bg-fill-alpha-white-10);
    backdrop-filter: blur(6px);
}

.container {
    display: flex;
    padding: 0px var(--spacing-12);
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: var(--spacing-12);
    align-self: stretch;
}

.title {
    text-align: center;
}

.text {
    color: var(--color-text-primary-disabled);
    text-align: center;
    letter-spacing: var(--letter-spacing-negative-md);
}

.email {
    color: var(--color-text-primary-inverted);
    font-family: var(--font-default);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-regular);
    line-height: var(--line-height-lg);
    letter-spacing: var(--letter-spacing-negative-sm);
    word-wrap: break-word;
}

.root.subscribed {
    height: auto;
}

@media (width < 1440px) {
    .root {
        padding: var(--spacing-32) var(--spacing-16) var(--spacing-16) var(--spacing-16);
        gap: var(--spacing-28);
    }

    .container {
        padding: var(--spacing-32) var(--spacing-16) var(--spacing-16) var(--spacing-16);
        gap: var(--spacing-28);
    }

    .container.subscribed {
        padding: var(--spacing-32) var(--spacing-16);
    }

    .container {
        padding: 0px var(--spacing-12);
        gap: var(--spacing-12);
    }
}

@media (width < 768px) {
    .root {
        display: flex;
        padding: var(--spacing-24) var(--spacing-12) var(--spacing-12) var(--spacing-12);
        flex-direction: column;
        align-items: flex-start;
        gap: var(--spacing-20);
        align-self: stretch;
    }

    .container {
        display: flex;
        padding: 0px var(--spacing-12);
        flex-direction: column;
        align-items: center;
        gap: 12px;
        align-self: stretch;
    }

    .container {
        padding: 0px var(--spacing-12);
        align-items: center;
        gap: 12px;
    }

    .title {
        font-size: var(--font-size-xxl);
        letter-spacing: var(--letter-spacing-negative-md);
    }

    .text {
        font-size: var(--font-size-xs);
        letter-spacing: var(--letter-spacing-negative-sm);
    }
}
