/* 给文章里的 video 合理尺寸 */
.post-content video{
  display:block;
  width:100%;
  height:auto !important;
  min-height:200px;
  background:#000;
}
.video-container{overflow:hidden;}

#page-header{
  background: none !important;          /* 背景设透明 */
}
/* 覆盖步骤 1 的做法：重新加一层自定义渐变 */
#page-header::before{
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(
      to bottom,
      rgba(0,0,0,0.4) 0%,
      rgba(0,0,0,0.4) 60%,
      rgba(0,0,0,0.0) 100%);
  z-index:1;                 /* 在视频之上、文字之下 */
  pointer-events:none;
}

#page-header::after{
  display: none !important;             /* 关闭上/下两层渐变 */
}

/* 2. 视频铺满并保持在文字下方一层 */
#page-header video{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;                           /* 文字默认 z-index≈10，不会被挡 */
}

/* 3. 如果你给 header 固定了 45vh 高度，可让封面文字稍微升一层保险 */
#page-header .post-info,
#page-header #site-info{
  position: relative;
  z-index: 2;
}

/* ------------ 灰蓝主题统一色 ------------ */
:root {
  --main-blue-grey: #42556e;   /* 深灰蓝 */
  --hover-blue-grey: #677c99;  /* 浅一点的灰蓝 */
  --text-on-dark: #ffffff;     /* 浅色文字 */
  --text-on-light: #2b3542;    /* 深色文字 */
}

/* ===== 页脚 ===== */
#footer,
#footer-wrap {
  background: var(--main-blue-grey) !important;
  color: var(--text-on-dark) !important;
}
#footer a { color: var(--text-on-dark) !important; }

/* ===== Follow Me 按钮 ===== */
.card-info .button,
.card-info .follow-button {
  background-color: var(--main-blue-grey) !important;
  color: var(--text-on-dark) !important;
  border: none;
  transition: all 0.3s ease;
}
.card-info .button:hover,
.card-info .follow-button:hover {
  background-color: var(--hover-blue-grey) !important;
  color: var(--text-on-light) !important;
}

/* ===== 右侧悬浮按钮 ===== */
#rightside > div button {
  background-color: var(--main-blue-grey) !important;
  color: var(--text-on-dark) !important;
  border: none;
  transition: all 0.3s ease;
}
#rightside > div button:hover {
  background-color: var(--hover-blue-grey) !important;
  color: var(--text-on-light) !important;
}

/* ===== 滚动条（WebKit） ===== */
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  background: #e4e6ea;               /* 滚动槽浅灰即可 */
}
::-webkit-scrollbar-thumb {
  background-color: var(--main-blue-grey);
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background-color: var(--hover-blue-grey);
}