.blog-content,
.ck-content {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    line-height: 1.7;
}

.blog-content figure.blog-artifact,
.ck-content figure.blog-artifact,
.blog-content .ai-chart-wrapper,
.ck-content .ai-chart-wrapper {
    margin: 1.5rem auto;
    text-align: center;
}

.blog-content img,
.ck-content img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    max-width: 600px;
    max-height: 400px;
    width: 100%;
    height: auto;
    object-fit: contain;
}

.blog-content .ai-chart-wrapper,
.ck-content .ai-chart-wrapper {
    width: 100%;
    max-width: 600px;
    max-height: 400px;
    aspect-ratio: 3 / 2;
}

.blog-content .ai-chart-wrapper canvas,
.ck-content .ai-chart-wrapper canvas {
    width: 100% !important;
    height: 100% !important;
}

.blog-content .ai-chart-placeholder,
.ck-content .ai-chart-placeholder {
    width: 100%;
    max-width: 600px;
    max-height: 400px;
    height: auto;
    display: block;
    margin: 1.5rem auto;
    object-fit: contain;
}

.blog-content .blog-artifact-title,
.ck-content .blog-artifact-title,
.blog-content .ai-chart-caption,
.ck-content .ai-chart-caption {
    text-align: center;
    color: #525252;
    font-size: 0.95rem;
    margin-top: 0.5rem;
}

.blog-content .ai-chart-token,
.ck-content .ai-chart-token {
    display: none;
}