/* ===== Hugo 专属增强（仅新增类，不覆盖原 Minimalism 视觉） ===== */

/* 客户端搜索弹窗（index.json 检索） */
.search-modal-mask { position: fixed; inset: 0; background: rgba(20,24,28,.5); z-index: 2000; display: none; }
.search-modal-mask.open { display: block; }
.search-modal { position: fixed; top: 12%; left: 50%; transform: translateX(-50%); width: 90%; max-width: 640px; max-height: 76vh; background: #fff; border-radius: 8px; z-index: 2001; display: none; flex-direction: column; overflow: hidden; box-shadow: 0 24px 80px rgba(0,0,0,.3); }
.search-modal.open { display: flex; }
.search-modal input { width: 100%; border: none; border-bottom: 1px solid #eee; padding: 18px 22px; font-size: 18px; box-sizing: border-box; outline: none; }
.search-modal .results { overflow: auto; padding: 8px 0; }
.search-modal .results a { display: block; padding: 12px 22px; border-bottom: 1px solid #f2f2f2; }
.search-modal .results a:hover { background: #f8f9fa; }
.search-modal .results .r-title { font-size: 16px; color: #222; font-weight: 600; }
.search-modal .results .r-excerpt { font-size: 13px; color: #888; margin-top: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.search-modal .results .r-empty { padding: 20px; color: #999; text-align: center; }
.search-modal .results .r-cat { font-size: 12px; color: #007fff; margin-right: 8px; }

/* 顶栏栅格列垂直居中（修正“偏上”）：logo / 导航 / 搜索三列同高并居中 */
.rowr [class*=col-] { display: flex; align-items: center; min-height: 56px; }
/* 搜索框：还原原站 60% 宽度，放大镜按钮 absolute 贴合输入框右缘 */
#search input { width: 60%; box-sizing: border-box; padding-right: 30px; }
/* 标签云：对齐原站（随机配色 + 字号分级 + 悬停高亮） */
.tag-cloud { padding: 8px 20px 14px; }
.tag-cloud a { display: inline-block; margin: 4px 8px 4px 0; color: var(--tc, #8590a6); font-size: 13px; transition: color .2s; }
.tag-cloud a:hover { color: #007fff; }
.tag-cloud .t-lg { font-size: 18px; }
.tag-cloud .t-md { font-size: 15px; }
.tag-cloud .t-sm { font-size: 13px; }

/* 阅读进度条 */
#read-progress { position: fixed; top: 0; left: 0; height: 3px; width: 0; background: #007fff; z-index: 1000; transition: width .1s; }

/* 滚动渐入：仅在 JS 可用（<html class="js">）时隐藏初始态，
   无 JS 时内容照常完整显示，绝不丢失 */
.js .reveal {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity .6s cubic-bezier(.16, 1, .3, 1),
              transform .6s cubic-bezier(.16, 1, .3, 1);
  will-change: opacity, transform;
}
.js .reveal.in {
  opacity: 1;
  transform: none;
  transition-delay: var(--rd, 0ms);
}

/* Giscus 评论容器 */
.giscus { margin-top: 24px; }

/* 回顶部小三角（配合原 .return-top） */
.return-top .tri { display: block; width: 0; height: 0; margin: 18px auto 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 10px solid #007fff; }

/* ===== 修复：首页 hero 锚定到视口的全宽元素（.page-bg/.page-title）
   在出现竖向滚动条后会略超内容区，导致底部出现横向滚动条。
   只裁剪 html 的横向溢出即可。
   ⚠️ 绝不能加在 body 上：body 一旦 overflow-x:hidden，会变成独立滚动容器，
   既让网站右侧多一条竖拉条，又会切断 window 滚动 —— 回顶部按钮(returnTop
   依赖 window.scrollY 判断显现与滚动)随之失效。 ===== */
html { overflow-x: hidden; }

/* ===== 首页 Hero 标题「代码如诗·字字珠玑」特效 =====
   逐字错位入场 + 白色发光字 + 呼吸式发光（heroGlow）。
   ① 用 flex + left:0/right:0 真正居中：absolute 标题 width:100% 解析到整屏宽，
      但 left:auto 会落到居中 .container 的静态左缘，宽屏下被带偏 —— 显式锚定到视口。
   ② 发光滤镜放在每个 .ch 上，避免父级 filter 被 transform 子级拆分导致光晕丢失。 ===== */
.hero-title {
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  font-weight: 700;
  font-size: clamp(1.7rem, 4.6vw, 2.6rem);
  letter-spacing: .1em;
  text-align: center;
}
.hero-title .ch {
  display: inline-block;
  color: #fff;
  -webkit-text-fill-color: #fff;
  opacity: 0;
  transform: translateY(18px) scale(.92);
  filter: drop-shadow(0 0 10px rgba(150, 120, 255, .55));
  animation: heroRise .7s cubic-bezier(.16, 1, .3, 1) forwards,
             heroGlow 3.2s ease-in-out infinite;
  animation-delay: calc(var(--i) * .09s + .25s), 0s;
}
.hero-title .dot { margin: 0 .06em; }
@keyframes heroGlow {
  0%, 100% { filter: drop-shadow(0 0 8px rgba(150, 120, 255, .45)); }
  50%      { filter: drop-shadow(0 0 24px rgba(175, 140, 255, .95)); }
}
@keyframes heroRise {
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-title { animation: none; }
  .hero-title .ch { opacity: 1; transform: none; filter: drop-shadow(0 0 10px rgba(150, 120, 255, .55)); animation: none; }
}

/* ===== 首页 Hero 背景：使用纯代码屏 bg.jpg，并始终居中裁剪 =====
   about.jpg 下半是键盘，cover 在宽屏下只能看到顶部窄条，代码容易被裁掉；
   bg.jpg 整屏都是代码，配合 background-position:center 任意宽度都能露出代码。 ===== */
.page-bg.code-bg {
  background-image: url(../img/bg.jpg);
  background-position: center;
  background-color: #1a1a2e;
}

/* Chroma 代码高亮（GitHub 浅色，匹配原 highlight.js default） */
.chroma { background: #f3f3f3; color: #24292e; border-radius: 4px; padding: 12px 14px; }
.chroma .err { color: #a61717; background: #e3d2d2; }
.chroma .k, .chroma .kd, .chroma .kn, .chroma .kp, .chroma .kr, .chroma .kt { color: #d73a49; }
.chroma .o, .chroma .ow { color: #d73a49; }
.chroma .c, .chroma .c1, .chroma .cm, .chroma .cs, .chroma .cp { color: #6a737d; font-style: italic; }
.chroma .s, .chroma .s1, .chroma .s2, .chroma .sx, .chroma .dl { color: #032f62; }
.chroma .se { color: #005cc5; }
.chroma .m, .chroma .mi, .chroma .mf, .chroma .il, .chroma .mo { color: #005cc5; }
.chroma .nf { color: #6f42c0; }
.chroma .nc, .chroma .nn { color: #6f42c0; }
.chroma .nb, .chroma .bp { color: #005cc5; }
.chroma .na { color: #005cc5; }
.chroma .nt { color: #22863a; }
.chroma .nx { color: #24292e; }
.chroma .nl { color: #d73a49; }
