.banners-link-btn .heoblogIcon{font-style:normal;font-size:20px;}
.icon-fire-fill::before{content:'\e729';font-family:iconfont;color:#fff;}
.topGroup .todayCard::after{box-shadow:0 -109px 133px -9px #51a4f4 inset;}
.icon-add-circle-fill{font-style:normal;}
.icon-add-circle-fill::before{content:'\e605';font-family:iconfont;color:#fff;}
.icon-star-smile-fill::before{content:'\e636';font-family:iconfont;color:#fff;}
.tags-group-icon-pair>.tags-group-icon:first-of-type{margin-right:40px;}
.recent-post-group{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between;align-content:space-between;gap:.5rem;}
.topGroup{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between;height:calc(328px + .5rem);align-content:space-between;width:calc(50% - .25rem);position:relative;animation:slide-in .6s .1s backwards;flex:1;overflow:hidden;border-radius:10px;}
div#home_top_iconsCard{display:flex;width:calc(50% - .5rem);height:calc(328px + .5rem);flex-direction:column;justify-content:space-between;flex:1;margin-right:5px;}
div#home_top_iconsCard_content{display:flex;width:100%;height:100%;background:var(--main-bg-color);border:1px solid var(--main-bg-color);border-radius:12px;overflow:hidden;position:relative;box-shadow:0 8px 16px -4px #2c2d300c;flex-direction:column;transition:.3s;will-change:transform;animation:slide-in .6s .1s backwards;}
.banners-title{top:2.6rem;left:2rem;position:absolute;display:flex;flex-direction:column;}

.banners-title-big{font-size:32px;line-height:1;font-weight:700;margin-bottom:8px;-webkit-line-clamp:1;display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;}

.tts-trigger-btn {
    position: relative;
}

.tts-trigger-btn::after {
    content: attr(data-tts-tip);
    position: absolute;
    right: 100%;
    top: 50%;
    transform: translateY(-50%) translateX(-8px);
    background: rgba(30, 30, 30, 0.92);
    color: #fff;
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 6px;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
    z-index: 1001;
}

.tts-trigger-btn:hover::after {
    opacity: 1;
}

/* 标题2的新样式 */
.banners-title-medium {
    font-size: 25px;
    line-height: 1;
    font-weight: 700;
    margin-bottom: 8px;
    -webkit-line-clamp: 1;
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
}

/* 移动端适配 */
@media screen and (max-width: 1200px) {
    .banners-title-medium {
        font-size: 20px;
    }
}

.banners-title-small{font-size:12px;line-height:1;color:var(--main-color);margin-top:.5rem;margin-bottom:.5rem;margin-left:2px;}

.topGroup .todayCard{position:absolute;width:100%;height:100%;z-index:1;top:0;right:0;background:#fff;border-radius:12px;margin-left:1rem;overflow:hidden;display:flex;cursor:pointer;pointer-events:all;box-shadow:0 8px 16px -4px #2c2d300c;transition:transform 0.2s ease-out,opacity 0.2s ease-out;}
.topGroup .todayCard::after{position:absolute;content:'';width:100%;height:100%;top:0;left:0;}
.topGroup .todayCard .todayCard-info{position:absolute;bottom:1.5rem;left:2rem;z-index:2;color:#fff;max-width:60%;transition:.3s;}
.topGroup .todayCard .todayCard-info .todayCard-tips{opacity:.8;font-size:1.6rem;margin-left:3px;margin-top:4px;}
.topGroup .todayCard .todayCard-info .todayCard-title{font-size:26px;font-weight:700;line-height:40px;}

.topGroup .banner-button-group {
  position: absolute;
  right: 3rem;
  bottom: 3rem;
  display: flex;
  transition: 0.3s;
  z-index: 9999;
}

.topGroup .banner-button {
  background-color: transparent !important;
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: 20px;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  width: 118px;
  cursor: pointer;
  transition: transform 0.3s ease;
  transform: translateZ(0);
  position: relative;
  z-index: 9999;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.topGroup .banner-button i {
  margin-right: 8px;
  font-size: 22px;
}

.topGroup .banner-button:hover {
  transform: scale(1.1);
  background-color: rgba(255, 255, 255, 0.1) !important;
}

.topGroup .todayCard .todayCard-cover{position:absolute;min-width:100%;min-height:100%;top:0;left:0;background-size:cover;z-index:-1;transition:.3s;}

.banners-link{display:flex;flex-direction:column;align-items:flex-start;position:absolute;bottom:36px;left:40px;gap:12px;flex-wrap:wrap;}

/* 按钮结构样式（只管尺寸与布局，颜色统一在文件末尾定义） */
.banners-link-btn {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding: 6px 18px 6px 14px;
  border-radius: 60px;
  width: 87px;
  height: 28px;
  position: relative;
  font-size: 15px;
  white-space: nowrap;
}

/* 鼠标悬停时按钮放大 */
.banners-link-btn:hover {
  transform: scale(1.2);
}

/* 图标样式 */
.banners-link-btn .fa {
  font-size: 15px;
  margin-right: 8px;
  transition: transform 0.3s ease;
}

/* 鼠标悬停时图标放大 */
.banners-link-btn:hover .fa {
  transform: scale(1.2);
}

/* 移动端适配 */
@media (max-width: 768px) {
  .banners-link-btn {
    padding: 6px 14px 6px 12px;
  }
  .banners-link-btn .fa {
    font-size: 15px;
  }
}

.banners-link-title{margin-left:auto;pointer-events:none;}
@keyframes rowup{from{transform:translateY(0);}to{transform:translateY(-50%);};}
.tags-group-icon{width:120px;height:120px;border-radius:30px;position:relative;}
.tags-group-all{display:flex;transform:rotate(0);}
#home_top_iconsCard .tags-group-wrapper{margin-top:0;display:flex;flex-wrap:wrap;animation:rowup 50s linear infinite;width:320px;margin-left:auto;}
.tags-group-icon-pair .tags-group-icon:nth-child(even){margin-top:1rem;transform:translate(-60px);}
#home_top_iconsCard .tags-group-icon-pair{display:flex;}
#home_top_iconsCard .tags-group-icon-pair .tags-group-icon:nth-child(even){margin-left:4rem;}
.tags-group-icon-pair{margin-left:1rem;user-select:none;}
.tags-group-icon{display:flex;align-items:center;justify-content:center;color:#fff;font-size:66px;font-weight:700;box-shadow:0 2px 16px -3px rgba(0,0,0,.15);}
.tags-group-icon img{width:100%;}
#categoryList>a:nth-child()>i{padding-right:8px;}
.recent-post-item:hover .post_cover a span{left:0px;}
.recent-post-item:hover .recent-post-top .recent-post-item .recent-post-info .article-title{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;line-height:1.5;justify-content:center;align-items:flex-end;align-content:center;padding-top:.5rem;font-weight:700;font-size:.8rem;padding:0 !important;}
#recent-post-top .recent-post-item .post_cover{width:100%;}
.recent-top-post-group{border-radius:12px;overflow:hidden;overflow-x:auto;width:100%;margin-bottom:0;-webkit-user-select:none;}
.recent-post-top{display:flex;flex-direction:row;flex-wrap:wrap;width:100%;overflow-x:scroll;gap:.7rem;}
.recent-post-top::-webkit-scrollbar{display:none;}
.zoom-out{transform:scale(1.3);opacity:0;border-radius:20px;width:100%;}
.recent-post-top .recent-post-item{display:flex;width:200px;flex-direction:column;align-items:flex-start;background:var(--main-bg-color);border-radius:12px;overflow:hidden;height:161px;max-height:161px;border:1px solid var(--main-bg-color);transition:.3s;position:relative;box-shadow:0 8px 16px -4px #2c2d300c;}
@media screen and (min-width:1200px){
  .recent-post-top .recent-post-item{flex:1 1 30%;margin-left:0;}
  .recent-post-top .recent-post-item{margin-right:0px;margin-bottom:5px;}
  .recent-post-top{overflow-x:visible;}
  .recent-top-post-group{overflow:visible;overflow-x:visible;}
}
span.recent-post-top-text{position:absolute;top:0;left:-40px;display:flex;z-index:1;background:#b8cc3b;color:#fff;padding:2px 8px;font-size:1.5rem;border-radius:12px 0 12px 0;transition:.2s;cursor:pointer;-webkit-transition:.2s;-moz-transition:.2s;-ms-transition:.2s;-o-transition:.2s;}
.recent-post-top .recent-post-item .post_cover a{height:100px;overflow:hidden;display:flex;}
.recent-post-top .recent-post-item .post_cover img{object-fit:cover;width:100%;border-radius:12px 12px 0 0;}
.recent-post-item .post_cover{-webkit-mask-image:-webkit-radial-gradient(center,#fff,#000);}
.recent-post-top .recent-post-item .recent-post-info{padding:.3rem .5rem .3rem .5rem !important;transition:.3s;margin-top:5px;}
.recent-post-top .recent-post-item .recent-post-info a{font-weight:700;}
#home_top{margin:auto;margin-top:0rem;margin-bottom:.5rem;}
#aside-content>div.card-widget.card-info>div>div.card-info-data>div:nth-child()>a>div.headline{font-weight:700;}
details:not(.tk-admin-config-group) summary::marker{color:#b8cc3b;transition:.3s;}
details[open]:not(.tk-admin-config-group) summary::marker{color:#fff;}
.recent-post-item:hover{transform:scale(1);-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);}
@media screen and (max-width:600px){
  #home_top #home_top_iconsCard .tags-group-all{opacity:0.5;filter:blur(3px);}
}
@media screen and (max-width:1200px){
  .todayCard{display:none;}
  .topGroup{display:none;}
  .banners-link{bottom:15px;}
  .tags-group-icon{width:80px;height:80px;border-radius:10px;}
  .tags-group-icon-pair{margin-left:11rem;}
  .tags-group-icon img{width:100%;}
  .banners-link-btn{padding:5px 18px 5px 14px;width:80px;}
  .banners-link-btn .heoblogIcon{font-size:15px;}
  div#home_top_iconsCard{flex:auto;margin-right:0;width:100%;height:calc(220px + .5rem);}
  span.recent-post-top-text{left:0px;}
  .banners-title-big{font-size:25px;}
  .topGroup{overflow-x:scroll;height:fit-content;}
  .topGroup::-webkit-scrollbar{display:none;}
  .topGroup .todayCard{display:none;}
  .recent-post-group{flex-wrap:nowrap;}
}

@font-face{
  font-family:'iconfont'; /* Project id 4783179 */
  src:url('//at.alicdn.com/t/c/font_4783179_zwiw8i6a63h.woff2?t=1735994580092') format('woff2'),
      url('//at.alicdn.com/t/c/font_4783179_zwiw8i6a63h.woff?t=1735994580092') format('woff'),
      url('//at.alicdn.com/t/c/font_4783179_zwiw8i6a63h.ttf?t=1735994580092') format('truetype');
}


/* ===================================================== */
/* ===== 首页 Banner 左侧按钮：配色（唯一定义处） ===== */
/* ===================================================== */

/* 默认态：透明底 + 淡灰描边 */
.banners-link .banners-link-btn,
.banners-link .banners-link-btn:link,
.banners-link .banners-link-btn:visited,
.banners-link .banners-link-btn:active {
    background: transparent;
    border: 1px solid rgba(90, 90, 90, .65);
    color: rgba(90, 90, 90, 1);
    text-decoration: none;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    transition: color .25s ease, border-color .25s ease,
                background-color .25s ease, transform .3s ease;
}

/* 图标与文字强制继承按钮色 */
.banners-link .banners-link-btn .fa,
.banners-link .banners-link-btn .banners-link-title {
    color: inherit;
}

/* ---- 浅色模式 hover：黑字黑框 + 淡灰白底 ---- */
.banners-link .banners-link-btn:hover {
    color: #1a1a1a;
    border-color: #1a1a1a;
    background-color: rgba(120, 120, 120, .08);
}

/* 深色模式默认态（非 hover） */
html.dark .banners-link .banners-link-btn,
.dark-theme .banners-link .banners-link-btn,
[data-theme="dark"] .banners-link .banners-link-btn,
html.dark .banners-link .banners-link-btn:visited,
.dark-theme .banners-link .banners-link-btn:visited,
[data-theme="dark"] .banners-link .banners-link-btn:visited {
    color: rgba(255, 255, 255, .7);        /* ← 深色下文字，越大越亮 */
    border-color: rgba(255, 255, 255, .65); /* ← 深色下描边 */
}

/* ---- 深色模式 hover：白字白框 + 淡灰白底 ---- */
/* 三种写法兜底，确认站点实际用哪个后可删掉多余的两条 */
html.dark .banners-link .banners-link-btn:hover,
.dark-theme .banners-link .banners-link-btn:hover,
[data-theme="dark"] .banners-link .banners-link-btn:hover {
    color: #fff;
    border-color: #fff;
    background-color: rgba(255, 255, 255, .12);
}

/* 键盘 Tab 聚焦时才显示描边，鼠标点击不显示 */
.banners-link .banners-link-btn:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 3px;
}