/*
Theme Name:     极主题  Jitheme.com
Theme URI:      http://7b2.com/
Description:    这是b2主题的子主题，名为极主题，一个美化最好看的子主题。
Author:         极主题创造团队
Author URI:     https://www.jitheme.com/
Template:       b2
Version:        2.9.5
Tags:           收费主题,极主题,子主题
*/
/*
 *-------------------------------------------------------------------------------
 *全站字体更换
 *-------------------------------------------------------------------------------
*/
@font-face {
	font-family: 'jitheme';
	src: url('https://dsfs.oppo.com/store/public/font/OPPOSans-Medium.woff2') format('woff2');
	font-weight: normal;
	font-style: normal;
}

body,pre {
	font-family: 'jitheme', sans-serif;

}

/* 圈子评论头衔徽章去掉父主题默认阴影（含回复） */
.topic-comments .author-vip,
.topic-comments .author-lv {
    text-shadow: none !important;
    background: transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
    height: auto !important;
    line-height: 1.2 !important;
}

/* 圈子评论回复：昵称行与头衔行分离，头衔显示在昵称下方 */
.topic-child-list .topic-author-info-left {
    align-items: flex-start;
}

.topic-child-list .jitheme-circle-reply-userbox {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.topic-child-list .jitheme-circle-reply-mainline {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    line-height: 1.2;
}

.topic-child-list .jitheme-circle-reply-titleline {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 4px;
}

.topic-child-list .jitheme-circle-reply-titleline .author-vip,
.topic-child-list .jitheme-circle-reply-titleline .author-lv {
    margin-left: 0;
}

/* 整体滚动条样式 */
::-webkit-scrollbar {
  width: 8px;  /* 垂直滚动条宽度 */
  height: 8px; /* 水平滚动条高度 */
}
::-webkit-scrollbar-track {
  background-color: #f1f1f1;
}

/* 滚动条滑块 */
::-webkit-scrollbar-thumb {
  background-color: #888;
}

/* 滚动条滑块悬停时 */
::-webkit-scrollbar-thumb:hover {
  background-color: #555;
}

.Jifont_pad{margin-right: 5px;}
.Jifont_red{color:#fa455f;}
/*20230925*/
.logo-left .mobile-box {
    margin-left: 10px;
}
[class*="icon-fire-"] {
    color: #c1c1c1;
}
.icon-talk-hot-1 {
    color: #fa455f;
}
.icon-talk-hot-2 {
    color: #f90;
}
.icon-talk-hot-3 {
    color: #ff6000;
}
.icon-fire-1 {
    color: #e20000;
}
.icon-fire-2{
    color: #ff6000;
}
.icon-fire-3 {
    color: #f90;
}
.post-list-cats a span {
    border-radius: 4px;
}
/*暗夜模式*/
.jitheme-toggle i {
    background-position: 0 0;
    background-repeat: no-repeat;
    cursor: pointer;
    font-size: 24px;
}
.jitheme_logo {
    background-image: var(--logo-url);
    background-position: 0 0;
    background-repeat: no-repeat;
    cursor: pointer;
    height: 35px;  /* 移动端默认 35px */
    width: 150px;
    background-size: contain;
}

/* PC端（屏幕宽度大于等于 768px 或 992px） */
@media (min-width: 768px) {
    .jitheme_logo {
        height: 50px;
    }
}
.jitheme_index_qx{
    margin-top: 20px;
    padding: 15px;
    background-color: var(--main-bg-color);
}
.jitheme_index_qx .content-user-lv-login a{
    background-color:var(--b2color);
    color: #fff;
}

.avatar-parent,
.avatar-parent img,
.avatar,
.avatar img,
img.avatar,
.top-user-avatar,
.top-user-avatar img,
.user-s-info-avatar,
.user-s-info-avatar img,
.post-list-meta-avatar,
.post-list-meta-avatar img,
.insert-post-meta-avatar,
.insert-post-meta-avatar img,
.user-w-avatar,
.user-w-avatar img,
.following-avatar,
.following-avatar img,
.comment-form .com-info-avatar,
.comment-form .com-info img {
    border-radius: 50% !important;
}

.avatar-parent,
.avatar,
.top-user-avatar,
.user-s-info-avatar,
.post-list-meta-avatar,
.insert-post-meta-avatar,
.user-w-avatar,
.following-avatar,
.comment-form .com-info-avatar {
    overflow: hidden;
}

/* 认证角标需要超出头像容器显示，避免被全局头像裁切规则截断 */
.avatar-parent,
.comments-area-content .comment .gravatar,
.header-user .top-user-box,
.top-user-avatar.avatar-parent {
    overflow: visible;
}

/* 右上角头像跟随容器尺寸，避免在移动端只显示一小块 */
.top-user-avatar.avatar-parent img.avatar,
.top-user-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.comments-area-content .comment .gravatar .b2-vrenzhengguanli {
    z-index: 4;
}

/* 用户小工具头像不裁切，避免认证标和头像边缘显示不全 */
.user-widget-info .user-w-avatar,
.user-widget-info .user-w-avatar .avatar-parent {
    overflow: visible;
}

.top-user-box-drop .top-user-info-box-name .avatar {
    width: 48px;
    height: 48px;
    display: block;
    object-fit: cover;
    flex: 0 0 48px;
    border-radius: 50% !important;
}

/* 夜间模式：关闭父主题全局背景图（.site 背景图 + .b2-page-bg 图片层） */
body.style-for-dark .site {
    background-image: none !important;
}

body.style-for-dark .b2-page-bg,
body.style-for-dark .b2-page-bg::before,
body.style-for-dark .b2-page-bg img {
    display: none !important;
}

.ji-rank-archive-header .header-menus .menus,.ji-rank-archive-header .header-menus .join .cont-title small, .ji-rank-archive-header .header-menus .menus .cont-title small, .ji-rank-archive-header .header-menus .cats .item .txt {
    color: var(--muted-color);
}
.ji-rank-archive-header .header-menus,.ji-rank-archive-header .header-menus .join, .ji-rank-archive-header .header-menus .menus ,.jitheme-rank-tab .mi-tab-wrap,.group-item .item-wrap,.trendInfo___3oCmt {
    background-color:var(--main-bg-color);
}
.ji-paih-title h5,.btn-pink,.ji-rank-archive-header .header-menus .cats .item .count,.ji-rank-archive-header .header-menus .cats .item:hover .jitheme,.jitheme-ranks .item-author .author-avatar:after,.ji-rank-archive-header .header-menus .pops .item .num{
    color: #fff;
}
.site-content,.tax-info-item .fliter-button,.link-top h2,.top-user-box-drop p,.top-user-box-drop .top-user-info-box-count p,.top-user-info-box .user-w-gold a,.top-user-info-box-name h2,.login-out a,.bar-item i,.post-meta-right button,.post-style-2 .top-menu ul li.depth-0 > a,.post-style-2 .change-theme button,.post-style-2 .change-theme>div a,.document-cat-rot,.link-overlay,.link-overlay,.topic-name-data b,.comment-info span,.tags-page ul li h2,.shop-single-action-right .favorite-button,.insert-post h2, .file-down h2,.vip-allow.allow,#jitheme_header_top02 .header, #jitheme_header_top02 .header .wrapper,.jiheme_home .home .ji_haeder .jitheme-toggle i,.jiheme_home .home .ji_haeder .change-theme i,.item-ico i,.jitheme-zt .item-title,.message-content p,.jitheme-zt .item-desc,.close,.vip-login-title,.zt-title,.ji_haeder #jitheme_header_top02 .top-menu ul li.depth-0 > a,#jitheme_header_top01 .social-top .top-menu ul li.depth-0 > a,.mobile-footer-menu a,.ji-rank-archive-header .header-menus .pops .item a,.home-section-first-menus .main-menus .sub .sub-menus-1 .sub-item a,.home-section-first-menus .main-menus .sub .sub-menus-1 .sub-item .tit,.home-section-first-menus .main-menus .sub .sub-menus-2 .item a,.home-section-first-menus .main-menus .sub .sub-menus-2 .item a em,.home-section-first-menus .main-menus .sub h2,#Jitheme_index_rili .swiper-slide-text .home-sence-name h6{
    color: var(--key-color);
    
    }
.logo-left .login-button .b2-account-circle-line,.footer,.vip-faq-list h2{
    color: var(--key-color)!important;
}    
.user-w-logon::after{
    background-image: linear-gradient(0deg, var(--main-bg-color) 0,rgba(247,248,249,0) 100%)!important;
}
.top-user-box-drop.show,.site .site-header-in {
    box-shadow: var(--box-ty);
}
.b2-menu-3 .sub-menu-0 > li:hover > a, .b2-menu-3 .sub-menu-0 a:hover,.site, .widget-comment-contnet,.user-widget-content .user-w-rw,.widget .recommended-widget li.picked a,.po-ask button span,.po-topic-box-tips,.insert-post,.download-list,.content-ds,.download-rights,.download-info,.w-d-role.d-allow,.com-form-textarea textarea,.document-content .button,.pager-center,.homebk12 .homebk8-ctn li,.post-6-jiehsao,.post-tags-meat-onecad .tag-img i,.post-tags-meat-onecad .sub-nav span,.audio-wrapper,.site-terms,.topic-guess-box,.topic-card-box li,.file-list-item,.topic-vote-box,.user-money, .user-credit,#Onecad_vips .vip-faq-list p,.post-user-info,.jitheme-bqts,.jitheme_slide_d .mini-stats,.jitheme_slide_link ul li a,.topic-image-light,.info-po-attrs > div .info-po-input,.info-po-type-in,.po-attrs-buttons,.tox:not([dir=rtl]) .tox-toolbar__group:not(:last-of-type):before,.new-meta-left button,.infomation-list-top-l span,.fancybox-thumbs,.w-d-list.gujia .w-d-meta p,.widget .widget-gujia-hot-circle .widget-circle-info h2,.post-tags-meat a,.post-tags-meat a .tag-img,.ji-downMain .categories,.tax-fliter-hot .order-items a:hover.ji-rank-archive-header .header-menus .pops .item .num.num_1,.footer-fav,#jitheme_ask .ask-bar,.jitheme-category .tax-info-item .fliter-button,.about-contact .c-menus,.about-contactus .ct-box,.topic-comment-form,.jitheme_links_post .site-desc,.single-link-rating button,.jitheme_links_post .site-list-cat a,.login-out a,.top-user-info-box .user-w-gold > div,.topic-meta-more-box ul,.topic-footer-left button,.item-ico,.post-9 .post-excerpt, .post-2 .post-excerpt, .post-4 .post-excerpt, .post-7 .post-excerpt, .post-excerpt,.bind-pass-info div,.user-social-box > div,.social-top .show-menu-box .header-logo,.home-section-first-menus .main-menus .sub .sub-menus-1 .sub-item a,.home-section-first-menus .main-menus .sub .sub-menus-2 .item a,.entry-content .content-hidden,.home-section-first-menus .main-menus .sub .sub-menus-1 .sub-item .ithumb, #bigTriangleColor,.ask-widget-fliter  {
    background-color: var(--body-bg-color);
}

