/* ========== 小工具 ========== */
.widget {
  background: var(--yixian-bg-card);
  border: 1px solid var(--yixian-border-soft);
  border-radius: var(--yixian-r-lg);
  padding: var(--yixian-sp-4);
  margin-bottom: var(--yixian-sp-4);
  box-shadow: var(--yixian-shadow-1);
  transition: border-color var(--yixian-dur-2),box-shadow var(--yixian-dur-2);
  overflow: hidden;
  position: relative;
}
.widget::before {
  content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 3px;
  background: var(--yixian-primary-grad); opacity: 0; transition: opacity var(--yixian-dur-2);
}
.widget:hover { border-color: var(--yixian-primary-2); box-shadow: var(--yixian-shadow-2); }
.widget:hover::before { opacity: 1; }

.widget-title {
  font-size: var(--yixian-fs-md); font-weight: 700;
  margin: calc(var(--yixian-sp-4) * -1) calc(var(--yixian-sp-4) * -1) var(--yixian-sp-4);
  padding: var(--yixian-sp-3) var(--yixian-sp-4);
  color: var(--yixian-text); letter-spacing: -.01em;
  display: flex; align-items: center; gap: var(--yixian-sp-2);
  border-bottom: 1px solid var(--yixian-border-soft);
  background: var(--yixian-bg-soft);
  border-radius: var(--yixian-r-lg) var(--yixian-r-lg) 0 0;
}
.widget-title::before {
  content: ""; width: 4px; height: 18px; border-radius: 2px;
  background: var(--yixian-primary-grad); flex-shrink: 0;
}

.widget ul,.widget ol { list-style: none; padding: 0; margin: 0; }
.widget ul li,.widget ol li {
  padding: var(--yixian-sp-2) 0;
  border-bottom: 1px solid var(--yixian-border-soft);
  transition: padding var(--yixian-dur-1);
}
.widget ul li:last-child,.widget ol li:last-child { border-bottom: none; padding-bottom: 0; }
.widget ul li:first-child,.widget ol li:first-child { padding-top: 0; }

.widget ul li a,.widget ol li a {
  color: var(--yixian-text-soft); text-decoration: none;
  font-size: var(--yixian-fs-sm); line-height: 1.5;
  display: flex; align-items: center; gap: var(--yixian-sp-2);
  transition: color var(--yixian-dur-1),padding-left var(--yixian-dur-1);
}
.widget ul li a::before {
  content: ""; width: 5px; height: 5px; border-radius: 50%;
  background: var(--yixian-primary-2); flex-shrink: 0;
  opacity: 0; transform: scale(0); transition: all var(--yixian-dur-2);
}
.widget ul li:hover a { color: var(--yixian-primary-2); padding-left: 4px; }
.widget ul li:hover a::before { opacity: 1; transform: scale(1); }

.widget ul li .post-date,.widget ul li .comment-author-link,.widget ul li .rss-date {
  display: block; font-size: var(--yixian-fs-xs); color: var(--yixian-text-mute); margin-top: 2px;
}

.widget select {
  width: 100%; padding: 8px 12px;
  border: 1px solid var(--yixian-border); border-radius: var(--yixian-r-sm);
  background: var(--yixian-bg-card); color: var(--yixian-text);
  font-size: var(--yixian-fs-sm);
}

.widget_search .search-form { display: flex; gap: 0; }
.widget_search .search-field {
  flex: 1; padding: 8px 14px;
  border: 1px solid var(--yixian-border); border-right: none;
  border-radius: var(--yixian-r-pill) 0 0 var(--yixian-r-pill);
  background: var(--yixian-bg-soft); color: var(--yixian-text);
  font-size: var(--yixian-fs-sm);
}
.widget_search .search-field:focus { outline: none; border-color: var(--yixian-primary-2); }
.widget_search .search-submit {
  padding: 8px 14px;
  background: var(--yixian-primary-grad); color: #fff;
  border: none; border-radius: 0 var(--yixian-r-pill) var(--yixian-r-pill) 0;
  font-size: var(--yixian-fs-sm); font-weight: 600; cursor: pointer;
}

.widget .tagcloud { display: flex; gap: 6px; flex-wrap: wrap; }
.widget .tagcloud a {
  padding: 4px 10px; border-radius: var(--yixian-r-pill);
  background: var(--yixian-bg-soft); color: var(--yixian-text-soft);
  font-size: var(--yixian-fs-xs); transition: all var(--yixian-dur-1);
}
.widget .tagcloud a:hover { background: var(--yixian-primary-soft); color: var(--yixian-primary-2); }

.widget .wp-block-latest-posts__featured-image img { border-radius: var(--yixian-r-sm); margin-bottom: 8px; }
.widget .wp-block-latest-posts__post-title { color: var(--yixian-text); transition: color var(--yixian-dur-1); }
.widget .wp-block-latest-posts__post-title:hover { color: var(--yixian-primary-2); }

