.guest-profile-avatar {
    display: block;
    width: 120px;
    height: 120px;
    flex: 0 0 120px;
    max-width: none;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    object-position: center;
    border-radius: 50%;
    padding: 4px;
    background-color: var(--vz-body-bg);
    border: var(--vz-border-width) solid var(--vz-border-color);
    box-sizing: border-box;
}

@media (max-width: 767.98px) {
    .guest-profile-avatar {
        width: 65px;
        height: 65px;
        flex-basis: 65px;
        padding: 3px;
        margin-left: -8px;
    }
}

@media (max-width: 991.98px) {
    [data-public-journal-mobile-feed] {
        width: 100vw !important;
        max-width: 100vw !important;
        margin-left: calc(50% - 50vw) !important;
        margin-right: calc(50% - 50vw) !important;
    }

    [data-public-journal-mobile-feed] > .journal-trade-card-public-mobile {
        width: 100% !important;
        max-width: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        border-left: 0 !important;
        border-right: 0 !important;
        border-radius: 0 !important;
    }
}

/* Social journal interaction motion */
.journal-public-like,
.journal-public-favourite {
    transition:
        color 180ms ease,
        opacity 180ms ease,
        transform 180ms ease;
}

.journal-public-like > i,
.journal-public-favourite > i {
    display: inline-block;
    transform-origin: center;
    transition:
        color 180ms ease,
        transform 180ms ease;
}

.journal-public-like-count,
.journal-public-save-count {
    display: inline-block;
    transition:
        opacity 160ms ease,
        transform 160ms ease;
}

.social-action-pop {
    animation:
        fgen-social-action-pop
        220ms
        cubic-bezier(.2, .9, .3, 1.25);
}