.widget-comment-contnet.jt:before, .widget-comment-contnet.jt:after {
    border-bottom-color: var(--body-bg-color);
}
#public .my-circle-list button.picked:after,.widget-circle-info-desc:before{
    border-bottom-color: var(--float-btn-bg)!important;
}
.post-list-cats a span,.collection-posts li span,.ajax-pager .button[disabled], .ajax-pager .button.selected,.post-3-li-dubble .post-list-cats a span{
    background: var(--ji-btcolor);
}
.box, .side-fixed,.side-fixed,i.b2-vrenzhengguanli,.credit-top-avatar,.next-jt i,.document-row,.link-in:hover,.bar-normal,.bar-footer,.post-3 .post-3-li .item-in,.po-topic-box-tips,.topic-answer-login ,.topic-loading-more-button,.newOneCAD_link,.Onecad-dongtai,.user-sidebar-count li,#sence-box #sence-list-box #swiper1 .swiper-wrapper .swiper-slide a,.com-form-input input,.jitheme-background-default,.jitheme_slide_d_m .mini-stats-desc,.collection-button,.info-po-type-in > div.picked,#b2-editor-box .tox .tox-toolbar,.tox .tox-edit-area__iframe,.top-user-info-box,.top-user-box-drop,.top-user-info-box .user-w-gold a i,.w-d-list.gujia .w-d-title,.post-content-footer .content-footer-poster button,.tax-fliter-hot,.jitheme-zt .item-wrapa,.ji-bg-white,.jitheme-zt-more,.jitheme_arc_b,.jitheme_baim,#jitheme_ask_list  .ask-item  ,.jitheme-cat .ask-cat-list .b-wrap,#jitheme_new.plate-news,#jitheme_ask input,.content-excerpt,#jitheme_ask .ask-bar .picked,.ask-widget-ul li:nth-child(odd),.about-honour,.b2-menu-3 .sub-menu-0>li>a:hover,.about-contact,.about-calture .c2,.about-calture .c1-items,.about-contactus .c-box,.about-contactus .intro-wrap .c-box,.ask-list-nav,.topic-comment-form.show textarea,.post-type-archive-links .inner-wrapper-sticky,.modal-content,.home-section-first-menus .main-menus .sub .sub-menus-2 .item a em,#Jitheme_index_rili .calendar-title .right,.home-section-first-menus .main-menus .sub .sub-menus-1 .sub-item .ithumb{
    background: var(--main-bg-color)!important;
}
.widget-comment-contnet jt, .post-excerpt, .widget-comment-contnet p,.topic-content-text,.comment-author .user-title,.comment-content-text p,.document-row h3 a,.link-desc,.ask-desc,.ask-user-info,.tags-page ul li p,.post-list-cats a span,#jitheme_new .news-item a,#jitheme_new .news-item p,.one-home-title p,.user-panel-info p,.user-info-title,.user-sidebar-info p,.user-item-desc,.widget-comment-post,.widget-comment-user time,.shop-single-data-title,.post-breadcrumb,.user-w-tj p,.post-meta li span,.jitheme-category .data .ji-flex-1 span i.b2-upload-fill,.jitheme-category .data .ji-flex-1 span i.b2-hearts-line,.post-list-cat a,.item-author .author-info,.topic-more-menu button, .topic-more-menu a,.comment-content-text p,.shop-single-data li,.shop-single-data .shop-item-delete,.shop-single-data .shop-item-delete,.user-mission-info-left time,#footer_tsk .vip-login-countdown-row,.jitheme_avatar_data,.post-3 .post-list-meta,.ap-item-meta, .author-meta span,.home-authors .item-tobe-author .item-cont,.home-authors .item-tobe-author .item-cont .count span,.item-author .item-bottom-title,.post-list-cat a,.user-s-data,.user-s-info-desc,.user-s-data p,.jitheme-zt .item-desc,.vip-faq-list p{
    color: var(--this-text)
}
.topic-comment-list,.ask-inv-box,.topic-ask-box,.com-form-input input,.info-po-type-in,.po-attrs-buttons label,.infomation-meta,.post-tags-meat a,.btn-gray,.collection-list-top-info{
    border: 1px dashed var(--main-border-color);
}

.list-footer,.circle-widget-button,.comment .comment-item,.document-row.b2-pd:nth-of-type(odd) ,.document-row + .document-row,.pager-center,.aside-bar > div > div + div,.none-comment,.w-d-role > div + div,.topic-lv1 + .topic-lv1,.topic-comments,.jitheme_slide_tjmk,.po-infomation-footer,.infomation-vote,.custom-page-widget ul li + li,.b2-b-t,.coll-text,.jitheme-cat .ask-cat-list .select-wrap,.vip-faq-list + .vip-faq-list,.ask-write-answer,.circle-topic-item,.post-gg-button,.ask-item + .ask-item,#ji-footer-new{
    border-top: 1px solid var(--main-border-color);
}
.jitheme-widget-pl .b2-widget-title h2, .b2-widget-newsflashes .b2-widget-title h2 ,.b2-menu-4 .sub-menu-0 > li > a,.po-topic-textarea textarea:first-child, .content-show-roles  h2 , .content-show-roles  h1,.comments-title ,.pager-center ,.post-3 .post-3-li .item-in, .post-5 .post-modules-top,.topic-comment-list-header,.topic-vote-desc,.jitheme-widget-pl .b2-widget-title h2 ,.b2-widget-newsflashes .b2-widget-title h2,.info-po-attrs > div,.info-po-type,.info-po-attrs-row1,.li-line,.infomation-list-top,.tox .tox-toolbar, .tox .tox-toolbar__overflow, .tox .tox-toolbar__primary,.message-list li,.dmsg-header,.jitheme-widget-post .b2-widget-title h2,.ji-downMain .data ul li>div, .post-5 .post-modules-top,.ask-answer-title,.shop-single-attr-title{
    border-bottom: 1px dashed  var(--main-border-color);
    
}

