:root {
    --qm-paid-ink: #292621;
    --qm-paid-muted: #77736e;
    --qm-paid-line: #eeeae4;
    --qm-paid-warm: #b8772f;
    --qm-paid-orange: #d45b2e;
    --qm-paid-green: #276751;
    --qm-paid-surface: #fff;
    --qm-paid-gradient: linear-gradient(110deg, #f6c453 0%, #ff9c68 42%, #ed6f9b 100%);
    --qm-paid-gradient-hover: linear-gradient(110deg, #f7b83f 0%, #ff875f 42%, #e85d8f 100%);
    --qm-paid-gradient-ink: #442831;
}

.qm-paid-download {
    width: 100%;
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(76, 57, 35, 0.08);
    border-radius: 8px;
    background: var(--qm-paid-surface);
    color: var(--qm-paid-ink);
    box-shadow: 0 10px 32px rgba(67, 49, 29, 0.08);
}

/* The legacy inline-download component is a three-column grid. This shared
 * card keeps its JS hook, so explicitly isolate its layout on article pages. */
.qm-article-detail-refined .qm-paid-download.qm-article-inline-download {
    display: block;
    grid-template-columns: none;
    gap: 0;
    align-items: initial;
    padding: 0;
    background: var(--qm-paid-surface);
}

.qm-article-detail-refined .qm-paid-download.qm-article-inline-download::before {
    content: none;
    display: none;
}

.qm-article-aside-stack > .qm-paid-download {
    position: static;
    z-index: auto;
}

.qm-paid-download__product {
    display: grid;
    grid-template-columns: 106px minmax(0, 1fr);
    gap: 14px;
    padding: 14px;
    background: #fff;
}

.qm-paid-download__product.has-no-cover {
    grid-template-columns: minmax(0, 1fr);
}

.qm-paid-download__cover {
    position: relative;
    width: 106px;
    aspect-ratio: 0.82;
    overflow: hidden;
    border-radius: 7px;
    background: #f3eee7;
}

.qm-paid-download__cover > span {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    padding: 5px 8px;
    border-radius: 0 0 6px 0;
    background: #efb55d;
    color: #674116;
    font-size: 11px;
    line-height: 1;
}

.qm-paid-download__cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.qm-paid-download__summary {
    align-self: center;
    min-width: 0;
}

.qm-paid-download__summary h2 {
    display: -webkit-box;
    overflow: hidden;
    margin: 0;
    color: var(--qm-paid-ink);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.45;
    letter-spacing: 0;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.qm-paid-download__summary > p {
    display: -webkit-box;
    overflow: hidden;
    margin: 5px 0 0;
    color: #8a8580;
    font-size: 12px;
    line-height: 1.6;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.qm-paid-download__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 8px;
}

.qm-paid-download__badges span {
    max-width: 100%;
    overflow: hidden;
    padding: 4px 7px;
    border-radius: 5px;
    background: #f7f0e8;
    color: #8a673e;
    font-size: 11px;
    line-height: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qm-paid-download__quick-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px 9px;
    margin-top: 10px;
    color: #77736e;
    font-size: 11px;
}

.qm-paid-download__quick-meta span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.qm-paid-download__quick-meta span + span::before {
    content: "";
    width: 1px;
    height: 11px;
    margin-right: 4px;
    background: #d8d3cd;
}

.qm-paid-download__body {
    margin: 0;
    padding: 14px 14px 12px;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.qm-paid-download__regular-price {
    display: flex;
    align-items: baseline;
    min-height: 36px;
    color: var(--qm-paid-orange);
}

.qm-paid-download__regular-price small {
    margin-left: 4px;
    font-size: 12px;
    font-weight: 700;
    background: var(--qm-paid-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.qm-paid-download__regular-price strong {
    font-size: 30px;
    line-height: 1;
    background: var(--qm-paid-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.qm-paid-download__regular-price span {
    margin-left: 8px;
    color: #8d8882;
    font-size: 11px;
}

.qm-paid-download__member-offer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 10px;
    padding: 12px;
    border-radius: 8px;
    background: linear-gradient(110deg, #fff0dc 0%, #fff8ef 58%, #faead9 100%);
}

.qm-paid-download__member-copy {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    min-width: 0;
    gap: 5px 8px;
}

.qm-paid-download__member-copy > span {
    flex-basis: 100%;
    color: #9a632a;
    font-size: 11px;
}

.qm-paid-download__member-copy > span i {
    margin-right: 6px;
}

.qm-paid-download__member-copy strong {
    font-size: 22px;
    line-height: 1;
    background: var(--qm-paid-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.qm-paid-download__member-copy strong small {
    margin-left: 4px;
    font-size: 12px;
    background: inherit;
    -webkit-background-clip: inherit;
    background-clip: inherit;
    -webkit-text-fill-color: inherit;
    color: inherit;
}

.qm-paid-download__member-copy em {
    padding: 3px 6px;
    border-radius: 10px;
    background: #ffe0c4;
    color: #d0602c;
    font-size: 10px;
    font-style: normal;
}

.qm-paid-download__member-offer > a {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 0 10px;
    border-radius: 6px;
    background: var(--qm-paid-gradient);
    color: var(--qm-paid-gradient-ink);
    font-size: 11px;
    font-weight: 600;
}

.qm-paid-download__member-offer > a:hover {
    background: var(--qm-paid-gradient-hover);
    color: var(--qm-paid-gradient-ink);
}

.qm-paid-download__benefits {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 5px;
    padding: 13px 0 11px;
    border-bottom: 1px solid var(--qm-paid-line);
    color: #645f5a;
    font-size: 10px;
}

.qm-paid-download__benefits span,
.qm-paid-download__benefits a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    gap: 5px;
    color: inherit;
    text-align: center;
}

.qm-paid-download__benefits a {
    grid-column: 1 / -1;
    margin-top: 3px;
    color: #86673f;
}

.qm-paid-download__benefits i {
    color: #c88c45;
}

.qm-paid-download__properties {
    padding: 14px 0 10px;
}

.qm-paid-download__properties h3 {
    margin: 0 0 8px;
    color: var(--qm-paid-ink);
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0;
}

.qm-paid-download__properties dl {
    margin: 0;
}

.qm-paid-download__properties dl > div {
    display: grid;
    grid-template-columns: minmax(88px, auto) minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-height: 34px;
    border-bottom: 1px dashed #eeeae5;
}

.qm-paid-download__properties dl > div:last-child {
    border-bottom: 0;
}

.qm-paid-download__properties dt,
.qm-paid-download__properties dd {
    margin: 0;
    font-size: 11px;
}

.qm-paid-download__properties dt {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #77726c;
}

.qm-paid-download__properties dt i {
    width: 13px;
    color: #a9a6a1;
    text-align: center;
}

.qm-paid-download__properties dd {
    overflow: hidden;
    color: #55504b;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qm-paid-download__assurances {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    margin: 0 -2px 10px;
    padding: 10px 0;
    border-radius: 7px;
    background: #f7f8f5;
}

.qm-paid-download__assurances > span {
    display: grid;
    grid-template-columns: 25px minmax(0, 1fr);
    padding: 0 7px;
    border-right: 1px solid #e8ebe5;
}

.qm-paid-download__assurances > span:last-child {
    border-right: 0;
}

.qm-paid-download__assurances i {
    grid-row: 1 / 3;
    align-self: center;
    color: var(--qm-paid-green);
    font-size: 18px;
}

.qm-paid-download__assurances b,
.qm-paid-download__assurances small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qm-paid-download__assurances b {
    color: #416556;
    font-size: 10px;
}

.qm-paid-download__assurances small {
    color: #858984;
    font-size: 8px;
}

.qm-paid-download__coupon {
    margin-bottom: 10px;
    padding: 9px;
    border: 1px dashed rgba(190, 122, 51, 0.35);
    border-radius: 7px;
    background: #fffaf3;
}

.qm-paid-download__primary,
.qm-paid-download__member-button,
.qm-paid-download__preview {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 46px;
    padding: 0 14px;
    border: 0;
    border-radius: 7px;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0;
    text-align: center;
    transition: transform 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}

.qm-paid-download__actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    width: 100%;
}

.qm-paid-download__actions.has-single-action {
    grid-template-columns: minmax(0, 1fr);
}

.qm-paid-download__actions .qm-paid-download__primary,
.qm-paid-download__actions .qm-paid-download__member-button {
    min-width: 0;
    min-height: 40px;
    padding: 0 8px;
    font-size: 12px;
}

.qm-article-detail-refined .qm-paid-download :is(
    .qm-paid-download__primary,
    .qm-paid-download__member-button,
    .qm-paid-download__preview,
    .qm-paid-download__member-offer > a
) {
    border-radius: 7px !important;
    color: var(--qm-paid-gradient-ink) !important;
}

.qm-paid-download__primary {
    gap: 10px;
    background: var(--qm-paid-gradient);
    color: var(--qm-paid-gradient-ink);
    box-shadow: 0 7px 14px rgba(236, 110, 137, 0.22);
}

.qm-paid-download__primary:hover,
.qm-paid-download__primary:focus-visible {
    background: var(--qm-paid-gradient-hover);
    color: var(--qm-paid-gradient-ink);
    transform: translateY(-1px);
}

.qm-paid-download__primary:disabled {
    cursor: not-allowed;
    opacity: 0.55;
    transform: none;
}

.qm-paid-download__primary span {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 2px 5px;
    min-width: 0;
}

.qm-paid-download__primary b {
    font-size: 12px;
}

.qm-paid-download__member-button {
    gap: 8px;
    margin-top: 0;
    background: var(--qm-paid-gradient);
    color: var(--qm-paid-gradient-ink);
    box-shadow: 0 5px 12px rgba(236, 110, 137, 0.16);
}

.qm-paid-download__actions :is(
    .qm-paid-download__primary,
    .qm-paid-download__member-button
) :is(i, span, b) {
    color: inherit !important;
}

.qm-paid-download__member-button:hover,
.qm-paid-download__member-button:focus-visible {
    background: var(--qm-paid-gradient-hover);
    color: var(--qm-paid-gradient-ink);
}

.qm-paid-download__preview {
    min-height: 36px;
    margin-top: 7px;
    border: 0;
    background: var(--qm-paid-gradient);
    color: var(--qm-paid-gradient-ink);
    font-size: 12px;
    font-weight: 600;
    box-shadow: 0 5px 12px rgba(236, 110, 137, 0.14);
}

.qm-paid-download__preview:hover,
.qm-paid-download__preview:focus-visible {
    background: var(--qm-paid-gradient-hover);
    color: var(--qm-paid-gradient-ink);
}

.qm-paid-download__preview i {
    margin-right: 7px;
}

.qm-paid-download__panel {
    margin-top: 10px;
}

.qm-paid-download__panel[hidden] {
    display: none !important;
}

.qm-paid-download__order {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 40px;
    margin-top: 9px;
    padding: 0 10px;
    border: 1px solid #f1eee9;
    border-radius: 7px;
    color: #8a857f;
    font-size: 10px;
}

.qm-paid-download__order span {
    display: flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
}

.qm-paid-download__order:hover {
    color: #5e5953;
}

.qm-paid-download--material {
    position: static;
}

.qm-paid-download--software {
    width: min(100%, 430px);
    flex: 0 0 min(100%, 430px);
    align-self: stretch;
}

.qm-paid-download--software .qm-paid-download__product {
    grid-template-columns: 84px minmax(0, 1fr);
}

.qm-paid-download--software .qm-paid-download__cover {
    width: 84px;
    aspect-ratio: 1;
}

html.dark .qm-paid-download,
body.dark .qm-paid-download {
    --qm-paid-ink: #f4f1ed;
    --qm-paid-muted: #aaa39c;
    --qm-paid-line: rgba(255, 255, 255, 0.1);
    --qm-paid-surface: #24211e;
    --qm-paid-gradient: linear-gradient(110deg, #ffd86a 0%, #ffad78 42%, #f58eae 100%);
    --qm-paid-gradient-hover: linear-gradient(110deg, #ffcc4d 0%, #ff9969 42%, #ef769e 100%);
    --qm-paid-gradient-ink: #382329;
    border-color: rgba(255, 255, 255, 0.08);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.24);
}

html.dark .qm-article-detail-refined .qm-paid-download.qm-article-inline-download,
body.dark .qm-article-detail-refined .qm-paid-download.qm-article-inline-download {
    background: var(--qm-paid-surface);
}

html.dark .qm-article-detail-refined .qm-paid-download.qm-article-inline-download :is(
    .qm-paid-download__primary,
    .qm-paid-download__member-button,
    .qm-paid-download__preview,
    .qm-paid-download__member-offer > a
),
body.dark .qm-article-detail-refined .qm-paid-download.qm-article-inline-download :is(
    .qm-paid-download__primary,
    .qm-paid-download__member-button,
    .qm-paid-download__preview,
    .qm-paid-download__member-offer > a
) {
    color: var(--qm-paid-gradient-ink) !important;
}

html.dark .qm-paid-download__product,
body.dark .qm-paid-download__product {
    border-color: rgba(255, 255, 255, 0.08);
    background: #24211e;
}

html.dark .qm-paid-download__body,
body.dark .qm-paid-download__body {
    border: 0;
    background: transparent;
}

html.dark .qm-paid-download__member-offer,
body.dark .qm-paid-download__member-offer {
    border: 1px solid rgba(255, 194, 114, 0.14);
    background: linear-gradient(
        110deg,
        rgba(255, 216, 106, 0.12) 0%,
        rgba(255, 173, 120, 0.08) 52%,
        rgba(245, 142, 174, 0.12) 100%
    );
}

html.dark .qm-paid-download__member-copy > span,
body.dark .qm-paid-download__member-copy > span {
    color: #d9c1aa;
}

html.dark .qm-paid-download__member-copy em,
body.dark .qm-paid-download__member-copy em {
    background: rgba(255, 173, 120, 0.14);
    color: #ffc285;
}

html.dark .qm-paid-download__summary > p,
body.dark .qm-paid-download__summary > p,
html.dark .qm-paid-download__quick-meta,
body.dark .qm-paid-download__quick-meta,
html.dark .qm-paid-download__regular-price span,
body.dark .qm-paid-download__regular-price span,
html.dark .qm-paid-download__properties dt,
body.dark .qm-paid-download__properties dt,
html.dark .qm-paid-download__order,
body.dark .qm-paid-download__order {
    color: #aaa39c;
}

html.dark .qm-paid-download__properties dd,
body.dark .qm-paid-download__properties dd {
    color: #e0dad4;
}

html.dark .qm-paid-download__properties dl > div,
body.dark .qm-paid-download__properties dl > div {
    border-color: rgba(255, 255, 255, 0.08);
}

html.dark .qm-paid-download__benefits,
body.dark .qm-paid-download__benefits,
html.dark .qm-paid-download__preview,
body.dark .qm-paid-download__preview,
html.dark .qm-paid-download__order,
body.dark .qm-paid-download__order {
    border-color: rgba(255, 255, 255, 0.09);
}

html.dark .qm-paid-download__assurances,
body.dark .qm-paid-download__assurances {
    background: #2c2d29;
}

html.dark .qm-paid-download__preview,
body.dark .qm-paid-download__preview {
    background: var(--qm-paid-gradient);
    color: var(--qm-paid-gradient-ink);
}

@media (max-width: 1199.98px) {
    .qm-paid-download--software {
        width: 100%;
        flex-basis: 100%;
    }
}

@media (max-width: 991.98px) {
    .qm-article-aside-stack > .qm-paid-download,
    .qm-paid-download--material {
        position: static;
    }
}

@media (max-width: 575.98px) {
    .qm-paid-download__product {
        grid-template-columns: 86px minmax(0, 1fr);
        gap: 11px;
        padding: 12px;
    }

    .qm-paid-download__cover {
        width: 86px;
    }

    .qm-paid-download__summary h2 {
        font-size: 16px;
    }

    .qm-paid-download__summary > p {
        -webkit-line-clamp: 1;
    }

    .qm-paid-download__body {
        margin: 0;
        padding: 12px 12px 10px;
    }

    .qm-paid-download__member-offer {
        align-items: stretch;
        flex-direction: column;
    }

    .qm-paid-download__member-offer > a {
        width: auto;
        align-self: flex-start;
    }

    .qm-paid-download__benefits {
        grid-template-columns: 1fr 1fr;
        row-gap: 10px;
    }

    .qm-paid-download__benefits a {
        grid-column: auto;
        margin: 0;
    }

    .qm-paid-download__assurances > span {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
    }

    .qm-paid-download__assurances i {
        grid-row: auto;
        margin-bottom: 5px;
    }

    .qm-paid-download__assurances small {
        display: none;
    }

    .qm-paid-download__properties dl > div {
        grid-template-columns: minmax(86px, auto) minmax(0, 1fr);
    }
}

@media (prefers-reduced-motion: reduce) {
    .qm-paid-download__primary,
    .qm-paid-download__member-button,
    .qm-paid-download__preview {
        transition: none;
    }

    .qm-paid-download__primary:hover {
        transform: none;
    }
}