/* ========== Hot Posts Widget ========== */
.widget-hot-posts { display: flex; flex-direction: column; gap: 2px; }
.widget-hot-posts__item {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 12px; border-radius: var(--yixian-r-sm);
  text-decoration: none; color: inherit;
  transition: all var(--yixian-dur-1);
}
.widget-hot-posts__item:hover { background: var(--yixian-bg-soft); padding-left: 16px; }
.widget-hot-posts__rank {
  width: 24px; height: 24px; display: flex; align-items: center; justify-content: center;
  font-size: var(--yixian-fs-xs); font-weight: 700; border-radius: 6px;
  background: var(--yixian-bg-soft); color: var(--yixian-text-mute); flex-shrink: 0;
}
.widget-hot-posts__rank--top { background: var(--yixian-primary-grad); color: #fff; }
.widget-hot-posts__title { font-size: var(--yixian-fs-sm); color: var(--yixian-text-soft); line-height: 1.4; flex: 1; }
.widget-hot-posts__item:hover .widget-hot-posts__title { color: var(--yixian-primary-2); }

/* ========== Post List Widget ========== */
.widget-post-list { display: flex; flex-direction: column; gap: var(--yixian-sp-3); }
.widget-post-list__featured {
  position: relative; display: block; border-radius: var(--yixian-r-md); overflow: hidden;
  background: linear-gradient(135deg,var(--c1,#ffd6e7),var(--c2,#b388ff));
  aspect-ratio: 16/10; transition: transform var(--yixian-dur-2);
}
.widget-post-list__featured:hover { transform: scale(1.02); }
.widget-post-list__featured img { width: 100%; height: 100%; object-fit: cover; }
.widget-post-list__featured .widget-post-list__info {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: var(--yixian-sp-4) var(--yixian-sp-3) var(--yixian-sp-3);
  background: linear-gradient(transparent,rgba(0,0,0,.7));
  color: #fff;
}
.widget-post-list__featured h4 { font-size: var(--yixian-fs-md); margin: 0 0 4px; color: #fff; }
.widget-post-list__featured span { font-size: var(--yixian-fs-xs); opacity: .85; }

.widget-post-list__item {
  display: flex; gap: var(--yixian-sp-3); padding: var(--yixian-sp-2) 0;
  text-decoration: none; color: inherit; transition: padding var(--yixian-dur-1);
  border-bottom: 1px solid var(--yixian-border-soft);
}
.widget-post-list__item:last-child { border: none; }
.widget-post-list__item:hover { padding-left: 4px; }
.widget-post-list__item img { width: 60px; height: 60px; border-radius: var(--yixian-r-sm); object-fit: cover; flex-shrink: 0; }
.widget-post-list__item h4 { font-size: var(--yixian-fs-sm); color: var(--yixian-text); margin: 0 0 2px; font-weight: 500; }
.widget-post-list__item span { font-size: var(--yixian-fs-xs); color: var(--yixian-text-mute); }
.widget-post-list__item:hover h4 { color: var(--yixian-primary-2); }

.widget-post-list__simple {
  display: flex; align-items: center; gap: var(--yixian-sp-2);
  padding: var(--yixian-sp-1) 0; text-decoration: none; color: var(--yixian-text-soft);
  font-size: var(--yixian-fs-sm); transition: all var(--yixian-dur-1);
}
.widget-post-list__simple:hover { color: var(--yixian-primary-2); }
.widget-post-list__dot { width: 5px; height: 5px; border-radius: 50%; background: var(--yixian-primary-2); flex-shrink: 0; }
.widget-post-list__simple:hover .widget-post-list__dot { transform: scale(1.5); }

/* ========== Tag Cloud Widget ========== */
.widget-tag-cloud { display: flex; gap: 6px; flex-wrap: wrap; }
.widget-tag-cloud__item {
  padding: 4px 10px; border-radius: var(--yixian-r-pill);
  background: var(--yixian-bg-soft); color: var(--yixian-text-soft);
  font-size: var(--yixian-fs-xs); text-decoration: none;
  transition: all var(--yixian-dur-1);
}
.widget-tag-cloud__item:hover { background: var(--yixian-primary-soft); color: var(--yixian-primary-2); }

/* ========== Recent Comments Widget ========== */
.widget-recent-comments { display: flex; flex-direction: column; gap: var(--yixian-sp-3); }
.widget-recent-comments__item {
  display: flex; gap: var(--yixian-sp-2); padding: var(--yixian-sp-2) 0;
  border-bottom: 1px solid var(--yixian-border-soft);
}
.widget-recent-comments__item:last-child { border: none; }
.widget-recent-comments__avatar { width: 32px; height: 32px; border-radius: 50%; flex-shrink: 0; background: var(--yixian-primary-grad); overflow: hidden; }
.widget-recent-comments__avatar img { width: 100%; height: 100%; object-fit: cover; }
.widget-recent-comments__body { flex: 1; min-width: 0; }
.widget-recent-comments__author { font-size: var(--yixian-fs-sm); font-weight: 600; color: var(--yixian-text); }
.widget-recent-comments__content { font-size: var(--yixian-fs-xs); color: var(--yixian-text-soft); margin-top: 2px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.widget-recent-comments__meta { font-size: var(--yixian-fs-xs); color: var(--yixian-text-mute); margin-top: 2px; }
.widget-recent-comments__meta a { color: var(--yixian-link); }

/* ========== Follow Scroll ========== */
.widget-follow-scroll {
  position: sticky; top: calc(var(--yixian-nav-h) + var(--yixian-sp-5));
  transition: top var(--yixian-dur-2); z-index: 10;
}
@media (max-width: 768px) { .widget-follow-scroll { position: static; } }

/* ========== Comments ========== */
.comments { margin-top: var(--yixian-sp-10); }
.comments__head {
  display: flex; align-items: center; gap: var(--yixian-sp-4);
  margin-bottom: var(--yixian-sp-5);
}
.comments__head h3 { font-size: var(--yixian-fs-xl); margin: 0; }

.comments__editor {
  display: flex; gap: var(--yixian-sp-3); align-items: flex-start;
  padding: var(--yixian-sp-4); background: var(--yixian-bg-card);
  border: 1px solid var(--yixian-border-soft); border-radius: var(--yixian-r-md);
  margin-bottom: var(--yixian-sp-6);
}
.comments__editor .av, .yixian-comments__editor .av { width: 40px; height: 40px; border-radius: 50%; background: var(--yixian-primary-grad); flex-shrink: 0; }
.comments__editor textarea {
  flex: 1; min-height: 70px; resize: vertical;
  border: 0; outline: 0; background: transparent; color: var(--yixian-text);
  font: inherit;
}

.yixian-comments__editor-inner {
  display: flex; gap: var(--yixian-sp-3); align-items: flex-start;
}

.comment {
  display: flex; gap: var(--yixian-sp-3); padding: var(--yixian-sp-4) 0;
  border-bottom: 1px solid var(--yixian-border-soft);
}
.comment .av { width: 40px; height: 40px; border-radius: 50%; background: var(--yixian-primary-grad); flex-shrink: 0; overflow: hidden; }
.comment .av img { width: 100%; height: 100%; object-fit: cover; }
.comment__body { flex: 1; min-width: 0; }
.comment__head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.comment__head strong { font-size: var(--yixian-fs-sm); }
.comment__head time { color: var(--yixian-text-mute); font-size: var(--yixian-fs-xs); }
.comment__text { color: var(--yixian-text-soft); margin-top: 4px; font-size: var(--yixian-fs-md); line-height: 1.6; }
.comment__text p { margin: 0; }
.comment__actions { display: flex; gap: var(--yixian-sp-4); margin-top: 6px; color: var(--yixian-text-mute); font-size: var(--yixian-fs-xs); }
.comment__actions a,.comment__actions button { color: var(--yixian-text-mute); transition: color var(--yixian-dur-1); }
.comment__actions a:hover,.comment__actions button:hover { color: var(--yixian-primary-2); }

.comment .reply {
  margin-top: var(--yixian-sp-3);
  background: var(--yixian-bg-soft); padding: var(--yixian-sp-3); border-radius: var(--yixian-r-sm);
  display: flex; gap: 10px; align-items: flex-start;
}
.comment .reply .av { width: 30px; height: 30px; }

/* ========== Comment Respond Form ========== */
.comment-respond { margin-top: var(--yixian-sp-8); }
.comment-reply-title { font-size: var(--yixian-fs-lg); margin-bottom: var(--yixian-sp-4); }
.comment-form { display: flex; flex-direction: column; gap: var(--yixian-sp-3); }
.comment-form input,.comment-form textarea {
  padding: 10px 14px; border: 1px solid var(--yixian-border);
  border-radius: var(--yixian-r-sm); background: var(--yixian-bg-card);
  color: var(--yixian-text); font: inherit; font-size: var(--yixian-fs-sm);
  transition: border-color var(--yixian-dur-1);
}
.comment-form input:focus,.comment-form textarea:focus { border-color: var(--yixian-primary-2); outline: none; }
.comment-form .submit {
  align-self: flex-start; padding: 10px 24px;
  background: var(--yixian-primary-grad); color: #fff;
  border: none; border-radius: var(--yixian-r-pill);
  font-weight: 600; cursor: pointer;
  transition: box-shadow var(--yixian-dur-2),transform var(--yixian-dur-1);
}
.comment-form .submit:hover { box-shadow: 0 8px 20px rgba(179,136,255,.32); transform: translateY(-1px); }

/* ========== TOC ========== */
.toc {
  background: var(--yixian-bg-card); border: 1px solid var(--yixian-border-soft);
  border-radius: var(--yixian-r-lg); padding: var(--yixian-sp-4);
  margin-bottom: var(--yixian-sp-6);
}
.toc__header { display: flex; align-items: center; gap: var(--yixian-sp-2); margin-bottom: var(--yixian-sp-3); font-weight: 700; }
.toc__nav { display: flex; flex-direction: column; gap: 2px; }
.toc__link {
  font-size: var(--yixian-fs-sm); color: var(--yixian-text-soft);
  padding: 4px 0; border-radius: var(--yixian-r-sm);
  transition: all var(--yixian-dur-1);
}
.toc__link:hover { color: var(--yixian-primary-2); background: var(--yixian-primary-soft); padding-left: 8px; }

/* ========== Reading Progress ========== */
.reading-progress {
  position: fixed; top: 0; left: 0; width: 100%; height: 3px;
  background: var(--yixian-primary-grad); z-index: 9999;
  transform-origin: left; transition: transform .1s linear;
}

/* ========== Back to Top ========== */
.yixian-back-to-top, .back-to-top {
  position: fixed; bottom: var(--yixian-sp-6); right: var(--yixian-sp-6);
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--yixian-primary-grad); color: #fff;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 8px 20px rgba(179,136,255,.32);
  cursor: pointer; z-index: 40;
  transition: transform var(--yixian-dur-2),opacity var(--yixian-dur-2);
  opacity: 0; transform: translateY(20px);
}
.yixian-back-to-top.is-visible, .back-to-top.is-visible { opacity: 1; transform: translateY(0); }
.yixian-back-to-top:hover, .back-to-top:hover { transform: translateY(-2px); }
.yixian-back-to-top svg, .back-to-top svg { width: 20px; height: 20px; }

/* ========== Related Posts ========== */
.related-posts { margin-top: var(--yixian-sp-8); }
.related-posts__title { font-size: var(--yixian-fs-xl); margin-bottom: var(--yixian-sp-4); }
.related-posts__grid {
  display: grid; grid-template-columns: repeat(4,1fr); gap: var(--yixian-sp-4);
}
@media (max-width: 960px) { .related-posts__grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 480px) { .related-posts__grid { grid-template-columns: 1fr; } }

/* ========== Post Meta (like/share) ========== */
.post-like { display: flex; align-items: center; gap: var(--yixian-sp-3); margin: var(--yixian-sp-6) 0; }
.post-like__btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 20px; border-radius: var(--yixian-r-pill);
  background: var(--yixian-primary-soft); color: var(--yixian-primary-2);
  font-weight: 600; font-size: var(--yixian-fs-sm);
  transition: all var(--yixian-dur-2);
  cursor: pointer;
}
.post-like__btn:hover { background: var(--yixian-primary-grad); color: #fff; transform: scale(1.04); }

.post-share { display: flex; align-items: center; gap: var(--yixian-sp-3); margin: var(--yixian-sp-4) 0; }
.post-share__label { color: var(--yixian-text-mute); font-size: var(--yixian-fs-sm); }
.post-share__btn {
  width: 36px; height: 36px; border-radius: 50%;
  background: var(--yixian-bg-soft); color: var(--yixian-text-soft);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: all var(--yixian-dur-1);
}
.post-share__btn:hover { background: var(--yixian-primary-grad); color: #fff; }

/* ========== Post Copyright ========== */
.post-copyright {
  margin-top: var(--yixian-sp-6); padding: var(--yixian-sp-4);
  background: var(--yixian-bg-soft); border-radius: var(--yixian-r-md);
  font-size: var(--yixian-fs-sm); color: var(--yixian-text-soft);
  border: 1px solid var(--yixian-border-soft);
}

/* ========== Post Tags ========== */
.post-tags { display: flex; gap: 8px; flex-wrap: wrap; margin-top: var(--yixian-sp-4); }
.post-tags a {
  padding: 4px 12px; border-radius: var(--yixian-r-pill);
  background: var(--yixian-bg-soft); color: var(--yixian-text-soft);
  font-size: var(--yixian-fs-xs); transition: all var(--yixian-dur-1);
}
.post-tags a:hover { background: var(--yixian-primary-soft); color: var(--yixian-primary-2); }

/* ========== Cover Image ========== */
.article-cover { margin-bottom: var(--yixian-sp-6); border-radius: var(--yixian-r-lg); overflow: hidden; }
.article-cover img { width: 100%; display: block; }