.description-preview-content {
    display: flow-root;
}

.description-preview .description-preview-toggle[hidden] {
    display: none !important;
}

@media (max-width: 767.98px) {
    .description-preview.is-ready {
        position: relative;
        overflow-anchor: none;
    }

    .description-preview.is-ready .description-preview-viewport {
        overflow: hidden;
        overflow-anchor: none;
    }

    .description-preview.is-ready:not(.is-expanded)::after {
        position: absolute;
        right: 0;
        bottom: 0;
        left: 0;
        height: min(80px, 50%);
        background: linear-gradient(to bottom, transparent, #fff 85%);
        content: "";
        pointer-events: none;
    }

    .description-preview .description-preview-toggle {
        position: relative;
        z-index: 1;
        display: block;
        width: fit-content;
        max-width: 100%;
        margin: 16px auto 0;
        padding: 8px 16px;
        border: 1px solid transparent;
        border-radius: 999px;
        background: #ffa1b6;
        color: #111;
        font: inherit;
        font-size: 14px;
        font-weight: 600;
        line-height: 1.2;
        cursor: pointer;
        box-shadow: 0 3px 10px rgb(0 0 0 / 14%);
        transition: background-color 160ms ease, box-shadow 160ms ease;
    }

    .description-preview .description-preview-toggle:hover {
        background: #f78da6;
        box-shadow: 0 4px 12px rgb(0 0 0 / 18%);
    }

    .description-preview .description-preview-toggle:focus-visible {
        outline: 2px solid #b52649;
        outline-offset: 3px;
    }

    .description-preview:not(.is-expanded) .description-preview-toggle {
        position: absolute;
        bottom: 8px;
        left: 50%;
        margin: 0;
        transform: translateX(-50%);
        white-space: nowrap;
    }
}