.demo-card {
    min-height: 11rem;
}

.demo-card .video-card-thumbnail {
    aspect-ratio: 2.4 / 1;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 0.75rem;
}

.demo-card-token {
    font-family: var(--font-mono);
    font-size: 0.75rem;
    color: var(--color-base);
    background: var(--color-primary);
    padding: 0.2rem 0.45rem;
}

.demo-card-body {
    pointer-events: auto;
}

.demo-card-body p {
    margin: 0;
    color: var(--color-subtle);
    font-size: 0.9rem;
    line-height: 1.45;
}

.demo-context {
    margin: 1rem 0 1.5rem;
    padding: 0.75rem 1rem;
    border-inline-start: 3px solid var(--color-primary);
    background: var(--color-surface);
    color: var(--color-subtle);
}

.demo-context strong {
    color: var(--color-text);
}
