/* 首页展示区新版小工具 */
.knn-showcase-slider-widget,
.knn-showcase-slider-widget *,
.knn-tab-posts-v2,
.knn-tab-posts-v2 *{box-sizing:border-box}

/* 两个新版小工具放在同一个全宽区域时，自动组成参考图的左右比例。 */
.main-container.knn-widget-fluid.knn-showcase-pair-v2{display:grid;grid-template-columns:minmax(0,2.15fr) minmax(300px,1fr);align-items:stretch;gap:16px}
.knn-showcase-pair-v2-left,.knn-showcase-pair-v2-right{min-width:0}
.knn-showcase-pair-v2-left .knn-showcase-slider-widget,.knn-showcase-pair-v2-right.knn-tab-posts-v2.widget-container{margin-bottom:0}
.knn-showcase-pair-v2-other{grid-column:1/-1}

/* 左侧：精选推荐幻灯片 */
.knn-showcase-slider-widget{width:100%;margin-bottom:20px}
.knn-showcase-slider-v2.new-swiper{position:relative;width:100%;height:var(--knn-showcase-height,270px);padding:0;overflow:hidden;border-radius:12px;background:#dce8f4;box-shadow:0 8px 28px rgba(40,76,117,.09)}
.knn-showcase-slider-v2 .swiper-wrapper,.knn-showcase-slider-v2 .swiper-slide{height:100%}
.knn-showcase-slide{position:relative;display:block;width:100%;height:100%;overflow:hidden;color:#fff;text-decoration:none}
.knn-showcase-slide-image{display:block;width:100%;height:100%!important;min-height:0!important;max-height:none!important;object-fit:cover;transition:transform 6s ease}
.knn-showcase-slider-v2 .swiper-slide-active .knn-showcase-slide-image{transform:scale(1.035)}
.knn-showcase-slide-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(9,18,31,.76) 0%,rgba(12,24,40,.44) 44%,rgba(8,18,30,.05) 76%);pointer-events:none}
.knn-showcase-slide-copy{position:absolute;z-index:2;left:34px;bottom:28px;display:flex;max-width:68%;align-items:flex-start;flex-direction:column;color:#fff;text-align:left;text-shadow:0 2px 8px rgba(0,0,0,.24)}
.knn-showcase-slide-badge{display:inline-flex;align-items:center;min-height:27px;margin-bottom:12px;padding:4px 13px;border-radius:15px;color:#fff;background:linear-gradient(135deg,#ff5e83,#ff326d);box-shadow:0 5px 12px rgba(255,52,108,.26);font-size:12px;font-weight:700;text-shadow:none}
.knn-showcase-slide-title{display:block;font-size:29px;font-weight:900;line-height:1.2;letter-spacing:-.5px}
.knn-showcase-slide-description{display:block;margin-top:7px;color:rgba(255,255,255,.92);font-size:15px;line-height:1.5}
.knn-showcase-slide-button{display:inline-flex;align-items:center;gap:9px;height:35px;margin-top:15px;padding:0 18px;border-radius:18px;color:#27364a;background:#fff;box-shadow:0 5px 15px rgba(0,0,0,.16);font-size:12px;font-weight:700;text-shadow:none}.knn-showcase-slide-button i{font-size:10px}
.knn-showcase-slider-v2 .swiper-button-prev,.knn-showcase-slider-v2 .swiper-button-next{width:34px;height:34px;margin-top:-17px;border:0;border-radius:50%;color:#fff;background:rgba(24,34,48,.46);backdrop-filter:blur(5px);transition:background .18s ease,transform .18s ease}.knn-showcase-slider-v2 .swiper-button-prev{left:12px}.knn-showcase-slider-v2 .swiper-button-next{right:12px}.knn-showcase-slider-v2 .swiper-button-prev::after,.knn-showcase-slider-v2 .swiper-button-next::after{font-size:13px;font-weight:900}.knn-showcase-slider-v2 .swiper-button-prev:hover,.knn-showcase-slider-v2 .swiper-button-next:hover{background:rgba(24,34,48,.7);transform:scale(1.06)}
.knn-showcase-slider-v2 .swiper-pagination{bottom:10px!important;line-height:8px}.knn-showcase-slider-v2 .swiper-pagination-bullet{width:8px;height:8px;margin:0 4px!important;border:0;background:rgba(255,255,255,.75);opacity:1;transition:width .2s ease,background .2s ease}.knn-showcase-slider-v2 .swiper-pagination-bullet-active{width:19px;border-radius:5px;background:#fff}

/* 右侧：三标签文章榜单 */
.knn-tab-posts-v2.widget-container{width:100%;min-height:270px;margin-bottom:20px;padding:0 18px 12px;overflow:hidden;border:1px solid #edf1f6;border-radius:12px;background:#fff;box-shadow:0 8px 28px rgba(40,76,117,.08)}
.knn-tab-posts-v2-head{display:flex;align-items:stretch;height:56px;border-bottom:1px solid #edf1f6}
.knn-tab-posts-v2-nav{display:flex;align-items:stretch;flex:1;min-width:0;gap:2px}
.knn-tab-posts-v2-tab{position:relative;display:flex;align-items:center;justify-content:center;flex:1;min-width:0;padding:0 4px;border:0;outline:0;color:#4e5968;background:transparent;cursor:pointer;font-size:14px;white-space:nowrap;transition:color .18s ease}.knn-tab-posts-v2-tab::after{content:"";position:absolute;left:50%;bottom:-1px;width:0;height:3px;border-radius:2px;background:#1681f8;transform:translateX(-50%);transition:width .2s ease}.knn-tab-posts-v2-tab:hover,.knn-tab-posts-v2-tab.is-active{color:#1681f8;font-weight:700}.knn-tab-posts-v2-tab.is-active::after{width:42px}
.knn-tab-posts-v2-more{display:inline-flex;align-items:center;justify-content:flex-end;flex:0 0 47px;gap:4px;color:#8190a5;text-decoration:none;font-size:11px;white-space:nowrap;transition:color .18s ease}.knn-tab-posts-v2-more i{font-size:8px}.knn-tab-posts-v2-more:hover{color:#1681f8}
.knn-tab-posts-v2-panels{padding-top:9px}.knn-tab-posts-v2-panel[hidden]{display:none!important}
.knn-tab-posts-v2-list{display:flex;margin:0;padding:0;flex-direction:column;list-style:none;counter-reset:none}
.knn-tab-posts-v2-list li{margin:0;padding:0;border-bottom:1px solid #f4f6f9}.knn-tab-posts-v2-list li:last-child{border-bottom:0}
.knn-tab-posts-v2-list a{display:flex;align-items:center;min-width:0;height:38px;color:#4a5361;text-decoration:none;font-size:13px;transition:color .18s ease,transform .18s ease}.knn-tab-posts-v2-list a:hover{color:#1681f8;transform:translateX(2px)}
.knn-tab-posts-v2-rank{display:inline-flex;align-items:center;justify-content:center;flex:0 0 20px;width:20px;height:20px;margin-right:8px;border-radius:5px;font-size:11px;font-variant-numeric:tabular-nums}.knn-tab-posts-v2-rank.rank-1{color:#ff5776;background:#ffe8ee}.knn-tab-posts-v2-rank.rank-2{color:#ff8a3d;background:#fff0e6}.knn-tab-posts-v2-rank.rank-3{color:#d85be6;background:#fae9ff}.knn-tab-posts-v2-rank.rank-4{color:#388fe8;background:#e6f3ff}.knn-tab-posts-v2-rank.rank-5{color:#35ad62;background:#e7f8ec}
.knn-tab-posts-v2-title{display:block;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.knn-tab-posts-v2-date{flex:0 0 40px;margin-left:8px;color:#93a0b3;font-size:11px;font-style:normal;text-align:right;font-variant-numeric:tabular-nums}.knn-tab-posts-v2-empty{margin:20px 0;color:#98a2b1;text-align:center;font-size:13px}

body.dark-mode .knn-tab-posts-v2.widget-container{border-color:#303a47;background:#202936;box-shadow:0 8px 28px rgba(0,0,0,.22)}body.dark-mode .knn-tab-posts-v2-head{border-color:#303a47}body.dark-mode .knn-tab-posts-v2-tab{color:#aeb8c5}body.dark-mode .knn-tab-posts-v2-tab.is-active,body.dark-mode .knn-tab-posts-v2-tab:hover,body.dark-mode .knn-tab-posts-v2-more:hover{color:#56a8ff}body.dark-mode .knn-tab-posts-v2-more,body.dark-mode .knn-tab-posts-v2-date{color:#8492a4}body.dark-mode .knn-tab-posts-v2-list li{border-color:#2b3542}body.dark-mode .knn-tab-posts-v2-list a{color:#d5dce5}body.dark-mode .knn-tab-posts-v2-list a:hover{color:#56a8ff}

@media(max-width:767px){.main-container.knn-widget-fluid.knn-showcase-pair-v2{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}.knn-showcase-pair-v2-other{grid-column:auto}.knn-showcase-slider-v2.new-swiper{height:var(--knn-showcase-height-m,220px);border-radius:10px}.knn-showcase-slide-copy{left:20px;bottom:24px;max-width:80%}.knn-showcase-slide-badge{min-height:23px;margin-bottom:8px;padding:3px 10px;font-size:10px}.knn-showcase-slide-title{font-size:22px}.knn-showcase-slide-description{margin-top:5px;font-size:12px}.knn-showcase-slide-button{height:30px;margin-top:11px;padding:0 14px;font-size:11px}.knn-showcase-slider-v2 .swiper-button-prev,.knn-showcase-slider-v2 .swiper-button-next{display:none}.knn-tab-posts-v2.widget-container{min-height:0;padding:0 14px 10px;border-radius:10px}.knn-tab-posts-v2-head{height:50px}.knn-tab-posts-v2-tab{font-size:12px}.knn-tab-posts-v2-more{flex-basis:43px;font-size:10px}.knn-tab-posts-v2-list a{height:37px}}
@media(max-width:767px){
  .knn-showcase-slider-v2.new-swiper{
    height:var(--knn-showcase-height-m,220px)!important;
    min-height:var(--knn-showcase-height-m,220px)!important;
  }
  .knn-showcase-slider-v2.new-swiper>.swiper-wrapper,
  .knn-showcase-slider-v2.new-swiper>.swiper-wrapper>.swiper-slide,
  .knn-showcase-slider-v2 .knn-showcase-slide{
    height:100%!important;
    min-height:100%!important;
  }
  .knn-showcase-slider-v2 .knn-showcase-slide-image{
    position:absolute;
    inset:0;
    width:100%!important;
    height:100%!important;
    min-width:100%!important;
    min-height:100%!important;
    max-width:none!important;
    max-height:none!important;
    object-fit:cover!important;
    object-position:center center;
  }
}
@media(prefers-reduced-motion:reduce){.knn-showcase-slide-image,.knn-showcase-slider-v2 .swiper-button-prev,.knn-showcase-slider-v2 .swiper-button-next,.knn-tab-posts-v2 *{transition:none!important}}
