.hljs {
  padding: 1em;
}

@font-face {
  font-family: 'LXGW WenKai GB';
  src: url('https://fonts.medprober.com/LXGWWenKai-Regular.woff2') format('woff2'),
       url('https://fonts.medprober.com/LXGWWenKai-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}


/* --------- 全局及首页自定义样式 --------- */

/* 定义 CSS 变量，便于统一管理和修改主题样式 */
:root {
  --primary-text-color: #000; /* 主文本颜色：黑色 */
  --secondary-text-color: #666; /* 次要文本颜色：中等深灰，用于落款等 */

  /* 以下变量可能不再直接使用，但保留作为参考 */
  --container-bg-color: rgba(255, 255, 255, 0.85); 
  --container-border-color: #ccc; 
  --container-shadow-color: rgba(0, 0, 0, 0.15); 
  --border-radius-large: 12px;
  --spacing-medium: 2em;
  --spacing-large: 3em;

  /* === 核心：定义全局基础字体栈 === */
  --font-base: Optima, 'Lucida Sans', Calibri, Candara, Arial, 'source-han-serif-sc', 'Source Han Serif SC', 'Source Han Serif CN', 'Source Han Serif TC', 'Source Han Serif TW', 'Source Han Serif', 'Noto Serif CJK SC', 'Songti SC', 'Microsoft YaHei', sans-serif;

  /* === 定义桌面端诗歌的回退楷体字体栈 === */
  --font-poem: "KaiTi", "楷体", "STKaiti", "KaiTi_GB2312", serif; 

  /* === 定义手机端诗歌使用的霞鹜文楷网络字体名称 === */
  --font-poem-mobile-webfont: 'LXGW WenKai GB'; 

  /* 诗歌字体大小和行高变量 */
  --poem-font-size-desktop: 1.25rem; 
  --poem-line-height-desktop: 1.7; 
  --poem-font-size-mobile: 1.1rem; 
  --poem-line-height-mobile: 1.6; 
}

/* === 全局 body 样式 === */
body {
  font-family: var(--font-base); /* 应用基础字体到整个网站 */
  color: var(--primary-text-color); /* 应用主文本颜色 */
}

/* === 诗词文本容器样式 (移除卡片效果，专注于文本展示) === */
.poem-text-container {
  max-width: 700px; /* 限制诗歌文本宽度 */
  margin: 5vh auto; /* 垂直居中，水平居中 */
  padding: var(--spacing-medium) var(--spacing-large); /* 内部边距 */
  color: var(--primary-text-color); /* 诗词文本颜色继承自 body，这里再次明确 */
  position: relative; /* 确保创建堆叠上下文 */
  z-index: 1; /* 确保诗词文本在最上层，位于背景图之下 */
  animation: fadeInText 3s ease forwards; /* 渐显动画 */
  text-align: center; /* 居中显示诗歌文本 */
  /* white-space: pre-wrap; 从这里移除，移到 .poem-content */
}

/* === 应用于 <pre class="poem-content"> 的样式 === */
.poem-text-container .poem-content {
  /* 桌面端诗歌字体：优先使用系统楷体，因为 body 已设为全局字体 */
  font-family: var(--font-poem) !important; 
  font-size: var(--poem-font-size-desktop); 
  line-height: var(--poem-line-height-desktop); 
  white-space: pre-wrap; /* 保留空白和换行 */
  margin-top: 0; /* 移除 <pre> 默认的 margin-top */
  margin-bottom: 0; /* 移除 <pre> 默认的 margin-bottom */
}

/* 诗词落款样式 (选择器已更新为 .poem-text-container .author-signature) */
.poem-text-container .author-signature {
  display: block;
  text-align: right;
  margin-top: 1.5em;
  font-size: 0.9em;
  color: var(--secondary-text-color); /* 落款颜色 */
  font-style: normal;
  letter-spacing: 0.05em;
}

/* 渐显动画 */
@keyframes fadeInText {
  0% { opacity: 0; transform: translateY(20px);}
  100% { opacity: 1; transform: translateY(0);}
}

/* === 背景图片统一样式 === */
.poem-bg {
  position: fixed; /* 固定在视口 */
  top: 0; left: 0; right: 0; bottom: 0;
  background: no-repeat center center; /* 背景图片不重复，居中 */
  background-size: cover; /* 覆盖整个元素，可能裁剪 */
  background-image: url('/img/chunjiang-desktop.png'); /* 默认背景图片（桌面版） */
  filter: grayscale(100%) contrast(0.85) brightness(0.95); /* 灰度滤镜效果 */
  opacity: 0.5; /* 背景不透明度，可根据背景图的明暗和文字颜色调整 */
  z-index: -2; /* 放在所有内容的底层 */
  transform: translate3d(0, 0, 0); /* 开启硬件加速 */
  transition: transform 0.1s ease-out; /* 平滑过渡 */
}

/* 媒体查询：根据屏幕尺寸加载不同背景图和调整文本样式 */

/* PC桌面版 */
@media (min-width: 1025px) {
  .poem-bg { 
    /* JPG 兜底（所有浏览器支持） */
    background-image: url('https://img.medprober.com/chunjiang-desktop.jpg');

    /* WebP 优先（新浏览器用 WebP） */
    background-image: image-set(
      url('https://img.medprober.com/chunjiang-desktop.webp') type('image/webp'),
      url('https://img.medprober.com/chunjiang-desktop.jpg') type('image/jpeg')
    );
  }
  /* === 新增：桌面版 blockquote 样式 === */
  blockquote {
    border-left: none; /* 1. 去掉左侧的 3px 线条 */
    font-family: var(--font-poem) !important; /* 2. 字体改成楷体字，使用 !important 确保覆盖全局字体 */
    color: var(--secondary-text-color); /* 3. 字体颜色稍淡 */
    /*
     * 保持 blockquote 原有的 margin, padding 等，除非你想修改
     * margin: 1em 0;
     * padding: 0 2em;
     */
  }
}
/* 平板版 */
@media (min-width: 768px) and (max-width: 1024px) {
  .poem-bg { 
    background-image: url('https://img.medprober.com/chunjiang-mobile.jpg'); /* 用手机jpg替代 */
    background-image: image-set(
      url('https://img.medprober.com/chunjiang-mobile.webp') type('image/webp'),
      url('https://img.medprober.com/chunjiang-mobile.jpg') type('image/jpeg')
    );
  }
}
/* 手机版 */
@media (max-width: 767px) {
  .poem-bg { 
    background-image: url('https://img.medprober.com/chunjiang-mobile.jpg');
    background-image: image-set(
      url('https://img.medprober.com/chunjiang-mobile.webp') type('image/webp'),
      url('https://img.medprober.com/chunjiang-mobile.jpg') type('image/jpeg')
    );
  }
    /* === 关键：让手机端 body 优先使用霞鹜文楷 === */
  body { /* 注意：这里是 body 元素，而非 poem-text-container */
    font-family: var(--font-poem-mobile-webfont), Optima, 'Lucida Sans', Calibri, Candara, Arial, sans-serif !important; 
    /* !important 确保它覆盖桌面 body 的设置 */
    /* 回退字体链需要重新考虑，确保中英文都有可靠的回退 */
  }
  
  .poem-text-container .poem-content { 
    font-size: var(--poem-font-size-mobile); /* 手机端诗歌字体大小 */
    /* 手机端诗歌字体：优先使用霞鹜文楷，回退到系统楷体 */
    font-family: var(--font-poem-mobile-webfont), "KaiTi", "楷体", serif !important; 
    line-height: var(--poem-line-height-mobile);
  }
  .poem-text-container { /* 手机版容器内边距 */
    padding: 1.5em 2em;
  }
  /* 手机端 blockquote 美化 */
  blockquote {
    font-family: 'LXGW WenKai GB', serif;
    font-size: 15px;
    line-height: 1.6;
    color: #AAAAAA;
    padding: 0.8em 1em;
    margin: 1.5em 0;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 6px;
    font-style: normal;
    text-indent: 1.5em;
  }
}

/* === 针对 .masthead .tagline 类，取消斜体 === */
.masthead .tagline { 
  font-style: normal; /* 关键：取消斜体，让文字直立 */
  color: #AAAAAA; /* 字体变浅 */
}
/* 手机端适配：同样确保手机上也是直立的 */
@media (max-width: 767px) {
  .masthead .tagline { 
    font-style: normal; 
    color: #AAAAAA; /* 手机端字体变浅 */
  }
}

/*
 * 注意：
 * - 确保你的图片文件 (chunjiang-desktop.png, chunjiang-tablet.png, chunjiang-mobile.png)
 * 位于 static/img/ 目录下，并且文件名正确。
 * - 确保字体文件 (LXGWWenKai-Regular.woff2, LXGWWenKai-Regular.ttf)
 * 位于 static/fonts/ 目录下，并且文件名正确。
 * - 每次修改 CSS 后，务必重建 Hugo 网站，并强制刷新浏览器缓存。
 */

/* --------- custom.css END --------- */

/* --------- 正文图片浮动于右侧 --------- */

/* 图片浮动容器 */
.article-image {
  margin: 1em 0;
  overflow: auto;
}

/* 右浮动 */
.article-image.float-right {
  float: right;
  margin: 0 0 1em 1em;
  min-width: 40px;
  max-width: 150px;
}

/* 左浮动 */
.article-image.float-left {
  float: left;
  margin: 0 1em 1em 0;
  max-width: min(25%, 200px);
  min-width: 40px;
}

/* 图片基础样式 */
.article-image img {
  max-width: 100%;
  height: auto;
  display: block;
  border-radius: 6px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);

  /* 默认灰度处理 */
  filter: grayscale(100%);
  transition: filter 0.3s ease;
}

/* 鼠标悬停恢复彩色 */
.article-image img:hover {
  filter: grayscale(0%);
}

/* 手机版自适应 */
@media (max-width: 768px) {
  .article-image {
    float: none;
    margin: 1em auto;
    display: block;
    max-width: 80%;
  }
}