.user-s-data div + div,.document-row.b2-pd:nth-of-type(even) ,.pager-center,.info-box,.ji-rank-archive-header .header-menus .pops{
    border-left: 1px solid var(--main-border-color)!important;
}
.document-cat-item,.pager-center ,.ji-rank-archive-header .header-menus .pops{
    border-right: 1px solid var(--main-border-color);
}
.post-tags-meat a,.content-excerpt,.login-form-item input,.bind-pass-info div {
    border: 1px solid var(--main-border-color);
}
.header .login-button button.empty{
    color:#fff ;
   background: var(--b2color); 
}

@media screen and (min-width: 769px) {
    #jitheme-header-left .header .wrapper {
        display: flex;
        align-items: center;
    }

    #jitheme-header-left .header .wrapper .header-banner-right {
        margin-left: auto;
        display: flex;
        align-items: center;
        gap: 10px;
    }

    #jitheme-header-left .header .wrapper .header-banner-right .top-search {
        width: 260px;
    }

    #jitheme-header-left .header .wrapper .header-banner-right .header-user {
        position: static !important;
        top: auto !important;
        height: auto !important;
        display: flex;
        align-items: center;
        padding: 0;
    }
}

@media screen and (max-width: 768px) {
    #jitheme-header-left .header .wrapper .header-banner-right {
        display: flex;
        align-items: center;
    }

    #jitheme-header-left .header .wrapper .header-banner-right .change-theme {
        margin: 0 2px !important;
    }

    #jitheme-header-left .header .wrapper .header-banner-right .header-user .margin_ico {
        margin: 0 3px !important;
    }

    #jitheme-header-left .header .wrapper .header-banner-right .header-user .change-theme > div:last-child .margin_ico {
        margin-right: 10px !important;
    }
}


/*导航*/
.post-type-archive-circle .header ,.header,.header-banner{
    background-color: var(--header-bg)!important;
    color:  var(--key-color)!important;
}

/*圈子*/
.circle-desc,.widget .tagcloud a,.credit-top-info-right span,.widget-circle-info-desc,.com-form > .b2-radius{
    background-color:  var(--float-btn-bg);
    color: var(--key-color);
}
.topic-more-menu button:hover, .topic-more-menu a:hover{
    color:var(--b2color); 
}
.widget .tagcloud a:hover{
    color: var(--body-bg-color);
}
.topic-type-menu,.post-5 .load-more, .post-5 .b2-pagenav {
    border-top: 1px solid var(--main-bg-color);
    background-color: var(--main-bg-color);
}
.b2-widget-hot-circle .b2-widget-title button.picked:before{
    left: 45%;
}
.po-topic-textarea ,.b2-menu-4 ul ul li a img,.com-form-textarea{
    border: 1px solid  var(--main-border-color);
}
.topic-vote-box{
    max-width: unset!important;
}
/*侧栏CSS*/
.bar-normal,.bar-footer {
    box-shadow:unset;
}
.ajax-pager .button {
    margin-right: 15px;
    padding: 10px 20px;
    background: var(--ji-btcolor);
}

.onecad-right-tools {
    position: fixed;
    right: 14px;
    top: 50vh;
    transform: translateY(-50%);
    z-index: 50;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.onecad-right-tools .ort-checkin img {
    width: 56px;
    height: 64px;
    display: block;
}

.onecad-right-tools .ort-item {
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 10px;
    background: #fff;
    color: #6b7280;
    box-shadow: 0 8px 20px rgba(17, 24, 39, 0.12);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    text-decoration: none;
}

.onecad-right-tools .ort-svg {
    width: 17px;
    height: 17px;
}

.onecad-right-tools .ort-fav .ort-svg {
    width: 22px !important;
    height: 22px !important;
    transform: none;
}

.onecad-right-tools .ort-top .ort-svg {
    width: 22px !important;
    height: 22px !important;
    transform: none;
}

.onecad-right-tools .ort-dashicon {
    font-size: 24px !important;
    width: 24px !important;
    height: 24px !important;
    line-height: 24px !important;
}

/* 兼容旧版结构：如果按钮里仍是文字图标（★、↑），也强制放大 */
.onecad-right-tools .ort-fav .ort-ico,
.onecad-right-tools .ort-top .ort-ico {
    font-size: 22px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    color: #4b5563 !important;
    transform: none;
}



.onecad-right-tools .ort-item:hover {
    color: #3b82f6;
}

.onecad-right-tools .ort-top {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(4px);
    transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
}

.onecad-right-tools .ort-top.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

.onecad-right-tools .ort-pop {
    position: absolute;
    right: calc(100% + 10px);
    top: 50%;
    transform: translateY(-50%);
    display: none;
    flex-direction: column;
    border-radius: 10px;
    background: #fff;
    color: #16181a;
    box-shadow: 0 10px 28px rgba(17, 24, 39, 0.14);
    border: 1px solid rgba(162, 163, 166, 0.25);
    z-index: 5;
}

.onecad-right-tools .ort-item:hover .ort-pop {
    display: flex;
}

.onecad-right-tools .ort-pop-title {
    display: block;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.25;
    color: #2f5bff;
    word-break: break-all;
}

.onecad-right-tools .ort-pop-sub {
    display: block;
    font-size: 12px;
    color: #6b7280;
    line-height: 1.45;
}

.onecad-right-tools .ort-pop-fav {
    width: 208px;
    padding: 10px 12px;
    gap: 4px;
}

.onecad-right-tools .ort-pop-contact {
    width: 220px;
    padding: 12px;
    align-items: center;
    gap: 8px;
}

.onecad-right-tools .ort-pop-contact .ort-pop-banner {
    width: 100%;
    border-radius: 8px;
    display: block;
}

.onecad-right-tools .ort-pop-qr-wrap {
    padding: 6px;
    border: 2px solid #6f6cff;
    border-radius: 8px;
}

.onecad-right-tools .ort-pop-qr {
    width: 96px;
    height: 96px;
    object-fit: cover;
    display: block;
}

.onecad-right-tools .ort-pop-notice {
    width: 190px;
    padding: 10px 12px;
    gap: 4px;
}

@media screen and (max-width: 768px) {
    .onecad-right-tools {
        display: none;
    }
}

/* 你当前显示的是主题自带侧栏 #jitheme_celan，这里单独放大首个与回顶图标 */
#jitheme_celan .fixed-right > .drop:first-of-type .item i,
#jitheme_celan .fixed-right > .gotop .item i {
    font-size: 34px !important;
    line-height: 1 !important;
    transform: scale(1.25);
    display: inline-block;
}

#jitheme_celan .fixed-right > .drop:first-of-type .item .b2-vip-crown-2-line,
#jitheme_celan .fixed-right > .gotop .item .b2-rocket-2-line {
    font-size: 34px !important;
}
/*IMG问答导航*/
.b2-content .content-area, .post-style-2 .content-area, .archive .content-area {
    width: 100%;
}

/* 第8样式页：右侧栏与顶部游戏模块平齐（避开面包屑高度） */
.single .b2-single-content.b2-single-post-style-8 > #secondary.widget-area {
    margin-top: 32px;
}

