body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    line-height: 1.6;
    background: #f4f6f9;
    color: #333;
    padding: 20px;
}
.container {
    max-width: 800px;
    margin: 0 auto;
}
.post {
    background: #fff;
    padding: 20px;
    margin-bottom: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
.post h2 { margin-top: 0; color: #2c3e50; }

small { color: #7f8c8d; }

/* 针对 Markdown 正文内部的图片进行样式约束 */
.markdown-content img {
    max-width: 100%;      /* 核心：限制图片最大宽度不超过外层白框 */
    height: auto;         /* 核心：高度自动等比缩放，防止图片被拉伸变形 */

    /* 下面是美化建议（可选），让排版更有质感 */
    display: block;       /* 让图片独占一行 */
    margin: 20px auto;    /* 上下留白 20px，左右居中对齐 */
    border-radius: 8px;   /* 给图片加个微微的圆角，和外层卡片呼应 */
    box-shadow: 0 4px 8px rgba(0,0,0,0.1); /* 加一点淡淡的阴影，增加层次感 */
}

/* 针对所有超链接的全局样式 */
a {
    color: #2c3e50;            /* 默认状态：深沉的蓝灰色 */
    text-decoration: none;     /* 去掉默认的下划线，看起来更清爽 */
    transition: color 0.3s;    /* 添加 0.3 秒的平滑颜色渐变动画 */
}

/* 鼠标悬停在链接上时的样式 (:hover 伪类) */
a:hover {
    color: #3498db;            /* 鼠标放上去时变成亮蓝色 */
}

/* 已经访问过的链接样式 (:visited 伪类) */
a:visited {
    color: #2c3e50;            /* 强制已访问的链接和默认颜色保持一致，不再变紫！ */
}