.list-card-with-thumbnail { display: grid; grid-template-columns: minmax(0, 1fr) clamp(9rem, 17vw, 12rem); align-items: start; gap: 1rem; }
.list-card-content { min-width: 0; overflow-wrap: anywhere; }
.list-thumbnail { width: 100%; aspect-ratio: 8 / 5; margin: 0; background: var(--color-surface-muted, #eef0f2); border: 1px solid var(--color-border, #ced4d8); border-radius: .65rem; overflow: hidden; }
.list-thumbnail img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; }
.list-thumbnail-empty { display: grid; place-items: center; color: var(--color-muted, #5f6b64); }
.list-thumbnail-empty svg { width: 2.5rem; height: 2.5rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 40rem) {
    .list-card-with-thumbnail { grid-template-columns: minmax(0, 1fr) 6.5rem; gap: .65rem; }
    .list-card-content .details { grid-template-columns: minmax(0, 1fr); gap: .25rem; }
    .list-card-content .details dd { margin: 0 0 .5rem; }
    .list-card-content .page-heading { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 23rem) { .list-card-with-thumbnail { grid-template-columns: minmax(0, 1fr) 5rem; } }