/* sticky-sidebar 进入跟随后，抵消上面的静态偏移，避免出现顶部空白条 */
.single .b2-single-content.b2-single-post-style-8 > #secondary.widget-area .sidebar.is-affixed,
.single .b2-single-content.b2-single-post-style-8 > #secondary.widget-area .sidebar.is-affixed .inner-wrapper-sticky {
    margin-top: -32px;
}

/* 文章样式8：游戏下载样式 */
.post-style-8-top {
    margin-bottom: 12px;
}

.post-style-8-header {
    border-bottom: 0;
    padding-top: 0;
}

.post-style-8-hero {
    display: grid;
    grid-template-columns: 400px minmax(0, 1fr);
    gap: 18px;
    padding: 18px;
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    margin-bottom: 10px;
}

.ps8-gallery {
    min-width: 0;
    width: 400px;
}

.ps8-info {
    min-width: 0;
    padding-top: 2px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 150px;
    grid-template-areas:
        "title title"
        "desc desc"
        "meta votes";
    column-gap: 12px;
    row-gap: 0;
    align-content: start;
}

.ps8-main-img-wrap {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    background: #0f172a;
    width: 400px;
    height: 260px;
    max-width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ps8-main-img-wrap::before {
    content: '';
    position: absolute;
    inset: -12px;
    background-image: var(--ps8-cover-url);
    background-position: center;
    background-size: cover;
    filter: blur(16px) saturate(1.05);
    transform: scale(1.08);
    opacity: .72;
    z-index: 0;
}

.ps8-main-img-wrap::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.14) 0%, rgba(15, 23, 42, 0.28) 100%);
    z-index: 1;
}

.ps8-main-img-wrap img {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center center;
    display: block;
}

.post-style-8-top .ps8-info h1 {
    margin: 0;
    font-size: 18px;
    line-height: 27px;
    font-weight: 700;
    color: #26292d;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ps8-title-row {
    grid-area: title;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    margin-bottom: 8px;
    position: relative;
    padding-right: 82px;
    min-height: 30px;
}

.ps8-title-wrap {
    flex: 1;
    min-width: 0;
}

.ps8-hot-wrap {
    position: absolute;
    right: 0;
    top: 2px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.ps8-hot-wrap svg {
    width: 21px;
    height: 21px;
}

.ps8-hot-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    color: #9CA3BA;
}

.ps8-hot {
    color: #a2a3a6;
    font-weight: 500;
    font-size: 17px;
    line-height: 1;
    white-space: nowrap;
}

.ps8-desc {
    grid-area: desc;
    margin: 0 0 10px;
    height: 72px;
    color: #9ca3ba;
    line-height: 24px;
    font-size: 14px;
    font-weight: 500;
    overflow: hidden;
    display: -webkit-box;
    line-clamp: 3;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.ps8-meta-grid {
    grid-area: meta;
    display: grid;
    gap: 4px;
}

.ps8-meta-item {
    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);
    align-items: center;
    gap: 5px;
    min-height: 26px;
}

.ps8-meta-item > span {
    color: #26292d;
    font-weight: 700;
    font-size: 13px;
    line-height: 1;
}

.ps8-meta-item > b {
    font-weight: 500;
    color: #93989e;
    font-size: 12px;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ps8-dev {
    max-width: 220px;
}

.ps8-tags {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.ps8-tags em {
    font-style: normal;
    font-size: 9px;
    font-weight: 600;
    line-height: 17px;
    height: 17px;
    padding: 0 4px;
    border-radius: 3px;
    background: #e2e8f0;
    color: #6b7280;
}

.ps8-score {
    color: #fff !important;
    background: #f85178;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    padding: 0 7px;
    height: 26px;
    line-height: 1;
    font-size: 13px !important;
    font-weight: 500 !important;
    width: fit-content;
    white-space: nowrap;
    vertical-align: middle;
}

.ps8-meta-score-row {
    align-items: center;
}

.ps8-meta-score-row > b {
    align-self: center;
}

.ps8-votes-abs {
    grid-area: votes;
    position: static;
    display: flex;
    gap: 10px;
    align-self: end;
    justify-self: end;
}

.ps8-vote {
    width: 70px;
    height: 66px;
    border: 2px solid #e2e8f0;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background: #fff;
    transition: all .18s ease;
    position: relative;
}

.ps8-vote::after {
    content: attr(data-tip);
    position: absolute;
    left: 50%;
    bottom: calc(100% + 8px);
    transform: translateX(-50%);
    background: #000;
    color: #fff;
    font-size: 14px;
    line-height: 1;
    padding: 10px 12px;
    border-radius: 8px;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: opacity .15s ease;
    pointer-events: none;
    z-index: 12;
}

.ps8-vote::before {
    content: '';
    position: absolute;
    left: 50%;
    bottom: calc(100% + 2px);
    transform: translateX(-50%);
    border-width: 6px 6px 0 6px;
    border-style: solid;
    border-color: #000 transparent transparent transparent;
    opacity: 0;
    visibility: hidden;
    transition: opacity .15s ease;
    pointer-events: none;
    z-index: 12;
}

.ps8-vote:hover::after {
    opacity: 1;
    visibility: visible;
}

.ps8-vote:hover::before {
    opacity: 1;
    visibility: visible;
}

.ps8-vote.is-active.yes {
    border-color: #f5c870;
    box-shadow: 0 0 0 2px rgba(245, 200, 112, .2);
}

.ps8-vote.is-active.no {
    border-color: #b9b9f8;
    box-shadow: 0 0 0 2px rgba(185, 185, 248, .22);
}

.ps8-vote.is-loading {
    opacity: .65;
    pointer-events: none;
}

.ps8-vote img {
    width: 44px;
    height: 35px;
    margin-bottom: 1px;
}

.ps8-vote div {
    color: #16181a;
    font-size: 12px;
    line-height: 1;
}

.ps8-vote div span,
.ps8-vote div b {
    font-size: 16px;
    font-weight: 700;
    color: #26292d;
}

.ps8-vote.yes {
    background: #fff8e8;
    border-color: #fff2d1;
}

.ps8-vote.no {
    background: #f1f0ff;
    border-color: #e2e2ff;
}

/* 第8样式夜间模式可见性修复 */
body.style-for-dark .post-style-8-hero {
    background: #181a1f;
    border-color: #2c313a;
}

body.style-for-dark .post-style-8-top .ps8-info h1,
body.style-for-dark .ps8-meta-item > span,
body.style-for-dark .ps8-hot,
body.style-for-dark .ps8-vote div,
body.style-for-dark .ps8-vote div span,
body.style-for-dark .ps8-vote div b {
    color: var(--key-color) !important;
}

body.style-for-dark .ps8-desc,
body.style-for-dark .ps8-meta-item > b {
    color: var(--this-text) !important;
}

body.style-for-dark .ps8-tags em {
    background: #2a2f38;
    color: #d2d8e2;
}

body.style-for-dark .ps8-vote {
    background: #20232a;
    border-color: #3a404b;
}

body.style-for-dark .ps8-system-requirements {
    background: #181a1f;
    border-color: #2c313a;
}

body.style-for-dark .ps8-req-header,
body.style-for-dark .ps8-req-value {
    color: var(--key-color);
}

body.style-for-dark .ps8-req-label {
    color: var(--this-text);
}

body.style-for-dark .ps8-req-label svg,
body.style-for-dark .ps8-req-header-icon {
    color: #94a3b8;
}

body.style-for-dark .ps8-req-card {
    background: #20232a;
    border-color: #3a404b;
}

body.style-for-dark .ps8-req-row + .ps8-req-row,
body.style-for-dark .ps8-req-card-title {
    border-color: rgba(71, 85, 105, .55);
}

.post-style-8-cover {
    position: relative;
    height: 260px;
    border-radius: 10px;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    margin-bottom: 12px;
}

.post-style-8-mask {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.12) 0%, rgba(15, 23, 42, 0.75) 100%);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 8px;
    padding: 18px;
}

.post-style-8-mask h1 {
    color: #fff;
    margin: 0;
    font-size: 28px;
}

.post-style-8-download {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 12px 0 14px;
    padding: 14px 16px;
    border: 1px dashed var(--main-border-color);
    background: var(--main-bg-color);
}

.post-style-8-download-info strong {
    display: block;
    margin-bottom: 4px;
}