@keyframes fgen-social-action-pop {
    0% {
        transform: scale(1);
    }

    45% {
        transform: scale(1.22);
    }

    100% {
        transform: scale(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    .journal-public-like,
    .journal-public-favourite,
    .journal-public-like > i,
    .journal-public-favourite > i,
    .journal-public-like-count,
    .journal-public-save-count {
        transition: none;
    }

    .social-action-pop {
        animation: none;
    }
}

@media (max-width: 991.98px) {
    [data-journal-share-search] {
        font-size: 16px;
    }
}

/* FGenio journal comment composer v1 */
[data-journal-comment-modal] .modal-footer {
    background:
        rgba(
            var(--vz-body-bg-rgb),
            0.82
        );
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    border-top:
        1px solid
        var(--vz-border-color);
}

[data-journal-comment-emoji-row] {
    column-gap: 0.82rem !important;
    row-gap: 0.35rem !important;
}

[data-journal-comment-emoji] {
    line-height: 1;
    transition:
        transform 120ms ease,
        opacity 120ms ease;
}

[data-journal-comment-emoji]:active {
    transform: scale(0.94);
}

[data-journal-comment-input] {
    resize: none;
    min-height: 42px;
    max-height: 120px;
    transform: none !important;
}

[data-journal-comment-input]:focus {
    transform: none !important;
}

@media (max-width: 991.98px) {
    [data-journal-comment-input],
    [data-journal-comment-input]:focus {
        font-size: 16px !important;
        line-height: 1.5;
        transform: none !important;
        -webkit-text-size-adjust: 100%;
    }
}

/* FGenio mobile comment visual viewport v1 */
@media (max-width: 991.98px) {
    [data-journal-comment-modal] {
        top:
            var(
                --fgen-comment-vv-top,
                0px
            ) !important;

        bottom: auto !important;

        height:
            var(
                --fgen-comment-vv-height,
                100dvh
            ) !important;

        min-height: 0 !important;

        max-height:
            var(
                --fgen-comment-vv-height,
                100dvh
            ) !important;

        overflow: hidden !important;
    }

    [data-journal-comment-modal] .modal-dialog {
        width: 100%;
        height: 100%;
        min-height: 0;
        max-height: 100%;
        margin: 0 !important;
    }

    [data-journal-comment-modal] .modal-content {
        height: 100%;
        min-height: 0;
        max-height: 100%;
        overflow: hidden;
    }

    [data-journal-comment-modal] .modal-body {
        min-height: 0;
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }

    [data-journal-comment-modal] .modal-footer {
        position: sticky;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 10;

        flex: 0 0 auto;

        margin: 0;

        padding-bottom:
            max(
                0.75rem,
                env(safe-area-inset-bottom)
            );

        background:
            rgba(
                var(--vz-body-bg-rgb),
                0.97
            );

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

        backdrop-filter:
            blur(18px);

        box-shadow:
            0 -12px 28px
            rgba(
                0,
                0,
                0,
                0.10
            );
    }

    [data-journal-comment-input] {
        scroll-margin-bottom: 11rem;
    }
}

/* FGenio comment modal glass backdrop v1 */
body.fgen-comment-modal-open .modal-backdrop {
    opacity: 1 !important;

    background:
        rgba(
            var(--vz-body-bg-rgb),
            0.42
        ) !important;

    -webkit-backdrop-filter:
        blur(14px)
        saturate(125%);

    backdrop-filter:
        blur(14px)
        saturate(125%);
}

body.fgen-comment-modal-open
[data-journal-comment-modal] {
    z-index: 1056;
}

body.fgen-comment-modal-open
.modal-backdrop {
    z-index: 1055;
}

/* FGenio independent comment glass layer v2 */
[data-fgen-comment-glass-layer] {
    position: fixed;

    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    width: 100vw;

    height: 100vh;
    height: 100dvh;
    min-height: 100lvh;

    z-index: 1054;

    pointer-events: none;

    opacity: 0;

    background:
        rgba(
            var(--vz-body-bg-rgb),
            0.34
        );

    -webkit-backdrop-filter:
        blur(16px)
        saturate(125%);

    backdrop-filter:
        blur(16px)
        saturate(125%);

    transition:
        opacity 160ms ease;
}

[data-fgen-comment-glass-layer].is-visible {
    opacity: 1;
}

body.fgen-comment-modal-open
[data-journal-comment-modal] {
    z-index: 1056 !important;
}

body.fgen-comment-modal-open
.modal-backdrop {
    z-index: 1053 !important;
    opacity: 0 !important;
}

@media (max-width: 991.98px) {
    [data-fgen-comment-glass-layer] {
        position: fixed;

        top: 0;
        right: 0;
        bottom: auto;
        left: 0;

        width: 100vw;

        height: 100lvh;
        min-height: 100lvh;

        background:
            rgba(
                var(--vz-body-bg-rgb),
                0.46
            );

        -webkit-backdrop-filter:
            blur(18px)
            saturate(130%);

        backdrop-filter:
            blur(18px)
            saturate(130%);
    }
}

/* FGenio comment direct background blur v1 */

/*
 * Comment modal lives inside .page-content.
 * Blur only the real page behind it, never the modal nodes.
 */
body.fgen-comment-modal-open > header,
body.fgen-comment-modal-open
.page-content > :not(.modal) {
    -webkit-filter:
        blur(12px)
        brightness(0.78)
        saturate(0.88);

    filter:
        blur(12px)
        brightness(0.78)
        saturate(0.88);

    transition:
        filter 160ms ease,
        -webkit-filter 160ms ease;

    pointer-events: none;
    user-select: none;
}

/*
 * Keep Comment / Share / other modal nodes completely sharp.
 */
body.fgen-comment-modal-open
.page-content > .modal {
    -webkit-filter: none !important;
    filter: none !important;
}

/*
 * Extra veil prevents the blurred page from remaining visually noisy.
 * This is independent of Bootstrap backdrop behaviour.
 */
body.fgen-comment-modal-open::before {
    content: '';

    position: fixed;

    inset: 0;

    width: 100vw;

    height: 100vh;
    height: 100dvh;
    min-height: 100lvh;

    z-index: 1052;

    pointer-events: none;

    background:
        rgba(
            var(--vz-body-bg-rgb),
            0.34
        );
}

body.fgen-comment-modal-open
[data-journal-comment-modal] {
    position: fixed;
    z-index: 1056 !important;
}

/*
 * Mobile: stronger direct background treatment so any area revealed
 * while the software keyboard changes VisualViewport is still clean.
 */
@media (max-width: 991.98px) {
    body.fgen-comment-modal-open > header,
    body.fgen-comment-modal-open
    .page-content > :not(.modal) {
        -webkit-filter:
            blur(16px)
            brightness(0.66)
            saturate(0.78);

        filter:
            blur(16px)
            brightness(0.66)
            saturate(0.78);
    }

    body.fgen-comment-modal-open::before {
        height: 100lvh;
        min-height: 100lvh;

        background:
            rgba(
                var(--vz-body-bg-rgb),
                0.48
            );
    }
}

/* FGenio guest profile journal gate glass v1 */
[data-guest-profile-gate-blur-target] {
    transition:
        filter 220ms ease,
        opacity 220ms ease,
        transform 220ms ease;
}

.fgen-guest-profile-gate-active {
    position: relative;
    isolation: isolate;
}

.fgen-guest-profile-gate-active
[data-guest-profile-gate-blur-target] {
    -webkit-filter:
        blur(11px)
        brightness(0.66)
        saturate(0.82);

    filter:
        blur(11px)
        brightness(0.66)
        saturate(0.82);

    opacity: 0.72;

    transform:
        scale(0.995);

    pointer-events: none;
    user-select: none;
}

.fgen-guest-profile-gate-active::after {
    content: '';

    position: absolute;

    inset: 0;

    z-index: 10;

    pointer-events: none;

    background:
        linear-gradient(
            180deg,
            rgba(
                var(--vz-body-bg-rgb),
                0.22
            ) 0%,
            rgba(
                var(--vz-body-bg-rgb),
                0.48
            ) 38%,
            rgba(
                var(--vz-body-bg-rgb),
                0.70
            ) 100%
        );
}

.fgen-guest-profile-gate-active
[data-guest-profile-gate] {
    position: relative;

    z-index: 11;

    margin-top: 1rem;

    background:
        rgba(
            var(--vz-card-bg-rgb),
            0.90
        );

    -webkit-backdrop-filter:
        blur(18px)
        saturate(120%);

    backdrop-filter:
        blur(18px)
        saturate(120%);

    border:
        1px solid
        var(--vz-border-color);

    box-shadow:
        0 18px 48px
        rgba(
            0,
            0,
            0,
            0.18
        );
}

@media (max-width: 991.98px) {
    .fgen-guest-profile-gate-active
    [data-guest-profile-gate-blur-target] {
        -webkit-filter:
            blur(14px)
            brightness(0.58)
            saturate(0.76);

        filter:
            blur(14px)
            brightness(0.58)
            saturate(0.76);

        opacity: 0.66;
    }

    .fgen-guest-profile-gate-active::after {
        background:
            linear-gradient(
                180deg,
                rgba(
                    var(--vz-body-bg-rgb),
                    0.30
                ) 0%,
                rgba(
                    var(--vz-body-bg-rgb),
                    0.58
                ) 42%,
                rgba(
                    var(--vz-body-bg-rgb),
                    0.78
                ) 100%
            );
    }
}

/* FGenio guest profile gate server-state v2 */
.fgen-guest-profile-gate-zone {
    position: relative;
    isolation: isolate;
}

.fgen-guest-profile-gate-active {
    min-height: 55vh;
}

.fgen-guest-profile-gate-active
[data-guest-profile-gate-blur-target] {
    position: relative;

    -webkit-filter:
        blur(12px)
        brightness(0.60)
        saturate(0.78) !important;

    filter:
        blur(12px)
        brightness(0.60)
        saturate(0.78) !important;

    opacity: 0.62 !important;

    transform:
        scale(0.995);

    transform-origin:
        top center;

    pointer-events: none;
    user-select: none;
}

.fgen-guest-profile-gate-active::before {
    content: '';

    position: absolute;

    inset: 0;

    z-index: 5;

    pointer-events: none;

    background:
        linear-gradient(
            180deg,
            rgba(
                var(--vz-body-bg-rgb),
                0.20
            ) 0%,
            rgba(
                var(--vz-body-bg-rgb),
                0.56
            ) 38%,
            rgba(
                var(--vz-body-bg-rgb),
                0.82
            ) 100%
        );

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

    backdrop-filter:
        blur(8px);
}

.fgen-guest-profile-gate-active
[data-guest-profile-gate] {
    position: absolute;

    z-index: 10;

    top: clamp(
        2rem,
        14vh,
        8rem
    );

    left: 50%;

    width:
        min(
            calc(100% - 2rem),
            520px
        );

    margin: 0 !important;

    transform:
        translateX(-50%);

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            0.10
        );

    background:
        rgba(
            var(--vz-card-bg-rgb),
            0.88
        ) !important;

    -webkit-backdrop-filter:
        blur(22px)
        saturate(125%);

    backdrop-filter:
        blur(22px)
        saturate(125%);

    box-shadow:
        0 24px 70px
        rgba(
            0,
            0,
            0,
            0.32
        );
}

@media (max-width: 991.98px) {
    .fgen-guest-profile-gate-active {
        min-height: 68vh;
    }

    .fgen-guest-profile-gate-active
    [data-guest-profile-gate-blur-target] {
        -webkit-filter:
            blur(15px)
            brightness(0.52)
            saturate(0.72) !important;

        filter:
            blur(15px)
            brightness(0.52)
            saturate(0.72) !important;

        opacity: 0.55 !important;
    }

    .fgen-guest-profile-gate-active::before {
        background:
            linear-gradient(
                180deg,
                rgba(
                    var(--vz-body-bg-rgb),
                    0.28
                ) 0%,
                rgba(
                    var(--vz-body-bg-rgb),
                    0.64
                ) 40%,
                rgba(
                    var(--vz-body-bg-rgb),
                    0.88
                ) 100%
            );
    }

    .fgen-guest-profile-gate-active
    [data-guest-profile-gate] {
        top: 2rem;

        width:
            calc(
                100% - 1.5rem
            );

        border-radius:
            1rem;
    }
}

/* FGenio guest gate CTA position fix v3 */
.fgen-guest-profile-gate-active {
    position: relative;
    scroll-margin-top: 8px;
}

.fgen-guest-profile-gate-active
[data-guest-profile-gate] {
    position: absolute !important;

    top: 1.25rem !important;
    left: 50% !important;

    z-index: 20 !important;

    width:
        min(
            calc(100% - 2rem),
            520px
        ) !important;

    margin: 0 !important;

    transform:
        translateX(-50%) !important;

    opacity: 1 !important;

    -webkit-filter:
        none !important;

    filter:
        none !important;

    pointer-events: auto !important;

    background:
        rgba(
            var(--vz-card-bg-rgb),
            0.94
        ) !important;

    -webkit-backdrop-filter:
        blur(22px)
        saturate(125%);

    backdrop-filter:
        blur(22px)
        saturate(125%);

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

    box-shadow:
        0 22px 60px
        rgba(
            0,
            0,
            0,
            0.32
        );
}

/*
 * Veil must remain below the CTA.
 */
.fgen-guest-profile-gate-active::before,
.fgen-guest-profile-gate-active::after {
    z-index: 5 !important;
}

.fgen-guest-profile-gate-active
[data-guest-profile-gate-blur-target] {
    z-index: 1;
}

@media (max-width: 991.98px) {
    .fgen-guest-profile-gate-active
    [data-guest-profile-gate] {
        top: 1rem !important;

        width:
            calc(
                100% - 1.25rem
            ) !important;

        border-radius:
            1rem;
    }
}

/* FGenio guest gate CTA position fix v4 */
.fgen-guest-profile-gate-active {
    position: relative;
}

.fgen-guest-profile-gate-active
[data-guest-profile-gate] {
    position: absolute !important;

    top: 1.25rem !important;
    left: 50% !important;

    z-index: 30 !important;

    width:
        min(
            calc(100% - 2rem),
            520px
        ) !important;

    margin: 0 !important;

    transform:
        translateX(-50%) !important;

    opacity: 1 !important;

    -webkit-filter:
        none !important;

    filter:
        none !important;

    pointer-events: auto !important;

    background:
        rgba(
            var(--vz-card-bg-rgb),
            0.96
        ) !important;

    -webkit-backdrop-filter:
        blur(20px)
        saturate(125%);

    backdrop-filter:
        blur(20px)
        saturate(125%);

    box-shadow:
        0 20px 55px
        rgba(
            0,
            0,
            0,
            0.30
        );
}

.fgen-guest-profile-gate-active::before,
.fgen-guest-profile-gate-active::after {
    z-index: 5 !important;
}

.fgen-guest-profile-gate-active
[data-guest-profile-gate-blur-target] {
    position: relative;
    z-index: 1;
}

@media (max-width: 991.98px) {
    .fgen-guest-profile-gate-active
    [data-guest-profile-gate] {
        top: 1rem !important;

        width:
            calc(
                100% - 1.25rem
            ) !important;
    }
}

/* FGenio isolated guest profile gate v5 */
.fgen-guest-profile-gate-zone {
    position: relative;
    isolation: isolate;
}

.fgen-guest-profile-gate-active {
    position: relative;
    min-height: 62vh;
    overflow: visible;
}

.fgen-guest-profile-gate-active
[data-guest-profile-gate-blur-target] {
    position: relative;
    z-index: 1;

    -webkit-filter:
        blur(13px)
        brightness(0.58)
        saturate(0.76) !important;

    filter:
        blur(13px)
        brightness(0.58)
        saturate(0.76) !important;

    opacity: 0.60 !important;

    pointer-events: none;
    user-select: none;
}

.fgen-guest-profile-gate-active::before {
    content: '';

    position: absolute;

    inset: 0;

    z-index: 5;

    pointer-events: none;

    background:
        linear-gradient(
            180deg,
            rgba(
                var(--vz-body-bg-rgb),
                0.22
            ) 0%,
            rgba(
                var(--vz-body-bg-rgb),
                0.54
            ) 42%,
            rgba(
                var(--vz-body-bg-rgb),
                0.82
            ) 100%
        );

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

    backdrop-filter:
        blur(8px);
}

.fgen-guest-profile-gate-active
[data-guest-profile-gate] {
    position: absolute !important;

    top: 1.25rem !important;
    left: 50% !important;

    z-index: 30 !important;

    width:
        min(
            calc(100% - 2rem),
            520px
        ) !important;

    margin: 0 !important;

    transform:
        translateX(-50%) !important;

    opacity: 1 !important;

    -webkit-filter:
        none !important;

    filter:
        none !important;

    pointer-events: auto !important;

    background:
        rgba(
            var(--vz-card-bg-rgb),
            0.96
        ) !important;

    -webkit-backdrop-filter:
        blur(20px)
        saturate(125%);

    backdrop-filter:
        blur(20px)
        saturate(125%);

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

    box-shadow:
        0 22px 60px
        rgba(
            0,
            0,
            0,
            0.30
        );
}

@media (max-width: 991.98px) {
    .fgen-guest-profile-gate-active {
        min-height: 72vh;
    }

    .fgen-guest-profile-gate-active
    [data-guest-profile-gate-blur-target] {
        -webkit-filter:
            blur(15px)
            brightness(0.50)
            saturate(0.70) !important;

        filter:
            blur(15px)
            brightness(0.50)
            saturate(0.70) !important;

        opacity: 0.54 !important;
    }

    .fgen-guest-profile-gate-active
    [data-guest-profile-gate] {
        top: 1rem !important;

        width:
            calc(
                100% - 1.25rem
            ) !important;

        border-radius:
            1rem;
    }
}
