.dahai-post-carousel {
    padding: 10px;
    border-radius: 4px;
    background: #fff;
    border: 1px solid rgba(230, 232, 236, .95);
    overflow: hidden;
}

.dahai-post-carousel-main {
    border-radius: 4px;
    overflow: hidden;
    background: #f5f6f7;
}

.dahai-post-carousel-slide {
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: #111;
}

.dahai-post-carousel-slide a,
.dahai-post-carousel-slide img,
.dahai-post-carousel-slide video,
.dahai-post-carousel-video-wrap {
    display: block;
    width: 100%;
    height: 100%;
}

.dahai-post-carousel-slide img,
.dahai-post-carousel-slide video {
    object-fit: cover;
}

.dahai-post-carousel-video-wrap {
    position: relative;
    background: #000;
}

.dahai-post-carousel-video-wrap video {
    position: relative;
    z-index: 2;
    background: #000;
}

.dahai-post-carousel-video-poster {
    position: absolute;
    inset: 0;
    z-index: 1;
    filter: brightness(.82);
}

.dahai-post-carousel-video-wrap.is-playing .dahai-post-carousel-video-poster {
    display: none;
}

.dahai-post-carousel-video-thumb:before {
    content: '';
    width: 0;
    height: 0;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    border-left: 11px solid currentColor;
}

.dahai-post-carousel-nav {
    margin-top: 10px;
    padding: 2px 0;
}