.post-style-8-download-info p {
    margin: 0;
    color: var(--muted-color);
}

.ps8-download-modal .modal-content {
    width: min(1080px, calc(100vw - 40px));
    max-height: calc(100vh - 48px);
    padding: 28px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.ps8-download-modal-close {
    width: 44px;
    height: 44px;
    padding: 0 !important;
    border: 0;
    outline: 0;
    background: transparent !important;
    color: #8b5cf6;
    border-radius: 12px;
    box-shadow: none;
    appearance: none;
    -webkit-appearance: none;
    font-size: 38px !important;
    line-height: 1 !important;
    font-weight: 300;
    font-family: Arial, Helvetica, sans-serif;
}

.ps8-download-modal-close::before,
.ps8-download-modal-close::after {
    display: none !important;
}

.ps8-download-modal-header {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
    padding-top: 10px;
    padding-right: 28px;
    margin-bottom: 18px;
}

.ps8-download-modal-header strong {
    font-size: 20px;
    color: #26292d;
    line-height: 1.2;
}

.ps8-download-modal-header span {
    color: var(--muted-color);
    font-size: 13px;
    text-align: right;
    white-space: nowrap;
}

.ps8-download-tabs-bar {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.ps8-download-modal-body {
    min-height: 0;
    overflow: auto;
}

.single .b2-single-content.b2-single-post-style-8 #download-box {
    display: none;
}

.ps8-download-modal-loading,
.ps8-download-modal-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 240px;
    color: var(--muted-color);
    font-size: 14px;
}

.ps8-download-tabs {
    display: flex;
    align-items: center;
    flex: 1;
    gap: 28px;
    margin-bottom: 18px;
    padding: 0 6px 2px;
    overflow-x: auto;
}

.ps8-download-tabs-meta {
    flex: 0 0 auto;
    min-width: max-content;
    padding-top: 8px;
    color: var(--muted-color);
    font-size: 13px;
    line-height: 1.4;
    text-align: right;
}

.ps8-download-tabs-tools {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex: 0 0 auto;
    min-width: max-content;
    padding-top: 4px;
}

.ps8-download-sort {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 30px;
    padding: 0 10px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: #94a3b8;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
}

.ps8-download-sort::before {
    content: '';
    width: 8px;
    height: 12px;
    border-radius: 2px;
    background: currentColor;
    clip-path: polygon(0 0, 40% 0, 40% 100%, 0 100%, 0 68%, 100% 68%, 100% 100%, 60% 100%, 60% 0, 100% 0, 100% 32%, 0 32%);
    opacity: .7;
}

.ps8-download-sort:hover,
.ps8-download-sort:focus {
    color: var(--b2color);
}

.ps8-download-sort.is-active {
    color: #3153ff;
    background: rgba(49, 83, 255, 0.08);
}

.ps8-download-tab {
    position: relative;
    padding: 0 0 14px;
    border: 0;
    background: transparent;
    color: #6b7280;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
}

.ps8-download-tab:hover,
.ps8-download-tab:focus {
    color: var(--b2color);
    opacity: 1;
}

.ps8-download-tab.is-active {
    color: #111827;
}

.ps8-download-tab.is-active::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -1px;
    width: 24px;
    height: 4px;
    border-radius: 999px;
    background: var(--b2color);
    transform: translateX(-50%);
}

.ps8-download-qr-listing {
    display: grid;
    gap: 16px;
}

.ps8-download-qr-card {
    display: none;
    border: 1px solid #edf0f5;
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    padding: 16px;
}

.ps8-download-qr-card.is-active {
    display: block;
}

.ps8-download-tab-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 240px;
    border: 1px dashed #d7deea;
    border-radius: 14px;
    background: #fbfcfe;
    color: var(--muted-color);
    font-size: 14px;
}

.ps8-related-resource-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 240px));
    justify-content: flex-start;
    gap: 18px;
}

.ps8-related-resource-card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 100%;
    padding: 0;
    border: 1px solid #edf0f5;
    border-radius: 20px;
    background: #fff;
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.ps8-related-resource-card:hover,
.ps8-related-resource-card:focus {
    transform: translateY(-4px);
    border-color: rgba(124, 58, 237, 0.18);
    box-shadow: 0 18px 36px rgba(15, 23, 42, 0.1);
}

.ps8-related-resource-cover {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: linear-gradient(135deg, #eef2ff 0%, #fdf2f8 100%);
}

.ps8-related-resource-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .3s ease;
}

.ps8-related-resource-card:hover .ps8-related-resource-cover img,
.ps8-related-resource-card:focus .ps8-related-resource-cover img {
    transform: scale(1.04);
}

.ps8-related-resource-fallback {
    font-size: 30px;
    font-weight: 700;
    color: #6d28d9;
}

.ps8-related-resource-body {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px 16px 18px;
}

.ps8-related-resource-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-width: 0;
}

.ps8-related-resource-badge {
    display: inline-flex;
    align-items: center;
    height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    background: rgba(109, 40, 217, 0.08);
    color: #6d28d9;
    font-size: 12px;
    font-weight: 700;
}

.ps8-related-resource-date {
    color: #94a3b8;
    font-size: 12px;
    white-space: nowrap;
}

.ps8-related-resource-title {
    display: -webkit-box;
    overflow: hidden;
    color: #111827;
    font-size: 16px;
    line-height: 1.65;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.ps8-related-resource-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    min-width: 96px;
    height: 36px;
    padding: 0 14px;
    border-radius: 999px;
    background: #111827;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
}

@media (max-width: 640px) {
    .ps8-related-resource-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
    }

    .ps8-related-resource-body {
        padding: 14px;
    }

    .ps8-related-resource-meta {
        flex-wrap: wrap;
    }
}

@media (max-width: 480px) {
    .ps8-related-resource-list {
        grid-template-columns: minmax(0, 1fr);
    }
}

.ps8-download-subsection-sep {
    height: 1px;
    margin: 16px 0;
    background: linear-gradient(90deg, rgba(226, 232, 240, 0), rgba(226, 232, 240, 0.95), rgba(226, 232, 240, 0));
}

.ps8-download-qr-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.ps8-download-qr-card-head h3 {
    margin: 0;
    font-size: 18px;
    line-height: 1.3;
    color: #1f2937;
}

.ps8-download-qr-attrs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 14px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ps8-download-qr-attrs li {
    display: flex;
    align-items: baseline;
    gap: 6px;
    font-size: 13px;
}

.ps8-download-qr-attrs span {
    color: #6b7280;
    white-space: nowrap;
}

.ps8-download-qr-attrs b {
    color: #111827;
    font-weight: 500;
    word-break: break-all;
}

.ps8-download-qr-state {
    margin-top: 12px;
    padding: 10px 12px;
    border-radius: 12px;
    font-size: 14px;
    line-height: 1.6;
    white-space: normal;
}

.ps8-download-qr-state.is-allow {
    background: #edfdf1;
    color: #0f8a38;
}

.ps8-download-qr-state.is-locked {
    background: #fff7ed;
    color: #c2410c;
}

.ps8-download-qr-items {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 14px;
    margin-top: 14px;
}

.ps8-download-qr-item {
    position: relative;
    overflow: hidden;
    border: 1px solid #e9edf4;
    border-radius: 14px;
    background: #fff;
    padding: 14px;
    text-align: center;
}

.ps8-download-qr-ribbon {
    position: absolute;
    top: 12px;
    left: -42px;
    z-index: 2;
    display: inline-block;
    width: 136px;
    padding: 4px 0;
    background: linear-gradient(180deg, #ff5f52 0%, #e91313 100%);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    line-height: 1.2;
    text-align: center;
    transform: rotate(-45deg);
    box-shadow: 0 6px 14px rgba(233, 19, 19, 0.28);
    pointer-events: none;
}

.ps8-download-qr-item strong {
    display: block;
    margin-bottom: 12px;
    font-size: 15px;
    color: #111827;
}

.ps8-download-qr-canvas {
    display: block;
    width: 168px;
    height: 168px;
    margin: 0 auto;
    border-radius: 12px;
    background: #fff;
}

.ps8-download-qr-item.is-quark .ps8-download-qr-canvas {
    width: 184px;
    height: 184px;
}

.ps8-download-qr-actions,
.ps8-download-locked-actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    flex-wrap: wrap;
    margin-top: 12px;
}

