.settings-page {
    min-height: 100vh;
    background:
        radial-gradient(
            circle at 50% -15%,
            rgba(47, 99, 233, 0.09),
            transparent 38%
        ),
        var(--background);
}
.settings-app {
    width:
        min(
            calc(100% - 48px),
            1120px
        );
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    margin: 0 auto;
    padding:
        30px 0 24px;
}
.settings-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}
.settings-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    outline: none;
}
.settings-brand__logo {
    width: 39px;
    height: 39px;
    object-fit: contain;
    filter:
        drop-shadow(
            0 4px 14px
            rgba(47, 99, 233, 0.16)
        );
}
.settings-brand__name {
    font-size: 19px;
    font-weight: 680;
    letter-spacing:
        -0.035em;
    background:
        var(--vw-gradient);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color:
        transparent;
}
.settings-back {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding:
        0 13px;
    color:
        var(--text-secondary);
    background:
        var(--surface);
    border:
        1px solid
        var(--border);
    border-radius:
        var(--radius-round);
    font-size: 12px;
    font-weight: 570;
    transition:
        color var(--transition-fast),
        background var(--transition-fast),
        border-color var(--transition-fast);
}
.settings-back:hover {
    color:
        var(--text);
    background:
        var(--surface-hover);
    border-color:
        var(--border-strong);
}
.settings-back i {
    font-size: 11px;
}
.settings-shell {
    flex: 1;
    padding:
        72px 0 80px;
}
.settings-heading {
    max-width: 620px;
    margin-bottom: 42px;
}
.settings-heading__eyebrow {
    margin-bottom: 9px;
    color:
        var(--vw-blue-bright);
    font-size: 11px;
    font-weight: 680;
    letter-spacing:
        0.075em;
    text-transform:
        uppercase;
}
.settings-heading__title {
    color:
        var(--text);
    font-size:
        clamp(
            34px,
            5vw,
            48px
        );
    font-weight: 680;
    line-height: 1;
    letter-spacing:
        -0.05em;
}
.settings-heading__description {
    max-width: 520px;
    margin-top: 13px;
    color:
        var(--text-secondary);
    font-size: 14px;
    line-height: 1.55;
}
.settings-layout {
    display: grid;
    grid-template-columns:
        205px
        minmax(0, 1fr);
    align-items: start;
    gap:
        clamp(
            40px,
            7vw,
            82px
        );
}
.settings-navigation {
    position: sticky;
    top: 24px;
    display: grid;
    gap: 4px;
}
.settings-navigation__item {
    min-height: 40px;
    display: flex;
    align-items: center;
    gap: 11px;
    padding:
        0 11px;
    color:
        var(--text-tertiary);
    border-radius:
        var(--radius-sm);
    font-size: 12px;
    font-weight: 560;
    transition:
        color var(--transition-fast),
        background var(--transition-fast);
}
.settings-navigation__item i {
    width: 17px;
    font-size: 13px;
    text-align: center;
}
.settings-navigation__item:hover {
    color:
        var(--text-secondary);
    background:
        var(--surface);
}
.settings-navigation__item.is-active {
    color:
        var(--text);
    background:
        var(--surface-hover);
}
.settings-content {
    min-width: 0;
    display: grid;
    gap: 22px;
}
.settings-section {
    scroll-margin-top: 32px;
    padding:
        clamp(
            22px,
            3vw,
            30px
        );
    background:
        color-mix(
            in srgb,
            var(--background-elevated)
            74%,
            transparent
        );
    border:
        1px solid
        var(--border);
    border-radius:
        var(--radius-xl);
}
.settings-section__heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 24px;
}
.settings-section__title {
    color:
        var(--text);
    font-size: 18px;
    font-weight: 630;
    letter-spacing:
        -0.025em;
}
.settings-section__description {
    margin-top: 5px;
    color:
        var(--text-tertiary);
    font-size: 12px;
    line-height: 1.45;
}
.theme-options {
    display: grid;
    gap: 10px;
}
.theme-option {
    width: 100%;
    display: grid;
    grid-template-columns:
        74px
        minmax(0, 1fr)
        26px;
    align-items: center;
    gap: 15px;
    padding:
        13px;
    color:
        var(--text);
    background:
        var(--surface);
    border:
        1px solid
        var(--border);
    border-radius:
        var(--radius-md);
    text-align: left;
    transition:
        background var(--transition-fast),
        border-color var(--transition-fast),
        transform var(--transition-fast);
}
.theme-option:hover {
    background:
        var(--surface-hover);
    border-color:
        var(--border-strong);
}
.theme-option:active {
    transform:
        scale(0.995);
}
.theme-option.is-selected {
    background:
        rgba(
            47,
            99,
            233,
            0.07
        );
    border-color:
        rgba(
            78,
            128,
            245,
            0.26
        );
}
.theme-option__preview {
    position: relative;
    width: 74px;
    height: 48px;
    overflow: hidden;
    border:
        1px solid
        rgba(
            255,
            255,
            255,
            0.08
        );
    border-radius:
        10px;
}
.theme-option__preview--dark {
    background:
        #0d1016;
}
.theme-option__preview--light {
    background:
        #f4f5f8;
    border-color:
        rgba(
            0,
            0,
            0,
            0.08
        );
}
.theme-option__preview--dark span,
.theme-option__preview--light span {
    position: absolute;
    left: 10px;
    right: 10px;
    height: 4px;
    border-radius:
        999px;
}
.theme-option__preview--dark span {
    background:
        rgba(
            255,
            255,
            255,
            0.12
        );
}
.theme-option__preview--light span {
    background:
        rgba(
            20,
            30,
            50,
            0.12
        );
}
.theme-option__preview span:nth-child(1) {
    top: 12px;
}
.theme-option__preview span:nth-child(2) {
    top: 22px;
    right: 24px;
}
.theme-option__preview span:nth-child(3) {
    top: 32px;
    right: 18px;
}
.theme-option__preview--system {
    display: grid;
    grid-template-columns:
        1fr 1fr;
    background:
        none;
}
.theme-system-dark {
    background:
        #0d1016;
}
.theme-system-light {
    background:
        #f4f5f8;
}
.theme-option__copy {
    min-width: 0;
    display: flex;
    flex-direction:
        column;
    gap: 3px;
}
.theme-option__copy strong {
    font-size: 12px;
    font-weight: 620;
}
.theme-option__copy span {
    color:
        var(--text-tertiary);
    font-size: 11px;
    line-height: 1.4;
}
.theme-option__check {
    width: 22px;
    height: 22px;
    display: grid;
    place-items: center;
    color:
        transparent;
    background:
        transparent;
    border:
        1px solid
        var(--border-strong);
    border-radius: 50%;
    font-size: 9px;
    transition:
        color var(--transition-fast),
        background var(--transition-fast),
        border-color var(--transition-fast);
}
.theme-option.is-selected
.theme-option__check {
    color:
        #ffffff;
    background:
        var(--vw-blue);
    border-color:
        var(--vw-blue);
}
.settings-account {
    display: grid;
    grid-template-columns:
        auto
        minmax(0, 1fr)
        auto;
    align-items: center;
    gap: 14px;
}
.settings-account[hidden],
.settings-account-guest[hidden] {
    display: none !important;
}
.settings-account__avatar {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    overflow: hidden;
    color:
        #ffffff;
    background:
        var(--vw-gradient);
    border-radius: 50%;
    font-size: 18px;
    font-weight: 680;
    box-shadow:
        inset 0 1px 0
        rgba(
            255,
            255,
            255,
            0.14
        );
}
.settings-account__avatar img,
.settings-account__avatar span {
    grid-area:
        1 / 1;
}
.settings-account__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.settings-account__avatar img[hidden],
.settings-account__avatar span[hidden] {
    display: none !important;
}
.settings-account__details {
    min-width: 0;
    display: flex;
    flex-direction:
        column;
    gap: 3px;
}
.settings-account__details strong {
    overflow: hidden;
    color:
        var(--text);
    font-size: 13px;
    font-weight: 620;
    white-space: nowrap;
    text-overflow:
        ellipsis;
}
.settings-account__details span {
    overflow: hidden;
    color:
        var(--text-tertiary);
    font-size: 11px;
    white-space: nowrap;
    text-overflow:
        ellipsis;
}
.settings-account-guest {
    display: grid;
    grid-template-columns:
        auto
        minmax(0, 1fr)
        auto;
    align-items: center;
    gap: 13px;
}
.settings-account-guest__icon {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    color:
        var(--text-secondary);
    background:
        var(--surface);
    border:
        1px solid
        var(--border);
    border-radius: 50%;
    font-size: 15px;
}
.settings-account-guest strong,
.settings-account-guest span {
    display: block;
}
.settings-account-guest strong {
    color:
        var(--text);
    font-size: 12px;
    font-weight: 610;
}
.settings-account-guest span {
    margin-top: 3px;
    color:
        var(--text-tertiary);
    font-size: 11px;
}
.settings-primary-button,
.settings-secondary-button {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding:
        0 13px;
    border-radius:
        var(--radius-sm);
    font-size: 11px;
    font-weight: 590;
    transition:
        background var(--transition-fast),
        border-color var(--transition-fast),
        color var(--transition-fast),
        transform var(--transition-fast);
}
.settings-primary-button {
    color:
        #ffffff;
    background:
        var(--vw-blue);
}
.settings-primary-button:hover {
    filter:
        brightness(1.06);
}
.settings-secondary-button {
    color:
        var(--text-secondary);
    background:
        var(--surface);
    border:
        1px solid
        var(--border);
}
.settings-secondary-button:hover {
    color:
        var(--text);
    background:
        var(--surface-hover);
    border-color:
        var(--border-strong);
}
.settings-primary-button:active,
.settings-secondary-button:active {
    transform:
        scale(0.97);
}
.settings-danger-zone {
    margin-top: 26px;
    padding: 20px;
    background:
        rgba(173, 62, 72, 0.055);
    border:
        1px solid
        rgba(210, 80, 92, 0.18);
    border-radius:
        var(--radius-md);
}
.settings-danger-zone[hidden] {
    display: none !important;
}
.settings-danger-zone__heading {
    margin-bottom: 18px;
}
.settings-danger-zone__heading h3 {
    color:
        #ef858e;
    font-size: 13px;
    font-weight: 630;
}
.settings-danger-zone__heading p {
    margin-top: 4px;
    color:
        var(--text-tertiary);
    font-size: 11px;
}
.settings-danger-zone__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}
.settings-danger-zone__copy strong,
.settings-danger-zone__copy span {
    display: block;
}
.settings-danger-zone__copy strong {
    color:
        var(--text);
    font-size: 12px;
    font-weight: 610;
}
.settings-danger-zone__copy span {
    margin-top: 4px;
    color:
        var(--text-tertiary);
    font-size: 11px;
    line-height: 1.4;
}
.settings-delete-account-button {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    padding:
        0 13px;
    color:
        #ff9ca4;
    background:
        rgba(210, 58, 70, 0.12);
    border:
        1px solid
        rgba(230, 76, 88, 0.28);
    border-radius:
        var(--radius-sm);
    font-size: 11px;
    font-weight: 590;
    transition:
        color var(--transition-fast),
        background var(--transition-fast),
        border-color var(--transition-fast),
        transform var(--transition-fast);
}
.settings-delete-account-button:hover {
    color:
        #ffffff;
    background:
        rgba(210, 58, 70, 0.22);
    border-color:
        rgba(235, 82, 94, 0.42);
}
.settings-delete-account-button:active {
    transform:
        scale(0.97);
}
.settings-delete-account-button:disabled {
    opacity: 0.45;
    pointer-events: none;
}
.edit-profile-modal {
    position:
        fixed;
    z-index:
        1000;
    inset:
        0;
    display:
        grid;
    place-items:
        center;
    padding:
        24px;
}
.edit-profile-modal[hidden] {
    display:
        none !important;
}
.edit-profile-modal__backdrop {
    position:
        absolute;
    inset:
        0;
    width:
        100%;
    height:
        100%;
    padding:
        0;
    background:
        var(--overlay);
    border:
        0;
    backdrop-filter:
        blur(7px);
    -webkit-backdrop-filter:
        blur(7px);
}
.edit-profile-modal__dialog {
    position:
        relative;
    z-index:
        1;
    width:
        min(
            100%,
            520px
        );
    max-height:
        calc(
            100vh - 48px
        );
    overflow-y:
        auto;
    padding:
        27px;
    color:
        var(--text);
    background:
        color-mix(
            in srgb,
            var(--background-elevated) 94%,
            transparent
        );
    border:
        1px solid
        var(--border);
    border-radius:
        18px;
    box-shadow:
        var(--shadow-floating);
    backdrop-filter:
        blur(28px)
        saturate(140%);
    -webkit-backdrop-filter:
        blur(28px)
        saturate(140%);
}
.edit-profile-modal__close {
    position:
        absolute;
    top:
        16px;
    right:
        16px;
    width:
        32px;
    height:
        32px;
    display:
        grid;
    place-items:
        center;
    padding:
        0;
    color:
        var(--text-tertiary);
    background:
        transparent;
    border:
        0;
    border-radius:
        50%;
    font-size:
        11px;
    transition:
        color var(--transition-fast),
        background var(--transition-fast);
}
.edit-profile-modal__close:hover {
    color:
        var(--text);
    background:
        var(--surface-hover);
}
.edit-profile-modal__heading {
    display:
        flex;
    align-items:
        center;
    gap:
        13px;
    padding-right:
        42px;
    margin-bottom:
        26px;
}
.edit-profile-modal__icon {
    width:
        40px;
    height:
        40px;
    display:
        grid;
    place-items:
        center;
    flex:
        0 0 auto;
    color:
        var(--vw-blue-bright);
    background:
        rgba(47, 99, 233, 0.09);
    border:
        1px solid
        rgba(103, 166, 255, 0.11);
    border-radius:
        12px;
    font-size:
        13px;
}
.edit-profile-modal__heading h2 {
    margin:
        0;
    color:
        var(--text);
    font-size:
        17px;
    font-weight:
        660;
    letter-spacing:
        -0.025em;
}
.edit-profile-modal__heading p {
    margin:
        4px 0 0;
    color:
        var(--text-tertiary);
    font-size:
        10px;
    line-height:
        1.45;
}
.edit-profile-avatar {
    display:
        flex;
    align-items:
        center;
    gap:
        17px;
    margin-bottom:
        25px;
    padding:
        17px;
    background:
        rgba(255, 255, 255, 0.018);
    border:
        1px solid
        var(--border);
    border-radius:
        13px;
}
.edit-profile-avatar__preview {
    width:
        72px;
    height:
        72px;
    display:
        grid;
    place-items:
        center;
    flex:
        0 0 auto;
    overflow:
        hidden;
    color:
        #ffffff;
    background:
        var(--vw-gradient);
    border:
        1px solid
        rgba(255, 255, 255, 0.10);
    border-radius:
        50%;
    box-shadow:
        0 9px 28px
        rgba(26, 72, 173, 0.14);
}
.edit-profile-avatar__image,
.edit-profile-avatar__initial {
    grid-area:
        1 / 1;
    width:
        100%;
    height:
        100%;
}
.edit-profile-avatar__image {
    object-fit:
        cover;
}
.edit-profile-avatar__initial {
    display:
        grid;
    place-items:
        center;
    font-size:
        21px;
    font-weight:
        700;
}
.edit-profile-avatar__image[hidden],
.edit-profile-avatar__initial[hidden] {
    display:
        none !important;
}
.edit-profile-avatar__actions {
    min-width:
        0;
    display:
        flex;
    align-items:
        center;
    flex-wrap:
        wrap;
    gap:
        7px;
}
.edit-profile-avatar__change,
.edit-profile-avatar__remove {
    min-height:
        32px;
    display:
        inline-flex;
    align-items:
        center;
    justify-content:
        center;
    padding:
        0 10px;
    border-radius:
        8px;
    font-size:
        9px;
    font-weight:
        620;
    transition:
        color var(--transition-fast),
        background var(--transition-fast),
        border-color var(--transition-fast),
        opacity var(--transition-fast);
}
.edit-profile-avatar__change {
    color:
        var(--text-secondary);
    background:
        var(--surface);
    border:
        1px solid
        var(--border);
}
.edit-profile-avatar__change:hover {
    color:
        var(--text);
    background:
        var(--surface-hover);
    border-color:
        var(--border-strong);
}
.edit-profile-avatar__remove {
    color:
        #d98b91;
    background:
        transparent;
    border:
        1px solid
        rgba(202, 82, 92, 0.13);
}
.edit-profile-avatar__remove:hover:not(:disabled) {
    color:
        #efa0a6;
    background:
        rgba(190, 59, 70, 0.06);
    border-color:
        rgba(202, 82, 92, 0.23);
}
.edit-profile-avatar__remove:disabled {
    opacity:
        0.35;
}
.edit-profile-avatar__actions > span {
    width:
        100%;
    margin-top:
        1px;
    color:
        var(--text-tertiary);
    font-size:
        8px;
}
.edit-profile-field +
.edit-profile-field {
    margin-top:
        19px;
}
.edit-profile-field > label,
.edit-profile-field__header label {
    color:
        var(--text-secondary);
    font-size:
        10px;
    font-weight:
        610;
}
.edit-profile-field > label {
    display:
        block;
    margin-bottom:
        8px;
}
.edit-profile-field__header {
    display:
        flex;
    align-items:
        center;
    justify-content:
        space-between;
    gap:
        12px;
    margin-bottom:
        8px;
}
.edit-profile-field__header span {
    color:
        var(--text-tertiary);
    font-size:
        9px;
}
.edit-profile-field__input,
.edit-profile-field__textarea {
    width:
        100%;
    color:
        var(--text);
    background:
        rgba(255, 255, 255, 0.025);
    border:
        1px solid
        var(--border);
    border-radius:
        var(--radius-sm);
    outline:
        none;
    font:
        inherit;
    font-size:
        11px;
    transition:
        background var(--transition-fast),
        border-color var(--transition-fast),
        box-shadow var(--transition-fast);
}
.edit-profile-field__input {
    height:
        41px;
    padding:
        0 12px;
}
.edit-profile-field__textarea {
    min-height:
        112px;
    padding:
        11px 12px;
    resize:
        vertical;
    line-height:
        1.55;
}
.edit-profile-field__input:focus,
.edit-profile-field__textarea:focus {
    background:
        rgba(255, 255, 255, 0.035);
    border-color:
        rgba(79, 141, 247, 0.48);
    box-shadow:
        0 0 0 3px
        rgba(47, 99, 233, 0.07);
}
.edit-profile-field__textarea::placeholder {
    color:
        var(--text-tertiary);
}
.edit-profile-field__input--readonly {
    color:
        var(--text-tertiary);
    background:
        rgba(255, 255, 255, 0.015);
}
.edit-profile-field__help {
    margin:
        6px 0 0;
    color:
        var(--text-tertiary);
    font-size:
        8px;
    line-height:
        1.5;
}
.edit-profile-message {
    margin:
        16px 0 0;
    padding:
        9px 10px;
    color:
        #e99da3;
    background:
        rgba(190, 59, 70, 0.06);
    border:
        1px solid
        rgba(202, 82, 92, 0.12);
    border-radius:
        8px;
    font-size:
        9px;
    line-height:
        1.45;
}
.edit-profile-message[hidden] {
    display:
        none !important;
}
.edit-profile-modal__actions {
    display:
        flex;
    align-items:
        center;
    justify-content:
        flex-end;
    gap:
        8px;
    margin-top:
        26px;
    padding-top:
        18px;
    border-top:
        1px solid
        var(--border);
}
.edit-profile-modal__cancel,
.edit-profile-modal__save {
    min-height:
        37px;
    display:
        inline-flex;
    align-items:
        center;
    justify-content:
        center;
    padding:
        0 14px;
    border-radius:
        var(--radius-sm);
    font-size:
        10px;
    font-weight:
        620;
    transition:
        color var(--transition-fast),
        background var(--transition-fast),
        border-color var(--transition-fast),
        transform var(--transition-fast);
}
.edit-profile-modal__cancel {
    color:
        var(--text-secondary);
    background:
        var(--surface);
    border:
        1px solid
        var(--border);
}
.edit-profile-modal__cancel:hover {
    color:
        var(--text);
    background:
        var(--surface-hover);
    border-color:
        var(--border-strong);
}
.edit-profile-modal__save {
    color:
        #ffffff;
    background:
        var(--vw-gradient);
    border:
        1px solid
        rgba(103, 166, 255, 0.22);
    box-shadow:
        0 8px 24px
        rgba(36, 83, 190, 0.14);
}
.edit-profile-modal__save:hover:not(:disabled) {
    filter:
        brightness(1.07);
}
.edit-profile-modal__save:disabled {
    opacity:
        0.38;
}
.edit-profile-modal__cancel:active,
.edit-profile-modal__save:active:not(:disabled) {
    transform:
        scale(0.97);
}
@media (
    max-width: 560px
) {
    .edit-profile-modal {
        padding:
            14px;
    }
    .edit-profile-modal__dialog {
        max-height:
            calc(
                100vh - 28px
            );
        padding:
            22px 18px;
    }
    .edit-profile-avatar {
        align-items:
            flex-start;
    }
    .edit-profile-avatar__preview {
        width:
            62px;
        height:
            62px;
    }
    .edit-profile-modal__actions {
        flex-direction:
            column-reverse;
    }
    .edit-profile-modal__cancel,
    .edit-profile-modal__save {
        width:
            100%;
    }
}
.delete-account-modal {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: grid;
    place-items: center;
    padding: 24px;
}
.delete-account-modal[hidden] {
    display: none !important;
}
.delete-account-modal__backdrop {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    background:
        rgba(3, 5, 9, 0.72);
    border: 0;
    backdrop-filter:
        blur(8px);
    -webkit-backdrop-filter:
        blur(8px);
}
.delete-account-modal__dialog {
    position: relative;
    z-index: 1;
    width:
        min(
            100%,
            540px
        );
    max-height:
        calc(
            100vh - 48px
        );
    overflow-y: auto;
    padding: 26px;
    color:
        var(--text);
    background:
        var(--background-elevated);
    border:
        1px solid
        rgba(218, 77, 89, 0.22);
    border-radius:
        var(--radius-xl);
    box-shadow:
        0 26px 80px
        rgba(0, 0, 0, 0.42);
    animation:
        delete-account-modal-in
        180ms
        var(--ease-smooth)
        both;
}
@keyframes delete-account-modal-in {
    from {
        opacity: 0;
        transform:
            translateY(8px)
            scale(0.985);
    }
    to {
        opacity: 1;
        transform:
            translateY(0)
            scale(1);
    }
}
.delete-account-modal__close {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    padding: 0;
    color:
        var(--text-tertiary);
    background:
        transparent;
    border: 0;
    border-radius: 50%;
    font-size: 13px;
    transition:
        color var(--transition-fast),
        background var(--transition-fast);
}
.delete-account-modal__close:hover {
    color:
        var(--text);
    background:
        var(--surface-hover);
}
.delete-account-modal__icon {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    margin-bottom: 18px;
    color:
        #ff929b;
    background:
        rgba(210, 58, 70, 0.11);
    border:
        1px solid
        rgba(225, 75, 87, 0.2);
    border-radius: 50%;
    font-size: 17px;
}
.delete-account-modal__heading {
    padding-right: 34px;
}
.delete-account-modal__eyebrow {
    margin-bottom: 7px;
    color:
        #ef858e;
    font-size: 10px;
    font-weight: 680;
    letter-spacing:
        0.075em;
    text-transform:
        uppercase;
}
.delete-account-modal__heading h2 {
    color:
        var(--text);
    font-size: 23px;
    font-weight: 660;
    letter-spacing:
        -0.035em;
}
.delete-account-modal__heading > p:last-child {
    margin-top: 9px;
    color:
        var(--text-secondary);
    font-size: 12px;
    line-height: 1.55;
}
.delete-account-modal__losses {
    margin-top: 22px;
    padding: 17px;
    background:
        rgba(173, 62, 72, 0.045);
    border:
        1px solid
        rgba(205, 76, 87, 0.12);
    border-radius:
        var(--radius-md);
}
.delete-account-modal__losses-title {
    margin-bottom: 13px;
    color:
        var(--text-secondary);
    font-size: 11px;
    font-weight: 610;
}
.delete-account-modal__losses ul {
    display: grid;
    gap: 13px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.delete-account-modal__losses li {
    display: grid;
    grid-template-columns:
        25px
        minmax(0, 1fr);
    align-items: start;
    gap: 10px;
}
.delete-account-modal__losses li > i {
    width: 25px;
    height: 25px;
    display: grid;
    place-items: center;
    color:
        #d98188;
    background:
        rgba(195, 66, 77, 0.07);
    border-radius: 7px;
    font-size: 10px;
}
.delete-account-modal__losses strong,
.delete-account-modal__losses span {
    display: block;
}
.delete-account-modal__losses strong {
    color:
        var(--text);
    font-size: 11px;
    font-weight: 600;
}
.delete-account-modal__losses span {
    margin-top: 2px;
    color:
        var(--text-tertiary);
    font-size: 10px;
    line-height: 1.4;
}
.delete-account-modal__notice {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-top: 17px;
    color:
        #d7989d;
    font-size: 10px;
    line-height: 1.45;
}
.delete-account-modal__notice i {
    flex: 0 0 auto;
    margin-top: 2px;
    font-size: 11px;
}
.delete-account-modal__confirmation {
    margin-top: 20px;
}
.delete-account-modal__provider[hidden] {
    display: none !important;
}
.delete-account-modal__verification-heading {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 16px;
}
.delete-account-modal__verification-heading > i {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    color:
        #ff929b;
    background:
        rgba(210, 58, 70, 0.09);
    border-radius: 8px;
    font-size: 11px;
}
.delete-account-modal__verification-heading strong,
.delete-account-modal__verification-heading span {
    display: block;
}
.delete-account-modal__verification-heading strong {
    color:
        var(--text);
    font-size: 11px;
    font-weight: 620;
}
.delete-account-modal__verification-heading span {
    margin-top: 3px;
    color:
        var(--text-tertiary);
    font-size: 10px;
    line-height: 1.45;
}
.delete-account-modal__provider > label {
    display: block;
    margin-bottom: 8px;
    color:
        var(--text-secondary);
    font-size: 11px;
}
.delete-account-modal__error {
    margin-top: 7px;
    color:
        #ef858e;
    font-size: 10px;
    line-height: 1.4;
}
.delete-account-modal__error[hidden] {
    display: none !important;
}
.delete-account-modal__confirmation label {
    display: block;
    margin-bottom: 8px;
    color:
        var(--text-secondary);
    font-size: 11px;
    line-height: 1.5;
}
.delete-account-modal__confirmation strong {
    color:
        var(--text);
    font-weight: 650;
}
.delete-account-modal__input {
    width: 100%;
    height: 40px;
    padding:
        0 12px;
    color:
        var(--text);
    background:
        var(--surface);
    border:
        1px solid
        var(--border);
    border-radius:
        var(--radius-sm);
    outline: none;
    font-size: 12px;
    transition:
        border-color var(--transition-fast),
        box-shadow var(--transition-fast),
        background var(--transition-fast);
}
.delete-account-modal__input:hover {
    border-color:
        var(--border-strong);
}
.delete-account-modal__input:focus {
    border-color:
        rgba(220, 75, 87, 0.55);
    box-shadow:
        0 0 0 3px
        rgba(210, 58, 70, 0.08);
}
.delete-account-modal__error {
    margin-top: 7px;
    color:
        #ef858e;
    font-size: 10px;
    line-height: 1.4;
}
.delete-account-modal__error[hidden] {
    display: none !important;
}
.delete-account-modal__cancel,
.delete-account-modal__continue {
    min-height: 37px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding:
        0 15px;
    border-radius:
        var(--radius-sm);
    font-size: 11px;
    font-weight: 600;
    transition:
        color var(--transition-fast),
        background var(--transition-fast),
        border-color var(--transition-fast),
        transform var(--transition-fast);
}
.delete-account-modal__cancel {
    color:
        var(--text-secondary);
    background:
        var(--surface);
    border:
        1px solid
        var(--border);
}
.delete-account-modal__cancel:hover {
    color:
        var(--text);
    background:
        var(--surface-hover);
    border-color:
        var(--border-strong);
}
.delete-account-modal__continue {
    color:
        #ffffff;
    background:
        #b93642;
    border:
        1px solid
        #c84450;
}
.delete-account-modal__continue:hover:not(:disabled) {
    background:
        #c9414d;
    border-color:
        #d1535e;
}
.delete-account-modal__continue:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}
.delete-account-modal__cancel:active,
.delete-account-modal__continue:active {
    transform:
        scale(0.97);
}
body.has-modal-open {
    overflow: hidden;
}
.settings-footer {
    padding:
        18px 0 4px;
    color:
        var(--text-tertiary);
    border-top:
        1px solid
        var(--border);
    font-size: 10px;
}
@media (max-width: 760px) {
    .settings-app {
        width:
            calc(
                100% - 30px
            );
    }
    .settings-topbar {
        gap: 12px;
    }
    .settings-back span {
        display: none;
    }
    .settings-back {
        width: 38px;
        padding: 0;
        border-radius: 50%;
    }
    .settings-shell {
        padding:
            50px 0 60px;
    }
    .settings-heading {
        margin-bottom: 28px;
    }
    .settings-layout {
        display: block;
    }
    .settings-navigation {
        position: static;
        display: flex;
        overflow-x: auto;
        gap: 5px;
        margin-bottom: 20px;
        padding-bottom: 4px;
        scrollbar-width: none;
    }
    .settings-navigation::-webkit-scrollbar {
        display: none;
    }
    .settings-navigation__item {
        flex: 0 0 auto;
        padding:
            0 12px;
    }
    .settings-account,
    .settings-account-guest {
        grid-template-columns:
            auto
            minmax(0, 1fr);
    }
    .settings-account
    .settings-secondary-button,
    .settings-account-guest
    .settings-primary-button {
        grid-column:
            1 / -1;
        width: 100%;
    }
    .theme-option {
        grid-template-columns:
            60px
            minmax(0, 1fr)
            24px;
    }
    .theme-option__preview {
        width: 60px;
        height: 42px;
    }
}
@media (max-width: 480px) {
        .settings-danger-zone__row {
        align-items: stretch;
        flex-direction:
            column;
    }
    .settings-delete-account-button {
        width: 100%;
    }
    .settings-brand__name {
        display: none;
    }
    .settings-section {
        padding: 19px;
    }
    .theme-option {
        grid-template-columns:
            minmax(0, 1fr)
            23px;
    }
    .theme-option__preview {
        display: none;
    }
}