.dahai-post-carousel-thumb {
    position: relative;
    width: 140px;
    aspect-ratio: 16 / 9;
    margin-right: 8px;
    border-radius: 4px;
    overflow: hidden;
    cursor: pointer;
    background: #f2f3f5;
    opacity: .68;
    border: 2px solid transparent;
    transition: opacity .2s ease, transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.dahai-post-carousel-thumb.is-nav-selected,
.dahai-post-carousel-thumb:hover {
    opacity: 1;
}

.dahai-post-carousel-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dahai-post-carousel-video-thumb {
    position: absolute;
    left: 8px;
    bottom: 8px;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 4px;
    color: #fff;
    background: rgba(0, 0, 0, .58);
    box-shadow: 0 4px 12px rgba(0, 0, 0, .22);
}

.dahai-post-carousel-video-thumb:before {
    margin-left: 2px;
    border-top-width: 6px;
    border-bottom-width: 6px;
    border-left-width: 10px;
}

.dahai-post-carousel .flickity-button {
    background: rgba(255, 255, 255, .92);
    color: #333;
    box-shadow: 0 4px 16px rgba(15, 23, 42, .16);
}

.dahai-post-carousel .flickity-button:hover {
    background: var(--b2color, #ff3355);
    color: #fff;
}

.dahai-post-carousel .flickity-prev-next-button {
    width: 38px;
    height: 38px;
}

body.night .dahai-post-carousel {
    background: var(--beijing, #151617);
    border-color: rgba(255, 255, 255, .08);
    box-shadow: 0 12px 28px rgba(0, 0, 0, .28);
}

body.night .dahai-post-carousel-main,
body.night .dahai-post-carousel-thumb {
    background: var(--huise, #202124);
}

@media (max-width: 768px) {
    .dahai-post-carousel {
        margin: 16px 0 22px;
        padding: 8px;
        border-radius: 4px;
    }

    .dahai-post-carousel-thumb {
        width: 104px;
        margin-right: 6px;
        border-radius: 4px;
    }

    .dahai-post-carousel .flickity-prev-next-button {
        width: 32px;
        height: 32px;
    }
}

/* Dahai Steam params frame */
.dahai-post-params-frame {
    margin: 14px 0 24px;
    padding: 14px;
    border: 1px solid rgba(230, 232, 236, .95);
    border-radius: 4px;
    background: #fff;
    overflow: hidden
}

.dahai-post-params-hero {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 16px;
    align-items: stretch
}

.dahai-post-params-thumb {
    border-radius: 4px;
    overflow: hidden;
    background: #f3f4f6
}

.dahai-post-params-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.dahai-post-params-head {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    padding-right: 96px
}

.dahai-post-params-rating {
    position: absolute;
    top: 0;
    right: 0;
    min-width: 74px;
    padding: 8px 10px;
    border-radius: 4px;
    text-align: center;
    background: rgba(255, 51, 85, .1);
    color: var(--b2color, #ff3355)
}

.dahai-post-params-rating strong {
    display: block;
    font-size: 24px;
    line-height: 1;
    font-weight: 800
}

.dahai-post-params-rating span {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    line-height: 1.2;
    font-weight: 700
}

.dahai-post-params-head h2 {
    margin: 0 0 10px;
    font-size: 22px;
    line-height: 1.35
}

.dahai-post-params-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 12px
}

.dahai-post-params-badges span {
    display: inline-flex;
    align-items: center;
    padding: 5px 10px;
    border-radius: 999px;
    background: rgba(255, 51, 85, .1);
    color: var(--b2color, #ff3355);
    font-size: 13px;
    font-weight: 700
}

.dahai-post-params-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px
}

.dahai-post-params-meta span {
    padding: 10px;
    border-radius: 4px;
    background: #f6f7f8;
    color: #555;
    font-size: 13px;
    line-height: 1.45
}

.dahai-post-params-meta b {
    display: block;
    margin-bottom: 3px;
    color: #888;
    font-size: 12px;
    font-weight: 500
}

.dahai-post-params-section {
    margin-top: 14px;
    padding: 14px;
    border-radius: 4px;
    background: #f8f9fb
}

.dahai-post-params-section h3 {
    margin: 0 0 10px;
    font-size: 18px
}

.dahai-post-params-section p {
    margin: 0;
    line-height: 1.85;
    color: #4b5563
}

.dahai-post-params-intro,
.dahai-post-params-detail,
.dahai-post-params-req {
    position: relative;
    margin-top: 16px;
    padding: 18px 20px;
    border: 1px solid #d8dde6;
    border-radius: 4px;
    background:
        linear-gradient(var(--dh-pixel-grid, rgba(17, 24, 39, .035)) 1px, transparent 1px),
        linear-gradient(90deg, var(--dh-pixel-grid, rgba(17, 24, 39, .035)) 1px, transparent 1px),
        #fff;
    background-size: 16px 16px, 16px 16px, auto;
    box-shadow: 4px 4px 0 rgba(17, 24, 39, .08);
    overflow: hidden;
}

.dahai-post-params-intro:before,
.dahai-post-params-intro:after,
.dahai-post-params-detail:before,
.dahai-post-params-detail:after,
.dahai-post-params-req:before,
.dahai-post-params-req:after {
    content: "";
    position: absolute;
    z-index: 1;
    width: 7px;
    height: 7px;
    pointer-events: none;
}

.dahai-post-params-intro:before,
.dahai-post-params-detail:before,
.dahai-post-params-req:before {
    left: 10px;
    top: 10px;
    background: var(--dh-pixel-ink, #111827)
}

.dahai-post-params-intro:after,
.dahai-post-params-detail:after,
.dahai-post-params-req:after {
    right: 10px;
    top: 10px;
    background: var(--dh-color, var(--b2color, #ff3355))
}

.dahai-post-params-intro>*,
.dahai-post-params-detail>*,
.dahai-post-params-req>* {
    position: relative;
    z-index: 2
}

.dahai-post-params-detail .bb_paragraph {
    margin: 12px 0;
    line-height: 1.85;
    color: #4b5563
}

.dahai-post-params-detail strong {
    font-size: 18px;
    color: #222
}

.dahai-post-params-detail .bb_img_ctn {
    display: block;
    text-align: center
}

.dahai-post-params-detail img,
.dahai-post-params-detail video {
    max-width: 100%;
    height: auto;
    border-radius: 10px;
    display: inline-block;
    background: #000
}

.dahai-post-params-detail video {
    width: 100%;
    display: block;
    margin: 10px auto
}

.dahai-post-params-req-platform {
    margin-top: 12px;
}

.dahai-post-params-req-platform:first-of-type {
    margin-top: 0;
}

.dahai-post-params-req-platform>h4 {
    margin: 0 0 10px;
    color: var(--b2color, #ff3355);
    font-size: 15px;
    font-weight: 800;
    line-height: 1.3;
}

.dahai-post-params-req-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px
}

.dahai-post-params-req-card {
    padding: 12px;
    border: 1px solid rgba(216, 221, 230, .9);
    border-radius: 4px;
    background: rgba(255, 255, 255, .82);
}

.dahai-post-params-req-card h5 {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 0 0 10px;
    color: #222;
    font-size: 15px;
    font-weight: 800;
}

.dahai-post-params-req-card h5:before {
    content: "";
    width: 7px;
    height: 7px;
    background: var(--b2color, #ff3355);
}

.dahai-post-params-req-card ul {
    display: grid;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.dahai-post-params-req-card li {
    display: flex;
    gap: 6px;
    align-items: flex-start;
    padding: 6px 8px;
    border-radius: 4px;
    background: rgba(248, 249, 251, .86);
    color: #444;
    font-size: 13px;
    line-height: 1.55;
}

.dahai-post-params-req-card li b {
    flex: 0 0 auto;
    color: #666;
    font-weight: 700;
    white-space: nowrap;
}

.dahai-post-params-req-card li b:after {
    content: "：";
}

.dahai-post-params-req-card li span {
    min-width: 0;
    overflow-wrap: anywhere;
}

body.night .dahai-post-params-frame {
    background: var(--beijing, #151617);
    border-color: rgba(255, 255, 255, .08)
}

body.night .dahai-post-params-section,
body.night .dahai-post-params-meta span {
    background: var(--huise, #202124)
}

body.night .dahai-post-params-req-card {
    background: var(--dh-soft, #202124);
    border-color: var(--dh-border, rgba(255, 255, 255, .08));
}

body.night .dahai-post-params-req-card h5 {
    color: var(--dh-text, #e5e7eb);
}

body.night .dahai-post-params-req-card li {
    background: rgba(255, 255, 255, .035);
    color: var(--dh-desc, #cbd5e1);
}

body.night .dahai-post-params-req-card li b {
    color: var(--dh-muted, #94a3b8);
}

body.night .dahai-post-params-intro,
body.night .dahai-post-params-detail,
body.night .dahai-post-params-req {
    border-color: var(--dh-border, rgba(255, 255, 255, .08));
    background: var(--dh-bg, #151617);
    box-shadow: none;
}

body.night .dahai-post-params-intro p,
body.night .dahai-post-params-detail .bb_paragraph,
body.night .dahai-post-params-detail strong {
    color: var(--dh-desc, #cbd5e1);
}

@media(max-width:768px) {
    .dahai-post-params-hero {
        grid-template-columns: 1fr
    }

    .dahai-post-params-meta,
    .dahai-post-params-req-grid {
        grid-template-columns: 1fr
    }

    .dahai-post-params-head h2 {
        font-size: 19px
    }
}

/* B2 theme native style: carousel and top params only */
.dahai-post-params-frame {
    margin: 16px 0 20px;
    padding: 0;
    border: 0;
    background: transparent;
    overflow: visible;
    --dh-bg: #fff;
    --dh-soft: #fafafa;
    --dh-border: rgba(230, 232, 236, .95);
    --dh-text: #222;
    --dh-desc: #666;
    --dh-muted: #999;
    --dh-color: var(--b2color, #ff3355);
    --dh-radius: 8px;
    --dh-shadow: 0 2px 5px 0 rgb(0 0 0 / 4%);
}

.dahai-post-params-frame-top {
    margin-top: 0
}

.dahai-post-params-frame-top .dahai-post-params-hero {
    display: grid;
    grid-template-columns: minmax(340px, 42%) minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid var(--dh-border);
    border-radius: var(--dh-radius);
    background: var(--dh-bg);
    box-shadow: var(--dh-shadow);
}

.dahai-post-params-frame-top .dahai-post-params-thumb {
    min-height: 245px;
    background: #f5f6f7;
    overflow: hidden;
    border-right: 1px solid var(--dh-border);
}

.dahai-post-params-frame-top .dahai-post-params-thumb a,
.dahai-post-params-frame-top .dahai-post-params-thumb img {
    display: block;
    width: 100%;
    height: 100%;
}

.dahai-post-params-frame-top .dahai-post-params-thumb img {
    object-fit: cover;
    transition: transform .22s ease, filter .22s ease;
}

.dahai-post-params-frame-top .dahai-post-params-hero:hover .dahai-post-params-thumb img {
    transform: scale(1.018);
    filter: saturate(1.04);
}

.dahai-post-params-frame-top .dahai-post-params-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 92px;
    grid-template-areas:
        "title rating"
        "badges rating"
        "meta meta";
    gap: 12px 14px;
    align-content: center;
    min-width: 0;
    padding: 18px;
    background: linear-gradient(180deg, #fff 0%, #fbfbfc 100%);
}

.dahai-post-params-frame-top .dahai-post-params-head h2 {
    grid-area: title;
    align-self: end;
    margin: 0;
    color: var(--dh-text);
    font-size: 24px;
    font-weight: 700;
    line-height: 1.28;
    letter-spacing: -.02em;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.dahai-post-params-frame-top .dahai-post-params-rating {
    grid-area: rating;
    position: static;
    align-self: start;
    min-width: 0;
    padding: 9px 10px;
    border: 1px solid rgba(255, 51, 85, .16);
    border-radius: var(--dh-radius);
    background: rgba(255, 51, 85, .06);
    color: var(--dh-color);
    text-align: center;
    box-shadow: none;
}

.dahai-post-params-frame-top .dahai-post-params-rating strong {
    display: block;
    font-size: 24px;
    font-weight: 800;
    line-height: 1;
}

.dahai-post-params-frame-top .dahai-post-params-rating span {
    display: block;
    margin-top: 5px;
    color: var(--dh-muted);
    font-size: 11px;
    font-weight: 600;
    line-height: 1.25;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.dahai-post-params-frame-top .dahai-post-params-badges {
    grid-area: badges;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin: 0;
}

.dahai-post-params-frame-top .dahai-post-params-badges span {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    min-height: 25px;
    padding: 4px 9px;
    border: 1px solid rgba(230, 232, 236, .95);
    border-radius: 999px;
    background: #fff;
    color: #555;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.dahai-post-params-frame-top .dahai-post-params-badges span:first-child {
    border-color: rgba(255, 51, 85, .18);
    background: rgba(255, 51, 85, .06);
    color: var(--dh-color);
}

.dahai-post-params-frame-top .dahai-post-params-badges span:nth-child(2) {
    color: #444;
}

.dahai-post-params-frame-top .dahai-post-params-meta {
    grid-area: meta;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 2px;
}

.dahai-post-params-frame-top .dahai-post-params-meta span {
    min-width: 0;
    min-height: 58px;
    padding: 10px;
    border: 1px solid rgba(230, 232, 236, .9);
    border-radius: 7px;
    background: #fff;
    color: #444;
    font-size: 12px;
    line-height: 1.45;
    overflow: hidden;
}

.dahai-post-params-frame-top .dahai-post-params-meta b {
    display: block;
    margin: 0 0 5px;
    color: var(--dh-muted);
    font-size: 12px;
    font-weight: 600;
}

.dahai-post-params-frame-top .dahai-post-params-meta em {
    display: block;
    max-width: 100%;
    color: #444;
    font-style: normal;
    font-size: 12px;
    line-height: 1.35;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.dahai-post-params-extra {
    display: none
}

.dahai-post-carousel {
    margin: 16px 0 20px;
    padding: 10px;
    border: 1px solid var(--dh-border, rgba(230, 232, 236, .95));
    border-radius: var(--dh-radius, 8px);
    background: #fff;
    box-shadow: var(--dh-shadow, 0 2px 5px 0 rgb(0 0 0 / 4%));
    overflow: hidden;
}

.dahai-post-carousel:before,
.dahai-post-carousel:after {
    content: none
}

.dahai-post-carousel-main,
.dahai-post-carousel .flickity-viewport {
    border: 0;
    border-radius: 7px;
    background: #f5f6f7;
    overflow: hidden;
    box-shadow: none;
}

.dahai-post-carousel-slide {
    border-radius: 7px;
    background: #111;
}

.dahai-post-carousel-slide img,
.dahai-post-carousel-slide video,
.dahai-post-carousel-video-wrap {
    border-radius: 7px;
}

.dahai-post-carousel-nav {
    margin-top: 10px;
    padding: 2px 0;
    border: 0;
    background: transparent;
}

.dahai-post-carousel-thumb {
    width: 170px;
    min-width: 170px;
    flex: 0 0 170px;
    max-width: none;
    margin-right: 8px;
    border: 2px solid transparent;
    border-radius: 7px;
    background: #f2f3f5;
    opacity: .68;
    overflow: hidden;
    box-shadow: none;
}

.dahai-post-carousel-thumb.is-nav-selected,
.dahai-post-carousel-thumb:hover {
    opacity: 1;
    border-color: var(--dh-color, var(--b2color, #ff3355));
    transform: none;
    box-shadow: none;
}

.dahai-post-carousel .flickity-button {
    background: rgba(255, 255, 255, .92);
    color: #333;
    border: 0;
    border-radius: 50%;
    box-shadow: 0 4px 16px rgba(15, 23, 42, .16);
}

.dahai-post-carousel .flickity-button:hover {
    background: var(--dh-color, var(--b2color, #ff3355));
    color: #fff;
}

.dahai-post-carousel-video-thumb {
    border-radius: 50%
}

.dahai-post-params-frame .b2tooltipbox,
.dahai-post-carousel .b2tooltipbox {
    cursor: pointer
}

body.night .dahai-post-params-frame {
    --dh-bg: var(--beijing, #151617);
    --dh-soft: var(--huise, #202124);
    --dh-border: rgba(255, 255, 255, .08);
    --dh-text: #e5e7eb;
    --dh-desc: #cbd5e1;
    --dh-muted: #94a3b8;
    --dh-shadow: none;
}

body.night .dahai-post-params-frame-top .dahai-post-params-hero,
body.night .dahai-post-params-frame-top .dahai-post-params-head,
body.night .dahai-post-carousel {
    background: var(--dh-bg);
    border-color: var(--dh-border);
}

body.night .dahai-post-params-frame-top .dahai-post-params-meta span,
body.night .dahai-post-params-frame-top .dahai-post-params-badges span,
body.night .dahai-post-carousel-main,
body.night .dahai-post-carousel-thumb {
    background: var(--dh-soft);
    border-color: var(--dh-border);
    color: var(--dh-desc);
}

body.night .dahai-post-params-frame-top .dahai-post-params-head h2 {
    color: var(--dh-text);
}

body.night .dahai-post-params-frame-top .dahai-post-params-meta em {
    color: var(--dh-desc);
}

@media(max-width:768px) {
    .dahai-post-params-frame-top .dahai-post-params-hero {
        grid-template-columns: 1fr
    }

    .dahai-post-params-frame-top .dahai-post-params-thumb {
        min-height: 0;
        aspect-ratio: 16/9;
        border-right: 0;
        border-bottom: 1px solid var(--dh-border)
    }

    .dahai-post-params-frame-top .dahai-post-params-head {
        grid-template-columns: 1fr;
        grid-template-areas: "title" "rating" "badges" "meta";
        padding: 15px
    }

    .dahai-post-params-frame-top .dahai-post-params-rating {
        justify-self: start;
        width: 92px
    }

    .dahai-post-params-frame-top .dahai-post-params-meta {
        grid-template-columns: 1fr
    }

    .dahai-post-carousel {
        padding: 8px
    }

    .dahai-post-carousel-thumb {
        width: 128px;
        min-width: 128px;
        flex: 0 0 128px;
        margin-right: 6px
    }
}


/* Light pixel post header and tags */
.single-article>.entry-header {
    position: relative;
    margin: 0 0 18px;
    padding: 18px 20px;
    border: 1px solid #d8dde6;
    border-radius: 4px;
    background:
        linear-gradient(var(--dh-pixel-grid, rgba(17, 24, 39, .035)) 1px, transparent 1px),
        linear-gradient(90deg, var(--dh-pixel-grid, rgba(17, 24, 39, .035)) 1px, transparent 1px),
        #fff;
    background-size: 16px 16px, 16px 16px, auto;
    box-shadow: 4px 4px 0 rgba(17, 24, 39, .08);
    overflow: hidden;
}

.single-article>.entry-header:before,
.single-article>.entry-header:after,
.post-tags-meat:before,
.post-tags-meat:after {
    content: "";
    position: absolute;
    z-index: 1;
    width: 7px;
    height: 7px;
    pointer-events: none;
}

.single-article>.entry-header:before,
.post-tags-meat:before {
    left: 10px;
    top: 10px;
    background: var(--dh-pixel-ink, #111827)
}

.single-article>.entry-header:after,
.post-tags-meat:after {
    right: 10px;
    top: 10px;
    background: var(--dh-color, var(--b2color, #ff3355))
}

.single-article>.entry-header>*,
.post-tags-meat>* {
    position: relative;
    z-index: 2;
}

.single-article>.entry-header h1 {
    margin: 0 0 14px;
    font-weight: 800;
    line-height: 1.28;
}

.single-article>.entry-header #post-meta {
    display: grid;
    gap: 12px;
}

.single-article>.entry-header .post-meta-row {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
}

.single-article>.entry-header .post-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    margin: 0;
    padding: 0;
}

.single-article>.entry-header .post-meta>li,
.single-article>.entry-header .post-meta>span {
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    margin: 0;
    padding: 5px 9px;
    border: 1px solid rgba(216, 221, 230, .9);
    border-radius: 4px;
    background: rgba(255, 255, 255, .82);
    color: #4b5563;
    font-size: 12px;
    line-height: 1.35;
}

.single-article>.entry-header .post-meta .post-list-cat,
.single-article>.entry-header .post-meta .post-list-cat-item {
    margin: 0;
    padding: 0;
    background: transparent;
}

.single-article>.entry-header .single-button-download button {
    min-height: 34px;
    border: 1px solid #d8dde6;
    border-radius: 4px;
    background: #fff;
    box-shadow: 3px 3px 0 rgba(17, 24, 39, .08);
}

.single-article>.entry-header .post-user-info {
    margin: 0;
    padding: 12px;
    border: 1px solid #d8dde6;
    border-radius: 4px;
    background: rgba(247, 248, 250, .76);
}

.single-article>.entry-header .avatar-parent .avatar {
    border-radius: 4px;
}

.post-tags-meat {
    position: relative;
    margin: 18px 0 22px;
    padding: 16px 18px;
    border: 1px solid #d8dde6;
    border-radius: 4px;
    background:
        linear-gradient(var(--dh-pixel-grid, rgba(17, 24, 39, .035)) 1px, transparent 1px),
        linear-gradient(90deg, var(--dh-pixel-grid, rgba(17, 24, 39, .035)) 1px, transparent 1px),
        #fff;
    background-size: 16px 16px, 16px 16px, auto;
    box-shadow: 4px 4px 0 rgba(17, 24, 39, .08);
    overflow: hidden;
}

.post-tags-meat a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 30px;
    margin: 0 6px 8px 0;
    padding: 5px 10px;
    border: 1px solid #d8dde6;
    border-radius: 4px;
    background: rgba(255, 255, 255, .86);
    color: #374151;
    font-size: 12px;
    line-height: 1.25;
}

.post-tags-meat a:hover {
    border-color: var(--dh-pixel-ink, #111827);
    box-shadow: 3px 3px 0 rgba(17, 24, 39, .08);
}

.post-tags-meat .tag-img {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 4px;
    background: rgba(255, 51, 85, .08);
    color: var(--dh-color, var(--b2color, #ff3355));
}

body.night .single-article>.entry-header,
body.night .post-tags-meat {
    border-color: var(--dh-border, rgba(255, 255, 255, .08));
    background: var(--dh-bg, #151617);
    box-shadow: none;
}

body.night .single-article>.entry-header .post-meta>li,
body.night .single-article>.entry-header .post-meta>span,
body.night .single-article>.entry-header .single-button-download button,
body.night .single-article>.entry-header .post-user-info,
body.night .post-tags-meat a {
    border-color: var(--dh-border, rgba(255, 255, 255, .08));
    background: var(--dh-soft, #202124);
    color: var(--dh-desc, #cbd5e1);
}

@media(max-width:768px) {
    .single-article>.entry-header {
        padding: 15px
    }

    .single-article>.entry-header .post-meta-row {
        display: grid;
        gap: 10px
    }

    .single-article>.entry-header .single-button-download button {
        width: 100%
    }

    .post-tags-meat {
        padding: 14px
    }
}

/* Light pixel style overlay: top params and carousel only */
.dahai-post-params-frame {
    --dh-pixel-ink: #111827;
    --dh-pixel-blue: #2f6fed;
    --dh-pixel-grid: rgba(17, 24, 39, .035);
}

.dahai-post-params-frame-top .dahai-post-params-hero {
    position: relative;
    border-color: #d8dde6;
    border-radius: 4px;
    background:
        linear-gradient(var(--dh-pixel-grid) 1px, transparent 1px),
        linear-gradient(90deg, var(--dh-pixel-grid) 1px, transparent 1px),
        #fff;
    background-size: 16px 16px, 16px 16px, auto;
    box-shadow: 4px 4px 0 rgba(17, 24, 39, .08);
}

.dahai-post-params-frame-top .dahai-post-params-hero:before,
.dahai-post-params-frame-top .dahai-post-params-hero:after {
    content: "";
    position: absolute;
    z-index: 3;
    width: 7px;
    height: 7px;
    pointer-events: none;
}

.dahai-post-params-frame-top .dahai-post-params-hero:before {
    left: 12px;
    top: 12px;
    background: var(--dh-pixel-ink);
}

.dahai-post-params-frame-top .dahai-post-params-hero:after {
    right: 12px;
    top: 12px;
    background: var(--dh-color);
}

.dahai-post-params-frame-top .dahai-post-params-thumb {
    border-right-color: #d8dde6;
    background: #111827;
}

.dahai-post-params-frame-top .dahai-post-params-thumb:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 42%;
    background: linear-gradient(180deg, transparent, rgba(0, 0, 0, .34));
    pointer-events: none;
}

.dahai-post-params-frame-top .dahai-post-params-head {
    background: transparent;
}

.dahai-post-params-frame-top .dahai-post-params-head h2 {
    font-weight: 800;
}

.dahai-post-params-frame-top .dahai-post-params-rating {
    border-color: #d8dde6;
    border-radius: 4px;
    background: #fff;
    box-shadow: 3px 3px 0 rgba(17, 24, 39, .08);
}

.dahai-post-params-frame-top .dahai-post-params-badges span,
.dahai-post-params-frame-top .dahai-post-params-meta span {
    border-color: #d8dde6;
    border-radius: 4px;
    box-shadow: none;
}

.dahai-post-params-frame-top .dahai-post-params-badges span:first-child {
    border-color: rgba(255, 51, 85, .32);
}

.dahai-post-params-frame-top .dahai-post-params-meta span {
    position: relative;
}

.dahai-post-params-frame-top .dahai-post-params-meta span:after {
    content: "";
    position: absolute;
    right: 8px;
    top: 8px;
    width: 5px;
    height: 5px;
    background: #d8dde6;
}

.dahai-post-params-frame-top .dahai-post-params-meta em {
    font-weight: 500;
}

.dahai-post-carousel {
    position: relative;
    border-color: #d8dde6;
    border-radius: 4px;
    background:
        linear-gradient(var(--dh-pixel-grid) 1px, transparent 1px),
        linear-gradient(90deg, var(--dh-pixel-grid) 1px, transparent 1px),
        #fff;
    background-size: 16px 16px, 16px 16px, auto;
    box-shadow: 4px 4px 0 rgba(17, 24, 39, .08);
}

.dahai-post-carousel:before,
.dahai-post-carousel:after {
    content: "";
    position: absolute;
    z-index: 2;
    width: 7px;
    height: 7px;
    pointer-events: none;
}

.dahai-post-carousel:before {
    left: 10px;
    top: 10px;
    background: var(--dh-pixel-ink);
}

.dahai-post-carousel:after {
    right: 10px;
    top: 10px;
    background: var(--dh-color);
}

.dahai-post-carousel-main,
.dahai-post-carousel .flickity-viewport,
.dahai-post-carousel-slide,
.dahai-post-carousel-slide img,
.dahai-post-carousel-slide video,
.dahai-post-carousel-video-wrap,
.dahai-post-carousel-thumb {
    border-radius: 4px;
}

.dahai-post-carousel-thumb {
    border-color: #d8dde6;
    background: #fff;
}

.dahai-post-carousel-thumb.is-nav-selected,
.dahai-post-carousel-thumb:hover {
    border-color: var(--dh-pixel-ink);
    box-shadow: 3px 3px 0 rgba(17, 24, 39, .1);
}

.dahai-post-carousel .flickity-button {
    border-radius: 4px;
}

body.night .dahai-post-params-frame {
    --dh-pixel-grid: rgba(255, 255, 255, .025);
    --dh-pixel-ink: #e5e7eb;
}

body.night .dahai-post-params-frame-top .dahai-post-params-hero,
body.night .dahai-post-carousel {
    border-color: var(--dh-border);
    background: var(--dh-bg);
    box-shadow: none;
}

body.night .dahai-post-params-frame-top .dahai-post-params-rating,
body.night .dahai-post-params-frame-top .dahai-post-params-meta span,
body.night .dahai-post-params-frame-top .dahai-post-params-badges span,
body.night .dahai-post-carousel-thumb {
    border-color: var(--dh-border);
    background: var(--dh-soft);
}


/* Light pixel download box style */
.download-list {
    margin: 18px 0 22px;
    border: 1px solid #d8dde6;
    border-radius: 4px;
    background:
        linear-gradient(var(--dh-pixel-grid, rgba(17, 24, 39, .035)) 1px, transparent 1px),
        linear-gradient(90deg, var(--dh-pixel-grid, rgba(17, 24, 39, .035)) 1px, transparent 1px),
        #fff;
    background-size: 16px 16px, 16px 16px, auto;
    box-shadow: 4px 4px 0 rgba(17, 24, 39, .08);
    overflow: hidden;
}

.download-item {
    display: grid;
    grid-template-columns: 250px minmax(0, 1fr);
    align-items: stretch;
    overflow: hidden;
    border-radius: 0;
    background: transparent;
}

.download-rights {
    position: relative;
    width: auto;
    padding: 18px;
    border-right: 1px solid #d8dde6;
    background: rgba(247, 248, 250, .76);
}

.download-rights:before,
.download-list:before {
    content: "";
    position: absolute;
    width: 7px;
    height: 7px;
    background: var(--dh-pixel-ink, #111827);
    pointer-events: none;
}

.download-list {
    position: relative
}

.download-list:before {
    left: 10px;
    top: 10px;
    z-index: 2
}

.download-rights:before {
    right: 12px;
    top: 12px;
    background: var(--dh-color, var(--b2color, #ff3355))
}

.download-info {
    min-width: 0;
    padding: 18px 20px;
    background: rgba(255, 255, 255, .86);
}

.download-rights-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 12px;
    color: #111827;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.35;
    letter-spacing: -.02em;
}

.download-info>.download-rights-title {
    padding-bottom: 12px;
    border-bottom: 1px solid #d8dde6;
    font-size: 20px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.download-info>.download-rights-title span {
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.download-rights-title i {
    color: var(--dh-color, var(--b2color, #ff3355));
    font-size: 18px;
}

.entry-content .download-rights ul,
.download-info ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.download-rights ul {
    display: grid;
    gap: 7px;
}

.download-rights ul li {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    min-height: 34px;
    padding: 8px 10px;
    border: 1px solid #d8dde6;
    border-radius: 4px;
    background: #fff;
    color: #374151;
    font-size: 12px;
    line-height: 1.3;
    overflow: hidden;
}

.download-rights ul li>div,
.download-rights ul li span {
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.download-rights ul li.red {
    border-color: rgba(255, 51, 85, .32);
    background: rgba(255, 51, 85, .06);
}

.download-info ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 14px;
}

.download-info li {
    width: auto;
    margin: 0;
    min-height: 36px;
    padding: 9px 10px;
    border: 1px solid #d8dde6;
    border-radius: 4px;
    background: #fff;
    color: #374151;
    font-size: 12px;
    line-height: 1.3;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.download-attr-name {
    color: #6b7280;
    font-size: 11px;
    font-weight: 700;
}

.download-current {
    margin: 14px 0;
    padding: 12px 14px;
    border: 1px dashed #d8dde6;
    border-radius: 4px;
    background: rgba(255, 255, 255, .72);
    color: #374151;
    font-size: 12px;
    line-height: 1.55;
}

.download-current>span,
.download-current>div,
.download-current .green {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    max-width: 100%;
    vertical-align: middle;
}

.download-current .green {
    color: #166534
}

.download-current b {
    color: var(--dh-color, var(--b2color, #ff3355));
    font-weight: 800
}

.download-button-box {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}

.download-button-box button,
.download-button-box .button {
    margin: 0;
    min-height: 34px;
    padding: 8px 12px;
    border: 1px solid #d8dde6;
    border-radius: 4px;
    background: #fff;
    color: #111827;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    box-shadow: none;
    transition: background .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.download-button-box button:hover,
.download-button-box .button:hover {
    border-color: #111827;
    background: #111827;
    color: #fff;
    box-shadow: 3px 3px 0 rgba(17, 24, 39, .1);
}

body.night .download-list {
    border-color: var(--dh-border, rgba(255, 255, 255, .08));
    background: var(--dh-bg, var(--beijing, #151617));
    box-shadow: none;
}

body.night .download-rights,
body.night .download-info,
body.night .download-rights ul li,
body.night .download-info li,
body.night .download-current,
body.night .download-button-box button,
body.night .download-button-box .button {
    background: var(--dh-soft, var(--huise, #202124));
    border-color: var(--dh-border, rgba(255, 255, 255, .08));
    color: var(--dh-desc, #cbd5e1);
}

body.night .download-rights-title,
body.night .download-info>.download-rights-title {
    color: var(--dh-text, #e5e7eb);
}

@media(max-width:768px) {
    .download-item {
        grid-template-columns: 1fr;
    }

    .download-rights {
        border-right: 0;
        border-bottom: 1px solid #d8dde6;
        padding: 16px;
    }

    .download-info {
        padding: 16px;
    }

    .download-info ul {
        grid-template-columns: 1fr;
    }

    .download-button-box button,
    .download-button-box .button {
        flex: 1 1 calc(50% - 8px);
    }
}

/* Light pixel download sidebar widget */
.widget.b2-widget-download,
.b2-widget-download.widget,
.b2-widget-download {
    position: relative;
    padding: 16px;
    border: 1px solid #d8dde6;
    border-radius: 4px;
    background:
        linear-gradient(var(--dh-pixel-grid, rgba(17, 24, 39, .035)) 1px, transparent 1px),
        linear-gradient(90deg, var(--dh-pixel-grid, rgba(17, 24, 39, .035)) 1px, transparent 1px),
        #fff;
    background-size: 16px 16px, 16px 16px, auto;
    box-shadow: 4px 4px 0 rgba(17, 24, 39, .08);
    overflow: hidden;
}

.widget.b2-widget-download:before,
.b2-widget-download.widget:before,
.b2-widget-download:before,
.widget.b2-widget-download:after,
.b2-widget-download.widget:after,
.b2-widget-download:after {
    content: "";
    position: absolute;
    z-index: 2;
    width: 7px;
    height: 7px;
    pointer-events: none;
}

.widget.b2-widget-download:before,
.b2-widget-download.widget:before,
.b2-widget-download:before {
    left: 10px;
    top: 10px;
    background: var(--dh-pixel-ink, #111827);
}

.widget.b2-widget-download:after,
.b2-widget-download.widget:after,
.b2-widget-download:after {
    right: 10px;
    top: 10px;
    background: var(--dh-color, var(--b2color, #ff3355));
}

.b2-widget-download .widget-title,
.b2-widget-download .widget-title h2,
.b2-widget-download > h2,
.b2-widget-download > h3 {
    position: relative;
    z-index: 3;
    margin-bottom: 12px;
    padding: 0 18px 10px 18px;
    border-bottom: 1px solid #d8dde6;
    color: #111827;
    font-size: 15px;
    font-weight: 900;
    letter-spacing: -.02em;
}

.b2-widget-download .w-d-list {
    position: relative;
    z-index: 3;
    padding: 12px;
    border: 1px solid #d8dde6;
    border-radius: 4px;
    background: rgba(255, 255, 255, .86);
    box-shadow: 3px 3px 0 rgba(17, 24, 39, .055);
}

.b2-widget-download .w-d-list + .w-d-list {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #d8dde6;
}

.b2-widget-download .w-d-title {
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
    padding-bottom: 10px;
    border-bottom: 1px dashed #d8dde6;
}

.b2-widget-download .w-d-title h2 {
    margin: 0;
    color: #111827;
    font-size: 15px;
    font-weight: 900;
    line-height: 1.35;
}

.b2-widget-download .download-view {
    flex: 0 0 auto;
    min-height: 24px;
    padding: 5px 7px;
    border: 1px solid #d8dde6;
    border-radius: 4px;
    background: #fff;
    color: #374151;
    font-size: 11px;
    font-weight: 800;
}

.b2-widget-download .w-d-meta {
    display: grid;
    gap: 6px;
    margin: 10px 0;
    color: #6b7280;
    font-size: 12px;
    line-height: 1.45;
}

.b2-widget-download .w-d-meta p {
    margin: 0;
    padding: 7px 8px;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    background: rgba(248, 250, 252, .86);
}

.b2-widget-download .w-d-role {
    position: relative;
    padding: 0 10px;
    border: 1px solid rgba(255, 51, 85, .24);
    border-radius: 4px;
    background:
        linear-gradient(135deg, rgba(255, 51, 85, .09), transparent 42%),
        rgba(255, 246, 248, .92);
}

.b2-widget-download .w-d-role.d-allow {
    border-color: rgba(22, 101, 52, .26);
    background:
        linear-gradient(135deg, rgba(34, 197, 94, .12), transparent 42%),
        rgba(241, 251, 246, .94);
}

.b2-widget-download .w-d-role > div {
    align-items: center;
    gap: 8px;
    padding: 10px 0;
    border-color: rgba(17, 24, 39, .08);
    color: #111827;
    font-size: 12px;
    font-weight: 900;
}

.b2-widget-download .w-d-role > div span:last-child {
    padding: 3px 6px;
    border: 1px solid #d8dde6;
    border-radius: 3px;
    background: #fff;
    color: #4b5563;
    font-size: 11px;
    font-weight: 800;
    transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}

.b2-widget-download .w-d-role > div span:last-child:hover {
    transform: translateY(-1px);
    border-color: #111827;
    background: #111827;
    color: #fff;
}

.b2-widget-download .w-d-role ul {
    display: grid;
    gap: 6px;
    padding: 8px 0 10px;
    border-top: 1px dashed rgba(17, 24, 39, .12);
    border-bottom: 1px dashed rgba(17, 24, 39, .12);
}

.widget.b2-widget-download .w-d-role ul li,
.b2-widget-download .w-d-role ul li {
    align-items: center;
    min-height: 30px;
    padding: 6px 8px;
    border: 1px solid #d8dde6;
    border-radius: 3px;
    background: rgba(255, 255, 255, .88);
    color: #374151;
    font-size: 12px;
    line-height: 1.25;
}

.b2-widget-download .w-d-role ul li.red {
    border-color: rgba(255, 51, 85, .32);
    background: rgba(255, 51, 85, .08);
    color: var(--dh-color, var(--b2color, #ff3355));
}

.b2-widget-download .w-d-current {
    color: #111827;
}

.widget.b2-widget-download .w-d-current,
.b2-widget-download .w-d-current {
    font-family: inherit;
    font-size: 13px;
    line-height: 1.35;
}

.b2-widget-download .w-d-role > div.w-d-current.can-down span,
.b2-widget-download .w-d-role > div.w-d-current .green {
    color: #166534;
}

.b2-widget-download .w-d-role > div.w-d-current > span:last-child b {
    color: var(--dh-color, var(--b2color, #ff3355));
    font-family: inherit;
    font-size: 18px;
    font-weight: 900;
}

.b2-widget-download .w-d-download {
    margin-top: 12px;
}

.b2-widget-download .w-d-download span + span {
    margin-top: 8px;
}

.b2-widget-download .w-d-download span button,
.b2-widget-download .w-d-list.gujia button {
    width: 100%;
    min-height: 36px;
    padding: 9px 10px;
    border: 1px solid #111827;
    border-radius: 4px;
    background: #111827 !important;
    color: #fff !important;
    font-size: 12px;
    font-weight: 900;
    line-height: 1.35;
    text-align: center;
    box-shadow: 3px 3px 0 rgba(17, 24, 39, .12);
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
}

.b2-widget-download .w-d-download span button:hover {
    transform: translate(-1px, -1px);
    box-shadow: 4px 4px 0 rgba(17, 24, 39, .16);
}

.b2-widget-download .w-d-list.gujia .w-d-meta p,
.b2-widget-download .w-d-list.gujia .w-d-role,
.b2-widget-download .w-d-list.gujia button {
    border-radius: 4px;
    background:
        linear-gradient(90deg, rgba(17, 24, 39, .055), rgba(17, 24, 39, .025), rgba(17, 24, 39, .055));
    opacity: 1;
}

body.night .widget.b2-widget-download,
body.night .b2-widget-download.widget,
body.night .b2-widget-download {
    border-color: var(--dh-border, rgba(255, 255, 255, .08));
    background: var(--dh-bg, var(--beijing, #151617));
    box-shadow: none;
}

body.night .b2-widget-download .widget-title,
body.night .b2-widget-download .widget-title h2,
body.night .b2-widget-download > h2,
body.night .b2-widget-download > h3,
body.night .b2-widget-download .w-d-title h2,
body.night .b2-widget-download .w-d-role > div,
body.night .b2-widget-download .w-d-current {
    border-color: var(--dh-border, rgba(255, 255, 255, .08));
    color: var(--dh-text, #e5e7eb);
}

body.night .b2-widget-download .w-d-list,
body.night .b2-widget-download .w-d-meta p,
body.night .b2-widget-download .w-d-role,
body.night .b2-widget-download .w-d-role ul li,
body.night .b2-widget-download .download-view,
body.night .b2-widget-download .w-d-role > div span:last-child {
    border-color: var(--dh-border, rgba(255, 255, 255, .08));
    background: var(--dh-soft, var(--huise, #202124));
    color: var(--dh-desc, #cbd5e1);
}

body.night .b2-widget-download .w-d-role.d-allow {
    background: rgba(22, 101, 52, .14);
}

@media(max-width:768px) {
    .b2-widget-download {
        padding: 14px;
    }

    .b2-widget-download .w-d-title {
        flex-direction: column;
    }
}

/* Light pixel style: native bottom blocks */
.postFooterInfo,
.comments-box .comments-area,
.entry-content .b2-pagenav,
.entry-content .content-footer,
.entry-content .post-content-footer,
.entry-content .content-ds {
    position: relative;
    margin-top: 18px;
    border: 1px solid #d8dde6;
    border-radius: 4px;
    background:
        linear-gradient(var(--dh-pixel-grid, rgba(17, 24, 39, .035)) 1px, transparent 1px),
        linear-gradient(90deg, var(--dh-pixel-grid, rgba(17, 24, 39, .035)) 1px, transparent 1px),
        #fff;
    background-size: 16px 16px, 16px 16px, auto;
    box-shadow: 4px 4px 0 rgba(17, 24, 39, .08);
    overflow: hidden;
}

.postFooterInfo:before,
.comments-box .comments-area:before,
.entry-content .b2-pagenav:before,
.entry-content .content-footer:before,
.entry-content .post-content-footer:before,
.entry-content .content-ds:before,
.postFooterInfo:after,
.comments-box .comments-area:after,
.entry-content .b2-pagenav:after,
.entry-content .content-footer:after,
.entry-content .post-content-footer:after,
.entry-content .content-ds:after {
    content: "";
    position: absolute;
    z-index: 2;
    width: 7px;
    height: 7px;
    pointer-events: none;
}

.postFooterInfo:before,
.comments-box .comments-area:before,
.entry-content .b2-pagenav:before,
.entry-content .content-footer:before,
.entry-content .post-content-footer:before,
.entry-content .content-ds:before {
    left: 10px;
    top: 10px;
    background: var(--dh-pixel-ink, #111827);
}

.postFooterInfo:after,
.comments-box .comments-area:after,
.entry-content .b2-pagenav:after,
.entry-content .content-footer:after,
.entry-content .post-content-footer:after,
.entry-content .content-ds:after {
    right: 10px;
    top: 10px;
    background: var(--dh-color, var(--b2color, #ff3355));
}

.postFooterInfo {
    padding: 18px;
}

.postFooterInfo .avatar {
    border-radius: 4px;
    box-shadow: 3px 3px 0 rgba(17, 24, 39, .08);
}

.postFooterInfo .authorCard--title a {
    color: #111827;
    font-weight: 800;
}

.postFooterInfo .authorCard--description,
.postFooterInfo .authorCard--meta {
    color: #4b5563;
}

.postFooterInfo .button,
.postFooterInfo button,
.comments-box .comments-area button,
.entry-content .content-footer button,
.entry-content .post-content-footer button {
    border-radius: 4px;
}

.entry-content .b2-pagenav {
    padding: 12px;
}

.entry-content .b2-pagenav a,
.entry-content .b2-pagenav span,
.entry-content .b2-pagenav button,
.comments-box .comment-nav a,
.comments-box .comment-nav span,
.comments-box .comment-nav button {
    border-radius: 4px;
}

.entry-content .post-content-footer,
.entry-content .content-footer {
    padding: 12px 14px;
}

.entry-content .post-content-footer-in,
.entry-content .content-footer-poster,
.entry-content .content-footer-zan-cai {
    position: relative;
    z-index: 3;
}

.entry-content .content-footer-poster button,
.entry-content .content-footer-zan-cai span {
    border: 1px solid #d8dde6;
    border-radius: 4px;
    background: rgba(255, 255, 255, .86);
    color: #374151;
    box-shadow: none;
}

.entry-content .content-footer-zan-cai span.picked,
.entry-content .content-footer-poster .favorite-button.sc {
    border-color: rgba(255, 51, 85, .32);
    background: rgba(255, 51, 85, .08);
    color: var(--dh-color, var(--b2color, #ff3355));
}

.entry-content .content-ds {
    padding: 18px;
    text-align: center;
}

.entry-content .content-ds>* {
    position: relative;
    z-index: 3;
}

.entry-content .content-ds-users {
    display: flex;
    justify-content: center;
    gap: 6px;
}

.entry-content .content-ds-users img {
    border-radius: 4px;
}

.comments-box .comments-area {
    padding: 16px;
}

.comments-box .comments-title,
.comments-box .comment-form,
.comments-box .comments-area-content,
.comments-box .comment-nav {
    position: relative;
    z-index: 3;
}

.comments-box .comments-title {
    padding-bottom: 12px;
    border-bottom: 1px solid #d8dde6;
}

.comments-box .comment-form {
    margin-top: 14px;
    padding: 12px;
    border: 1px solid #d8dde6;
    border-radius: 4px;
    background: rgba(255, 255, 255, .72);
}

.comments-box .com-form textarea,
.comments-box .com-form input {
    border-radius: 4px;
}

.comments-box .comment-list>li,
.comments-box .none-comment {
    border-radius: 4px;
}

/* Pixel style: comment item cards */
.comments-box .comment .comment-item,
.comments-box .comment-item {
    position: relative;
    margin: 14px 0;
    padding: 14px 16px 14px 56px;
    border: 1px solid #d8dde6 !important;
    border-radius: 4px !important;
    background:
        linear-gradient(var(--dh-pixel-grid, rgba(17, 24, 39, .032)) 1px, transparent 1px),
        linear-gradient(90deg, var(--dh-pixel-grid, rgba(17, 24, 39, .032)) 1px, transparent 1px),
        rgba(255, 255, 255, .92);
    background-size: 16px 16px, 16px 16px, auto;
    box-shadow: 4px 4px 0 rgba(17, 24, 39, .07);
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.comments-box .comment-item:after {
    content: "";
    position: absolute;
    z-index: 1;
    pointer-events: none;
    right: 10px;
    top: 10px;
    width: 7px;
    height: 7px;
    background: var(--dh-color, var(--b2color, #ff3355));
}

.comments-box .comment-item:hover {
    border-color: #111827 !important;
    box-shadow: 5px 5px 0 rgba(17, 24, 39, .1);
    transform: translate(-1px, -1px);
}

.comments-box .comment-item .comment-meta {
    position: relative;
    z-index: 3;
    align-items: center;
    min-height: 40px;
    gap: 12px;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px dashed #d8dde6;
}

.comments-box .comment-user-info,
.comments-box .comment-user-info>div {
    min-width: 0;
}

.comments-box .comment .gravatar {
    z-index: 4;
    padding: 2px;
    border: 2px solid #111827;
    border-radius: 4px;
    background: #fff;
    box-shadow: 3px 3px 0 rgba(17, 24, 39, .1);
    box-sizing: border-box;
}

.comments-box .comment .gravatar .avatar,
.comments-box .comment .gravatar img {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 2px;
    object-fit: cover;
}

.comments-box .comment-author {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    max-width: 100%;
    color: #111827;
    font-weight: 900;
}

.comments-box .comment-author a {
    color: #111827;
    font-size: 14px;
    font-weight: 900;
}

.comments-box .comment-auth-mod {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 17px;
    height: 17px;
    margin-left: 3px;
    padding: 0 4px;
    border: 1px solid currentColor;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 900;
    line-height: 1;
    background: #fff;
    box-shadow: 2px 2px 0 rgba(17, 24, 39, .06);
}

.comments-box .comment-user-info .lv-icon {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    margin: 6px 6px 0 0;
    padding: 2px 7px;
    border: 1px solid #d8dde6;
    border-radius: 4px;
    background: rgba(255, 255, 255, .82);
    box-shadow: 2px 2px 0 rgba(17, 24, 39, .04);
}

.comments-box .comment-floor {
    flex: 0 0 auto;
    padding: 4px 8px;
    border: 1px solid #d8dde6;
    border-radius: 4px;
    background: rgba(248, 250, 252, .86);
    color: #64748b;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.3;
}

.comments-box .comment-content {
    position: relative;
    z-index: 2;
}

.comments-box .comment-content-text {
    margin: 10px 0 14px;
    padding: 12px 14px;
    border: 1px solid rgba(216, 221, 230, .78);
    border-radius: 4px;
    background: rgba(255, 255, 255, .78);
    color: #1f2937;
    line-height: 1.8;
}

.comments-box .comment-content-text p {
    margin: 0;
    color: #1f2937;
    font-size: 15px;
    font-weight: 650;
}

.comments-box .comment-footer {
    min-height: auto;
    align-items: center;
}

.comments-box .comment-footer-tools,
.comments-box .comment-vote-hidden,
.comments-box .comment-item-hidden {
    align-items: center;
    gap: 8px;
}

.comments-box .comment-footer-tools button,
.comments-box .comment-list .comment-footer button.text {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-height: 28px;
    margin: 0 !important;
    padding: 5px 9px !important;
    border: 1px solid #d8dde6;
    border-radius: 4px;
    background: #fff;
    color: #64748b;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
    box-shadow: 2px 2px 0 rgba(17, 24, 39, .045);
    transition: background .16s ease, color .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.comments-box .comment-footer-tools button:hover,
.comments-box .comment-list .comment-footer button.text:hover {
    border-color: #111827;
    background: #111827;
    color: #fff;
    box-shadow: 3px 3px 0 rgba(17, 24, 39, .1);
    transform: translate(-1px, -1px);
}

.comments-box .comment-list .comment-footer button.text.voted,
.comments-box .comment-footer-tools button.voted {
    border-color: rgba(255, 51, 85, .28);
    background: rgba(255, 51, 85, .08);
    color: var(--dh-color, var(--b2color, #ff3355));
}

.comments-box .comment-list .children article .comment-item {
    margin-left: 38px;
    padding: 14px 14px 14px 52px;
    background:
        linear-gradient(var(--dh-pixel-grid, rgba(17, 24, 39, .026)) 1px, transparent 1px),
        linear-gradient(90deg, var(--dh-pixel-grid, rgba(17, 24, 39, .026)) 1px, transparent 1px),
        rgba(248, 250, 252, .8);
    background-size: 16px 16px, 16px 16px, auto;
}

.comments-box .comment-auth-mod,
.comments-box .comment-footer-tools button,
.comments-box .comment-user-info .lv-icon {
    position: relative;
}

.comments-box .comment-auth.comment-auth-mod:hover:after,
.comments-box .comment-mod.comment-auth-mod:hover:after,
.comments-box .comment-footer-tools button:hover:after,
.comments-box .comment-user-info .lv-icon:hover:after {
    position: absolute;
    left: 50%;
    bottom: calc(100% + 8px);
    z-index: 20;
    transform: translateX(-50%);
    min-width: max-content;
    max-width: 180px;
    padding: 6px 8px;
    border: 1px solid #111827;
    border-radius: 4px;
    background: #111827;
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.2;
    white-space: nowrap;
    box-shadow: 3px 3px 0 rgba(17, 24, 39, .12);
    pointer-events: none;
}

.comments-box .comment-auth.comment-auth-mod:hover:before,
.comments-box .comment-mod.comment-auth-mod:hover:before,
.comments-box .comment-footer-tools button:hover:before,
.comments-box .comment-user-info .lv-icon:hover:before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: calc(100% + 3px);
    z-index: 21;
    transform: translateX(-50%);
    width: 7px;
    height: 7px;
    background: #111827;
    clip-path: polygon(50% 100%, 0 0, 100% 0);
    pointer-events: none;
}

.comments-box .comment-auth.comment-auth-mod:hover:after {
    content: "文章作者"
}

.comments-box .comment-mod.comment-auth-mod:hover:after {
    content: "管理员"
}

.comments-box .comment-footer-tools button.comment-up:hover:after,
.comments-box .comment-footer-tools button[id^="comment-up-"]:hover:after {
    content: "点赞"
}

.comments-box .comment-footer-tools button.comment-down:hover:after,
.comments-box .comment-footer-tools button[id^="comment-down-"]:hover:after {
    content: "点踩"
}

.comments-box .comment-footer-tools button.reply:hover:after {
    content: "回复评论"
}

.comments-box .comment-footer-tools button:not(.reply):not(.comment-up):not(.comment-down):not([id^="comment-up-"]):not([id^="comment-down-"]):hover:after {
    content: "操作"
}

.comments-box .comment-user-info .user-vip:hover:after {
    content: "会员等级"
}

.comments-box .comment-user-info .user-lv:hover:after {
    content: "用户等级"
}

body.night .postFooterInfo,
body.night .comments-box .comments-area,
body.night .entry-content .b2-pagenav,
body.night .entry-content .content-footer,
body.night .entry-content .post-content-footer,
body.night .entry-content .content-ds {
    border-color: var(--dh-border, rgba(255, 255, 255, .08));
    background: var(--dh-bg, var(--beijing, #151617));
    box-shadow: none;
}

body.night .postFooterInfo .authorCard--title a,
body.night .postFooterInfo .authorCard--description,
body.night .postFooterInfo .authorCard--meta,
body.night .entry-content .content-footer-poster button,
body.night .entry-content .content-footer-zan-cai span {
    color: var(--dh-desc, #cbd5e1);
}

body.night .entry-content .content-footer-poster button,
body.night .entry-content .content-footer-zan-cai span,
body.night .comments-box .comment-form,
body.night .comments-box .comments-title {
    border-color: var(--dh-border, rgba(255, 255, 255, .08));
    background: var(--dh-soft, var(--huise, #202124));
}

body.night .comments-box .comment .comment-item,
body.night .comments-box .comment-item,
body.night .comments-box .comment-content-text,
body.night .comments-box .comment-user-info .lv-icon,
body.night .comments-box .comment-floor,
body.night .comments-box .comment-footer-tools button,
body.night .comments-box .comment-list .comment-footer button.text,
body.night .comments-box .comment-auth-mod {
    border-color: var(--dh-border, rgba(255, 255, 255, .08)) !important;
    background: var(--dh-soft, var(--huise, #202124));
    color: var(--dh-desc, #cbd5e1);
    box-shadow: none;
}

body.night .comments-box .comment-author,
body.night .comments-box .comment-author a,
body.night .comments-box .comment-content-text p {
    color: var(--dh-text, #e5e7eb) !important;
}

body.night .comments-box .comment-item .comment-meta {
    border-bottom-color: var(--dh-border, rgba(255, 255, 255, .08));
}

body.night .comments-box .comment .gravatar {
    border-color: var(--dh-text, #e5e7eb);
    background: var(--dh-bg, var(--beijing, #151617));
    box-shadow: none;
}

@media(max-width:768px) {

    .postFooterInfo,
    .comments-box .comments-area,
    .entry-content .content-ds {
        padding: 14px;
    }

    .entry-content .post-content-footer,
    .entry-content .content-footer {
        padding: 10px;
    }

    .comments-box .comment .comment-item,
    .comments-box .comment-item {
        margin: 12px 0;
        padding: 12px 12px 12px 52px;
    }

    .comments-box .comment-item .comment-meta {
        display: grid;
        gap: 8px;
    }

    .comments-box .comment-floor {
        justify-self: start;
    }

    .comments-box .comment-content-text {
        padding: 10px 12px;
    }

    .comments-box .comment-footer-tools {
        flex-wrap: wrap;
    }

    .comments-box .comment-list .children article .comment-item {
        margin-left: 16px;
        padding-left: 44px;
    }
}

/* Compact pixel mission panels: reward and previous/next */
.content-ds {
    --dh-line: #d8dde6;
    --dh-ink: #111827;
    position: relative;
    display: flex;
    justify-content: center;
    flex-flow: column;
    min-height: 128px;
    margin: 18px 0 22px;
    padding: 22px 370px 22px 28px;
    border: 1px solid var(--dh-line) !important;
    border-radius: 4px !important;
    background:
        linear-gradient(var(--dh-pixel-grid, rgba(17, 24, 39, .032)) 1px, transparent 1px),
        linear-gradient(90deg, var(--dh-pixel-grid, rgba(17, 24, 39, .032)) 1px, transparent 1px),
        #fff !important;
    background-size: 16px 16px, 16px 16px, auto !important;
    box-shadow: 4px 4px 0 rgba(17, 24, 39, .075) !important;
    overflow: hidden;
}

.content-ds:before {
    content: "";
    position: absolute;
    left: 12px;
    top: 12px;
    width: 8px;
    height: 8px;
    background: #111827
}

.content-ds:after {
    content: "";
    position: absolute;
    right: 12px;
    top: 12px;
    width: 8px;
    height: 8px;
    background: var(--dh-color, var(--b2color, #ff3355))
}

.content-ds>p,
.content-ds-count,
.content-ds-users {
    position: relative;
    z-index: 2;
    max-width: 100%
}

.content-ds>p {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0 0 10px;
    color: var(--dh-ink);
    font-size: 22px;
    font-weight: 900;
    line-height: 1.25;
    letter-spacing: -.02em
}

.content-ds-count {
    color: #64748b;
    font-size: 14px
}

.content-ds-users {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin: 10px 0 0 !important;
    max-width: 100%
}

.content-ds-users li {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    position: relative !important
}

.content-ds-users li img {
    width: 30px;
    height: 30px;
    border: 1px solid var(--dh-line);
    border-radius: 4px !important;
    background: #fff;
    box-shadow: 2px 2px 0 rgba(17, 24, 39, .06)
}

.content-ds-button {
    position: absolute !important;
    right: 22px !important;
    top: 50% !important;
    z-index: 3;
    width: 330px;
    height: 92px;
    padding: 8px;
    border: 1px solid var(--dh-line);
    border-radius: 4px;
    background: rgba(255, 255, 255, .76);
    box-shadow: 3px 3px 0 rgba(17, 24, 39, .05);
    overflow: hidden;
    transform: translateY(-50%) !important
}

.content-ds-button:before {
    content: "THANKS PIPE";
    position: absolute;
    left: 10px;
    top: 6px;
    z-index: 4;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .06em
}

.content-ds-button:after {
    content: "";
    position: absolute;
    right: 9px;
    bottom: 9px;
    width: 7px;
    height: 7px;
    background: #2f6fed;
    box-shadow: -12px 0 0 rgba(47, 111, 237, .32), 0 -12px 0 rgba(47, 111, 237, .2)
}

.content-ds #con {
    width: 320px;
    height: 85px;
    transform: scale(.94);
    transform-origin: center center
}

.content-ds #TA-con {
    border: 1px solid rgba(255, 255, 255, .48);
    border-radius: 4px;
    background: linear-gradient(180deg, #ff6f9b, #f25d8e) !important;
    box-shadow: 4px 4px 0 rgba(242, 93, 142, .22);
    animation: dahai-ds-button-idle 2.8s steps(2, end) infinite;
    transition: filter .16s ease, box-shadow .16s ease
}

.content-ds #TA-con:hover {
    filter: saturate(1.08) brightness(1.03);
    box-shadow: 6px 6px 0 rgba(242, 93, 142, .28);
    animation: dahai-ds-button-hover .72s steps(2, end) infinite
}

.content-ds #tube-con {
    opacity: .72;
    filter: saturate(.9);
    animation: dahai-ds-pipe-flow 2.2s linear infinite
}

.content-ds #text-con i {
    animation: dahai-ds-coin 1.8s steps(2, end) infinite
}

.content-ds #TA {
    font-weight: 900
}

.content-ds #people {
    font-weight: 900;
    color: #94a3b8 !important
}

@keyframes dahai-ds-button-idle {

    0%,
    100% {
        transform: translateY(-50%)
    }

    50% {
        transform: translateY(calc(-50% - 1px))
    }
}

@keyframes dahai-ds-button-hover {

    0%,
    100% {
        transform: translateY(-50%)
    }

    50% {
        transform: translate(1px, calc(-50% + 1px))
    }
}

@keyframes dahai-ds-pipe-flow {
    0% {
        opacity: .55
    }

    50% {
        opacity: .86
    }

    100% {
        opacity: .55
    }
}

@keyframes dahai-ds-coin {

    0%,
    100% {
        transform: translateY(0)
    }

    50% {
        transform: translateY(-1px)
    }
}

.post-pre-next.mg-b {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin: 18px 0 24px !important
}

.post-pre-next>div {
    width: auto
}

.post-pre-next .post-pre-next-in {
    height: 100%;
    padding: 0
}

.post-pre-next .post-pre-next-info {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 104px;
    height: 100%;
    border: 1px solid #d8dde6 !important;
    border-radius: 4px !important;
    background: linear-gradient(var(--dh-pixel-grid, rgba(17, 24, 39, .032)) 1px, transparent 1px), linear-gradient(90deg, var(--dh-pixel-grid, rgba(17, 24, 39, .032)) 1px, transparent 1px), #fff !important;
    background-size: 16px 16px, 16px 16px, auto !important;
    box-shadow: 4px 4px 0 rgba(17, 24, 39, .075) !important;
    transition: .18s ease
}

.post-pre .post-pre-next-info {
    padding: 16px 18px 16px 66px !important;
    border-left: 4px solid #2f6fed !important
}

.post-next .post-pre-next-info {
    padding: 16px 66px 16px 18px !important;
    border-right: 4px solid var(--dh-color, var(--b2color, #ff3355)) !important;
    text-align: right
}

.post-pre-next .post-pre-next-info:before {
    content: "";
    position: absolute;
    left: 10px;
    top: 10px;
    width: 7px;
    height: 7px;
    background: #111827
}

.post-pre-next .post-pre-next-info:after {
    content: "";
    position: absolute;
    right: 10px;
    top: 10px;
    width: 7px;
    height: 7px;
    background: #2f6fed
}

.post-next .post-pre-next-info:after {
    background: var(--dh-color, var(--b2color, #ff3355))
}

.post-pre-next .post-per-next-cats {
    min-height: 0;
    font-size: 0
}

.post-pre-next .post-per-next-cats a {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    min-height: 24px;
    margin: 0 6px 6px 0;
    padding: 3px 8px;
    border: 1px solid #d8dde6;
    border-radius: 4px;
    background: rgba(255, 255, 255, .82);
    color: #64748b;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.35
}

.post-next .post-per-next-cats a {
    margin: 0 0 6px 6px
}

.post-pre-next h2 {
    height: auto;
    max-height: 42px;
    margin: 2px 0 8px;
    font-size: 16px;
    line-height: 1.35
}

.post-pre-next h2 a {
    color: #111827;
    font-weight: 900
}

.post-pre-next p {
    color: #64748b !important;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.2
}

.post-pre-next .next-jt {
    top: 50%;
    transform: translateY(-50%)
}

.post-pre .next-jt {
    left: 16px
}

.post-next .next-jt {
    right: 16px
}

.post-pre-next .next-jt a {
    display: block;
    transition: transform .16s ease
}

.post-pre-next .next-jt i {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid #d8dde6;
    border-radius: 4px;
    background: #fff;
    color: var(--dh-color, var(--b2color, #ff3355));
    font-size: 30px;
    line-height: 1;
    box-shadow: 3px 3px 0 rgba(17, 24, 39, .08);
    transition: background .16s ease, color .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease
}

.post-pre-next .next-jt a:hover i {
    border-color: #111827;
    background: #111827;
    color: #fff;
    box-shadow: 5px 5px 0 rgba(17, 24, 39, .12);
    transform: translate(-2px, -2px)
}

.post-pre .next-jt a:hover {
    transform: translateX(-2px)
}

.post-next .next-jt a:hover {
    transform: translateX(2px)
}

.post-pre-next .post-pre-next-info:hover {
    border-color: #111827 !important;
    box-shadow: 5px 5px 0 rgba(17, 24, 39, .1) !important;
    transform: translate(-1px, -1px)
}

body.night .content-ds,
body.night .post-pre-next .post-pre-next-info {
    border-color: var(--dh-border, rgba(255, 255, 255, .08)) !important;
    background: var(--dh-bg, var(--beijing, #151617)) !important;
    box-shadow: none !important
}

body.night .content-ds-button,
body.night .post-pre-next .post-per-next-cats a,
body.night .post-pre-next .next-jt i {
    border-color: var(--dh-border, rgba(255, 255, 255, .08));
    background: var(--dh-soft, var(--huise, #202124))
}

body.night .content-ds>p,
body.night .content-ds-count,
body.night .post-pre-next h2 a,
body.night .post-pre-next p {
    color: var(--dh-desc, #cbd5e1) !important
}

@media(max-width:768px) {
    .content-ds {
        min-height: 0;
        padding: 16px
    }

    .content-ds-button {
        position: relative !important;
        right: auto !important;
        top: auto !important;
        width: 100%;
        max-width: 330px;
        margin-top: 14px;
        transform: none !important
    }

    .content-ds-users {
        justify-content: flex-start;
        width: auto;
        max-width: none
    }

    .post-pre-next.mg-b {
        grid-template-columns: 1fr;
        gap: 12px
    }

    .post-pre .post-pre-next-info,
    .post-next .post-pre-next-info {
        padding: 16px 62px !important;
        text-align: left
    }

    .post-next .next-jt {
        right: 16px
    }
}