.ps8-download-qr-passcode {
    color: #111827;
    font-size: 13px;
    line-height: 1.6;
    font-weight: 700;
}

.ps8-download-qr-unavailable {
    color: #ef4444;
    font-size: 13px;
    line-height: 1.6;
}

.ps8-download-qr-tip {
    color: #6b7280;
    font-size: 13px;
    line-height: 1.6;
}

.ps8-download-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-width: 132px;
    height: 46px;
    padding: 0 24px;
    border: 0;
    border-radius: 14px;
    background: var(--b2color);
    box-shadow: 0 12px 24px var(--box-ty);
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: .02em;
    transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}

.ps8-download-trigger-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
}

.ps8-download-trigger-icon svg {
    display: block;
    width: 20px;
    height: 20px;
}

.ps8-download-trigger:hover,
.ps8-download-trigger:focus {
    transform: translateY(-1px);
    box-shadow: 0 16px 30px var(--box-ty);
    color: #fff;
}

.ps8-download-trigger:active {
    transform: translateY(0);
    box-shadow: 0 8px 18px var(--box-ty);
}

.ps8-download-trigger.is-disabled,
.ps8-download-trigger[disabled] {
    background: var(--main-bg-color);
    color: var(--muted-color);
    border: 1px solid var(--main-border-color);
    box-shadow: none;
    cursor: not-allowed;
    opacity: .9;
}

body.ps8-download-modal-open {
    overflow: hidden;
}

.ps8-system-requirements {
    margin: 12px 0 14px;
    padding: 10px;
    border: 1px solid #e5e7eb;
    background: #fbfdff;
}

.ps8-req-header {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
    color: #1f2937;
}

.ps8-req-header strong {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
}

.ps8-req-header-icon {
    width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #374151;
    flex: 0 0 18px;
    font-size: 15px;
    line-height: 1;
    overflow: hidden;
}

.ps8-req-header-icon svg {
    width: 15px;
    height: 15px;
    display: block;
    max-width: 15px !important;
    max-height: 15px !important;
    min-width: 15px;
    min-height: 15px;
    flex: 0 0 15px;
}

.ps8-req-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.ps8-req-card {
    display: flex;
    flex-direction: column;
    height: 300px;
    overflow: hidden;
    border: 1px solid #dbe4f0;
    border-radius: 10px;
    background: #fff;
}

.ps8-req-card-title {
    padding: 8px 12px;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
    border-bottom: 1px solid rgba(203, 213, 225, .65);
}

