/* ===== 首页文章卡片 - 半透明融入背景 ===== */
#recent-posts > .recent-post-item {
  background: rgba(255, 255, 255, 0.55) !important;
  backdrop-filter: blur(16px) saturate(140%);
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: 16px !important;
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(108, 92, 231, 0.06);
  transition: transform 0.3s ease, box-shadow 0.3s ease, background 0.3s ease;
}
#recent-posts > .recent-post-item:hover {
  transform: translateY(-6px);
  background: rgba(255, 255, 255, 0.72) !important;
  box-shadow: 0 14px 36px rgba(108, 92, 231, 0.14);
}
#recent-posts > .recent-post-item .post-bg {
  border-radius: 16px 0 0 16px !important;
  position: relative;
  min-height: 200px;
  width: 100%;
}
/* 渐变封面上显示标题 */
#recent-posts > .recent-post-item .post-bg[data-title]::after {
  content: attr(data-title);
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 1.6em;
  font-weight: 700;
  letter-spacing: 2px;
  text-align: center;
  padding: 20px;
  text-shadow: 0 0 20px rgba(255,255,255,0.5), 0 2px 10px rgba(0,0,0,0.3);
  background: rgba(0,0,0,0.08);
  transition: all 0.4s ease;
}
#recent-posts > .recent-post-item:hover .post-bg[data-title]::after {
  text-shadow: 0 0 30px rgba(255,255,255,0.8), 0 0 60px rgba(108,92,231,0.4);
  letter-spacing: 4px;
}
[data-theme="dark"] #recent-posts > .recent-post-item {
  background: rgba(20, 20, 35, 0.5) !important;
  border: 1px solid rgba(162, 155, 254, 0.15);
}
[data-theme="dark"] #recent-posts > .recent-post-item:hover {
  background: rgba(20, 20, 35, 0.7) !important;
}

/* ===== 侧边栏卡片 - 毛玻璃 ===== */
.card-widget {
  backdrop-filter: blur(14px) saturate(140%);
  background: rgba(255, 255, 255, 0.5) !important;
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 16px !important;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.card-widget:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 25px rgba(108, 92, 231, 0.1);
}
[data-theme="dark"] .card-widget {
  background: rgba(20, 20, 35, 0.5) !important;
  border: 1px solid rgba(162, 155, 254, 0.12);
}

/* ===== 头像旋转 ===== */
.card-info-avatar .avatar-img {
  transition: transform 0.6s ease;
}
.card-info-avatar .avatar-img:hover {
  transform: rotate(360deg);
}

/* ===== 导航栏毛玻璃 ===== */
#nav {
  backdrop-filter: saturate(180%) blur(20px);
  background: rgba(255, 255, 255, 0.72) !important;
}
[data-theme="dark"] #nav {
  background: rgba(18, 18, 18, 0.8) !important;
}

/* ===== 首页 banner 渐变遮罩 ===== */
#page-header.full_page::before,
#page-header::before {
  background: linear-gradient(135deg, rgba(108,92,231,0.25) 0%, rgba(253,121,168,0.15) 100%);
}

/* ===== 标签云悬浮 ===== */
.tag-cloud-tags a {
  transition: transform 0.2s, box-shadow 0.2s;
}
.tag-cloud-tags a:hover {
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(108, 92, 231, 0.3);
}

/* ===== 分类磁吸效果 ===== */
.category-list a {
  display: inline-block;
  padding: 6px 14px;
  margin: 4px;
  border-radius: 8px;
  background: rgba(108, 92, 231, 0.08);
  transition: all 0.3s ease;
}
.category-list a:hover {
  background: linear-gradient(135deg, #6C5CE7, #a29bfe);
  color: #fff !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(108, 92, 231, 0.3);
}
[data-theme="dark"] .category-list a {
  background: rgba(162, 155, 254, 0.12);
}
[data-theme="dark"] .category-list a:hover {
  background: linear-gradient(135deg, #6C5CE7, #a29bfe);
}

/* ===== 滚动条 ===== */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #a29bfe, #6C5CE7);
  border-radius: 4px;
}
::-webkit-scrollbar-track { background: transparent; }

/* ===== 侧边栏最新文章隐藏缩略图 ===== */
.card-recent-post .aside-list-item .thumbnail {
  display: none;
}
.card-recent-post .aside-list-item .content {
  width: 100%;
  padding-left: 0;
}

/* ===== 页脚心跳动画 ===== */
@keyframes heartbeat {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.3); }
}

/* ===== 暗色模式背景色 ===== */
[data-theme="dark"] {
  --global-bg: #545454 !important;
}
[data-theme="dark"] body,
[data-theme="dark"] #web_bg {
  background: #545454 !important;
}