/* related-cards-3x2.force.css — 强制 3×2 竖版卡片 */
.related .related-list,
.related-list{ display:grid!important; grid-template-columns:repeat(3,1fr)!important; gap:16px!important; list-style:none; padding:0; margin:0; }
.related-list > li{ min-width:0!important; }
.related .related-item, .related-item{ display:block!important; min-width:0!important; background:#fff; border:1px solid var(--c-border,#e5e7eb); border-radius:12px; padding:10px; height:100%; box-shadow:0 1px 0 rgba(0,0,0,.02); }
.related-item:hover{ background:var(--c-soft,#f8fafc); text-decoration:none; box-shadow:0 6px 18px rgba(0,0,0,.06); }
.related-item .ri-thumb{ display:block!important; float:none!important; width:100%!important; height:auto!important; aspect-ratio:4/3; margin:0 0 8px 0!important; border-radius:10px; overflow:hidden; background:#f1f5f9; border:1px solid var(--c-border,#e5e7eb); }
.related-item .ri-thumb img{ display:block!important; width:100%!important; height:100%!important; object-fit:cover!important; }
:root{ --lines:2; }
.related-item .ri-title{ display:-webkit-box!important; -webkit-line-clamp:var(--lines); -webkit-box-orient:vertical; overflow:hidden; line-height:1.55; font-size:15px; color:#0f172a; }
@media (max-width:900px){ .related .related-list, .related-list{ grid-template-columns:repeat(2,1fr)!important; } }
@media (max-width:640px){ .related .related-list, .related-list{ grid-template-columns:1fr!important; } }

}

/* ========= 正文基础排版（如已添加可略过） ========= */
.entry-content {
  font-family: "PingFang SC","Microsoft YaHei",Arial,Helvetica,sans-serif;
  font-size: 16px;
  line-height: 1.8;
  color: #333;
}
.entry-content p,
.entry-content li { margin: 0.8em 0; }

/* ========= H2 渐变/动画左侧色条 ========= */
.entry-content h2 {
  position: relative;
  font-size: 22px;
  line-height: 1.5;
  margin: 1.8em 0 1em;
  padding-left: 18px; /* 给左侧色条留空间 */
  color: #111;
  font-weight: 700;
}

/* A) 循环流动的渐变色条（自动动画） */
.entry-content h2::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.2em;                 /* 上下留一点呼吸感，避免顶到字 */
  bottom: 0.2em;
  width: 6px;                 /* 色条宽度 */
  border-radius: 3px;
  background: linear-gradient(
    180deg,
    #0ea5e9 0%,   /* 品牌蓝 */
    #22c55e 25%,  /* 清绿 */
    #f59e0b 50%,  /* 橙色 */
    #ef4444 75%,  /* 红色 */
    #0ea5e9 100%  /* 回到蓝 */
  );
  background-size: 100% 300%;
  animation: hyStripeFlow 6s linear infinite;
}

/* B) 悬停时发光（可选） */
.entry-content h2:hover::before {
  box-shadow: 0 0 12px rgba(14,165,233,.35);
  width: 7px;                 /* 轻微放大，增强存在感 */
  transition: width .2s ease, box-shadow .2s ease;
}

/* 动画关键帧：上下缓慢流动 */
@keyframes hyStripeFlow {
  0%   { background-position: 0% 0%; }
  100% { background-position: 0% 100%; }
}

/* 低运动偏好：禁用动画，静态渐变 */
@media (prefers-reduced-motion: reduce) {
  .entry-content h2::before {
    animation: none;
    background-position: 0 50%;
  }
}

/* 小屏微调 */
@media (max-width: 576px) {
  .entry-content { font-size: 15px; }
  .entry-content h2 { font-size: 20px; padding-left: 16px; }
  .entry-content h2::before { width: 5px; }
}

/* =========================
 * 文章正文排版（仅 .entry-content）
 * ========================= */
.entry-content {
  --font-main: "PingFang SC","Microsoft YaHei",Arial,Helvetica,sans-serif;
  --font-mono: ui-monospace, Menlo, Consolas, "Liberation Mono", monospace;
  --fg: #333;
  --muted: #666;
  --light: #999;
  --link: #0ea5e9;
  --link-hover: #0284c7;
  --hr: #e5e7eb;
  --border: #e5e7eb;
  --bg-code: #f8fafc;
  --bg-quote: #fbfdff;
  --h2-stripe-1: #0ea5e9;
  --h2-stripe-2: #22c55e;
  --h2-stripe-3: #f59e0b;
  --h2-stripe-4: #ef4444;

  font-family: var(--font-main);
  font-size: 16px;
  line-height: 1.85;
  color: var(--fg);
  word-break: break-word;
}

/* 段落与基本元素 */
.entry-content p { margin: 0.9em 0; }
.entry-content strong { font-weight: 700; }
.entry-content em { font-style: italic; }
.entry-content a { color: var(--link); text-decoration: none; }
.entry-content a:hover { text-decoration: underline; color: var(--link-hover); }
.entry-content hr {
  border: none;
  border-top: 1px dashed var(--hr);
  margin: 2rem 0;
}

/* 列表 */
.entry-content ul,
.entry-content ol { margin: 0.9em 0 0.9em 1.5em; }
.entry-content li { margin: 0.4em 0; }
.entry-content li > ul,
.entry-content li > ol { margin-top: 0.4em; }

/* 图片与图文 */
.entry-content img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 1em auto;
  border-radius: 6px;
}
.entry-content figure { margin: 1.2em 0; text-align: center; }
.entry-content figcaption {
  font-size: 13px;
  color: var(--light);
  margin-top: 0.4em;
}

/* 标题体系（含 H2 左侧渐变色条 + 轻动画） */
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
  color: #111;
  margin: 1.6em 0 0.8em;
  line-height: 1.35;
  font-weight: 700;
}

.entry-content h1 { font-size: 30px; }
.entry-content h2 { font-size: 22px; padding-left: 18px; position: relative; }
.entry-content h3 { font-size: 18px; padding-left: 12px; border-left: 3px solid #d4d4d8; }
.entry-content h4 { font-size: 16px; }
.entry-content h5 { font-size: 15px; }
.entry-content h6 { font-size: 14px; color: var(--muted); }

/* H2 渐变色条（自动流动） */
.entry-content h2::before {
  content: "";
  position: absolute;
  left: 0; top: 0.22em; bottom: 0.22em;
  width: 6px; border-radius: 3px;
  background: linear-gradient(
    180deg,
    var(--h2-stripe-1) 0%,
    var(--h2-stripe-2) 25%,
    var(--h2-stripe-3) 50%,
    var(--h2-stripe-4) 75%,
    var(--h2-stripe-1) 100%
  );
  background-size: 100% 300%;
  animation: hyStripeFlow 6s linear infinite;
}
.entry-content h2:hover::before {
  box-shadow: 0 0 12px rgba(14,165,233,.35);
  width: 7px;
  transition: width .2s ease, box-shadow .2s ease;
}
@keyframes hyStripeFlow {
  0% { background-position: 0% 0%; }
  100% { background-position: 0% 100%; }
}

/* 引用块 */
.entry-content blockquote {
  margin: 1.2em 0;
  padding: 0.8em 1em;
  background: var(--bg-quote);
  border-left: 4px solid #93c5fd;
  color: #334155;
  border-radius: 6px;
}

/* 表格：横向滚动容器 + 基础美化 */
.entry-content table {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
  margin: 1.2em 0;
  font-size: 14px;
}
.entry-content table th,
.entry-content table td {
  border: 1px solid var(--border);
  padding: 10px 12px;
  vertical-align: top;
}
.entry-content table th {
  background: #f6f8fa;
  text-align: left;
  font-weight: 600;
}
.entry-content .table-wrap { overflow-x: auto; }
.entry-content .table-wrap table { min-width: 640px; }

/* 代码与预格式 */
.entry-content code {
  font-family: var(--font-mono);
  font-size: 0.92em;
  background: var(--bg-code);
  padding: 0.15em 0.4em;
  border-radius: 4px;
  border: 1px solid #edf2f7;
}
.entry-content pre {
  background: var(--bg-code);
  border: 1px solid #edf2f7;
  border-radius: 6px;
  padding: 12px 14px;
  overflow: auto;
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 1.7;
  margin: 1.1em 0;
}
.entry-content pre code { background: transparent; border: 0; padding: 0; }

/* 内嵌媒体（视频/iframe）自适应 */
.entry-content iframe,
.entry-content video {
  max-width: 100%;
  display: block;
  margin: 1em auto;
}

/* 选区颜色（仅正文） */
.entry-content ::selection {
  background: rgba(14,165,233,.18);
}

/* 小屏幕微调 */
@media (max-width: 576px) {
  .entry-content { font-size: 15px; }
  .entry-content h1 { font-size: 26px; }
  .entry-content h2 { font-size: 20px; padding-left: 16px; }
  .entry-content h2::before { width: 5px; }
  .entry-content h3 { font-size: 17px; }
}

/* 降低动画首选：系统偏好下禁用色条动画 */
@media (prefers-reduced-motion: reduce) {
  .entry-content h2::before { animation: none; background-position: 0 50%; }
}