.ps8-req-card.is-min .ps8-req-card-title {
    color: #1d4ed8;
    background: linear-gradient(180deg, #dbeafe 0%, #cfe0fb 100%);
}

.ps8-req-card.is-rec .ps8-req-card-title {
    color: #c2410c;
    background: linear-gradient(180deg, #fef3c7 0%, #fcefb4 100%);
}

.ps8-req-card-body {
    flex: 1 1 auto;
    padding: 6px 10px 8px;
    overflow: auto;
}

.ps8-req-row {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    gap: 8px;
    align-items: start;
    padding: 6px 0;
}

.ps8-req-row + .ps8-req-row {
    border-top: 0;
}

.ps8-req-label {
    display: inline-flex;
    align-items: flex-start;
    align-self: start;
    gap: 5px;
    color: #4b5563;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.35;
    white-space: nowrap;
}

.ps8-req-label svg,
.ps8-req-label .ps8-req-icon {
    width: 15px;
    height: 15px;
    flex: 0 0 15px;
    color: #6b7280;
    display: block;
    max-width: 15px !important;
    max-height: 15px !important;
    min-width: 15px;
    min-height: 15px;
}

.ps8-req-value {
    color: #111827;
    font-size: 12px;
    line-height: 1.45;
    word-break: break-word;
    align-self: start;
}

/* 样式8正文标题：绿色标题块 + 右侧灰色延展条 */
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content > h2,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content > h1,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content > h3,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content > h4,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content > h5,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content > h6 {
    position: relative;
    font-size: revert !important;
    display: flex !important;
    align-items: stretch;
    width: 100% !important;
    max-width: 100%;
    padding: 0 !important;
    background: transparent !important;
    color: inherit !important;
    font-size: inherit !important;
    line-height: inherit !important;
    font-weight: 700 !important;
    border-radius: 0;
    z-index: 1;
}

.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h2,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h1,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h3,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h4,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h5,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h6 {
    position: relative;
    font-size: revert !important;
    display: flex !important;
    align-items: stretch;
    width: 100% !important;
    max-width: 100%;
    padding: 0 !important;
    background: transparent !important;
    color: inherit !important;
    font-size: inherit !important;
    line-height: inherit !important;
    font-weight: 700 !important;
    border-radius: 0;
    z-index: 1;
}

.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content > h2::after,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content > h1::after,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content > h3::after,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content > h4::after,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content > h5::after,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content > h6::after {
    content: '';
    display: block;
    flex: 1 1 auto;
    min-width: 0;
    background: #e7e7e7;
}

.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h2::after,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h1::after,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h3::after,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h4::after,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h5::after,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h6::after {
    content: '';
    display: block;
    flex: 1 1 auto;
    min-width: 0;
    background: #e7e7e7;
}

.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h2 > .ps8-heading-label,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h1 > .ps8-heading-label,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h3 > .ps8-heading-label,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h4 > .ps8-heading-label,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h5 > .ps8-heading-label,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h6 > .ps8-heading-label {
    position: relative;
    display: inline-flex;
    align-items: center;
    flex: 0 1 auto;
    max-width: 100%;
    min-height: 36px;
    padding: 7px 14px !important;
    background: var(--b2color);
    color: #ffffff;
    line-height: inherit;
    font-weight: 700;
    box-sizing: border-box;
}

.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h3 > .ps8-heading-label {
    min-height: 25px;
    padding: 3px 12px !important;
}

.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h4 > .ps8-heading-label {
    min-height: 23px;
    padding: 2px 12px !important;
}

.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h2 > .ps8-heading-label::before,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h1 > .ps8-heading-label::before,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h3 > .ps8-heading-label::before,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h4 > .ps8-heading-label::before,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h5 > .ps8-heading-label::before,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h6 > .ps8-heading-label::before {
    content: none;
}

/* 单独兜底 h2 的 L 角，避免被主题其它 h2::before 规则覆盖 */
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h2 > .ps8-heading-label::before,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h1 > .ps8-heading-label::before,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h3 > .ps8-heading-label::before,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h4 > .ps8-heading-label::before,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h5 > .ps8-heading-label::before,
.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h6 > .ps8-heading-label::before {
    content: '' !important;
    position: absolute;
    left: 4px;
    top: 3px;
    width: 10px;
    height: 9px;
    border-left: 2px solid rgba(255, 255, 255, 0.72);
    border-top: 2px solid rgba(255, 255, 255, 0.72);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    z-index: 2;
    display: block;
}

body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h2,
body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h1,
body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h3,
body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h4,
body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h5,
body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h6 {
    background: transparent !important;
}

body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h2::after,
body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h1::after,
body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h3::after,
body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h4::after,
body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h5::after,
body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h6::after {
    background: #2a2f38;
}

body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h2 > .ps8-heading-label,
body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h1 > .ps8-heading-label,
body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h3 > .ps8-heading-label,
body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h4 > .ps8-heading-label,
body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h5 > .ps8-heading-label,
body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h6 > .ps8-heading-label {
    background: var(--b2color) !important;
}

body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h2 > .ps8-heading-label::before,
body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h1 > .ps8-heading-label::before,
body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h3 > .ps8-heading-label::before,
body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h4 > .ps8-heading-label::before,
body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h5 > .ps8-heading-label::before,
body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .entry-content .ps8-content-collapse > h6 > .ps8-heading-label::before {
    border-left-color: rgba(230, 247, 237, 0.75);
    border-top-color: rgba(230, 247, 237, 0.75);
    background: transparent;
    box-shadow: none;
}

.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .ps8-content-collapse {
    --ps8-content-collapsed-height: 1100px;
    position: relative;
}

.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .ps8-content-collapse.is-collapsed {
    max-height: var(--ps8-content-collapsed-height);
    overflow: hidden;
}

.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .ps8-content-collapse.is-collapsed::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 140px;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #ffffff 82%);
}

body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .ps8-content-collapse.is-collapsed::after {
    background: linear-gradient(180deg, rgba(23, 27, 34, 0) 0%, #171b22 82%);
}

.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .ps8-content-toggle-wrap {
    display: flex;
    justify-content: center;
    margin-top: 18px;
}

.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .ps8-content-toggle {
    min-width: 140px;
    height: 42px;
    padding: 0 22px;
    border: 1px solid rgba(54, 179, 126, 0.22);
    border-radius: 999px;
    background: #eef9f2;
    color: var(--b2color);
    font-size: 14px;
    font-weight: 600;
    line-height: 42px;
    text-align: center;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}

.single .b2-single-content.b2-single-post-style-8 .post-style-8-game .ps8-content-toggle:hover {
    background: var(--b2color);
    border-color: var(--b2color);
    color: #ffffff;
    transform: translateY(-1px);
}

body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .ps8-content-toggle {
    background: rgba(54, 179, 126, 0.16);
    border-color: rgba(54, 179, 126, 0.35);
    color: #d4f7e0;
}

body.style-for-dark .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .ps8-content-toggle:hover {
    background: var(--b2color);
    border-color: var(--b2color);
    color: #ffffff;
}

@media screen and (max-width: 768px) {
    .post-style-8-hero {
        grid-template-columns: 1fr;
        padding: 12px;
        gap: 12px;
    }

    .ps8-gallery {
        width: 100%;
        max-width: 100%;
    }

    .post-style-8-top .ps8-info h1 {
        font-size: 18px;
        line-height: 1.3;
    }

    .ps8-info {
        display: block;
    }

    .ps8-hot {
        font-size: 16px;
    }

    .ps8-meta-item {
        grid-template-columns: 92px minmax(0, 1fr);
    }

    .ps8-votes-abs {
        display: none;
    }

    .ps8-main-img-wrap {
        width: 100%;
        height: auto;
        aspect-ratio: 16 / 9;
    }

    .post-style-8-cover {
        height: 180px;
    }

    .post-style-8-mask h1 {
        font-size: 22px;
    }

    .post-style-8-download {
        flex-direction: column;
        align-items: flex-start;
    }

    .ps8-download-modal .modal-content {
        width: calc(100vw - 20px);
        max-height: calc(100vh - 20px);
        padding: 18px 14px 14px;
    }

    .ps8-download-modal-header {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
        padding-top: 4px;
        padding-right: 20px;
        margin-bottom: 12px;
    }

    .ps8-download-modal-header strong {
        font-size: 18px;
    }

    .ps8-download-tabs-bar {
        flex-direction: column;
        align-items: stretch;
        gap: 6px;
    }

    .ps8-download-tabs-meta {
        padding-top: 0;
        text-align: left;
    }

    .ps8-download-tabs-tools {
        justify-content: flex-start;
        padding-top: 0;
    }

    .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .ps8-content-collapse.is-collapsed::after {
        height: 120px;
    }

    .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .ps8-content-toggle-wrap {
        margin-top: 14px;
    }

    .single .b2-single-content.b2-single-post-style-8 .post-style-8-game .ps8-content-toggle {
        width: 100%;
        min-width: 0;
    }

    .ps8-download-modal-header span {
        white-space: normal;
    }

    .ps8-download-tabs {
        gap: 18px;
        margin-bottom: 14px;
        padding: 0 2px 2px;
    }

    .ps8-download-tab {
        font-size: 16px;
        padding-bottom: 12px;
    }

    .ps8-download-qr-card {
        padding: 14px;
    }

    .ps8-download-qr-card-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .ps8-download-qr-attrs {
        grid-template-columns: 1fr;
    }

    .ps8-download-qr-items {
        grid-template-columns: 1fr;
    }

    .ps8-download-qr-canvas {
        width: 150px;
        height: 150px;
    }

    .ps8-download-qr-item.is-quark .ps8-download-qr-canvas {
        width: 164px;
        height: 164px;
    }

    .ps8-system-requirements {
        padding: 10px;
    }

    .ps8-req-header strong {
        font-size: 15px;
    }

    .ps8-req-grid {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .ps8-req-card-title {
        font-size: 13px;
        padding: 8px 10px;
    }

    .ps8-req-card-body {
        overflow: visible;
        padding: 6px 9px 8px;
    }

    .ps8-req-card {
        height: auto;
    }

    .ps8-req-row {
        grid-template-columns: 1fr;
        gap: 4px;
        padding: 6px 0;
    }

    .ps8-req-label,
    .ps8-req-value {
        font-size: 12px;
    }
}

.comments-area-content .comment .comment-item {
    border-top: 0;
    padding: 16px 18px 14px 60px;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    transition: none;
}

.comments-area-content .comment .gravatar img,
.comments-area-content .comment .avatar-parent,
.comments-area-content .comment .avatar-parent .avatar {
    border-radius: 50%;
}

.comment-form .com-info-avatar,
.comment-form .com-info img {
    border-radius: 50% !important;
}

.comments-area-content .comment .gravatar img,
.comments-area-content .comment .avatar-parent .avatar {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.comments-area-content .comment {
    margin-bottom: 14px;
}

.comments-area-content .comment .gravatar {
    top: 16px;
    left: 6px;
    width: 44px;
    height: 44px;
    z-index: 3;
}

.comments-area-content .comment .comment-item:hover {
    border-color: transparent;
    box-shadow: none;
    transform: none;
}

.comments-area-content .comment .comment-item {
    padding-left: 68px;
}

.comments-area-content .comment .comment-meta {
    align-items: flex-start;
    gap: 10px;
}

.comments-area-content .comment .comment-user-info {
    min-width: 0;
}

.comments-area-content .comment .comment-author,
.comments-area-content .comment .comment-author a {
    font-size: 14px;
    font-weight: 700;
    color: var(--key-color);
}

.comments-area-content .comment .comment-author .user-title {
    width: auto;
    max-width: 220px;
    margin-left: 8px;
    color: var(--muted-color);
    font-weight: 500;
}

.comments-area-content .comment .comment_at {
    margin: 0 6px;
    color: var(--muted-color);
    font-size: 12px;
    font-weight: 500;
}

.comments-area-content .comment .comment-floor {
    flex: 0 0 auto;
    white-space: nowrap;
    color: var(--muted-color);
    font-weight: 500;
}

.comments-area-content .comment .comment-content-text {
    margin: 8px 0 12px;
    line-height: 1.85;
    color: var(--this-text);
    font-weight: 600;
}

.comments-area-content .comment .comment-content-text p {
    margin: 0;
    font-size: 15px;
    line-height: 1.85;
    font-weight: 600;
}

.comments-area-content .comment .comment-img-box-multi {
    display: flex;
    flex-wrap: nowrap;
    gap: 10px;
    margin: 10px 0 14px;
    overflow: visible;
    align-items: flex-start;
}

.comments-area-content .comment .comment-content:has(> .comment-img-box-multi) > .comment-img-box:not(.comment-img-box-multi) {
    display: none;
}

.comments-area-content .comment .comment-img-box-multi .comment-img {
    flex: 0 0 254px;
    width: 254px;
    max-width: 254px;
    height: 113px;
    object-fit: cover;
}

.comment-image-preview-open {
    overflow: hidden;
}

.comment-image-preview-overlay {
    position: fixed;
    inset: 0;
    background: rgba(15, 18, 26, 0.88);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 10000;
    padding: 24px;
}

.comment-image-preview-overlay.show {
    display: flex;
}

.comment-image-preview-dialog {
    position: relative;
    max-width: min(92vw, 1400px);
    max-height: 92vh;
}

.comment-image-preview-img {
    display: block;
    max-width: 100%;
    max-height: 92vh;
    width: auto;
    height: auto;
    border-radius: 0;
    box-shadow: 0 18px 60px rgba(0, 0, 0, 0.35);
    cursor: default;
}

.comment-image-preview-close {
    position: absolute;
    top: -18px;
    right: -18px;
    width: auto;
    height: auto;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #fff;
    font-size: 30px;
    line-height: 1;
    text-align: center;
    cursor: pointer;
    box-shadow: none;
    padding: 0;
}

@media screen and (max-width: 768px) {
    .comments-area-content .comment .comment-img-box-multi {
        gap: 8px;
    }

    .comments-area-content .comment .comment-img-box-multi .comment-img {
        flex-basis: 200px;
        width: 200px;
        max-width: 200px;
        height: 89px;
    }
}

.comment-sub-img-list {
    display: flex;
    flex-wrap: nowrap;
    gap: 10px;
    align-items: center;
    overflow-x: auto;
}

.comment-sub-img-item {
    flex: 0 0 96px;
    position: relative;
    width: 96px;
    height: 96px;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--main-border-color);
    background: var(--body-bg-color);
}

.comment-sub-img-item .comment-sub-img {
    position: static;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.comment-sub-img-item .comment-sub-img-button {
    position: absolute;
    right: 8px;
    bottom: 8px;
}

.comment-sub-img-add {
    flex: 0 0 96px;
    width: 96px;
    height: 96px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px dashed var(--main-border-color);
    border-radius: 12px;
    background: var(--main-bg-color);
    color: var(--muted-color);
    cursor: pointer;
    font-size: 12px;
    font-weight: 500;
}

.comment-sub-img-tip {
    margin-top: 8px;
    color: var(--muted-color);
    font-size: 12px;
}

.comment-image-upload-wrap {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.comment-image-upload-wrap .comment-img-button {
    flex: 0 0 auto;
}

.comment-image-upload-wrap .comment-image-box {
    position: static;
    width: auto;
    height: auto;
    min-height: 96px;
    padding: 0;
    box-shadow: none;
    background: transparent;
}

.comment-image-upload-wrap .comment-image-box::before,
.comment-image-upload-wrap .comment-image-box::after {
    display: none;
}

.comment-image-upload-wrap .comment-image-box.b2-show {
    display: block;
}

.comments-area-content .comment .comment-footer {
    min-height: auto;
    color: var(--muted-color);
    font-weight: 500;
}

.comments-area-content .comment .comment-footer-tools {
    width: 100%;
    align-items: center;
}

.comments-area-content .comment .comment-footer-tools button {
    margin-left: 0;
    margin-right: 18px;
    color: var(--muted-color);
    font-weight: 500;
}

.comments-area-content .comment .comment-footer-tools .reply {
    margin-right: 0;
}

.comments-area-content .comment .comment-auth-mod {
    border-radius: 999px;
    width: 18px;
    height: 18px;
    line-height: 16px;
    font-size: 11px;
}

.comments-area-content .comment-list .children article .gravatar {
    top: 14px;
    left: 56px;
    width: 44px;
    height: 44px;
}

.comments-area-content .comment-list .children article .gravatar img,
.comments-area-content .comment-list .children article .avatar-parent .avatar {
    width: 44px;
    height: 44px;
}

.comments-area-content .comment-list .children article .comment-item {
    margin-left: 46px;
    padding: 14px 16px 12px 64px;
    background: var(--body-bg-color);
    border-color: var(--main-border-color);
    border-radius: 14px;
}

.comment-footer-tools button.comment-delete {
    display: none;
}

.comments-area-content .comment-list .children article .comment-content-text p {
    font-size: 14px;
}

.comment.sticky-itme .comment-meta {
    position: relative;
    align-items: center;
    padding-right: 72px;
}

.comment-form .com-info {
    width: 44px;
    height: 44px;
}

.comment-form .com-form {
    margin-left: 54px;
}

.comment.sticky-itme .sticky-icon {
    position: absolute;
    top: 50%;
    right: 0;
    width: 55px;
    height: 20px;
    transform: translateY(-50%);
    background: url('https://static01.52jidi.com/game-community-web/images/icon_review_top.378cbcbdf552305d460a.png') center/contain no-repeat;
}

.comment.sticky-itme .sticky-icon::before {
    content: none;
}

.comment-list .children .comment.sticky-itme .sticky-icon {
    right: 0;
}

.comments-area-content .comment .comment-footer-tools button:hover {
    color: var(--key-color);
}

@media screen and (max-width: 768px) {
    .comments-area-content .comment {
        margin-bottom: 12px;
    }

    .slider-4 .slider-row-1-right > .slider-4-item + .slider-4-item {
		margin-top: 6px !important;
	}

    .comments-area-content .comment .gravatar {
        left: 4px;
        width: 30px;
        height: 30px;
    }

    .comments-area-content .comment .comment-item {
        padding: 14px 14px 12px 48px;
        border-radius: 14px;
    }

    .comments-area-content .comment .comment-meta {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        gap: 8px;
    }

    .comments-area-content .comment .comment-user-info {
        flex: 1 1 auto;
        min-width: 0;
    }

    .comments-area-content .comment .comment-user-info > div {
        display: flex;
        align-items: flex-start;
        justify-content: flex-start;
        flex-wrap: nowrap;
        min-width: 0;
        gap: 2px;
    }

    .comments-area-content .comment .comment-author {
        display: inline-flex;
        align-items: flex-start;
        flex-wrap: nowrap;
        min-width: 0;
        gap: 2px;
    }

    .comments-area-content .comment .comment-author,
    .comments-area-content .comment .comment-author a {
        font-size: 12px;
    }

    .comments-area-content .comment-list .children .comment-author > a:first-child {
        display: inline-block;
        flex: 0 1 4.5em;
        min-width: 0;
        max-width: 4.5em;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        vertical-align: top;
    }

    .comments-area-content .comment .comment-author .comment_at + a {
        display: inline-block;
        flex: 0 1 4.5em;
        min-width: 0;
        max-width: 4.5em;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        vertical-align: top;
    }

    .comments-area-content .comment .comment-author > span:not(.user-title) {
        display: inline-flex;
        align-items: center;
        gap: 1px;
        flex: 0 0 auto;
    }

    .comments-area-content .comment .comment-author .user-title {
        font-size: 11px;
        max-width: 120px;
        margin-left: 4px;
    }

    .comments-area-content .comment .comment-user-info > div > span:last-child {
        display: inline-flex;
        align-items: center;
        gap: 1px;
        flex: 0 0 auto;
    }

    .comments-area-content .comment .comment-author .lv-icon {
        padding: 1px 3px;
        margin-left: 1px;
        margin-right: 0;
        height: 16px;
        line-height: 14px;
    }

    .comments-area-content .comment .comment-author .lv-icon.user-lv i {
        padding: 0 4px;
        margin-left: 1px;
        height: 15px;
        line-height: 15px;
    }

    .comments-area-content .comment .comment_at,
    .comments-area-content .comment .comment-floor,
    .comments-area-content .comment .comment-footer-tools button {
        font-size: 11px;
    }

    .comments-area-content .comment .comment_at {
        margin: 0 2px;
    }

    .comments-area-content .comment .comment-auth-mod {
        width: 14px;
        height: 14px;
        line-height: 12px;
        font-size: 9px;
    }

    .comments-area-content .comment .comment-content-text p {
        font-size: 14px;
    }

    .comments-area-content .comment-list .children article .gravatar {
        left: 4px;
        width: 30px;
        height: 30px;
    }

    .comments-area-content .comment-list .children article .gravatar img,
    .comments-area-content .comment-list .children article .avatar-parent .avatar {
        width: 30px;
        height: 30px;
    }

    .comments-area-content .comment-list .children article .comment-item {
        margin-left: 0;
        padding: 14px 14px 12px 48px;
    }

    .comment-form .com-info {
        width: 44px;
        height: 44px;
    }

    .comment-form .com-form {
        margin-left: 54px;
    }

    .comment.sticky-itme .comment-meta {
        padding-right: 62px;
    }

    .comment.sticky-itme .sticky-icon {
        width: 48px;
        height: 18px;
    }
}